feat: open file shortcut

j4k0xb · Jun 4, 2024 · ca4d402 · ca4d402
1 parent 4863fda
commit ca4d402
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 17 deletions.
diff --git a/apps/playground/src/App.tsx b/apps/playground/src/App.tsx
@@ -18,7 +18,7 @@ import { DeobfuscateContextProvider } from './context/DeobfuscateContext';
 import { settings } from './hooks/useSettings';
 import { useWorkspaces, type Workspace } from './indexeddb';
 import { debounce } from './utils/debounce';
-import { downloadFile } from './utils/download';
+import { downloadFile } from './utils/files';
 import type { DeobfuscateResult } from './webcrack.worker';
 
 export const [config, setConfig] = createStore({
@@ -245,6 +245,9 @@ function App() {
             currentModel={activeTab()}
             onModelChange={openTab}
             onValueChange={saveModelsDebounced}
+            onFileOpen={(content) => {
+              openUntitledTab().setValue(content);
+            }}
           />
         </main>
       </div>

diff --git a/apps/playground/src/components/Menu.tsx b/apps/playground/src/components/Menu.tsx
@@ -1,6 +1,7 @@
 import { For } from 'solid-js';
 import { setSettings, settings, type Settings } from '../hooks/useSettings';
 import { useWorkspaces, type Workspace } from '../indexeddb';
+import { openFile } from '../utils/files';
 
 interface Props {
   onFileOpen?: (content: string) => void;
@@ -11,26 +12,20 @@ interface Props {
 export default function Menu(props: Props) {
   const { workspaces } = useWorkspaces();
 
-  function openFile() {
-    const input = document.createElement('input');
-    input.type = 'file';
-    input.onchange = async (event) => {
-      const file = (event.target as HTMLInputElement).files?.[0];
-      if (!file) return;
-      const content = await file.text();
-      props.onFileOpen?.(content);
-    };
-    input.click();
-  }
-
   return (
     <ul class="menu menu-sm menu-horizontal bg-base-200 w-full">
       <li>
-        <details>
+        <details open>
           <summary>File</summary>
           <ul class="min-w-52 z-10 !px-0">
             <li>
-              <a onClick={openFile}>Open File…</a>
+              <a onClick={() => openFile(props.onFileOpen)}>
+                Open File…{' '}
+                <span class="ml-auto">
+                  <kbd class="kbd kbd-sm">Ctrl</kbd>+
+                  <kbd class="kbd kbd-sm">O</kbd>
+                </span>
+              </a>
             </li>
             <li>
               <div class="dropdown dropdown-right dropdown-hover transform-none">
@@ -58,7 +53,13 @@ export default function Menu(props: Props) {
               </div>
             </li>
             <li>
-              <a onClick={props.onSave}>Save</a>
+              <a onClick={props.onSave}>
+                Save{' '}
+                <span class="ml-auto">
+                  <kbd class="kbd kbd-sm">Ctrl</kbd>+
+                  <kbd class="kbd kbd-sm">S</kbd>
+                </span>
+              </a>
             </li>
           </ul>
         </details>

diff --git a/apps/playground/src/components/MonacoEditor.tsx b/apps/playground/src/components/MonacoEditor.tsx
@@ -4,13 +4,14 @@ import { useDeobfuscateContext } from '../context/DeobfuscateContext';
 import { theme } from '../hooks/useTheme';
 import { registerEvalSelection } from '../monaco/eval-selection';
 import { PlaceholderContentWidget } from '../monaco/placeholder-widget';
-import { downloadFile } from '../utils/download';
+import { downloadFile, openFile } from '../utils/files';
 
 interface Props {
   models: monaco.editor.ITextModel[];
   currentModel?: monaco.editor.ITextModel;
   onModelChange?: (model: monaco.editor.ITextModel) => void;
   onValueChange?: (value: string) => void;
+  onFileOpen?: (content: string) => void;
   onSave?: (value: string) => void;
 }
 
@@ -105,6 +106,15 @@ export default function MonacoEditor(props: Props) {
       },
     });
 
+    const openAction = editor.addAction({
+      id: 'editor.action.open',
+      label: 'File: Open',
+      keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyO],
+      run() {
+        openFile(props.onFileOpen);
+      },
+    });
+
     const saveAction = editor.addAction({
       id: 'editor.action.save',
       label: 'File: Save',
@@ -129,6 +139,7 @@ export default function MonacoEditor(props: Props) {
       editorOpener.dispose();
       placeholder.dispose();
       deobfuscateAction.dispose();
+      openAction.dispose();
       saveAction.dispose();
       evalAction.dispose();
       saveAction.dispose();

diff --git a/apps/playground/src/utils/download.ts → apps/playground/src/utils/files.ts b/apps/playground/src/utils/download.ts → apps/playground/src/utils/files.ts
@@ -17,3 +17,15 @@ export function downloadFile(model: monaco.editor.ITextModel) {
 
   URL.revokeObjectURL(url);
 }
+
+export function openFile(cb: (content: string) => void = () => {}) {
+  const input = document.createElement('input');
+  input.type = 'file';
+  input.onchange = async (event) => {
+    const file = (event.target as HTMLInputElement).files?.[0];
+    if (file) {
+      cb(await file.text());
+    }
+  };
+  input.click();
+}