Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(journals): modernize UI with responsive grid and fix Quick Add integration

Browse Source
This commit is contained in:
Scott Idem
2026-01-14 15:20:05 -05:00
parent 283053e4a4
commit 8c9788bd41
5 changed files with 365 additions and 533 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
src/routes/journals/ae_comp__journal_entry_quick_add.svelte
View File

@@ -2,25 +2,31 @@
import { api } from '$lib/api/api';
import { ae_api } from '$lib/stores/ae_stores';
import { journals_slct, journals_loc, journals_trig } from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import { BookType } from '@lucide/svelte';
// Props
let {
class: className = "",
placeholder = "Type your quick note... (First line = Title)"
placeholder = "Type your quick note... (First line = Title)",
journals_li = [] // Optional list of journals to select from
} = $props();
// State
let note_content = $state("");
let is_submitting = $state(false);
// Derived
// Determine target journal: Selected > Default Preference > First Available?
let target_journal_id = $derived($journals_slct.journal_id || $journals_loc.qry__journal_id);
// Derived / Local target
// We prefer the persisted 'qry__journal_id' if we are on the main landing page
let selected_journal_id = $state($journals_loc.qry__journal_id);
// If a journal is explicitly selected via slct (e.g. we are in a journal view), use that
let target_journal_id = $derived($journals_slct.journal_id || selected_journal_id);
async function handle_submit() {
if (!note_content.trim()) return;
if (!target_journal_id) {
alert("No journal selected!");
alert("Please select a target journal first.");
return;
}
@@ -30,33 +36,32 @@
let name = lines[0].substring(0, 100);
if (lines[0].length > 100) name += "...";
// If content is just one line, name is content, content is content.
// If multiple lines, name is line 0, content is full text.
const payload = {
journal_id: target_journal_id,
const data_kv = {
name: name,
content: note_content,
type_code: 'note', // Default to note
// created_on: handled by backend usually, or we can send ISO
enabled: true,
hidden: false
type_code: 'note',
private: false, // Ensure notes are public/decrypted by default
enable: true,
hide: false
};
// Use the store value directly via $ prefix
const api_cfg = $ae_api;
const res = await api.create_ae_obj_v3({
api_cfg: api_cfg,
obj_type: 'journal_entry',
fields: payload
});
try {
const res = await journals_func.create_ae_obj__journal_entry({
api_cfg: $ae_api,
journal_id: target_journal_id, // Pass string ID here
data_kv: data_kv,
log_lvl: 1
});
if (res) {
note_content = "";
// Trigger refresh
$journals_trig.journal_entry_li = true;
} else {
if (res) {
note_content = "";
// Trigger refresh
$journals_trig.journal_entry_li = true;
} else {
alert("Failed to create note.");
}
} catch (error) {
console.error("Error creating journal entry:", error);
alert("Failed to create note.");
}
@@ -68,39 +73,67 @@
handle_submit();
}
}
function handle_journal_change(e: Event) {
const val = (e.target as HTMLSelectElement).value;
selected_journal_id = val;
$journals_loc.qry__journal_id = val; // Persist choice
}
</script>
<div class="card p-4 space-y-4 variant-filled-surface {className}">
<header class="flex justify-between items-center">
<h3 class="h3">Quick Add</h3>
{#if !target_journal_id}
<header class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-2">
<h3 class="h3 flex items-center gap-2">
<BookType size="1.2em" class="text-primary-500" />
Quick Add
</h3>
{#if journals_li && journals_li.length > 0}
<div class="w-full sm:w-auto">
<select
class="select select-sm variant-filled-surface border-surface-500/30 font-bold"
value={target_journal_id}
onchange={handle_journal_change}
>
<option value="" disabled selected={!target_journal_id}>Select Target Journal...</option>
{#each journals_li as journal}
<option value={journal.id}>{journal.name}</option>
{/each}
</select>
</div>
{:else if !target_journal_id}
<span class="badge variant-filled-error">No Journal Selected</span>
{/if}
</header>
<textarea
class="textarea"
rows="3"
bind:value={note_content}
class="textarea variant-filled-surface border-surface-500/20"
rows="3"
bind:value={note_content}
{placeholder}
onkeydown={handle_keydown}
disabled={is_submitting}
></textarea>
<div class="flex justify-end space-x-2">
<button
class="btn variant-ghost-surface"
onclick={() => note_content = ""}
disabled={is_submitting || note_content.length === 0}
>
Clear
</button>
<button
class="btn variant-filled-primary"
onclick={handle_submit}
disabled={is_submitting || !target_journal_id || note_content.length === 0}
>
{#if is_submitting}Saving...{:else}Add Note{/if}
</button>
<div class="flex justify-between items-center">
<span class="text-[10px] opacity-50 font-mono uppercase tracking-tighter hidden sm:block">
Press Ctrl + Enter to save
</span>
<div class="flex justify-end space-x-2 grow sm:grow-0">
<button
class="btn btn-sm variant-ghost-surface"
onclick={() => note_content = ""}
disabled={is_submitting || note_content.length === 0}
>
Clear
</button>
<button
class="btn btn-sm variant-filled-primary font-bold shadow-md"
onclick={handle_submit}
disabled={is_submitting || !target_journal_id || note_content.length === 0}
>
{#if is_submitting}Saving...{:else}Add Note{/if}
</button>
</div>
</div>
</div>
</div>