[FEAT] Save name fix

This commit is contained in:
2026-01-01 19:20:16 +01:00
parent a314721a60
commit 934b6cba9b
6 changed files with 197 additions and 45 deletions

View File

@@ -16,14 +16,19 @@
<div class="hidden md:flex items-center gap-5">
<!-- Auth & Projects -->
<template v-if="authStore.user">
<NavbarProjectActions @open-save-modal="openSaveModal" @open-new-project-modal="isNewProjectModalOpen = true" @open-project-list="isProjectListOpen = true" />
<NavbarProjectActions
@save-project="handleQuickSave"
@open-save-modal="openSaveModal"
@open-new-project-modal="isNewProjectModalOpen = true"
@open-project-list="isProjectListOpen = true"
/>
<div class="h-4 w-px bg-gray-200 dark:bg-gray-700"></div>
<!-- User Dropdown -->
<NavbarUserMenu @open-auth-modal="isAuthModalOpen = true" />
</template>
<div v-else>
<button @click="isAuthModalOpen = true" class="btn btn-primary btn-sm shadow-indigo-500/20 shadow-lg">Login / Register</button>
</div>
@@ -48,6 +53,7 @@
:is-open="isMobileMenuOpen"
@close="isMobileMenuOpen = false"
@open-help="$emit('open-help')"
@save-project="handleQuickSave"
@open-save-modal="openSaveModal"
@open-new-project-modal="isNewProjectModalOpen = true"
@open-project-list="isProjectListOpen = true"
@@ -55,12 +61,12 @@
</nav>
<AuthModal :is-open="isAuthModalOpen" @close="isAuthModalOpen = false" />
<ProjectList :is-open="isProjectListOpen" @close="isProjectListOpen = false" @open-project="handleOpenProject" />
<SaveProjectModal :is-open="isSaveProjectModalOpen" :initial-name="projectStore.currentProject?.name" @close="isSaveProjectModalOpen = false" @save="handleSaveProject" />
<SaveProjectModal :is-open="isSaveProjectModalOpen" :initial-name="saveModalInitialName" @close="isSaveProjectModalOpen = false" @save="handleSaveProject" />
<NewProjectModal :is-open="isNewProjectModalOpen" @close="isNewProjectModalOpen = false" @create="handleCreateNewProject" />
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { ref, computed } from 'vue';
import DarkModeToggle from '../utilities/DarkModeToggle.vue';
import { useAuthStore } from '@/stores/useAuthStore';
import AuthModal from '@/components/auth/AuthModal.vue';
@@ -85,27 +91,49 @@
const isProjectListOpen = ref(false);
const isSaveProjectModalOpen = ref(false);
const isNewProjectModalOpen = ref(false);
const saveMode = ref<'save' | 'save-as'>('save');
const authStore = useAuthStore();
const projectStore = useProjectStore();
const { createProject, openProject, saveProject } = useProjectManager();
const { createProject, openProject, saveProject, saveAsProject } = useProjectManager();
const handleOpenProject = async (project: Project) => {
await openProject(project);
};
const openSaveModal = () => {
const openSaveModal = (mode: 'save' | 'save-as' = 'save') => {
saveMode.value = mode;
isSaveProjectModalOpen.value = true;
};
const saveModalInitialName = computed(() => {
if (saveMode.value === 'save-as') {
return (projectStore.currentProject?.name ? projectStore.currentProject.name + ' (copy)' : '');
}
return projectStore.currentProject?.name;
});
const handleQuickSave = async () => {
if (projectStore.currentProject?.name) {
await saveProject(projectStore.currentProject.name);
} else {
openSaveModal('save');
}
};
const handleSaveProject = async (name: string) => {
try {
await saveProject(name);
if (saveMode.value === 'save-as') {
await saveAsProject(name);
} else {
await saveProject(name);
}
} catch {
// Error handled in composable
}
};
const handleCreateNewProject = (config: { width: number; height: number; columns: number; rows: number }) => {
createProject(config);
};