fixes
This commit is contained in:
@@ -21,6 +21,40 @@ const showCreateDialog = ref(false)
|
||||
const newIdea = ref({ name: '', description: '' })
|
||||
const submitting = ref(false)
|
||||
const API_URL = import.meta.env.VITE_API_URL
|
||||
const isSettingsVisible = ref(localStorage.getItem('ideas_view_settings_visible') !== 'false')
|
||||
|
||||
watch(isSettingsVisible, (val) => {
|
||||
localStorage.setItem('ideas_view_settings_visible', val)
|
||||
})
|
||||
|
||||
// --- Rename Idea ---
|
||||
const showRenameDialog = ref(false)
|
||||
const ideaToRename = ref(null)
|
||||
const newName = ref('')
|
||||
const renaming = ref(false)
|
||||
|
||||
const openRenameDialog = (idea) => {
|
||||
ideaToRename.value = idea
|
||||
newName.value = idea.name
|
||||
showRenameDialog.value = true
|
||||
}
|
||||
|
||||
const handleRename = async () => {
|
||||
if (!newName.value.trim() || newName.value === ideaToRename.value.name) {
|
||||
showRenameDialog.value = false
|
||||
return
|
||||
}
|
||||
|
||||
renaming.value = true
|
||||
try {
|
||||
await ideaStore.updateIdea(ideaToRename.value.id, {
|
||||
name: newName.value.trim()
|
||||
})
|
||||
showRenameDialog.value = false
|
||||
} finally {
|
||||
renaming.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// --- Generation Settings ---
|
||||
const prompt = ref('')
|
||||
@@ -161,6 +195,15 @@ const handleGenerate = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
const pastePrompt = async () => {
|
||||
try {
|
||||
const text = await navigator.clipboard.readText()
|
||||
if (text) prompt.value = text
|
||||
} catch (err) {
|
||||
console.error('Failed to read clipboard', err)
|
||||
}
|
||||
}
|
||||
|
||||
// --- Asset Picker Logic ---
|
||||
const isAssetPickerVisible = ref(false)
|
||||
const assetPickerTab = ref('all') // 'all', 'uploaded', 'generated'
|
||||
@@ -243,14 +286,14 @@ const handleAssetPickerUpload = async (event) => {
|
||||
<template>
|
||||
<div class="flex flex-col h-full font-sans relative">
|
||||
<!-- Content Area (Scrollable) -->
|
||||
<div class="flex-1 overflow-y-auto p-8 pb-48 custom-scrollbar">
|
||||
<div class="flex-1 overflow-y-auto p-4 md:p-6 pb-48 custom-scrollbar">
|
||||
<!-- Top Bar -->
|
||||
<header class="flex justify-between items-end mb-8 border-b border-white/5 pb-6">
|
||||
<header class="flex justify-between items-end mb-4 border-b border-white/5 pb-4">
|
||||
<div>
|
||||
<h1
|
||||
class="text-4xl font-bold m-0 bg-gradient-to-r from-violet-400 to-fuchsia-400 bg-clip-text text-transparent">
|
||||
class="text-2xl font-bold m-0 bg-gradient-to-r from-violet-400 to-fuchsia-400 bg-clip-text text-transparent">
|
||||
Ideas</h1>
|
||||
<p class="mt-2 mb-0 text-slate-400">Your creative sessions and experiments</p>
|
||||
<p class="mt-1 mb-0 text-xs text-slate-400">Your creative sessions and experiments</p>
|
||||
</div>
|
||||
<!-- REMOVED NEW IDEA BUTTON -->
|
||||
</header>
|
||||
@@ -296,9 +339,15 @@ const handleAssetPickerUpload = async (event) => {
|
||||
|
||||
<!-- Details -->
|
||||
<div class="flex-1 min-w-0">
|
||||
<h3
|
||||
class="m-0 text-lg font-bold text-slate-200 group-hover:text-violet-300 transition-colors truncate">
|
||||
{{ idea.name }}</h3>
|
||||
<div class="flex items-center gap-2">
|
||||
<h3
|
||||
class="m-0 text-lg font-bold text-slate-200 group-hover:text-violet-300 transition-colors truncate">
|
||||
{{ idea.name }}</h3>
|
||||
<Button icon="pi pi-pencil" text rounded size="small"
|
||||
class="!w-6 !h-6 !text-slate-500 hover:!text-violet-400 opacity-0 group-hover:opacity-100 transition-opacity"
|
||||
@click.stop="openRenameDialog(idea)"
|
||||
/>
|
||||
</div>
|
||||
<p class="m-0 text-sm text-slate-500 truncate">{{ idea.description || 'No description' }}</p>
|
||||
</div>
|
||||
|
||||
@@ -315,13 +364,29 @@ const handleAssetPickerUpload = async (event) => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Create Idea Dialog (Removed) -->
|
||||
|
||||
<!-- Rename Dialog -->
|
||||
<Dialog v-model:visible="showRenameDialog" header="Rename Idea" modal :style="{ width: '400px' }"
|
||||
:pt="{ root: { class: '!bg-slate-800 !border-white/10' }, header: { class: '!bg-slate-800' }, content: { class: '!bg-slate-800' } }">
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col gap-1">
|
||||
<label class="text-[10px] font-bold text-slate-400 uppercase tracking-wider">New Name</label>
|
||||
<InputText v-model="newName" class="w-full !bg-slate-700 !border-white/10 !text-white" autofocus @keyup.enter="handleRename" />
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 mt-2">
|
||||
<Button label="Cancel" text @click="showRenameDialog = false" class="!text-slate-400 hover:!text-white" />
|
||||
<Button label="Save" :loading="renaming" @click="handleRename" class="!bg-violet-600 !border-none hover:!bg-violet-500" />
|
||||
</div>
|
||||
</div>
|
||||
</Dialog>
|
||||
|
||||
<!-- SETTINGS PANEL (Bottom - Persistent) -->
|
||||
<div
|
||||
<div v-if="isSettingsVisible"
|
||||
class="absolute bottom-4 left-1/2 -translate-x-1/2 w-[95%] max-w-4xl glass-panel border border-white/10 bg-slate-900/95 backdrop-blur-xl px-4 py-3 z-[60] !rounded-[2rem] shadow-2xl flex flex-col gap-1 max-h-[60vh] overflow-y-auto">
|
||||
|
||||
<div class="w-full flex justify-center -mt-1 mb-1 cursor-pointer" @click="isSettingsVisible = false">
|
||||
<div class="w-12 h-1 bg-white/20 rounded-full hover:bg-white/40 transition-colors"></div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col lg:flex-row gap-3">
|
||||
<!-- LEFT COLUMN: Prompt + Character + Assets -->
|
||||
<div class="flex-1 flex flex-col gap-2">
|
||||
@@ -329,7 +394,14 @@ const handleAssetPickerUpload = async (event) => {
|
||||
<div class="flex flex-col gap-1">
|
||||
<div class="flex justify-between items-center">
|
||||
<label class="text-[10px] font-bold text-slate-400 uppercase tracking-wider">Prompt</label>
|
||||
<!-- Optional: Add Clear/Improve buttons here if desired, keeping simple for now to match layout -->
|
||||
<div class="flex gap-1">
|
||||
<Button icon="pi pi-clipboard" label="Paste" size="small" text
|
||||
class="!text-slate-400 hover:!text-white hover:!bg-white/10 !py-0 !px-1.5 !text-[9px] !h-5"
|
||||
@click="pastePrompt" />
|
||||
<Button icon="pi pi-times" label="Clear" size="small" text
|
||||
class="!text-slate-400 hover:!text-white hover:!bg-white/10 !py-0 !px-1.5 !text-[9px] !h-5"
|
||||
@click="prompt = ''" />
|
||||
</div>
|
||||
</div>
|
||||
<Textarea v-model="prompt" rows="2"
|
||||
placeholder="Describe what you want to create... (Auto-starts new session)"
|
||||
@@ -460,6 +532,13 @@ const handleAssetPickerUpload = async (event) => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<transition name="fade">
|
||||
<div v-if="!isSettingsVisible" class="absolute bottom-8 left-1/2 -translate-x-1/2 z-10">
|
||||
<Button label="Open Controls" icon="pi pi-chevron-up" @click="isSettingsVisible = true" rounded
|
||||
class="!bg-violet-600 !border-none !shadow-xl !font-bold shadow-violet-500/40 !px-6 !py-3" />
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<Dialog v-model:visible="isAssetPickerVisible" modal header="Select Assets"
|
||||
:style="{ width: '80vw', maxWidth: '900px' }"
|
||||
:pt="{ root: { class: '!bg-slate-900 !border !border-white/10' }, header: { class: '!bg-slate-900 !border-b !border-white/5 !text-white' }, content: { class: '!bg-slate-900 !p-0' }, footer: { class: '!bg-slate-900 !border-t !border-white/5 !p-4' }, closeButton: { class: '!text-slate-400 hover:!text-white' } }">
|
||||
|
||||
Reference in New Issue
Block a user