feat(events): restore inc_file_counts opt-in, session list layout + button polish
- Add `inc_file_counts` flag to `load_ae_obj_id__event_session` — maps to backend alt view (v_event_session_w_file_count) when true; default stays lightweight. Callers never pass raw view names. - Preserve-on-write fallback in `_refresh_session_id_background` keeps cached file_count/file_count_all if API response omits them. - Session detail +page.ts uses `inc_file_counts: true` so SvelteKit prefetch no longer clobbers counts via bulkPut on hover. - Remove explicit `view: 'alt'` from launcher +page.ts (now invalid param). - Session list link: flex-1 + min-w-0 for full-row width; name flex-1 pushes badge group right; code + file_count stacked in flex-col items-end. - Hover styling: button-like appearance with slow fade-out (duration-500) / fast snap-in (hover:duration-150). - Session +page.svelte: use url_session_id (string) for link_to_id props and auth__kv.session[] index — fixes TS type error from number|undefined. - IDAA layout: dormant tech notice banner (guarded by 1==3, remove when ready). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
@@ -80,7 +80,6 @@ export async function load({ params, parent, url }) {
|
||||
inc_all_file_li: true,
|
||||
inc_presentation_li: true,
|
||||
inc_presenter_li: true,
|
||||
view: 'alt',
|
||||
try_cache: true,
|
||||
log_lvl: 0
|
||||
});
|
||||
|
||||
@@ -25,7 +25,9 @@ import Session_view from './session_view.svelte';
|
||||
import Session_page_menu from './session_page_menu.svelte';
|
||||
import Comp_event_presentation_obj_li from '../../../../ae_comp__event_presentation_obj_li.svelte';
|
||||
import Comp_event_presenter_form_agree from '../../presenter/[presenter_id]/ae_comp__event_presenter_form_agree.svelte';
|
||||
import { LoaderCircle } from '@lucide/svelte';
|
||||
import Comp_event_files_upload from '../../../../ae_comp__event_files_upload.svelte';
|
||||
import Element_manage_event_file_li_wrap from '$lib/elements/element_manage_event_file_li_direct.svelte';
|
||||
import { Archive, FileText, Info, LoaderCircle, Upload } from '@lucide/svelte';
|
||||
// STABILITY FIX: Capture URL params reactively via $derived so liveQuery
|
||||
// closures see a stable identifier that updates on same-route navigation.
|
||||
let url_session_id = $derived(data.params.session_id);
|
||||
@@ -114,31 +116,101 @@ if (!$events_sess.pres_mgmt) $events_sess.pres_mgmt = {};
|
||||
{lq__event_session_obj}
|
||||
{lq__auth__event_presenter_obj} />
|
||||
|
||||
<!-- Metadata Section: Session identity card — name, time, room, host, description -->
|
||||
<div
|
||||
class="bg-surface-50-950 border-surface-200-800 rounded-xl border p-4 shadow-sm">
|
||||
<Session_view
|
||||
{lq__event_presenter_obj}
|
||||
{lq__event_session_obj}
|
||||
{lq__auth__event_presenter_obj}
|
||||
{lq__event_presentation_obj_li} />
|
||||
</div>
|
||||
<!-- Session Info / Files toggle — mirrors the same pattern on the Presenter page.
|
||||
WHY: Admins and session POCs need to upload/manage session-level files (e.g. agendas,
|
||||
handouts) separately from presenter files. The toggle was present for years and was
|
||||
inadvertently dropped during the V3 migration. -->
|
||||
{#if $ae_loc.authenticated_access}
|
||||
<header class="ae_module_header">
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
$events_loc.pres_mgmt.show_content__session_view =
|
||||
$events_loc.pres_mgmt.show_content__session_view === 'manage_files'
|
||||
? null
|
||||
: 'manage_files';
|
||||
}}
|
||||
class="btn btn-md"
|
||||
class:preset-filled-secondary-500={$events_loc.pres_mgmt.show_content__session_view === 'manage_files'}
|
||||
class:preset-filled-tertiary-500={$events_loc.pres_mgmt.show_content__session_view !== 'manage_files'}
|
||||
title="Toggle between session info and session file management">
|
||||
{#if $events_loc.pres_mgmt.show_content__session_view === 'manage_files'}
|
||||
<Info size="1em" class="m-1" />
|
||||
Session Info?
|
||||
{:else}
|
||||
<Archive size="1em" class="m-1" />
|
||||
Session Files?
|
||||
<span
|
||||
class="badge preset-tonal-success"
|
||||
class:hidden={!$lq__event_session_obj?.file_count}>
|
||||
<FileText size="1em" class="m-1" />
|
||||
{$lq__event_session_obj?.file_count}×
|
||||
</span>
|
||||
{/if}
|
||||
</button>
|
||||
</header>
|
||||
{/if}
|
||||
|
||||
<!-- Presentation List Section -->
|
||||
<div class="w-full">
|
||||
<!--
|
||||
{#if $events_loc.pres_mgmt.show_content__session_view === 'manage_files' && $ae_loc.authenticated_access}
|
||||
<!-- Session Files Section -->
|
||||
<div>
|
||||
{#if $ae_loc.trusted_access || $events_loc.auth__kv.session[url_session_id]}
|
||||
<Comp_event_files_upload
|
||||
class_li="border border-surface-200-800 rounded-xl p-4 bg-surface-50-900 hover:bg-surface-100-900 transition-colors duration-200"
|
||||
link_to_type="event_session"
|
||||
link_to_id={url_session_id}>
|
||||
{#snippet label()}
|
||||
<span>
|
||||
<div class="text-lg">
|
||||
<Upload size="1em" />
|
||||
<strong>Upload session files</strong>
|
||||
</div>
|
||||
<div class="text-sm italic opacity-60">
|
||||
Session-level handouts, agendas, or supplemental materials
|
||||
</div>
|
||||
</span>
|
||||
{/snippet}
|
||||
</Comp_event_files_upload>
|
||||
{/if}
|
||||
|
||||
<div class="w-max max-w-full overflow-x-auto">
|
||||
<Element_manage_event_file_li_wrap
|
||||
link_to_type="event_session"
|
||||
link_to_id={url_session_id}
|
||||
allow_basic={$ae_loc.trusted_access ||
|
||||
!!$events_loc.auth__kv.session[url_session_id]}
|
||||
allow_moderator={$ae_loc.trusted_access ||
|
||||
!!$events_loc.auth__kv.session[url_session_id]}
|
||||
container_class_li={''} />
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<!-- Metadata Section: Session identity card — name, time, room, host, description -->
|
||||
<div
|
||||
class="bg-surface-50-950 border-surface-200-800 rounded-xl border p-4 shadow-sm">
|
||||
<Session_view
|
||||
{lq__event_presenter_obj}
|
||||
{lq__event_session_obj}
|
||||
{lq__auth__event_presenter_obj}
|
||||
{lq__event_presentation_obj_li} />
|
||||
</div>
|
||||
|
||||
<!-- Presentation List Section -->
|
||||
<div class="w-full">
|
||||
<!--
|
||||
CRITICAL FIX: Use the pre-loaded data (data.initial_session_obj) as a fallback
|
||||
until the `liveQuery` store ($lq...) emits its first value. This avoids
|
||||
a blank first-draw when IndexedDB is empty on a cold start — the LQ
|
||||
will take over once the DB write completes. Prefer blocking loads
|
||||
where possible; use this fallback when you must load asynchronously.
|
||||
-->
|
||||
<Comp_event_presentation_obj_li
|
||||
lq__event_presentation_obj_li={$lq__event_presentation_obj_li ??
|
||||
data.initial_session_obj?.event_presentation_li ??
|
||||
[]}
|
||||
{log_lvl} />
|
||||
</div>
|
||||
<Comp_event_presentation_obj_li
|
||||
lq__event_presentation_obj_li={$lq__event_presentation_obj_li ??
|
||||
data.initial_session_obj?.event_presentation_li ??
|
||||
[]}
|
||||
{log_lvl} />
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Background Connection Status (Non-blocking) -->
|
||||
{#if !$lq__event_session_obj}
|
||||
|
||||
@@ -42,6 +42,7 @@ export async function load({ params, parent }) {
|
||||
inc_file_li: true,
|
||||
inc_presentation_li: true,
|
||||
inc_presenter_li: true,
|
||||
inc_file_counts: true, // Use richer view so file_count badge is accurate on session detail page
|
||||
try_cache: true,
|
||||
log_lvl: log_lvl
|
||||
});
|
||||
|
||||
@@ -149,7 +149,7 @@ function toggle_details(id: string) {
|
||||
<div class="flex items-center gap-2">
|
||||
<a
|
||||
href="/events/{session_obj?.event_id}/session/{session_obj?.event_session_id}"
|
||||
class="hover:text-primary-500 flex flex-row items-center gap-2 text-left text-lg font-bold transition-colors duration-200">
|
||||
class="hover:text-primary-800-200 hover:bg-surface-400-600 active:bg-surface-200-700 flex flex-1 flex-row items-center gap-2 rounded-lg px-2 py-2 text-left text-lg font-bold transition-colors duration-1000 hover:duration-300 min-w-0">
|
||||
{#if session_obj?.hide}
|
||||
<EyeOff
|
||||
size="1em"
|
||||
@@ -160,15 +160,24 @@ function toggle_details(id: string) {
|
||||
class="text-primary-500 flex-none" />
|
||||
{/if}
|
||||
|
||||
<span>{session_obj?.name}</span>
|
||||
<span class="flex-1">{session_obj?.name}</span>
|
||||
|
||||
{#if session_obj?.file_count_all}
|
||||
<span
|
||||
class="badge preset-tonal-success flex items-center gap-1 px-1 py-0 text-xs">
|
||||
<Check size="1em" />
|
||||
{#if (!$events_loc.pres_mgmt.hide__session_code && session_obj?.code) || session_obj?.file_count_all}
|
||||
<div class="flex flex-col items-end gap-0.5">
|
||||
{#if !$events_loc.pres_mgmt.hide__session_code && session_obj?.code}
|
||||
<span class="border-surface-300-700 text-surface-700-300 bg-surface-200-800 rounded border px-1.5 py-0.5 font-mono text-xs select-all hover:bg-surface-100-900">
|
||||
{session_obj.code}
|
||||
</span>
|
||||
{/if}
|
||||
|
||||
{session_obj.file_count_all}
|
||||
</span>
|
||||
{#if session_obj?.file_count_all}
|
||||
<span
|
||||
class="badge preset-tonal-success flex items-center gap-1 px-1 py-0 text-xs">
|
||||
<Check size="1em" />
|
||||
{session_obj.file_count_all}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
</a>
|
||||
|
||||
|
||||
@@ -64,6 +64,17 @@ let verify_failed_for_uuid: string | null = null;
|
||||
// Handles the case where site_cfg_json loads without novi_idaa_api_key (stale cache)
|
||||
// or the Novi API call hangs — the user would otherwise be stuck with no escape.
|
||||
const VERIFY_TIMEOUT_MS = 8000;
|
||||
|
||||
// One-time technical notice banner — persisted in localStorage so it only shows once.
|
||||
// TEMPORARY (2026-04-01): Remove this block after a few days.
|
||||
const TECH_NOTICE_KEY = 'idaa_tech_notice_2026_04_01_dismissed';
|
||||
let show_tech_notice: boolean = $state(
|
||||
browser ? localStorage.getItem(TECH_NOTICE_KEY) !== 'true' : false
|
||||
);
|
||||
function dismiss_tech_notice() {
|
||||
show_tech_notice = false;
|
||||
try { localStorage.setItem(TECH_NOTICE_KEY, 'true'); } catch { /* storage unavailable */ }
|
||||
}
|
||||
let verifying_timed_out: boolean = $state(false);
|
||||
|
||||
$effect(() => {
|
||||
@@ -353,6 +364,28 @@ async function verify_novi_uuid(
|
||||
{/if}
|
||||
</div>
|
||||
{:else if $ae_loc.trusted_access || ($ae_loc.authenticated_access && $idaa_loc.novi_uuid && $idaa_loc.novi_verified)}
|
||||
{#if show_tech_notice && 1 == 3}
|
||||
<!-- TEMPORARY (2026-04-01): One-time notice about last night's technical issues. Remove after a few days. -->
|
||||
<div class="m-2 flex items-start gap-3 rounded-lg border border-yellow-400 bg-yellow-50 p-3 text-yellow-900 dark:border-yellow-600 dark:bg-yellow-950 dark:text-yellow-100">
|
||||
<span class="fas fa-exclamation-triangle mt-0.5 shrink-0 text-yellow-500"></span>
|
||||
<p class="flex-1 text-sm">
|
||||
Opt 1:
|
||||
<strong>Notice:</strong> We experienced technical difficulties last night (March 31) and this morning (April 1). Things are back to normal. We apologize for any inconvenience.
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
Opt 2:
|
||||
<strong>Notice:</strong> We have experienced some technical difficulties recently. Things are back to normal. We apologize for any inconvenience.
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
class="shrink-0 rounded px-2 py-1 text-xs font-semibold hover:bg-yellow-200 dark:hover:bg-yellow-800 btn"
|
||||
onclick={dismiss_tech_notice}>
|
||||
OK
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
{@render children?.()}
|
||||
{#if $idaa_loc.novi_uuid}
|
||||
<span class="text-sm text-gray-500">
|
||||
|
||||
Reference in New Issue
Block a user