Merge pull request #4217 from matrix-org/t3chguy/gemini

Remove Gemini Scrollbars

src/components/structures/EmbeddedPage.js

@@ -23,11 +23,11 @@ import PropTypes from 'prop-types';
 import request from 'browser-request';
 import { _t } from '../../languageHandler';
 import sanitizeHtml from 'sanitize-html';
-import * as sdk from '../../index';
 import dis from '../../dispatcher';
 import {MatrixClientPeg} from '../../MatrixClientPeg';
 import classnames from 'classnames';
 import MatrixClientContext from "../../contexts/MatrixClientContext";
+import AutoHideScrollbar from "./AutoHideScrollbar";
 
 export default class EmbeddedPage extends React.PureComponent {
     static propTypes = {
@@ -117,10 +117,9 @@ export default class EmbeddedPage extends React.PureComponent {
         </div>;
 
         if (this.props.scrollbar) {
-            const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
-            return <GeminiScrollbarWrapper autoshow={true} className={classes}>
+            return <AutoHideScrollbar className={classes}>
                 {content}
-            </GeminiScrollbarWrapper>;
+            </AutoHideScrollbar>;
         } else {
             return <div className={classes}>
                 {content}

src/components/structures/GroupView.js

@@ -39,6 +39,7 @@ import {makeGroupPermalink, makeUserPermalink} from "../../utils/permalinks/Perm
 import {Group} from "matrix-js-sdk";
 import {allSettled, sleep} from "../../utils/promise";
 import RightPanelStore from "../../stores/RightPanelStore";
+import AutoHideScrollbar from "./AutoHideScrollbar";
 
 const LONG_DESC_PLACEHOLDER = _td(
 `<h1>HTML for your community's page</h1>
@@ -1173,7 +1174,6 @@ export default createReactClass({
     render: function() {
         const GroupAvatar = sdk.getComponent("avatars.GroupAvatar");
         const Spinner = sdk.getComponent("elements.Spinner");
-        const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
 
         if (this.state.summaryLoading && this.state.error === null || this.state.saving) {
             return <Spinner />;
@@ -1332,10 +1332,10 @@ export default createReactClass({
                         <GroupHeaderButtons />
                     </div>
                     <MainSplit panel={rightPanel}>
-                        <GeminiScrollbarWrapper className="mx_GroupView_body">
+                        <AutoHideScrollbar className="mx_GroupView_body">
                             { this._getMembershipSection() }
                             { this._getGroupSection() }
-                        </GeminiScrollbarWrapper>
+                        </AutoHideScrollbar>
                     </MainSplit>
                 </main>
             );

src/components/structures/MyGroups.js

@@ -22,6 +22,7 @@ import { _t } from '../../languageHandler';
 import dis from '../../dispatcher';
 import AccessibleButton from '../views/elements/AccessibleButton';
 import MatrixClientContext from "../../contexts/MatrixClientContext";
+import AutoHideScrollbar from "./AutoHideScrollbar";
 
 export default createReactClass({
     displayName: 'MyGroups',
@@ -62,8 +63,6 @@ export default createReactClass({
         const Loader = sdk.getComponent("elements.Spinner");
         const SimpleRoomHeader = sdk.getComponent('rooms.SimpleRoomHeader');
         const GroupTile = sdk.getComponent("groups.GroupTile");
-        const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
-
 
         let content;
         let contentHeader;
@@ -74,7 +73,7 @@ export default createReactClass({
             });
             contentHeader = groupNodes.length > 0 ? <h3>{ _t('Your Communities') }</h3> : <div />;
             content = groupNodes.length > 0 ?
-                <GeminiScrollbarWrapper>
+                <AutoHideScrollbar className="mx_MyGroups_scrollable">
                     <div className="mx_MyGroups_microcopy">
                         <p>
                             { _t(
@@ -93,7 +92,7 @@ export default createReactClass({
                     <div className="mx_MyGroups_joinedGroups">
                         { groupNodes }
                     </div>
-                </GeminiScrollbarWrapper> :
+                </AutoHideScrollbar> :
                 <div className="mx_MyGroups_placeholder">
                     { _t(
                         "You're not currently a member of any communities.",

src/components/structures/RoomView.js

@@ -405,21 +405,6 @@ export default createReactClass({
         this.onResize();
 
         document.addEventListener("keydown", this.onKeyDown);
-
-        // XXX: EVIL HACK to autofocus inviting on empty rooms.
-        // We use the setTimeout to avoid racing with focus_composer.
-        if (this.state.room &&
-            this.state.room.getJoinedMemberCount() == 1 &&
-            this.state.room.getLiveTimeline() &&
-            this.state.room.getLiveTimeline().getEvents() &&
-            this.state.room.getLiveTimeline().getEvents().length <= 6) {
-            const inviteBox = document.getElementById("mx_SearchableEntityList_query");
-            setTimeout(function() {
-                if (inviteBox) {
-                    inviteBox.focus();
-                }
-            }, 50);
-        }
     },
 
     shouldComponentUpdate: function(nextProps, nextState) {

src/components/structures/ScrollPanel.js

@@ -782,7 +782,7 @@ export default createReactClass({
         if (!this._divScroll) {
             // Likewise, we should have the ref by this point, but if not
             // turn the NPE into something meaningful.
-            throw new Error("ScrollPanel._getScrollNode called before gemini ref collected");
+            throw new Error("ScrollPanel._getScrollNode called before AutoHideScrollbar ref collected");
         }
 
         return this._divScroll;

src/components/structures/TagPanel.js

@@ -28,6 +28,7 @@ import { _t } from '../../languageHandler';
 import { Droppable } from 'react-beautiful-dnd';
 import classNames from 'classnames';
 import MatrixClientContext from "../../contexts/MatrixClientContext";
+import AutoHideScrollbar from "./AutoHideScrollbar";
 
 const TagPanel = createReactClass({
     displayName: 'TagPanel',
@@ -106,7 +107,6 @@ const TagPanel = createReactClass({
         const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
         const ActionButton = sdk.getComponent('elements.ActionButton');
         const TintableSvg = sdk.getComponent('elements.TintableSvg');
-        const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
 
         const tags = this.state.orderedTags.map((tag, index) => {
             return <DNDTagTile
@@ -138,9 +138,8 @@ const TagPanel = createReactClass({
                 { clearButton }
             </div>
             <div className="mx_TagPanel_divider" />
-            <GeminiScrollbarWrapper
+            <AutoHideScrollbar
                 className="mx_TagPanel_scroller"
-                autoshow={true}
                 // XXX: Use onMouseDown as a workaround for https://github.com/atlassian/react-beautiful-dnd/issues/273
                 // instead of onClick. Otherwise we experience https://github.com/vector-im/riot-web/issues/6253
                 onMouseDown={this.onMouseDown}
@@ -166,7 +165,7 @@ const TagPanel = createReactClass({
                             </div>
                     ) }
                 </Droppable>
-            </GeminiScrollbarWrapper>
+            </AutoHideScrollbar>
         </div>;
     },
 });