\n 📝\n {editingEntry ? 'Edit Journal Entry' : 'New Journal Entry'}\n

\n \n ✕\n \n

\n\n

\n {/* Title */}\n

\n Title\n setTitle(e.target.value)}\n placeholder=\"Give your entry a title...\"\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500\"\n required\n />\n

\n\n {/* Mood Before/After */}\n

\n \n Mood Before Writing (optional)\n \n setMoodBefore(e.target.value ? parseInt(e.target.value) : undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500\"\n >\n \n {Array.from({ length: 10 }, (_, i) => i + 1).map(num => (\n \n ))}\n \n

\n \n Mood After Writing (optional)\n \n setMoodAfter(e.target.value ? parseInt(e.target.value) : undefined)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500\"\n >\n \n {Array.from({ length: 10 }, (_, i) => i + 1).map(num => (\n \n ))}\n \n

\n\n {/* Writing Prompts */}\n

\n \n Need inspiration? Try these prompts:\n \n

\n {journalPrompts.slice(0, 6).map((prompt, idx) => (\n usePrompt(prompt)}\n className=\"text-left p-2 text-sm bg-purple-50 text-purple-700 rounded border hover:bg-purple-100 transition-colors\"\n >\n {prompt}\n \n ))}\n

\n\n {/* Content */}\n

\n Your thoughts\n setContent(e.target.value)}\n placeholder=\"Write about your thoughts, feelings, experiences...\"\n rows={12}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500\"\n required\n />\n

\n {content.length} characters\n

\n\n {/* Tags */}\n

\n Tags\n

\n {tags.map(tag => (\n \n {tag}\n removeTag(tag)}\n className=\"ml-1 text-purple-600 hover:text-purple-800\"\n >\n ×\n \n \n ))}\n

\n setTagInput(e.target.value)}\n onKeyPress={(e) => e.key === 'Enter' && (e.preventDefault(), addTag())}\n placeholder=\"Add a tag...\"\n className=\"flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-purple-500\"\n />\n \n Add\n \n

\n\n {/* Submit Buttons */}\n

\n \n {isSubmitting ? 'Saving...' : (editingEntry ? 'Update Entry' : 'Save Entry')}\n \n \n Cancel\n \n

\n );\n }\n\n return (\n

\n {/* Header */}\n

\n 📝\n Journal\n

\n \n ✏️ New Entry\n \n

\n\n {/* Journal Entries */}\n {entries.length === 0 ? (\n

📖

Start Your Journal

\n Writing can help you process emotions, track patterns, and reflect on your journey.\n

\n \n Write Your First Entry\n \n

\n ) : (\n

\n {entries.map((entry) => (\n

{entry.title}

\n {new Date(entry.created_at!).toLocaleDateString()} at{' '}\n {new Date(entry.created_at!).toLocaleTimeString()}\n

\n editEntry(entry)}\n className=\"text-gray-400 hover:text-blue-600\"\n title=\"Edit entry\"\n >\n ✏️\n \n deleteEntry(entry.id!)}\n className=\"text-gray-400 hover:text-red-600\"\n title=\"Delete entry\"\n >\n 🗑️\n \n

\n\n {/* Mood indicators */}\n {(entry.mood_before || entry.mood_after) && (\n

\n {entry.mood_before && (\n \n Mood before: {entry.mood_before}/10\n \n )}\n {entry.mood_after && (\n \n Mood after: {entry.mood_after}/10\n \n )}\n

\n )}\n\n {/* Content preview */}\n

\n {entry.content.length > 300 ? (\n <>\n {entry.content.substring(0, 300)}...\n editEntry(entry)}\n className=\"text-purple-600 hover:text-purple-800 ml-2\"\n >\n Read more\n \n \n ) : (\n entry.content\n )}\n

\n\n {/* Tags */}\n {entry.tags && entry.tags.length > 0 && (\n

\n {entry.tags.map((tag, idx) => (\n \n {tag}\n \n ))}\n

\n )}\n

\n ))}\n

\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/andym42/Mind_clinic/code/frontend/components/Journal.tsx","extension","actionData","errors"]