add recent file support

src-tauri/capabilities/default.json

@@ -6,6 +6,17 @@
     "main"
   ],
   "permissions": [
+    {
+      "identifier": "fs:scope",
+      "allow": [
+        {
+          "path": "$APPCONFIG"
+        },
+        {
+          "path": "$APPCONFIG/*"
+        }
+      ]
+    },
     "core:default",
     "core:image:allow-from-path",
     "opener:default",

src/store.ts

@@ -1,6 +1,8 @@
 import { defineStore } from 'pinia'
+import { type ToastServiceMethods } from 'primevue'
 
-import { type Inventory } from 'src/types/data'
+import type { Inventory, AppConfig } from 'src/types/data'
+import { saveConfig } from './utils/io'
 
 interface InventoryState {
   filePath: string,
@@ -15,6 +17,7 @@ export const useAppStore = defineStore('appStore', {
       filePath: '',
       data: null as Inventory | null,
     } as InventoryState,
+    currentConfig: {} as AppConfig
   }),
   getters: {
     fileTree(state) {
@@ -29,6 +32,28 @@ export const useAppStore = defineStore('appStore', {
       return split[split.length - 1]
     },
   },
+  actions: {
+    async setInventory(path: string, data: Inventory, toast: ToastServiceMethods) {
+      this.currentInventory.filePath = path
+      this.currentInventory.data = data
+
+      if (!this.currentConfig.recentFiles) {
+        this.currentConfig.recentFiles = []
+        this.currentConfig.recentFiles.push(path)
+      } else if (!this.currentConfig.recentFiles.includes(path)) {
+        this.currentConfig.recentFiles.push(path)
+      }
+
+      await saveConfig(this.currentConfig, toast)
+    },
+    async removeRecentFile(path: string, toast: ToastServiceMethods) {
+      const index = this.currentConfig.recentFiles!.findIndex(other => other === path)
+      if (index > -1) {
+        this.currentConfig.recentFiles = this.currentConfig.recentFiles?.filter((_, i) => i !== index)
+        await saveConfig(this.currentConfig, toast)
+      }
+    }
+  }
 })
 
 export type AppStoreDefinition = Omit<

src/types/data.ts

@@ -55,3 +55,11 @@ export interface Inventory {
   rows: Row[]
   templates: Row[]
 }
+
+/**
+ * The main app's config
+ */
+export interface AppConfig {
+  configVersion: number
+  recentFiles?: string[]
+}

src/utils/io.ts

@@ -0,0 +1,118 @@
+import { appConfigDir } from '@tauri-apps/api/path'
+import { exists, writeTextFile, readTextFile, mkdir } from '@tauri-apps/plugin-fs'
+import { type ToastServiceMethods } from 'primevue'
+import { type AppConfig } from '../types/data'
+
+export const configDirPath = async () => {
+  const configDirPath = await appConfigDir()
+  return `${configDirPath}/config.json`
+}
+
+/**
+ * Gets the app config; if it doesn't exist, it will be made with defaults
+ * @param toast the primevue toast instance
+ * @returns app config
+ */
+export const getConfig = async (toast: ToastServiceMethods): Promise<AppConfig> => {
+  const configPath = await configDirPath()
+  let configExists = false
+  try {
+    configExists = await exists(configPath)
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The path could not be read',
+      detail: err,
+    })
+  }
+  let config = {
+    configVersion: 0,
+    recentFiles: [],
+  }
+  let json: AppConfig | null = null
+
+  if (!configExists) {
+    const acd = await appConfigDir()
+    await mkdir(acd, { recursive: true })
+    await writeJson(configPath, config, toast)
+  } else {
+    json = await readJson<AppConfig>(configPath, toast)
+  }
+
+  return json || config
+}
+
+/**
+ * Saves the app config
+ * @param config the app config
+ * @param toast the primevue toast instance
+ */
+export const saveConfig = async (config: AppConfig, toast: ToastServiceMethods) => {
+  const configPath = await configDirPath()
+  await writeJson(configPath, config, toast)
+}
+
+/**
+ * Reads json with error handling
+ * @param path the full path to read from
+ * @param toast the primevue toast instance
+ * @returns the parsed json object or null if invalid/unable to read
+ */
+export const readJson = async<T>(path: string, toast: ToastServiceMethods) => {
+  let fileContent: string
+  let parsedContent: T
+  try {
+    fileContent = await readTextFile(path)
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The file could not be read (permission issue?)',
+      detail: err,
+    })
+
+    return null
+  }
+  try {
+    parsedContent = JSON.parse(fileContent)
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The file could not be parsed (invalid json)',
+      detail: err,
+    })
+
+    return null
+  }
+
+  return parsedContent
+}
+
+/**
+ * Saves json with error handling
+ * @param path the full path to write to
+ * @param content the content to write
+ * @param toast the primevue toast instance
+ */
+export const writeJson = async<T>(path: string, content: T, toast: ToastServiceMethods) => {
+  let json = ''
+  try {
+    json = JSON.stringify(content, null, 2)
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The file could not be stringified',
+      detail: err,
+    })
+
+    return
+  }
+  try {
+    await writeTextFile(path, json)
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The file could not be written (permission issue?)',
+      detail: err,
+    })
+  }
+}

src/views/Home/Home.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
 import {
   computed,
+  onMounted,
   ref,
 } from 'vue'
 import { open } from '@tauri-apps/plugin-dialog'
-import { readTextFile } from '@tauri-apps/plugin-fs'
+import { exists, readTextFile } from '@tauri-apps/plugin-fs'
 import { useRouter } from 'vue-router'
 import { useToast } from 'primevue/usetoast'
 import Button from 'primevue/button'
@@ -14,6 +15,8 @@ import InputGroupAddon from 'primevue/inputgroupaddon'
 import Panel from 'primevue/panel'
 
 import { useAppStore } from 'src/store'
+import { getConfig, readJson } from 'src/utils/io'
+import { Inventory } from 'src/types/data'
 
 const router = useRouter()
 const toast = useToast()
@@ -38,8 +41,7 @@ const onBrowse = async (e: Event) => {
 
 const onCreate = async (e: Event) => {
   e.preventDefault()
-  appStore.currentInventory.filePath = `${filePath.value}/${fileName.value}.json`
+  appStore.setInventory(`${filePath.value}/${fileName.value}.json`, {
-  appStore.currentInventory.data = {
     columns: [
       { name: 'name', type: 'text' },
       { name: 'location', type: 'text' },
@@ -47,7 +49,7 @@ const onCreate = async (e: Event) => {
     ],
     rows: [],
     templates: [],
-  }
+  }, toast)
   router.push('/editor')
 }
 
@@ -60,47 +62,57 @@ const onFind = async (e: Event) => {
   })
 
   if (!!val && !Array.isArray(val)) {
-    let contents: string
+    await onOpenFile(val)
-    try {
-      contents = await readTextFile(val)
-    } catch (err) {
-      toast.add({
-        severity: 'error',
-        summary: 'The file could not be read (permission issue?)',
-        detail: err,
-      })
-
-      return
-    }
-
-    let json: any
-    try {
-      json = JSON.parse(contents)
-    } catch (err) {
-      toast.add({
-        severity: 'error',
-        summary: 'The file could not be parsed (invalid json)',
-        detail: err,
-      })
-
-      return
-    }
-
-    if (!!json.columns && !!json.rows) {
-      if (!json.templates) {
-        json.templates = []
-      }
-      appStore.currentInventory.data = json
-      appStore.currentInventory.filePath = val
-      router.push('/editor')
-    } else {
-      toast.add({
-        severity: 'error',
-        summary: 'The file is not a valid database for simple-inventory-editor',
-      })
-    }
   }
 }
+
+const onOpenFile = async (val: string) => {
+  let json = await readJson<Inventory>(val, toast)
+
+  if (!!json && !!json.columns && !!json.rows) {
+    if (!json.templates) {
+      json.templates = []
+    }
+    appStore.setInventory(val, json, toast)
+    router.push('/editor')
+  } else {
+    toast.add({
+      severity: 'error',
+      summary: 'The file is not a valid database for simple-inventory-editor',
+    })
+  }
+}
+
+const onOpenRecentFile = async (event: Event, file: string) => {
+  event.preventDefault()
+  try {
+    const fileExists = exists(file)
+    if (!fileExists) {
+      toast.add({
+        severity: 'error',
+        summary: 'The file does not exist',
+      })
+      appStore.removeRecentFile(file, toast)
+    } else {
+      await onOpenFile(file)
+    }
+  } catch (err) {
+    toast.add({
+      severity: 'error',
+      summary: 'The file could not be read (permissions issue?)',
+      detail: err,
+    })
+  }
+}
+
+const onRemoveRecentFile = async (event: Event, file: string) => {
+  event.preventDefault()
+  await appStore.removeRecentFile(file, toast)
+}
+
+onMounted(async () => {
+  appStore.currentConfig = await getConfig(toast)
+})
 </script>
 
 <template lang="pug">
@@ -108,8 +120,26 @@ section.home-page
   Panel
     template(#header)
       h2 Open Recent File
-    .content
+    .content(
-      p Not Yet Implemented
+      v-if='!appStore.currentConfig?.recentFiles || appStore.currentConfig.recentFiles.length === 0'
+    )
+      p No recent files
+    .content(
+      v-else
+    )
+      InputGroup(
+        v-for='file of appStore.currentConfig.recentFiles'
+      )
+        InputGroupAddon
+          span {{ file }}
+        InputGroupAddon
+          Button(
+            @click='(e) => onOpenRecentFile(e, file)'
+          ) Open
+        InputGroupAddon
+          Button(
+            @click='(e) => onRemoveRecentFile(e, file)'
+          ) Remove
   p.or or...
   Panel
     template(#header)