Files
OSIT-AE-App-Svelte/src/routes/idaa/(idaa)/archives/+page.svelte
Scott Idem f84d6b638d Implement reactive sorting for IDAA Archives
- Forced priority archives to the top of the list.
- Implemented descending (DESC) sort by the 'sort' field within groups.
- Added a sort selector to the archive list component.
- Centralized sorting logic in-memory within LiveQuery for immediate reactivity.
2026-02-08 18:12:54 -05:00

190 lines
6.3 KiB
Svelte

<script lang="ts">
interface Props {
/** @type {import('./$types').PageData} */
data: any;
}
let { data }: Props = $props();
let log_lvl: number = $state(0);
// *** Import Svelte specific
// import { page } from '$app/state';
import { browser } from '$app/environment';
// import { goto, invalidate, pushState, replaceState } from '$app/navigation';
// *** Import other supporting libraries
// import { Modal } from 'flowbite-svelte';
import { liveQuery } from 'dexie';
// *** Import Aether specific variables and functions
// import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils/ae_utils';
// import { core_func } from '$lib/ae_core/ae_core_functions';
import { db_archives } from '$lib/ae_archives/db_archives';
import {
ae_snip,
ae_loc,
ae_sess,
ae_api,
ae_trig,
slct,
slct_trigger
} from '$lib/stores/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import {
idaa_loc,
idaa_sess,
idaa_slct,
idaa_trig
} from '$lib/stores/ae_idaa_stores';
// import { archives_func } from '$lib/ae_archives/ae_archives_functions';
import Comp__archive_obj_li from './ae_idaa_comp__archive_obj_li.svelte';
import Help_tech from '$lib/app_components/e_app_help_tech.svelte';
let lq__archive_obj_li = $derived(
liveQuery(async () => {
const results = await db_archives.archive
.where('account_id')
.equals($slct.account_id)
.toArray();
// In-memory sort: Priority (desc) then Sort (desc)
results.sort((a, b) => {
// Priority: True (1) before False (0)
const prioA = a.priority ? 1 : 0;
const prioB = b.priority ? 1 : 0;
if (prioA !== prioB) return prioB - prioA;
// Sort: 9, 8, 7...
const sortA = a.sort ?? 0;
const sortB = b.sort ?? 0;
if (sortA !== sortB) return sortB - sortA;
// Fallback: Name
return (a.name ?? '').localeCompare(b.name ?? '');
});
return results;
})
);
if (browser) {
console.log('Browser environment detected.');
// The archive_id should not already be set while the page is loading if we are looking at this page?
// let message = {'archive_id': $idaa_slct?.archive_id ?? null};
$idaa_slct.archive_id = null;
$idaa_slct.archive_content_id = null;
let message = {
archive_id: $idaa_slct.archive_id,
archive_content_id: $idaa_slct.archive_content_id
};
window.parent.postMessage(message, '*');
// add_activity_log(
// {
// action: 'idaa_archives_page',
// action_with: 'browser',
// }
// );
}
function add_activity_log({
action = 'idaa_archives_page',
action_with = 'none'
}: {
action?: string;
action_with?: string;
}) {
let last_cache_refresh_iso = new Date($ae_loc?.last_cache_refresh);
let activity_description = `
${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? 'no-email'}
allow=${$ae_loc?.allow_access}
last_cache_refresh=${last_cache_refresh_iso.toLocaleString()}
data_route=${data?.route.toString() ?? 'unknown'}
`;
let data_kv = {
external_client_id: data?.route.id,
name: `IDAA: ${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? ''}`,
description: activity_description ?? null,
object_type: 'archive', // archive, post, event
// object_id_random: data?.params?.archive_id ?? null,
// object_id_random: ae_acct.slct.archive_id, // data?.params?.archive_id ?? null,
url_root: data?.url.origin,
// url_full_path: data?.url.href,
url_full_path: data?.url.pathname,
url_params: data?.url.searchParams.toString(),
action: action,
action_with: action_with ?? 'none',
meta_json: {
allow_access: $ae_loc?.allow_access,
last_cache_refresh: $ae_loc?.last_cache_refresh,
last_cache_refresh_iso: last_cache_refresh_iso.toISOString(),
last_cache_refresh_locale:
last_cache_refresh_iso.toLocaleString(),
access_level: $ae_loc?.access_level,
iframe: $ae_loc?.iframe
// site_access_key: $ae_loc?.site_access_key,
// site_domain_access_key: $ae_loc?.site_domain_access_key,
// site_domain: $ae_loc?.site_domain,
// extra_data: extra_data ?? '',
// log_lvl: log_lvl,
}
};
core_func.create_ae_obj__activity_log({
api_cfg: $ae_api,
account_id: $ae_loc.account_id,
data_kv: data_kv,
log_lvl: log_lvl
});
}
</script>
<svelte:head>
<title>
IDAA Archives: - Novi - {$ae_loc?.title}
</title>
</svelte:head>
<!-- <h1>Archives {$lq__archive_obj_li?.length}</h1> -->
<Help_tech
e_class="mx-auto"
e_class_h1="novi_m0"
e_class_h2="novi_m0"
btn_class="novi_btn"
show_btn_class="z-10"
additional_kv={{
novi_uuid: $idaa_loc.novi_uuid,
novi_email: $idaa_loc.novi_email,
novi_full_name: $idaa_loc.novi_full_name
}}
></Help_tech>
{#await lq__archive_obj_li}
<div class="flex flex-col items-top justify-center p-8">
<span class="fas fa-spinner fa-spin text-4xl text-primary-500 mb-4"
></span>
<span class="text-lg text-gray-600 dark:text-gray-400"
>Loading archives...</span
>
</div>
{:then}
{#if $lq__archive_obj_li && $lq__archive_obj_li?.length}
<Comp__archive_obj_li {lq__archive_obj_li} />
{:else}
<div class="flex flex-col items-top justify-center p-4 text-center">
<p class="text-lg text-gray-600 dark:text-gray-400 mb-4">
No archives found.
</p>
<p class="text-md text-gray-500 dark:text-gray-300">
Archives will appear here once created.
</p>
</div>
{/if}
{/await}