51bdad9485
- Enhanced AE_AITools with a Settings tab for model, prompt, and parameter configuration. - Connected AE_AITools to Journals state via two-way bindings for persistent configuration. - Removed redundant AI settings from Journals config modal. - Standardized Svelte 5 patterns for cross-module component configuration.
254 lines
8.1 KiB
Svelte
254 lines
8.1 KiB
Svelte
<script lang="ts">
|
|
interface Props {
|
|
log_lvl?: number;
|
|
show?: boolean;
|
|
tab?: string;
|
|
}
|
|
|
|
let {
|
|
log_lvl = $bindable(0),
|
|
show = $bindable(true),
|
|
tab = $bindable('form') // form, local_json, session_json
|
|
}: Props = $props();
|
|
|
|
import {
|
|
ArrowDown01,
|
|
ArrowDown10,
|
|
ArrowDownUp,
|
|
BetweenVerticalEnd,
|
|
BetweenVerticalStart,
|
|
Bot,
|
|
BookHeart,
|
|
BookImage,
|
|
Bookmark,
|
|
BookOpenText,
|
|
BriefcaseBusiness,
|
|
CalendarClock,
|
|
Check,
|
|
Copy,
|
|
Expand,
|
|
Eye,
|
|
EyeOff,
|
|
Flag,
|
|
FlagOff,
|
|
FilePlus,
|
|
Fingerprint,
|
|
Globe,
|
|
Library,
|
|
MessageSquareWarning,
|
|
Minus,
|
|
Notebook,
|
|
Pencil,
|
|
Plus,
|
|
RefreshCcw,
|
|
RemoveFormatting,
|
|
SquareLibrary,
|
|
Shapes,
|
|
Share2,
|
|
ShieldCheck,
|
|
ShieldMinus,
|
|
Siren,
|
|
Skull,
|
|
Tags,
|
|
Target,
|
|
ToggleLeft,
|
|
ToggleRight,
|
|
Trash2,
|
|
TypeOutline,
|
|
X
|
|
} from '@lucide/svelte';
|
|
import { Modal } from 'flowbite-svelte';
|
|
|
|
import {
|
|
ae_snip,
|
|
ae_loc,
|
|
ae_sess,
|
|
ae_api,
|
|
ae_trig,
|
|
slct,
|
|
slct_trigger
|
|
} from '$lib/stores/ae_stores';
|
|
import {
|
|
journals_loc,
|
|
journals_sess,
|
|
journals_slct,
|
|
journals_prom,
|
|
journals_trig
|
|
} from '$lib/ae_journals/ae_journals_stores';
|
|
import E_app_codemirror_v5 from '$lib/app_components/e_app_codemirror_v5.svelte';
|
|
</script>
|
|
|
|
<Modal
|
|
bind:open={show}
|
|
autoclose={false}
|
|
placement="top-center"
|
|
size="xl"
|
|
class="
|
|
top-center
|
|
relative
|
|
flex flex-col
|
|
mx-auto w-full
|
|
bg-white dark:bg-gray-800
|
|
text-gray-800 dark:text-gray-200
|
|
border border-orange-300 dark:border-orange-700 rounded-lg
|
|
shadow-xl
|
|
"
|
|
headerClass="
|
|
flex flex-row gap-2 items-center justify-between
|
|
w-full
|
|
bg-orange-100 dark:bg-orange-900
|
|
"
|
|
footerClass="
|
|
flex flex-row gap-2 items-center justify-center
|
|
w-full
|
|
bg-orange-100 dark:bg-orange-900
|
|
"
|
|
>
|
|
{#snippet header()}
|
|
<h3>
|
|
<span class="text-base font-semibold">
|
|
<span class="text-primary-500">
|
|
<BookOpenText class="inline-block mr-1" />
|
|
</span>
|
|
Æ Journals Settings:
|
|
</span>
|
|
{$journals_loc?.name ?? '-- not set --'}
|
|
</h3>
|
|
{/snippet}
|
|
|
|
<div class="modal h-full md:pb-24">
|
|
<div class="modal-box space-y-2">
|
|
<!-- Menu to toggle between viewing JSON and the form view -->
|
|
<div class="flex flex-row gap-1 items-center justify-center">
|
|
<button
|
|
type="button"
|
|
class:preset-outlined-surface-200-800={tab === 'form'}
|
|
class="
|
|
btn btn-sm
|
|
preset-outlined-surface-50-950
|
|
transition-all
|
|
"
|
|
onclick={() => (tab = 'form')}
|
|
>
|
|
<span class="fas fa-cog mr-1"></span>
|
|
Config
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class:preset-outlined-surface-200-800={tab === 'local_json'}
|
|
class="
|
|
btn btn-sm
|
|
preset-outlined-surface-50-950
|
|
transition-all
|
|
"
|
|
onclick={() => (tab = 'local_json')}
|
|
>
|
|
<span class="fas fa-code mr-1"></span>
|
|
Local JSON
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class:preset-outlined-surface-200-800={tab === 'session_json'}
|
|
class="
|
|
btn btn-sm
|
|
preset-outlined-surface-50-950
|
|
transition-all
|
|
"
|
|
onclick={() => (tab = 'session_json')}
|
|
>
|
|
<span class="fas fa-code mr-1"></span>
|
|
Session JSON
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Section for the configuration form -->
|
|
<div
|
|
class:hidden={tab !== 'form'}
|
|
class="flex flex-col gap-6 items-start justify-start p-2"
|
|
>
|
|
<div class="w-full space-y-4">
|
|
<h2 class="h2 text-xl font-bold flex items-center gap-2 border-b border-surface-500/30 pb-2">
|
|
<CalendarClock class="text-primary-500" />
|
|
Date and Time Settings
|
|
</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<label class="label">
|
|
<span>DateTime Format</span>
|
|
<select
|
|
bind:value={$journals_loc.datetime_format}
|
|
class="select"
|
|
>
|
|
<option value="datetime_12_short">MMM D, YY hh:mm A</option>
|
|
<option value="datetime_12_long">MMMM D, YYYY hh:mm A</option>
|
|
<option value="datetime_short">MMM D, YY HH:mm</option>
|
|
<option value="datetime_long">MMMM D, YYYY HH:mm</option>
|
|
<option value="datetime_us">US (MM/DD/YYYY hh:mm:ss A)</option>
|
|
<option value="datetime_iso">ISO (YYYY-MM-DD HH:mm:ss)</option>
|
|
</select>
|
|
</label>
|
|
|
|
<label class="label">
|
|
<span>Time Format</span>
|
|
<select
|
|
bind:value={$journals_loc.time_format}
|
|
class="select"
|
|
>
|
|
<option value="time_12_short">12-hour short (e.g., 3:30 PM)</option>
|
|
<option value="time_12_long">12-hour long (e.g., 3:30:45 PM)</option>
|
|
<option value="time_short">24-hour short (e.g., 15:30)</option>
|
|
<option value="time_long">24-hour long (e.g., 15:30:45)</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Section for viewing (and direct editing???) the raw localStorage JSON configuration -->
|
|
<div class:hidden={tab !== 'local_json'} class="">
|
|
<E_app_codemirror_v5
|
|
editable={false}
|
|
readonly={true}
|
|
content={JSON.stringify($journals_loc, null, 2)}
|
|
show_line_numbers={false}
|
|
placeholder=""
|
|
class="
|
|
p-1
|
|
preset-outlined-surface-100-900
|
|
rounded-lg
|
|
"
|
|
/>
|
|
<!-- <pre class="text-wrap">
|
|
{JSON.stringify($journals_loc, null, 2)}
|
|
</pre> -->
|
|
</div>
|
|
|
|
<!-- Section for viewing (and direct editing???) the raw sessionStorage JSON configuration -->
|
|
<div class:hidden={tab !== 'session_json'} class="">
|
|
<E_app_codemirror_v5
|
|
editable={false}
|
|
readonly={true}
|
|
content={JSON.stringify($journals_sess, null, 2)}
|
|
show_line_numbers={false}
|
|
placeholder=""
|
|
class="
|
|
p-1
|
|
preset-outlined-surface-100-900
|
|
rounded-lg
|
|
"
|
|
/>
|
|
<!-- <pre class="text-wrap">
|
|
{JSON.stringify($journals_sess, null, 2)}
|
|
</pre> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{#snippet footer()}
|
|
<button class="btn btn-sm btn-outline btn-primary" onclick={() => (show = false)}>
|
|
<X class="inline-block mr-1" />
|
|
Close
|
|
</button>
|
|
{/snippet}
|
|
</Modal>
|