feat(omnibar): auto command registration, keyboard navigation

unigraph-dev · Dec 31, 2021 · 868fc04 · 868fc04
1 parent c213232
commit 868fc04
Show file tree

Hide file tree

Showing 7 changed files with 219 additions and 97 deletions.
diff --git a/packages/unigraph-dev-explorer/src/examples/bookmarks/Bookmarks.tsx b/packages/unigraph-dev-explorer/src/examples/bookmarks/Bookmarks.tsx
@@ -134,13 +134,18 @@ const quickAdder = async (inputStr: string, preview = true) => {
 };
 
 export const init = () => {
+    const description = 'Add a bookmark';
     const tt = () => (
         <div>
             For example, enter #tag1 https://example.com
         </div>
     );
 
-    registerQuickAdder({ bookmark: { adder: quickAdder, tooltip: tt }, bm: { adder: quickAdder, tooltip: tt } });
+    registerQuickAdder({
+        bookmark: {
+            adder: quickAdder, tooltip: tt, description, alias: ['bm'],
+        },
+    });
 
     registerDynamicViews({ '$/schema/web_bookmark': BookmarkItem });
 };
diff --git a/packages/unigraph-dev-explorer/src/examples/notes/init.tsx b/packages/unigraph-dev-explorer/src/examples/notes/init.tsx
@@ -28,7 +28,12 @@ export const init = () => {
         </div>
     );
 
-    registerQuickAdder({ n: { adder: quickAdder, tooltip: tt }, note: { adder: quickAdder, tooltip: tt } });
+    const description = 'Add a note';
+    registerQuickAdder({
+        note: {
+            adder: quickAdder, tooltip: tt, description, alias: ['n'],
+        },
+    });
 
     registerContextMenuItems('$/schema/note_block', [(uid: any, object: any, handleClose: any, callbacks: any) => (
         <MenuItem onClick={() => {

diff --git a/packages/unigraph-dev-explorer/src/examples/todo/TodoList.tsx b/packages/unigraph-dev-explorer/src/examples/todo/TodoList.tsx
@@ -128,8 +128,13 @@ const tt = () => (
 );
 
 export const init = () => {
+    const description = 'Add a new Todo object';
     registerDynamicViews({ '$/schema/todo': TodoItem });
-    registerQuickAdder({ todo: { adder: quickAdder, tooltip: tt }, td: { adder: quickAdder, tooltip: tt } });
+    registerQuickAdder({
+        todo: {
+            adder: quickAdder, tooltip: tt, description, alias: ['td'],
+        },
+    });
 };
 
 export const TodoList = withUnigraphSubscription(

diff --git a/packages/unigraph-dev-explorer/src/examples/todo/parseTodoObject.ts b/packages/unigraph-dev-explorer/src/examples/todo/parseTodoObject.ts
@@ -52,6 +52,6 @@ export const parseTodoObject: (arg0: string, refs?: any[]) => ATodoList = (todoS
                 name: tagName,
             },
         })), ...inlineRefsToChildren(refs)],
-        timeFrame,
+        time_frame: timeFrame,
     };
 };
diff --git a/packages/unigraph-dev-explorer/src/init.ts b/packages/unigraph-dev-explorer/src/init.ts
@@ -31,12 +31,39 @@ window.reloadCommands = () => {
     const pageCommands = Object.entries(window.unigraph.getState('registry/pages').value).map(([k, v]: any) => ({
         name: `Open: ${v.name}`,
         about: `Open the page ${v.name}`,
-        onClick: () => {
+        onClick: (ev: any, setInput: any, setClose: any) => {
             window.wsnavigator(`/${k}`);
+            setInput(''); setClose();
         },
     }));
 
-    commandsState.setValue(pageCommands);
+    const adderCommands = Object.entries(window.unigraph.getState('registry/quickAdder').value).map(([k, v]: any) => {
+        if ((v.alias || []).includes(k)) return false;
+        const matches = [k, ...(v.alias || [])].map((el: string) => `+${el}`).join(' / ');
+        return {
+            name: `${matches}: ${v.description}`,
+            about: 'Add a Unigraph object',
+            onClick: (ev: any, setInput: any) => {
+                ev.stopPropagation();
+                ev.preventDefault();
+                setInput(`+${k} `);
+            },
+            group: 'adder',
+        };
+    }).filter(Boolean);
+
+    const searchCommand = {
+        name: '?<search query> : search Unigraph',
+        about: 'Search Unigraph',
+        onClick: (ev: any, setInput: any) => {
+            ev.stopPropagation();
+            ev.preventDefault();
+            setInput('?');
+        },
+        group: 'search',
+    };
+
+    commandsState.setValue([...adderCommands, searchCommand, ...pageCommands]);
 };
 
 /**