store settings in localstorage

This commit is contained in:
2023-05-24 23:30:28 +02:00
parent d6480a7a37
commit d62444f65e
4 changed files with 49 additions and 4 deletions

View File

@@ -7,11 +7,14 @@ import {
setClientKey, setClientKey,
passphraseRequired passphraseRequired
} from '@/composables/useEncryption' } from '@/composables/useEncryption'
import { initializeSettings} from '@/composables/useSettings'
import { windowIsMobile } from '@/utils/helpers' import { windowIsMobile } from '@/utils/helpers'
import SideBar from '@/components/SideBar.vue' import SideBar from '@/components/SideBar.vue'
import firebase from 'firebase/compat/app' import firebase from 'firebase/compat/app'
import * as firebaseui from 'firebaseui' import * as firebaseui from 'firebaseui'
initializeSettings()
const sideBarCollapsed = ref<boolean>(windowIsMobile()) const sideBarCollapsed = ref<boolean>(windowIsMobile())
// const Note = defineAsyncComponent(() => import('@/components/ViewModes/Note.vue')) // const Note = defineAsyncComponent(() => import('@/components/ViewModes/Note.vue'))
@@ -90,9 +93,10 @@ provide('loading', loading)
</main> </main>
</div> </div>
<Modal :open="passphraseRequired" :persistent="true"> <Modal :open="passphraseRequired" :persistent="true">
<template #title>Enter your passphrase</template>
<template #default> <template #default>
<p> <p>
Your notes are encrypted. Please enter your encryption key passphrase to decrypt your notes. Your notes are encrypted. Please enter your encryption key passphrase to decrypt your cloud notes.
</p> </p>
<input type="password" class="input-bordered input mt-4 w-full" v-model="passphrase" /> <input type="password" class="input-bordered input mt-4 w-full" v-model="passphrase" />
</template> </template>

View File

@@ -2,6 +2,8 @@
import { activeNotesSource, notesSources } from '@/composables/useNotes' import { activeNotesSource, notesSources } from '@/composables/useNotes'
import { signOut as firebaseSignOut } from '@/composables/useFirebase' import { signOut as firebaseSignOut } from '@/composables/useFirebase'
import { OnClickOutside } from '@vueuse/components' import { OnClickOutside } from '@vueuse/components'
import { preferredNotesSource } from '@/composables/useSettings'
const sourceLabels: { [source: string]: string } = { const sourceLabels: { [source: string]: string } = {
local: 'Switch to local notes', local: 'Switch to local notes',
firebase: 'Switch to cloud notes' firebase: 'Switch to cloud notes'
@@ -17,6 +19,7 @@ const availableNoteSources = computed(() =>
const signOut = async (close: () => Promise<boolean>) => { const signOut = async (close: () => Promise<boolean>) => {
await firebaseSignOut() await firebaseSignOut()
preferredNotesSource.value = null
close() close()
} }
@@ -41,7 +44,7 @@ const handleClick = (fn: (...args: any[]) => any) => {
class="text-base" class="text-base"
v-for="{ source, label } in availableNoteSources" v-for="{ source, label } in availableNoteSources"
:key="source" :key="source"
@click="handleClick(() => (activeNotesSource = source))" @click="handleClick(() => (preferredNotesSource = source))"
> >
<a> <a>
<i class="fa-fw fa-solid fa-database" /> <i class="fa-fw fa-solid fa-database" />

View File

@@ -7,20 +7,34 @@ import { decryptNotes, encryptionKey } from '@/composables/useEncryption'
import { defaultNotes } from '@/utils/defaultNotes' import { defaultNotes } from '@/utils/defaultNotes'
import { mdToHtml } from '@/utils/markdown' import { mdToHtml } from '@/utils/markdown'
import { getAllMatches } from '@/utils/helpers' import { getAllMatches } from '@/utils/helpers'
import { preferredNotesSource } from '@/composables/useSettings'
export const notesSources = computed(() => ({ export const notesSources = computed(() => ({
local: true, local: true,
firebase: initialized.value && user.value firebase: initialized.value && user.value
})) }))
type notesSourceValues = keyof typeof notesSources.value | null export const availableNotesSources = computed(() =>
Object.entries(notesSources.value)
.filter(([, enabled]) => enabled)
.map(([source]) => source)
)
export type notesSourceValues = keyof typeof notesSources.value | null
export const activeNotesSource = ref<notesSourceValues>(null) export const activeNotesSource = ref<notesSourceValues>(null)
watchEffect(() => { watchEffect(() => {
const getSource = (): notesSourceValues => { const getSource = (): notesSourceValues => {
if (!initialized.value) return null if (!initialized.value) return null
return user.value ? 'firebase' : 'local' if (
preferredNotesSource.value &&
availableNotesSources.value.includes(preferredNotesSource.value)
) {
return preferredNotesSource.value
} else {
return user.value ? 'firebase' : 'local'
}
} }
activeNotesSource.value = getSource() activeNotesSource.value = getSource()
}) })

View File

@@ -0,0 +1,24 @@
import type { notesSourceValues } from '@/composables/useNotes'
interface Settings {
preferredNotesSource: notesSourceValues
}
export const preferredNotesSource = ref<notesSourceValues>(null)
const updateSettings = () => {
const settings: Settings = {
preferredNotesSource: preferredNotesSource.value
}
localStorage.setItem('settings', JSON.stringify(settings))
}
export const initializeSettings = () => {
watch([preferredNotesSource], () => updateSettings())
try {
const settings: Settings = JSON.parse(localStorage.getItem('settings') || '{}')
preferredNotesSource.value = settings.preferredNotesSource
} catch (error) {
console.error(error)
}
}