diff options
| -rw-r--r-- | src/client/views/MainView.tsx | 18 |
1 files changed, 3 insertions, 15 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index aa34a12ed..af224747d 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -40,8 +40,6 @@ export class MainView extends React.Component { @observable private _workspacesShown: boolean = false; @observable public pwidth: number = 0; @observable public pheight: number = 0; - private searchbox: React.RefObject<HTMLDivElement>; - @computed private get mainContainer(): Opt<Doc> { return FieldValue(Cast(CurrentUserUtils.UserDocument.activeWorkspace, Doc)); } @@ -57,7 +55,6 @@ export class MainView extends React.Component { constructor(props: Readonly<{}>) { super(props); MainView.Instance = this; - this.searchbox = React.createRef(); // causes errors to be generated when modifying an observable outside of an action configure({ enforceActions: "observed" }); if (window.location.search.includes("readonly")) { @@ -267,26 +264,17 @@ export class MainView extends React.Component { <button className="toolbar-button round-button" title="Redo" onClick={() => UndoManager.Redo()}><FontAwesomeIcon icon="redo-alt" size="sm" /></button> <button className="toolbar-button round-button" title="Ink" onClick={() => InkingControl.Instance.toggleDisplay()}><FontAwesomeIcon icon="pen-nib" size="sm" /></button> </div >, - <div ref={this.searchbox} className="main-searchDiv" key="search" style={{ top: '34px', right: '1px', position: 'absolute' }} > <SearchBox /> </div>, + this.isSearchVisible ? <div className="main-searchDiv" key="search" style={{ top: '34px', right: '1px', position: 'absolute' }} > <SearchBox /> </div> : null, <div className="main-buttonDiv" key="logout" style={{ bottom: '0px', right: '1px', position: 'absolute' }} ref={logoutRef}> <button onClick={() => request.get(DocServer.prepend(RouteStore.logout), emptyFunction)}>Log Out</button></div> ]; } + @observable isSearchVisible = false; @action toggleSearch = () => { - const sb = this.searchbox.current; - if (sb !== null) { - console.log("toggle search") - if (sb.style.display === "none") { - sb.style.display = "block"; - } - else { - sb.style.display = "none"; - } - } - + this.isSearchVisible = !this.isSearchVisible; } render() { |