Sort notes in notes selector by how recent they were opened

src/components/NoteSelector.vue

@@ -1,5 +1,6 @@
 <script>
     import { mapState, mapActions } from 'pinia'
+    import { toRaw } from 'vue';
     import { useNotesStore } from "../stores/notes-store"
 
     export default {
@@ -23,15 +24,44 @@
                     "scratch": path === "buffer-dev.txt",
                 }
             })
+            if (this.items.length > 1) {
+                this.selected = 1
+            }
         },
 
         computed: {
             ...mapState(useNotesStore, [
                 "notes",
+                "recentNotePaths",
             ]),
 
+            orderedItems() {
+                const sortKeys = Object.fromEntries(this.recentNotePaths.map((item, idx) => [item, idx]))
+                const getSortScore = (item) => sortKeys[item.path] !== undefined ? sortKeys[item.path] : 1000
+                const compareFunc = (a, b) => {
+                    const sortScore = getSortScore(a) - getSortScore(b)
+                    if (sortScore !== 0) {
+                        // sort by recency first
+                        return sortScore
+                    } else {
+                        // then notes in root
+                        const aIsRoot = a.path.indexOf("/") === -1
+                        const bIsRoot = b.path.indexOf("/") === -1
+                        if (aIsRoot && !bIsRoot) {
+                            return -1
+                        } else if (!aIsRoot && bIsRoot) {
+                            return 1
+                        } else {
+                            // last sort by path
+                            return a.path.localeCompare(b.path)
+                        }
+                    }
+                }
+                return [...this.items].sort(compareFunc)
+            },
+
             filteredItems() {
-                return this.items.filter((lang) => {
+                return this.orderedItems.filter((lang) => {
                     return lang.name.toLowerCase().indexOf(this.filter.toLowerCase()) !== -1
                 })
             },

src/stores/notes-store.js

@@ -2,11 +2,15 @@ import { toRaw } from 'vue';
 import { defineStore } from "pinia"
 import { NoteFormat } from "../editor/note-format"
 
+const SCRATCH_FILE = window.heynote.isDev ? "buffer-dev.txt" : "buffer.txt"
+
 export const useNotesStore = defineStore("notes", {
     state: () => ({
         notes: {},
+        recentNotePaths: [SCRATCH_FILE],
+
         currentEditor: null,
-        currentNotePath: window.heynote.isDev ? "buffer-dev.txt" : "buffer.txt",
+        currentNotePath: SCRATCH_FILE,
         currentNoteName: null,
         currentLanguage: null,
         currentLanguageAuto: null,
@@ -32,6 +36,10 @@ export const useNotesStore = defineStore("notes", {
             this.showLanguageSelector = false
             this.showCreateNote = false
             this.currentNotePath = path
+
+            const recent = this.recentNotePaths.filter((p) => p !== path)
+            recent.unshift(path)
+            this.recentNotePaths = recent.slice(0, 100)
         },
 
         openLanguageSelector() {