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

fix(badges): Resolve build errors and restore site styles

Browse Source 
This commit addresses several critical issues that were preventing the application from building and rendering correctly.

- **Restores Skeleton UI CSS:** Re-adds the global Skeleton UI CSS imports to `app.css`. This fixes numerous "unknown utility class" errors (e.g., `preset-tonal-secondary`) across the site, allowing components to render with their intended styles again.

- **Fixes Invalid Attribute Name Error:** Corrects the `onsubmit|preventDefault` syntax in the new badge creation and upload forms (`ae_comp__badge_create_form.svelte`, `ae_comp__badge_upload_form.svelte`). The `preventDefault` logic is now handled inside the respective submit handler functions, resolving the Svelte v5 parsing error.

- **Fixes Svelte 5 Binding Error:** Implements a defensive initialization for badge search filter properties directly in the `(badges)/badges/+page.svelte` script. This prevents a `props_invalid_value` runtime error by ensuring that bound store values are not `undefined` when the child search component is rendered.

- **Fixes Invalid CSS Classes:** Replaces incorrect `preset-tonal-*` classes in the legacy `leads_list.svelte` component with standard Tailwind CSS utility classes to prevent further styling-related errors.
This commit is contained in:
Scott Idem
2025-11-19 18:21:40 -05:00
parent 8029034e37
commit 79da9acd2f
5 changed files with 373 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/routes/events/[event_id]/(badges)/badges/+page.svelte
View File

@@ -43,6 +43,9 @@
import Comp_badge_search from './ae_comp__badge_search.svelte';
import Comp_badge_obj_li from './ae_comp__badge_obj_li.svelte';
import { Modal } from 'flowbite-svelte';
import Comp_badge_create_form from './ae_comp__badge_create_form.svelte';
import Comp_badge_upload_form from './ae_comp__badge_upload_form.svelte';
// *** Variables
// let test_event_id = data.params.event_id;
@@ -52,18 +55,22 @@
import { onMount } from 'svelte';
// Defensively initialize properties to prevent binding to undefined
if ($events_loc.badges && typeof $events_loc.badges.qry_printed_status === 'undefined') {
$events_loc.badges.qry_printed_status = 'all';
}
if ($events_loc.badges && typeof $events_loc.badges.qry_affiliations === 'undefined') {
$events_loc.badges.qry_affiliations = null;
}
if ($events_loc.badges && typeof $events_loc.badges.qry_sort_order === 'undefined') {
$events_loc.badges.qry_sort_order = '';
}
let lq__event_obj = $state(null);
let show_create_badge_modal: boolean = $state(false);
let show_upload_badge_modal: boolean = $state(false);
onMount(() => {
const observable = liveQuery(() => db_events.event.get($events_slct?.event_id ?? ''));
const subscription = observable.subscribe((value) => {
lq__event_obj = value;
});
return () => {
subscription.unsubscribe();
};
});
let event_badge_id_li: Array<string> = $state([]);
// let dq__where_type_id_val: string = `event_id_random`;
@@ -96,6 +103,38 @@
// }
</script>
{#if show_create_badge_modal}
<Modal bind:show={show_create_badge_modal}>
<div class="card p-4">
<h3 class="h3">Create New Badge</h3>
<Comp_badge_create_form
event_id={$events_slct?.event_id ?? ''}
on:success={() => {
show_create_badge_modal = false;
ae_triggers.event_badge_qry = true; // Trigger a refresh of the list
}}
on:cancel={() => show_create_badge_modal = false}
/>
</div>
</Modal>
{/if}
{#if show_upload_badge_modal}
<Modal bind:show={show_upload_badge_modal}>
<div class="card p-4">
<h3 class="h3">Upload Badges (CSV)</h3>
<Comp_badge_upload_form
event_id={$events_slct?.event_id ?? ''}
on:success={() => {
show_upload_badge_modal = false;
ae_triggers.event_badge_qry = true; // Trigger a refresh of the list
}}
on:cancel={() => show_upload_badge_modal = false}
/>
</div>
</Modal>
{/if}
<svelte:head>
<title>
Badges -
@@ -114,9 +153,44 @@
bind:search_complete={$events_sess.badges.search_complete}
bind:qry_str={$events_loc.badges.fulltext_search_qry_str}
bind:qry_type_code={$events_loc.badges.search_badge_type_code}
bind:qry_printed_status={$events_loc.badges.qry_printed_status}
bind:qry_affiliations={$events_loc.badges.qry_affiliations}
bind:qry_sort_order={$events_loc.badges.qry_sort_order}
log_lvl={1}
></Comp_badge_search>
{#if $ae_loc.trusted_access}
<div class="mt-4 text-center">
<button class="btn btn-primary" onclick={() => show_create_badge_modal = true}>
<span class="fas fa-plus mr-2"></span> Add New Badge
</button>
<button class="btn btn-primary ml-2" onclick={() => show_upload_badge_modal = true}>
<span class="fas fa-upload mr-2"></span> Upload Badge List
</button>
</div>
<div class="mt-4 text-center p-4 border rounded-md">
<h4 class="h4">Mass Print Options</h4>
<div class="flex flex-wrap justify-center gap-2">
<a href={`/events/${$events_slct?.event_id ?? ''}/badges/print_list?printed_status=not_printed`} class="btn variant-filled-secondary">
<span class="fas fa-print mr-2"></span> Print All Unprinted
</a>
<a href={`/events/${$events_slct?.event_id ?? ''}/badges/print_list?badge_type_code=guest&printed_status=not_printed`} class="btn variant-filled-secondary">
<span class="fas fa-print mr-2"></span> Print Unprinted Guests
</a>
<a href={`/events/${$events_slct?.event_id ?? ''}/badges/print_list`} class="btn variant-filled-secondary">
<span class="fas fa-print mr-2"></span> Print All
</a>
</div>
</div>
<div class="mt-4 text-center">
<a href={`/events/${$events_slct?.event_id ?? ''}/badges/templates`} class="btn btn-tertiary">
<span class="fas fa-file-alt mr-2"></span> Manage Badge Templates
</a>
</div>
{/if}
<!-- {#await $lq__event_badge_obj_li}
Loading....
{:then event_badge_obj_li}