Dashboard and error handling

packages/sshecret-frontend/src/components/common/Dialog.vue

@@ -0,0 +1,22 @@
+<template>
+  <sl-dialog ref="dialogRef" :open="open" @sl-hide="handleHide" :label="label">
+    <slot />
+    <div slot="footer">
+      <slot name="footer" />
+    </div>
+  </sl-dialog>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useBubbleSafeHandler } from '@/composables/useBubbleSafeHandler'
+
+const props = defineProps<{ label: string; open: boolean }>()
+
+const emit = defineEmits<{ (e: 'hide'): void }>()
+const dialogRef = ref<HTMLSlDrawerElement>()
+
+const handleHide = useBubbleSafeHandler(dialogRef, () => {
+  emit('hide')
+})
+</script>