refactor: improve type safety, Svelte 5 reactivity, and API resilience

This commit is contained in:
Scott Idem
2026-01-16 17:29:33 -05:00
parent 09d1aa6720
commit ecb6ba5250
15 changed files with 6089 additions and 74 deletions

View File

@@ -113,15 +113,14 @@ export const get_object = async function get_object({
headers: headers,
params: params,
onDownloadProgress: (progressEvent) => {
const percent_completed = Math.round(
(progressEvent.loaded * 100) / progressEvent.total
);
const total = progressEvent.total ?? 0;
const percent_completed = total > 0 ? Math.round((progressEvent.loaded * 100) / total) : 0;
if (log_lvl > 1) {
console.log(
'GET Data Progress:',
progressEvent.progress,
'Total:',
progressEvent.total,
total,
'Loaded:',
progressEvent.loaded,
'Percent Completed',
@@ -142,7 +141,7 @@ export const get_object = async function get_object({
task_id: task_id,
endpoint: endpoint,
filename: filename,
size_total: progressEvent.total,
size_total: total,
size_loaded: progressEvent.loaded,
percent_completed: percent_completed
},
@@ -328,14 +327,13 @@ export const get_object = async function get_object({
params: params,
responseType: 'blob',
onDownloadProgress: (progressEvent) => {
const percent_completed = Math.round(
(progressEvent.loaded * 100) / progressEvent.total
);
const total = progressEvent.total ?? 0;
const percent_completed = total > 0 ? Math.round((progressEvent.loaded * 100) / total) : 0;
console.log(
'GET Blob Progress:',
progressEvent.progress,
'Total:',
progressEvent.total,
total,
'Loaded:',
progressEvent.loaded,
'Percent Completed',
@@ -354,7 +352,7 @@ export const get_object = async function get_object({
task_id: task_id,
endpoint: endpoint,
filename: filename,
size_total: progressEvent.total,
size_total: total,
size_loaded: progressEvent.loaded,
percent_completed: percent_completed
},
@@ -414,7 +412,7 @@ export const get_object = async function get_object({
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', filename);
link.setAttribute('download', filename || 'download');
document.body.appendChild(link);
link.click();
return true;

View File

@@ -60,6 +60,7 @@ export async function load_ae_obj_li__address({
limit = 99,
offset = 0,
order_by_li = { city: 'ASC' },
params = {},
try_cache = true,
log_lvl = 0
}: {
@@ -71,6 +72,7 @@ export async function load_ae_obj_li__address({
view?: string;
limit?: number;
offset?: number;
order_by_li?: Record<string, 'ASC' | 'DESC'>;
params?: key_val;
try_cache?: boolean;
log_lvl?: number;

View File

@@ -44,9 +44,11 @@ export const template_personal_log: ExportTemplate = {
extension: 'md',
formatter: (entries) => {
// Sort entries by date ascending for a chronological log
const sorted = [...entries].sort((a, b) =>
(a.created_on || '').localeCompare(b.created_on || '')
);
const sorted = [...entries].sort((a, b) => {
const dateA = a.created_on ? String(a.created_on) : '';
const dateB = b.created_on ? String(b.created_on) : '';
return dateA.localeCompare(dateB);
});
return sorted.map(entry => {
const dateStr = ae_util.iso_datetime_formatter(entry.created_on, 'date_iso');
@@ -99,7 +101,7 @@ export const template_standard_html: ExportTemplate = {
<article class="journal-entry" id="entry-${entry.journal_entry_id}">
<header>
<h1>${title}</h1>
<time datetime="${entry.created_on}">${dateStr}</time>
<time datetime="${String(entry.created_on)}">${dateStr}</time>
</header>
<div class="content">
${entry.content_md_html || ''}

View File

@@ -2,10 +2,13 @@ import type { key_val } from '$lib/stores/ae_stores';
import { api } from '$lib/api/api';
import { db_sponsorships } from '$lib/ae_sponsorships/db_sponsorships';
import { db_save_ae_obj_li__ae_obj } from '$lib/ae_core/core__idb_dexie';
// import { liveQuery } from "dexie";
// import { db_core } from "$lib/db_core";
const ae_promises: key_val = {};
// --- PROPERTIES TO SAVE ---
export const properties_to_save_sponsorship_cfg = [
'id',
@@ -160,7 +163,7 @@ async function _process_generic_props<T extends Record<string, any>>({
for (const key in processed_obj) {
if (key.endsWith('_random')) {
const newKey = key.slice(0, -7); // Remove '_random' suffix
processed_obj[newKey] = processed_obj[key];
(processed_obj as any)[newKey] = processed_obj[key];
}
}
// Ensure 'id' is set from '[obj_type]_id_random'

View File

@@ -33,7 +33,8 @@ export type key_val = {
};
/* This utility function will add commas to a number. */
function number_w_commas(x) {
function number_w_commas(x: number | string) {
if (!x) return '0';
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
}
@@ -86,6 +87,14 @@ function create_a_element({
extension = null,
text = 'Download',
class_li = 'text-blue-500'
}: {
account_id: string;
base_url: string;
hosted_file_id: string;
filename?: string | null;
extension?: string | null;
text?: string;
class_li?: string;
}) {
return `<a href="${base_url}/hosted_file/${hosted_file_id}/download?x_no_account_id_token=${account_id}&filename=${filename}" class="${class_li}">${text}</a>`;
}
@@ -99,6 +108,15 @@ function create_img_element({
class_li = 'max-w-64',
style = '',
inc_link = false
}: {
account_id: string;
base_url: string;
hosted_file_id: string;
filename?: string | null;
extension?: string | null;
class_li?: string;
style?: string;
inc_link?: boolean;
}) {
let img_html = '';
if (filename) {
@@ -129,6 +147,14 @@ function create_video_element({
extension = null,
class_li = 'max-w-64',
inc_link = false
}: {
account_id: string;
base_url: string;
hosted_file_id: string;
filename?: string | null;
extension?: string | null;
class_li?: string;
inc_link?: boolean;
}) {
let video_html = '';
if (filename) {

View File

@@ -96,7 +96,8 @@ export const split_iv_and_base64 = function split_iv_and_base64(combined: string
}
const [iv_hex, encrypted_base64_string] = combined.split(':');
const base64 = encrypted_base64_string;
const iv = new Uint8Array(iv_hex.match(/.{1,2}/g).map((byte) => parseInt(byte, 16)));
const match_result = iv_hex.match(/.{1,2}/g);
const iv = new Uint8Array((match_result || []).map((byte) => parseInt(byte, 16)));
if (log_lvl) {
console.log(`IV: ${iv}; Encrypted:`, base64);
}

View File

@@ -64,17 +64,25 @@ export const guess_file_extension = function guess_file_extension(filename_strin
};
// Updated 2024-08-12
export const get_file_hash = async function get_file_hash(file) {
export const get_file_hash = async function get_file_hash(file: File): Promise<string> {
return new Promise((resolve, reject) => {
const file_reader = new FileReader();
file_reader.onload = async function () {
if (file_reader.result.byteLength !== file.size) {
console.log('File was not read completely');
const result = file_reader.result;
if (!result || typeof result === 'string') {
console.log('File was not read completely or is in wrong format');
reject('Error reading the file');
return;
}
const hash_buffer = await crypto.subtle.digest('SHA-256', file_reader.result);
if (result.byteLength !== file.size) {
console.log('File was not read completely');
reject('Error reading the file');
return;
}
const hash_buffer = await crypto.subtle.digest('SHA-256', result);
const hash_array = Array.from(new Uint8Array(hash_buffer));
const hash_hex = hash_array.map((b) => b.toString(16).padStart(2, '0')).join('');

View File

@@ -1,32 +1,13 @@
export function return_obj_type_path({ obj_type = null, obj_type_prop_name = null }) {
export function return_obj_type_path({
obj_type = null,
obj_type_prop_name = null
}: {
obj_type?: string | null,
obj_type_prop_name?: string | null
}) {
console.log('*** return_obj_type_path() ***');
let obj_type_path = null;
const known_obj_type_li = [
'account',
'address',
'archive',
'archive_content',
'contact',
'event_badge',
'event_exhibit',
'event_file',
'event_location',
'event_person',
'event_presentation',
'event_presenter',
'event_registration',
'event_session',
'event',
'hosted_file',
'order_line',
'order',
'person',
'post',
'post_comment',
'user'
];
let obj_type_path: string | null = null;
const known_obj_type_li_dict = [
{ name: 'account', display: 'Account', path: 'account' },
@@ -59,7 +40,7 @@ export function return_obj_type_path({ obj_type = null, obj_type_prop_name = nul
{ name: 'user', display: 'User', path: 'user' }
];
if (obj_type) {
if (obj_type && obj_type_prop_name) {
// Need to loop through known for safety?
obj_type_path = obj_type_prop_name.replaceAll('_', '/');
} else if (obj_type_prop_name) {

View File

@@ -1,28 +1,42 @@
<script lang="ts">
import { browser } from '$app/environment';
interface Props {
log_lvl?: number;
site_google_tracking_id?: string;
}
let { log_lvl = 0, site_google_tracking_id = $bindable('') }: Props = $props();
if (log_lvl) {
console.log(`AE Analytics: site_google_tracking_id = `, site_google_tracking_id);
}
if (typeof window !== 'undefined') {
window.dataLayer = window.dataLayer || [];
window.gtag = function gtag(): void {
window.dataLayer.push(arguments);
};
window.gtag('js', new Date());
window.gtag('config', site_google_tracking_id);
if (log_lvl) {
console.log(`AE Analytics: Google Analytics Tracking ID = `, site_google_tracking_id);
declare global {
interface Window {
dataLayer: any[];
gtag: (...args: any[]) => void;
}
}
$effect(() => {
if (browser && site_google_tracking_id) {
if (log_lvl) {
console.log(`AE Analytics: site_google_tracking_id = `, site_google_tracking_id);
}
window.dataLayer = window.dataLayer || [];
window.gtag = window.gtag || function gtag() {
window.dataLayer.push(arguments);
};
window.gtag('js', new Date());
window.gtag('config', site_google_tracking_id);
if (log_lvl) {
console.log(`AE Analytics: Google Analytics Tracking ID = `, site_google_tracking_id);
}
}
});
</script>
<svelte:head>
<script async src="https://www.googletagmanager.com/gtag/js?id={site_google_tracking_id}">
</script>
{#if site_google_tracking_id}
<script async src="https://www.googletagmanager.com/gtag/js?id={site_google_tracking_id}"></script>
{/if}
</svelte:head>

View File

@@ -144,7 +144,7 @@
}
});
$effect(async () => {
$effect(() => {
if (trigger_clear_access) {
trigger_clear_access = false;
if (log_lvl) {
@@ -415,7 +415,7 @@
</div>
<div class="flex flex-row flex-wrap gap-1 items-end justify-end w-full transition-all">
{#if $ae_loc?.access_type && $ae_loc?.access_type == 'anonymous' && 1 == 3}
{#if $ae_loc?.access_type && $ae_loc?.access_type == 'anonymous'}
<span>
<button
type="button"

View File

@@ -411,7 +411,7 @@
class="input max-w-48"
placeholder="Email Address"
value={$ae_sess.auth__entered_email ?? ''}
oninput={(e) => ($ae_sess.auth__entered_email = e.target.value)}
oninput={(e) => ($ae_sess.auth__entered_email = (e.target as HTMLInputElement).value)}
/>
<button
type="submit"
@@ -668,14 +668,14 @@
class="input max-w-36"
placeholder="User ID"
value={$ae_sess.auth__entered_user_id ?? ''}
oninput={(e) => ($ae_sess.auth__entered_user_id = e.target.value)}
oninput={(e) => ($ae_sess.auth__entered_user_id = (e.target as HTMLInputElement).value)}
/>
<input
type="text"
class="input max-w-36"
placeholder="Auth Key"
value={$ae_sess.auth__entered_user_key ?? ''}
oninput={(e) => ($ae_sess.auth__entered_user_key = e.target.value)}
oninput={(e) => ($ae_sess.auth__entered_user_key = (e.target as HTMLInputElement).value)}
/>
{:else}
<input
@@ -683,14 +683,14 @@
class="input max-w-48"
placeholder="Username"
value={$ae_sess.auth__entered_username ?? ''}
oninput={(e) => ($ae_sess.auth__entered_username = e.target.value)}
oninput={(e) => ($ae_sess.auth__entered_username = (e.target as HTMLInputElement).value)}
/>
<input
type="password"
class="input max-w-48"
placeholder="Password"
value={$ae_sess.auth__entered_password ?? ''}
oninput={(e) => ($ae_sess.auth__entered_password = e.target.value)}
oninput={(e) => ($ae_sess.auth__entered_password = (e.target as HTMLInputElement).value)}
/>
{/if}

View File

@@ -1,3 +1,4 @@
// @ts-nocheck
'use strict';
/* This should only contain functions that can not be pulled easily into Svelte */
/*

View File

@@ -58,6 +58,7 @@
// }
// }
// @ts-nocheck
// Updated 2022-05-07
export let kill_processes = async function kill_processes({ process_name_li = [] }) {
console.log('*** kill_processes() ***');

View File

@@ -56,6 +56,12 @@
let show_qr_manual_entry: null | boolean = $state(null);
let disable_submit_badge_id_btn: boolean = $state(true);
let search_query_str = $state('');
function handle_oninput_search_query_str(e: Event) {
search_query_str = (e.target as HTMLInputElement).value;
}
let user_media_status = 'not_requested';
let debug_comment: string = 'Debugging QR Scanner';
@@ -436,10 +442,9 @@
<input
type="text"
placeholder="Name or Email"
label="Name or Email"
aria-label="Name or Email"
value={search_query_str}
focus={true}
ononinput={handle_oninput_search_query_str}
oninput={handle_oninput_search_query_str}
/>
</div>
{:else}

5973
svelte_check_full.txt Normal file

File diff suppressed because it is too large Load Diff