search bar on topnpm start

3 files changed, 55 insertions, 2 deletions

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index c152a4a64..582cc2d5c 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -657,7 +657,9 @@ export class CurrentUserUtils {
         const toolsBtn = await CurrentUserUtils.setupToolsBtnPanel(doc, sidebarContainer);
         const libraryBtn = CurrentUserUtils.setupLibraryPanel(doc, sidebarContainer);
         const searchBtn = CurrentUserUtils.setupSearchBtnPanel(doc, sidebarContainer);
-
+        if (doc["search-panel"] === undefined) {
+            doc["search-panel"] = new PrefetchProxy(Docs.Create.SearchDocument({ ignoreClick: true, childDropAction: "alias", lockedPosition: true, _viewType: CollectionViewType.Schema, title: "sidebar search stack", })) as any as Doc;
+    }
         // Finally, setup the list of buttons to display in the sidebar
         if (doc["tabs-buttons"] === undefined) {
             doc["tabs-buttons"] = new PrefetchProxy(Docs.Create.StackingDocument([libraryBtn, searchBtn, toolsBtn], {
@@ -666,6 +668,15 @@ export class CurrentUserUtils {
             }));
             (toolsBtn.onClick as ScriptField).script.run({ this: toolsBtn });
         }
+        
+        
+
+            // new PrefetchProxy(Docs.Create.StackingDocument([libraryBtn, searchBtn, toolsBtn], {
+            //     _width: 500, _height: 80, boxShadow: "0 0", _pivotField: "title", _columnsHideIfEmpty: true, ignoreClick: true, _chromeStatus: "view-mode",
+            //     title: "sidebar btn row stack", backgroundColor: "dimGray",
+            // }));
+        
+
     }
 
     static blist = (opts: DocumentOptions, docs: Doc[]) => new PrefetchProxy(Docs.Create.LinearDocument(docs, {
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index f6db1af66..c65c90afb 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -59,6 +59,7 @@ import { DocumentManager } from '../util/DocumentManager';
 import { DocumentLinksButton } from './nodes/DocumentLinksButton';
 import { LinkMenu } from './linking/LinkMenu';
 import { LinkDocPreview } from './nodes/LinkDocPreview';
+import { SearchBox } from './search/SearchBox';
 
 @observer
 export class MainView extends React.Component {
@@ -79,6 +80,8 @@ export class MainView extends React.Component {
     @computed private get mainContainer() { return this.userDoc ? FieldValue(Cast(this.userDoc.activeWorkspace, Doc)) : CurrentUserUtils.GuestWorkspace; }
     @computed public get mainFreeform(): Opt<Doc> { return (docs => (docs && docs.length > 1) ? docs[1] : undefined)(DocListCast(this.mainContainer!.data)); }
     @computed public get sidebarButtonsDoc() { return Cast(this.userDoc["tabs-buttons"], Doc) as Doc; }
+    @computed public get searchDoc() { return Cast(this.userDoc["search-panel"], Doc) as Doc; }
+
 
     public isPointerDown = false;
 
@@ -300,6 +303,39 @@ export class MainView extends React.Component {
             }
         }
     }
+
+    @computed get search() {
+        return <DocumentView Document={this.searchDoc!}
+            DataDoc={undefined}
+            LibraryPath={emptyPath}
+            addDocument={undefined}
+            addDocTab={this.addDocTabFunc}
+            pinToPres={emptyFunction}
+            rootSelected={returnTrue}
+            onClick={undefined}
+            backgroundColor={this.defaultBackgroundColors}
+            removeDocument={undefined}
+            ScreenToLocalTransform={Transform.Identity}
+            ContentScaling={returnOne}
+            NativeHeight={returnZero}
+            NativeWidth={returnZero}
+            PanelWidth={this.getPWidth}
+            PanelHeight={this.getPHeight}
+            renderDepth={0}
+            focus={emptyFunction}
+            parentActive={returnTrue}
+            whenActiveChanged={emptyFunction}
+            bringToFront={emptyFunction}
+            docFilters={returnEmptyFilter}
+            ContainingCollectionView={undefined}
+            ContainingCollectionDoc={undefined}
+        />;
+    }
+
+
+
+    
+
     @computed get mainDocView() {
         return <DocumentView Document={this.mainContainer!}
             DataDoc={undefined}
@@ -327,6 +363,7 @@ export class MainView extends React.Component {
             ContainingCollectionDoc={undefined}
         />;
     }
+
     @computed get dockingContent() {
         TraceMobx();
         const mainContainer = this.mainContainer;
@@ -461,6 +498,10 @@ export class MainView extends React.Component {
     @computed get mainContent() {
         const sidebar = this.userDoc?.["tabs-panelContainer"];
         return !this.userDoc || !(sidebar instanceof Doc) ? (null) : (
+            <div>
+            <div style={{height:"32px", width:"100%", backgroundColor:"black"}}>
+            {this.search}
+            </div> 
             <div className="mainView-mainContent" style={{
                 color: this.darkScheme ? "rgb(205,205,205)" : "black",
                 height: RichTextMenu.Instance?.Pinned ? `calc(100% - ${ANTIMODEMENU_HEIGHT})` : "100%"
@@ -488,6 +529,7 @@ export class MainView extends React.Component {
                     </div>
                     {this.dockingContent}
                 </div>
+            </div>
             </div>);
     }
 
diff --git a/src/client/views/collections/SchemaTable.tsx b/src/client/views/collections/SchemaTable.tsx
index e9f7e3c68..2b60bef1b 100644
--- a/src/client/views/collections/SchemaTable.tsx
+++ b/src/client/views/collections/SchemaTable.tsx
@@ -219,7 +219,7 @@ export class SchemaTable extends React.Component<SchemaTableProps> {
                         background: col.color, padding: "2px",
                         display: "flex", cursor: "default", height: "100%",
                     }}>
-                    <FontAwesomeIcon icon={icon} size="lg" style={{ display: "inline", paddingLeft: "7px" }} />
+                    <FontAwesomeIcon icon={icon} size="lg" style={{ display: "inline", paddingBottom: "1px", paddingTop:"4px" }} />
                     {/* <div className="keys-dropdown"
                         style={{ display: "inline", zIndex: 1000 }}> */}
                     {keysDropdown}