feat: add dashboard

src/views/Dashboard/components/DashboardEditToolbar.vue

@@ -0,0 +1,31 @@
+<template>
+    <div class="flex items-center gap-2 rounded-md border bg-card px-3 py-2">
+        <span class="text-sm font-medium text-muted-foreground">{{ t('dashboard.toolbar.editing') }}</span>
+        <Input
+            :model-value="name"
+            :placeholder="t('dashboard.name_placeholder')"
+            class="mx-2 h-7 max-w-[200px] text-sm"
+            @update:model-value="emit('update:name', $event)" />
+        <div class="flex gap-2">
+            <Button variant="secondary" size="sm" @click="emit('cancel')">{{ t('dashboard.actions.cancel') }}</Button>
+            <Button variant="destructive" size="sm" @click="emit('delete')">{{ t('dashboard.actions.delete') }}</Button>
+        </div>
+        <Button class="ml-auto" size="sm" @click="emit('save')">{{ t('dashboard.actions.save') }}</Button>
+    </div>
+</template>
+
+<script setup>
+    import { useI18n } from 'vue-i18n';
+
+    import { Button } from '@/components/ui/button';
+    import { Input } from '@/components/ui/input';
+
+    defineProps({
+        name: {
+            type: String,
+            default: ''
+        }
+    });
+    const emit = defineEmits(['save', 'cancel', 'delete', 'update:name']);
+    const { t } = useI18n();
+</script>