feat: add fontFamilies array

src/modules/repo/interfaces/UserSettings.ts

@@ -1,8 +1,10 @@
-import { DataType } from '@/data/DataType.enum'
-import { Model } from '@/data/models/Model'
+import { DataType } from "@/data/DataType.enum"
+import { Model } from "@/data/models/Model"
 
 export interface UserSettings extends Model<DataType.UserSettings> {
+  fontFamilies?: string[]
   fontFamily?: string
+  chosenFontFamily?: string
   fontSize?: string
   backlink?: boolean
 }

src/modules/repo/services/repo.ts

@@ -1,21 +1,21 @@
-import { useMarkdown } from '@/hooks/useMarkdown.hook'
-import { prepareNoteCache } from '@/modules/note/cache/prepareNoteCache'
-import { RepoFile } from '@/modules/repo/interfaces/RepoFile'
-import { UserSettings } from '@/modules/repo/interfaces/UserSettings'
-import { getOctokit } from '@/modules/repo/services/octo'
+import { useMarkdown } from "@/hooks/useMarkdown.hook"
+import { prepareNoteCache } from "@/modules/note/cache/prepareNoteCache"
+import { RepoFile } from "@/modules/repo/interfaces/RepoFile"
+import { UserSettings } from "@/modules/repo/interfaces/UserSettings"
+import { getOctokit } from "@/modules/repo/services/octo"
 
 export const getFiles = async (
   owner: string,
-  repo: string
+  repo: string,
 ): Promise<RepoFile[]> => {
   if (!owner || !repo) {
     return []
   }
   const octokit = await getOctokit()
 
-  const commits = await octokit.request('GET /repos/{owner}/{repo}/commits', {
+  const commits = await octokit.request("GET /repos/{owner}/{repo}/commits", {
     owner,
-    repo
+    repo,
   })
 
   const lastCommit = commits.data.shift()
@@ -25,16 +25,16 @@ export const getFiles = async (
   }
 
   const treeResponse = await octokit.request(
-    'GET /repos/{owner}/{repo}/git/trees/{tree_sha}',
+    "GET /repos/{owner}/{repo}/git/trees/{tree_sha}",
     {
       owner,
       repo,
       tree_sha: lastCommit.commit.tree.sha,
-      recursive: 'true'
-    }
+      recursive: "true",
+    },
   )
 
-  return treeResponse?.data.tree.filter((t) => t.type === 'blob') ?? []
+  return treeResponse?.data.tree.filter((t) => t.type === "blob") ?? []
 }
 
 export const getCachedMainReadme = async (owner: string, repo: string) => {
@@ -60,7 +60,7 @@ export const getMainReadme = async (owner: string, repo: string) => {
 
   const { render } = useMarkdown()
   const { getCachedNote, saveCacheNote } = prepareNoteCache(
-    `${owner}-${repo}-README`
+    `${owner}-${repo}-README`,
   )
 
   try {
@@ -68,7 +68,7 @@ export const getMainReadme = async (owner: string, repo: string) => {
 
     const README = await octokit.repos.getReadme({
       owner,
-      repo
+      repo,
     })
 
     if (README) {
@@ -90,9 +90,9 @@ export const getMainReadme = async (owner: string, repo: string) => {
 export const getUserSettingsContent = async (
   user: string,
   repo: string,
-  files: RepoFile[]
-): Promise<UserSettings | null> => {
-  const configFile = files.find((file) => file.path === '.litenote.json')
+  files: RepoFile[],
+): Promise<Omit<UserSettings, "chosenFontFamily"> | null> => {
+  const configFile = files.find((file) => file.path === ".litenote.json")
 
   if (!configFile?.sha) {
     return null
@@ -110,7 +110,7 @@ export const getUserSettingsContent = async (
 export const queryFileContent = async (
   user: string,
   repo: string,
-  sha: string
+  sha: string,
 ) => {
   const octokit = await getOctokit()
 
@@ -119,12 +119,12 @@ export const queryFileContent = async (
   }
 
   const file = await octokit.request(
-    'GET /repos/{owner}/{repo}/git/blobs/{file_sha}',
+    "GET /repos/{owner}/{repo}/git/blobs/{file_sha}",
     {
       owner: user,
       repo: repo,
-      file_sha: sha
-    }
+      file_sha: sha,
+    },
   )
 
   return file?.data.content ?? null

src/modules/repo/store/userRepo.store.ts

@@ -1,17 +1,17 @@
-import { defineStore } from 'pinia'
+import { defineStore } from "pinia"
 
-import { data } from '@/data/data'
-import { DataType } from '@/data/DataType.enum'
-import { RepoFile } from '@/modules/repo/interfaces/RepoFile'
-import { UserSettings } from '@/modules/repo/interfaces/UserSettings'
-import { SavedRepo } from '@/modules/repo/models/SavedRepo'
+import { data } from "@/data/data"
+import { DataType } from "@/data/DataType.enum"
+import { RepoFile } from "@/modules/repo/interfaces/RepoFile"
+import { UserSettings } from "@/modules/repo/interfaces/UserSettings"
+import { SavedRepo } from "@/modules/repo/models/SavedRepo"
 import {
   getCachedMainReadme,
   getFiles,
   getMainReadme,
-  getUserSettingsContent
-} from '@/modules/repo/services/repo'
-import { refreshToken } from '@/modules/user/service/signIn'
+  getUserSettingsContent,
+} from "@/modules/repo/services/repo"
+import { refreshToken } from "@/modules/user/service/signIn"
 
 interface State {
   user: string
@@ -22,15 +22,14 @@ interface State {
   needToLogin: boolean
 }
 
-export const useUserRepoStore = defineStore({
-  id: 'USER_REPO_STATE',
+export const useUserRepoStore = defineStore("USER_REPO_STATE", {
   state: (): State => ({
-    user: '',
-    repo: '',
+    user: "",
+    repo: "",
     files: [],
     readme: undefined,
     userSettings: undefined,
-    needToLogin: false
+    needToLogin: false,
   }),
   actions: {
     async setUserRepo(user: string, repo: string) {
@@ -39,7 +38,7 @@ export const useUserRepoStore = defineStore({
 
       const savedRepoId = data.generateId(DataType.SavedRepo, `${user}-${repo}`)
       const cachedSavedRepo = await data.get<DataType.SavedRepo, SavedRepo>(
-        savedRepoId
+        savedRepoId,
       )
 
       if (cachedSavedRepo) {
@@ -49,7 +48,7 @@ export const useUserRepoStore = defineStore({
       try {
         await refreshToken()
       } catch (error) {
-        console.warn('impossible to refresh token', error)
+        console.warn("impossible to refresh token", error)
       }
 
       const userSettingsId = `UserSetting-${user}-${repo}`
@@ -69,20 +68,30 @@ export const useUserRepoStore = defineStore({
             $type: DataType.SavedRepo,
             repo,
             user,
-            files
+            files,
           })
           this.files = files
           return getUserSettingsContent(user, repo, files)
         })
         .then((userSettings) => {
+          const chosenFontFamily = userSettings?.fontFamilies?.find(
+            (font) => font === this.userSettings?.chosenFontFamily,
+          )
+            ? this.userSettings?.chosenFontFamily
+            : userSettings?.fontFamily
           this.userSettings = userSettings
 
-          if (userSettings) {
-            data.update<DataType.UserSettings, UserSettings>({
-              ...userSettings,
-              _id: userSettingsId
-            })
+          if (!this.userSettings) {
+            return
           }
+
+          this.userSettings.chosenFontFamily =
+            chosenFontFamily ?? this.userSettings.fontFamily
+
+          data.update<DataType.UserSettings, UserSettings>({
+            ...this.userSettings,
+            _id: userSettingsId,
+          })
         })
 
       getCachedMainReadme(user, repo).then(async (cachedReadme) => {
@@ -101,11 +110,11 @@ export const useUserRepoStore = defineStore({
         return
       }
 
-      console.log('add file')
+      console.log("add file")
 
       const savedRepoId = data.generateId(
         DataType.SavedRepo,
-        `${this.user}-${this.repo}`
+        `${this.user}-${this.repo}`,
       )
       const newFiles = [...this.files.filter((f) => f.sha !== file.sha), file]
       data.update<DataType.SavedRepo, SavedRepo>({
@@ -113,19 +122,31 @@ export const useUserRepoStore = defineStore({
         $type: DataType.SavedRepo,
         repo: this.repo,
         user: this.user,
-        files: newFiles
+        files: newFiles,
       })
       this.files = newFiles
     },
     resetUserRepo() {
-      this.user = ''
-      this.repo = ''
+      this.user = ""
+      this.repo = ""
       this.resetFiles()
     },
     resetFiles() {
       this.files = []
       this.readme = null
       this.userSettings = undefined
-    }
-  }
+    },
+    setFontFamily(fontFamily: string) {
+      if (!this.userSettings) {
+        return
+      }
+      this.userSettings.chosenFontFamily = fontFamily
+
+      const userSettingsId = `UserSetting-${this.user}-${this.repo}`
+      data.update<DataType.UserSettings, UserSettings>({
+        ...this.userSettings,
+        _id: userSettingsId,
+      })
+    },
+  },
 })