More general code clean up. Updating Lucide icons.
This commit is contained in:
@@ -22,10 +22,10 @@
|
||||
|
||||
onMount(async () => {
|
||||
// Load the large file specifically first
|
||||
large_file_obj = await load_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
large_file_obj = await load_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
hosted_file_id: LARGE_FILE_ID,
|
||||
log_lvl: 1
|
||||
log_lvl: 1
|
||||
});
|
||||
|
||||
// Fallback for large file if API doesn't have it (for UI testing)
|
||||
@@ -39,17 +39,17 @@
|
||||
};
|
||||
}
|
||||
|
||||
const promises = test_ids.map(id =>
|
||||
load_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
const promises = test_ids.map(id =>
|
||||
load_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
hosted_file_id: id,
|
||||
log_lvl: 1
|
||||
log_lvl: 1
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
const results = await Promise.all(promises);
|
||||
hosted_files = results.filter((f: any) => f !== null) as any[];
|
||||
|
||||
|
||||
// Add a fake object for the invalid ID test
|
||||
hosted_files.push({
|
||||
id: 'INVALID_ID_TEST',
|
||||
@@ -85,7 +85,7 @@
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
<span class="text-[10px] font-bold uppercase opacity-50">Direct Download</span>
|
||||
<button
|
||||
<button
|
||||
class="btn btn-sm {test_direct_download ? 'variant-filled-primary' : 'variant-soft-surface'}"
|
||||
onclick={() => test_direct_download = !test_direct_download}
|
||||
>
|
||||
@@ -108,9 +108,9 @@
|
||||
{/if}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<p class="text-sm opacity-80 italic">
|
||||
Use this file to verify the <strong>percentage counter</strong> and <strong>loading spinner</strong>.
|
||||
Use this file to verify the <strong>percentage counter</strong> and <strong>loading spinner</strong>.
|
||||
This file is ~100MB+, which should provide ample time to observe the progress state.
|
||||
</p>
|
||||
|
||||
@@ -125,9 +125,9 @@
|
||||
<p class="text-xs font-mono opacity-50">ID: {LARGE_FILE_ID}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="w-full md:w-auto">
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={LARGE_FILE_ID}
|
||||
hosted_file_obj={large_file_obj}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -142,10 +142,10 @@
|
||||
|
||||
<div class="card p-6 variant-soft-surface space-y-4 border border-gray-500 shadow-lg">
|
||||
<h2 class="h2">Style & Variant Trials</h2>
|
||||
|
||||
|
||||
{#if loading}
|
||||
<div class="flex items-center gap-2 py-10 justify-center">
|
||||
<Lucide.Loader2 class="animate-spin" />
|
||||
<Lucide.LoaderCircle class="animate-spin" />
|
||||
<span>Loading test metadata gallery...</span>
|
||||
</div>
|
||||
{:else}
|
||||
@@ -159,11 +159,11 @@
|
||||
</div>
|
||||
<span class="badge variant-filled-primary uppercase">{file.extension}</span>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 pt-2">
|
||||
<div class="space-y-1">
|
||||
<p class="text-[10px] opacity-50 uppercase font-bold">Variant: Tonal</p>
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file.id}
|
||||
hosted_file_obj={file}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -172,10 +172,10 @@
|
||||
classes="w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="space-y-1">
|
||||
<p class="text-[10px] opacity-50 uppercase font-bold">Variant: Filled</p>
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file.id}
|
||||
hosted_file_obj={file}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -184,10 +184,10 @@
|
||||
classes="w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="space-y-1">
|
||||
<p class="text-[10px] opacity-50 uppercase font-bold">Variant: Outline</p>
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file.id}
|
||||
hosted_file_obj={file}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -196,10 +196,10 @@
|
||||
classes="w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="space-y-1">
|
||||
<p class="text-[10px] opacity-50 uppercase font-bold">Variant: Ghost</p>
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file.id}
|
||||
hosted_file_obj={file}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -209,10 +209,10 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="pt-2 border-t border-surface-500/20">
|
||||
<p class="text-[10px] opacity-50 uppercase font-bold">Custom Label Snippet:</p>
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file.id}
|
||||
hosted_file_obj={file}
|
||||
show_direct_download={test_direct_download}
|
||||
@@ -240,7 +240,7 @@
|
||||
Testing the component when <code>hosted_file_id</code> or <code>hosted_file_obj</code> is missing.
|
||||
</p>
|
||||
<div class="flex gap-4 mt-4">
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={null}
|
||||
hosted_file_obj={null}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user