feat: add message editing

This commit adds message editing as a feature. To accomplish this, the settings
dialog was refactored into a singleton and now the message edit and settings
use the singleton where appropriate.

app/components/Sidenav/index.vue

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import { DialogType } from '~/composables/useDialog';
+
 const { close: closeSidebar, open, sidebarWidth, resize, saveWidth } = useSidebar();
 const route = useRoute();
 
@@ -35,7 +37,7 @@ const onFocusOut = (e: FocusEvent) => {
     }
 };
 
-const { toggle: toggleSettings } = useSettings();
+const { openDialog } = useDialog();
 
 const onResizeStart = (event: MouseEvent) => {
     isResizing.value = true;
@@ -141,7 +143,7 @@ const navKind = computed(() => {
 
                 <div class="flex justify-between pt-2">
                     <div class="flex">
-                        <button @click="toggleSettings()"
+                        <button @click="openDialog(DialogType.Settings)"
                             class="flex items-center justify-center h-7 w-7 cursor-pointer hover:bg-[var(--color-hover)] focus-visible:bg-[var(--color-hover)] rounded-lg transition-colors text-[var(--text-secondary)] active:text-[var(--text-primary)]">
                             <Icon name="mynaui:cog-four" class="text-5" />
                         </button>