feat(editor): open text files from local

src/lib/components/EditorTitle.svelte

@@ -60,5 +60,4 @@
     maxlength={24}
     {readonly}
   />
-  <span class="-ml-2 text-primary/50">.txt</span>
 </form>

src/lib/components/MenuBar.svelte

@@ -5,6 +5,7 @@
   import { editors } from '@/store/store';
   import { fade } from 'svelte/transition';
   import { NotepadHelper } from '@/helpers/notepad-helper';
+  import { isTauri } from '$lib';
 
   interface MenuItems {
     label: string;
@@ -24,10 +25,10 @@
       items: [
         {
           label: 'New',
-          shortcut: 'Ctrl+Alt+N',
-          onClick: NotepadHelper.openFile
+          shortcut: isTauri ? 'Ctrl+N' : 'Ctrl+Alt+N',
+          onClick: NotepadHelper.createNew
         },
-        { label: 'Open...', shortcut: 'Ctrl+O' },
+        { label: 'Open...', shortcut: 'Ctrl+O', onClick: NotepadHelper.openFile },
         { label: 'Save', shortcut: 'Ctrl+S' },
         { label: 'Save as...' },
         { type: 'separator' },
@@ -113,7 +114,7 @@
   {#if !isXS && !tabsMode}
     <div
       transition:fade
-      class="max-md:!ml-auto max-md:pr-3 md:absolute md:left-1/2 md:top-1/2 md:-translate-x-1/2 md:-translate-y-1/2"
+      class="max-md:!ml-auto md:absolute md:left-1/2 md:top-1/2 md:-translate-x-1/2 md:-translate-y-1/2"
     >
       <EditorTitle id={singleEditorId} title={singleEditorTitle} />
     </div>

src/lib/components/Shortcuts.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { isTauri } from '$lib';
   import { NotepadHelper } from '@/helpers/notepad-helper';
   import { shortcut, type ShortcutEventDetail } from '@svelte-put/shortcut';
 
@@ -12,8 +13,15 @@
   use:shortcut={{
     trigger: {
       key: 'n',
-      modifier: ['ctrl', 'alt'],
+      modifier: isTauri ? ['ctrl'] : ['ctrl', 'alt'],
       callback: (d) => dispatch(d, NotepadHelper.createNew)
     }
   }}
+  use:shortcut={{
+    trigger: {
+      key: 'o',
+      modifier: ['ctrl'],
+      callback: (d) => dispatch(d, NotepadHelper.openFile)
+    }
+  }}
 />

src/lib/helpers/notepad-helper.ts

@@ -1,14 +1,14 @@
-import { activeTabId, editors } from '@/store/store';
+import { activeTabId, editors, type EditorData } from '@/store/store';
 import { get } from 'svelte/store';
 import { v4 as uuidv4 } from 'uuid';
 
 export class NotepadHelper {
-  static createNew() {
+  static createNew({ content, title }: Partial<EditorData> = {}) {
     const newId = uuidv4();
     editors.update((value) => {
       value.push({
-        title: 'Untitled',
-        content: '',
+        title: title ?? 'Untitled.txt',
+        content: content ?? '',
         id: newId
       });
 
@@ -20,7 +20,7 @@ export class NotepadHelper {
   static openFile() {
     const input = document.createElement('input');
     input.type = 'file';
-    input.accept = '.txt';
+    input.accept = '.txt,.md';
 
     input.onchange = (event: Event) => {
       const target = event.target as HTMLInputElement;
@@ -30,7 +30,11 @@ export class NotepadHelper {
 
         reader.onload = (e) => {
           const content = e.target?.result as string;
-          console.log(content);
+          const fileName = file.name;
+          NotepadHelper.createNew({
+            title: fileName,
+            content
+          });
         };
 
         reader.readAsText(file);
@@ -41,12 +45,19 @@ export class NotepadHelper {
   }
 
   static remove(id: string) {
+    let i = 0;
+    let removeIndex = -1;
     editors.update((value) => {
-      return value.filter((editor) => editor.id !== id);
+      return value.filter((editor) => {
+        if (editor.id == id) removeIndex = i;
+        i++;
+        return editor.id !== id;
+      });
     });
+
     activeTabId.update((value) => {
-      if (value === id) {
-        return get(editors)[0].id;
+      if (value === id && removeIndex > 0) {
+        return get(editors)[removeIndex - 1]?.id ?? null;
       }
       return value;
     });

src/lib/store/store.ts

@@ -11,7 +11,7 @@ export type EditorData = {
 export const saveDialog = writable(false);
 export const editors = writable<EditorData[]>([
   {
-    title: 'Untitled',
+    title: 'Untitled.txt',
     content: '',
     id: uuidv4()
   }