feat: Migrate ESLint to flat config and resolve initial linting errors
Migrated the ESLint configuration to the new flat config format () and addressed several initial linting errors. Key changes include: - Updated ESLint configuration to treat as warnings instead of errors. - Fixed errors in by declaring and . - Corrected error in by using instead of an out-of-scope . - Resolved error in by replacing the undefined directive with the component. - Addressed errors in by replacing with and with . - Fixed errors in by importing necessary modules (, , ) and adding missing props (, , , , ).
This commit is contained in:
Scott Idem
@@ -1,269 +1,245 @@
|
||||
<script lang="ts">
|
||||
import type { key_val } from '$lib/stores/ae_stores';
|
||||
import { ae_util } from '$lib/ae_utils/ae_utils';
|
||||
// import { api } from '$lib/api';
|
||||
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
|
||||
// import Element_data_store from '$lib/element_data_store_v2.svelte';
|
||||
import type { key_val } from '$lib/stores/ae_stores';
|
||||
import { ae_util } from '$lib/ae_utils/ae_utils';
|
||||
// import { api } from '$lib/api';
|
||||
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
|
||||
// import Element_data_store from '$lib/element_data_store_v2.svelte';
|
||||
|
||||
// import { core_func } from '$lib/ae_core_functions';
|
||||
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/stores/ae_stores';
|
||||
import { db_core } from "$lib/ae_core/db_core";
|
||||
import { core_func } from '$lib/ae_core/ae_core_functions';
|
||||
// import { core_func } from '$lib/ae_core_functions';
|
||||
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/stores/ae_stores';
|
||||
import { db_core } from '$lib/ae_core/db_core';
|
||||
import { core_func } from '$lib/ae_core/ae_core_functions';
|
||||
|
||||
// export let allow_basic: boolean = false;
|
||||
// export let allow_basic: boolean = false;
|
||||
|
||||
interface Props {
|
||||
log_lvl?: number;
|
||||
class_li_default?: string;
|
||||
class_li?: string;
|
||||
lq__hosted_file_obj_li: any;
|
||||
link_to_type: string;
|
||||
link_to_id: string;
|
||||
// export let allow_moderator: boolean = false;
|
||||
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
|
||||
max_file_count?: number;
|
||||
file_type?: string; // 'image', 'video', 'audio', 'document', 'other'
|
||||
slct_hosted_file_kv?: key_val;
|
||||
slct_hosted_file_id?: any;
|
||||
slct_hosted_file_obj?: any;
|
||||
}
|
||||
interface Props {
|
||||
log_lvl?: number;
|
||||
class_li_default?: string;
|
||||
class_li?: string;
|
||||
lq__hosted_file_obj_li: any;
|
||||
link_to_type: string;
|
||||
link_to_id: string;
|
||||
// export let allow_moderator: boolean = false;
|
||||
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
|
||||
max_file_count?: number;
|
||||
file_type?: string; // 'image', 'video', 'audio', 'document', 'other'
|
||||
slct_hosted_file_kv?: key_val;
|
||||
slct_hosted_file_id?: any;
|
||||
slct_hosted_file_obj?: any;
|
||||
}
|
||||
|
||||
let {
|
||||
log_lvl = 0,
|
||||
class_li_default = 'flex flex-col gap-1 items-center justify-center w-fit max-w-4xl mx-auto my-1 max-h-96 overflow-auto',
|
||||
class_li = '',
|
||||
lq__hosted_file_obj_li = $bindable([]),
|
||||
link_to_type,
|
||||
link_to_id,
|
||||
display_mode = 'default',
|
||||
max_file_count = 49,
|
||||
file_type = 'all',
|
||||
slct_hosted_file_kv = $bindable({}),
|
||||
slct_hosted_file_id = $bindable(null),
|
||||
slct_hosted_file_obj = $bindable(null)
|
||||
}: Props = $props();
|
||||
let {
|
||||
log_lvl = 0,
|
||||
class_li_default = 'flex flex-col gap-1 items-center justify-center w-fit max-w-4xl mx-auto my-1 max-h-96 overflow-auto',
|
||||
class_li = '',
|
||||
lq__hosted_file_obj_li = $bindable([]),
|
||||
link_to_type,
|
||||
link_to_id,
|
||||
display_mode = 'default',
|
||||
max_file_count = 49,
|
||||
file_type = 'all',
|
||||
slct_hosted_file_kv = $bindable({}),
|
||||
slct_hosted_file_id = $bindable(null),
|
||||
slct_hosted_file_obj = $bindable(null)
|
||||
}: Props = $props();
|
||||
|
||||
// export let show_convert_btn: null|boolean = null;
|
||||
|
||||
// let ae_placeholder_li: key_val = {};
|
||||
let ae_promises: key_val = {};
|
||||
let ae_tmp: key_val = $state({});
|
||||
ae_tmp.show__file_li = true;
|
||||
ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
|
||||
// let ae_triggers: key_val = {};
|
||||
// export let show_convert_btn: null|boolean = null;
|
||||
|
||||
// let ae_placeholder_li: key_val = {};
|
||||
let ae_promises: key_val = {};
|
||||
let ae_tmp: key_val = $state({});
|
||||
ae_tmp.show__file_li = true;
|
||||
ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
|
||||
// let ae_triggers: key_val = {};
|
||||
</script>
|
||||
|
||||
<section class="{class_li_default} {class_li}">
|
||||
<h3 class="h3" class:hidden={!$lq__hosted_file_obj_li?.length || display_mode != 'default'}>
|
||||
Manage Files:
|
||||
<span
|
||||
class="font-bold bg-success-100 px-4 border rounded-lg border-success-200"
|
||||
title="Files for {link_to_type ?? '-- not set --'}: {link_to_id ??
|
||||
'-- not set --'} (files: {$lq__hosted_file_obj_li?.length ?? 'None'})"
|
||||
>
|
||||
<span class="fas fa-folder-open mx-1"></span>
|
||||
{@html $lq__hosted_file_obj_li ? `${$lq__hosted_file_obj_li.length}×` : '-- none --'}
|
||||
</span>
|
||||
</h3>
|
||||
|
||||
<section
|
||||
class="{class_li_default} {class_li}"
|
||||
>
|
||||
<div class="flex flex-row flex-wrap items-center justify-center gap-1">
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
console.log('*** Refresh button clicked ***');
|
||||
|
||||
<h3
|
||||
class="h3"
|
||||
class:hidden={!$lq__hosted_file_obj_li?.length || display_mode != 'default'}
|
||||
>
|
||||
Manage Files:
|
||||
<span class="font-bold bg-success-100 px-4 border rounded-lg border-success-200"
|
||||
title="Files for {link_to_type ?? '-- not set --'}: {link_to_id ?? '-- not set --'} (files: {$lq__hosted_file_obj_li?.length ?? 'None'})"
|
||||
>
|
||||
<span class="fas fa-folder-open mx-1"></span>
|
||||
{@html $lq__hosted_file_obj_li ? `${$lq__hosted_file_obj_li.length}×` : '-- none --'}
|
||||
</span>
|
||||
</h3>
|
||||
db_core.file.clear();
|
||||
|
||||
<div
|
||||
class="flex flex-row flex-wrap items-center justify-center gap-1"
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
console.log('*** Refresh button clicked ***');
|
||||
// let params = {
|
||||
// qry__enabled: 'all',
|
||||
// qry__hidden: 'all',
|
||||
// }
|
||||
|
||||
db_core.file.clear();
|
||||
core_func.load_ae_obj_li__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
for_obj_type: link_to_type,
|
||||
for_obj_id: link_to_id,
|
||||
enabled: 'enabled',
|
||||
hidden: 'not_hidden',
|
||||
limit: 250,
|
||||
// params: params,
|
||||
try_cache: true,
|
||||
log_lvl: 2
|
||||
});
|
||||
|
||||
// let params = {
|
||||
// qry__enabled: 'all',
|
||||
// qry__hidden: 'all',
|
||||
// }
|
||||
// ae_tmp.show__file_li = false;
|
||||
// console.log(`$lq__hosted_file_obj_li:`, $lq__hosted_file_obj_li);
|
||||
// $slct_trigger = 'load__hosted_file_obj_li';
|
||||
// ae_tmp.show__file_li = true;
|
||||
}}
|
||||
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
||||
class:hidden={!$ae_loc.edit_mode || !$ae_loc.authenticated_access}
|
||||
title="Refresh the list of files"
|
||||
>
|
||||
<span class="fas fa-sync-alt m-1"></span>
|
||||
<div class="hidden">Files</div>
|
||||
</button>
|
||||
|
||||
core_func.load_ae_obj_li__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
for_obj_type: link_to_type,
|
||||
for_obj_id: link_to_id,
|
||||
enabled: 'enabled',
|
||||
hidden: 'not_hidden',
|
||||
limit: 250,
|
||||
// params: params,
|
||||
try_cache: true,
|
||||
log_lvl: 2
|
||||
});
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
console.log('*** Show Alt Download button clicked ***');
|
||||
ae_tmp.show__direct_download = !ae_tmp.show__direct_download;
|
||||
}}
|
||||
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
||||
class:hidden={!$ae_loc.edit_mode || !$ae_loc.trusted_access}
|
||||
title="Toggle direct download link and copy link button"
|
||||
>
|
||||
<span class="fas fa-download m-1"></span>
|
||||
<div class="hidden">
|
||||
{ae_tmp.show__direct_download ? 'Alt On' : 'Alt Download Off'}
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
// ae_tmp.show__file_li = false;
|
||||
// console.log(`$lq__hosted_file_obj_li:`, $lq__hosted_file_obj_li);
|
||||
// $slct_trigger = 'load__hosted_file_obj_li';
|
||||
// ae_tmp.show__file_li = true;
|
||||
}}
|
||||
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
||||
class:hidden={!$ae_loc.edit_mode || !$ae_loc.authenticated_access}
|
||||
title="Refresh the list of files"
|
||||
>
|
||||
<span class="fas fa-sync-alt m-1"></span>
|
||||
<div class="hidden">
|
||||
Files
|
||||
</div>
|
||||
</button>
|
||||
{#if $lq__hosted_file_obj_li && $lq__hosted_file_obj_li.length}
|
||||
<div class="overflow-auto w-full">
|
||||
<ol class="list-decimal list-inside">
|
||||
{#each [...$lq__hosted_file_obj_li].reverse().slice(0, max_file_count) as hosted_file_obj}
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.trusted_access}
|
||||
onclick={() => {
|
||||
// This (uploaded_file_kv) is referenced by other AE components. Currently it is only used for the video clipper. This should be a toggle of Add/Remove.
|
||||
if ($ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]) {
|
||||
delete $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id];
|
||||
$ae_loc.files.uploaded_file_kv = { ...$ae_loc.files.uploaded_file_kv };
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
console.log('*** Show Alt Download button clicked ***');
|
||||
ae_tmp.show__direct_download = !ae_tmp.show__direct_download;
|
||||
}}
|
||||
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
||||
class:hidden={!$ae_loc.edit_mode || !$ae_loc.trusted_access}
|
||||
title="Toggle direct download link and copy link button"
|
||||
>
|
||||
<span class="fas fa-download m-1"></span>
|
||||
<div class="hidden">
|
||||
{ae_tmp.show__direct_download ? 'Alt On' : 'Alt Download Off'}
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
delete slct_hosted_file_kv[hosted_file_obj.hosted_file_id];
|
||||
slct_hosted_file_id = null;
|
||||
slct_hosted_file_obj = null;
|
||||
} else {
|
||||
$ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
lq__hosted_file_obj_li[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
|
||||
slct_hosted_file_kv[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
slct_hosted_file_id = hosted_file_obj.hosted_file_id;
|
||||
slct_hosted_file_obj = hosted_file_obj;
|
||||
}
|
||||
log_lvl = 1;
|
||||
if (log_lvl) {
|
||||
console.log(`slct_hosted_file_kv:`, slct_hosted_file_kv);
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
|
||||
title="Add/Remove file to/from the locally stored uploaded file list. This is referenced by other AE components."
|
||||
>
|
||||
{#if $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]}
|
||||
<span class="fas fa-minus-circle m-1"></span>
|
||||
<span class="hidden">Remove</span>
|
||||
{:else}
|
||||
<span class="fas fa-plus-circle m-1"></span>
|
||||
<span class="hidden">Add</span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.administrator_access}
|
||||
onclick={() => {
|
||||
if (
|
||||
!confirm(
|
||||
`Are you sure you want to delete this hosted file?\n${hosted_file_obj.filename} [${hosted_file_obj.hosted_file_id_random}]`
|
||||
)
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
||||
ae_promises.delete__hosted_file_obj = core_func.delete_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
hosted_file_id: hosted_file_obj.hosted_file_id_random,
|
||||
link_to_type: link_to_type,
|
||||
link_to_id: link_to_id,
|
||||
rm_orphan: true,
|
||||
fake_delete: false,
|
||||
log_lvl: 1
|
||||
});
|
||||
}}
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
|
||||
title="Delete a file from the host server."
|
||||
>
|
||||
<span class="fas fa-trash-alt m-1"></span>
|
||||
<span class="hidden">Delete</span>
|
||||
</button>
|
||||
|
||||
{#if $lq__hosted_file_obj_li && $lq__hosted_file_obj_li.length}
|
||||
<div class="overflow-auto w-full">
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.administrator_access}
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
onclick={() => {
|
||||
// This should show/hide the editable fields for the file. This might need to be in a little modal.
|
||||
}}
|
||||
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
|
||||
title="Edit file details"
|
||||
>
|
||||
<span class="fas fa-edit m-1"></span>
|
||||
<span class="hidden">Edit</span>
|
||||
</button>
|
||||
|
||||
<span class="text-xs text-gray-500">
|
||||
<span class="fas fa-calendar-day mx-1"></span>
|
||||
<span class="hidden">Created on:</span>
|
||||
{ae_util.iso_datetime_formatter(hosted_file_obj.created_on, 'datetime_medium_sec')}
|
||||
{#if hosted_file_obj.updated_on}
|
||||
<span class="fas fa-sync-alt mx-1"></span>
|
||||
Updated on
|
||||
{ae_util.iso_datetime_formatter(hosted_file_obj.updated_on, 'datetime_medium_sec')}
|
||||
{/if}
|
||||
</span>
|
||||
|
||||
<ol class="list-decimal list-inside">
|
||||
{#each [...$lq__hosted_file_obj_li].reverse().slice(0, max_file_count) as hosted_file_obj}
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.trusted_access}
|
||||
onclick={() => {
|
||||
// This (uploaded_file_kv) is referenced by other AE components. Currently it is only used for the video clipper. This should be a toggle of Add/Remove.
|
||||
if ($ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]) {
|
||||
delete $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id];
|
||||
$ae_loc.files.uploaded_file_kv = {...$ae_loc.files.uploaded_file_kv};
|
||||
|
||||
delete slct_hosted_file_kv[hosted_file_obj.hosted_file_id];
|
||||
slct_hosted_file_id = null;
|
||||
slct_hosted_file_obj = null;
|
||||
} else {
|
||||
$ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
lq__hosted_file_obj_li[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
|
||||
slct_hosted_file_kv[hosted_file_obj.hosted_file_id] = hosted_file_obj;
|
||||
slct_hosted_file_id = hosted_file_obj.hosted_file_id;
|
||||
slct_hosted_file_obj = hosted_file_obj;
|
||||
}
|
||||
log_lvl = 1;
|
||||
if (log_lvl) {
|
||||
console.log(`slct_hosted_file_kv:`, slct_hosted_file_kv);
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
|
||||
title="Add/Remove file to/from the locally stored uploaded file list. This is referenced by other AE components."
|
||||
>
|
||||
{#if $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]}
|
||||
<span class="fas fa-minus-circle m-1"></span>
|
||||
<span class="hidden">Remove</span>
|
||||
{:else}
|
||||
<span class="fas fa-plus-circle m-1"></span>
|
||||
<span class="hidden">Add</span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.administrator_access}
|
||||
onclick={() => {
|
||||
if (!confirm(`Are you sure you want to delete this hosted file?\n${hosted_file_obj.filename} [${hosted_file_obj.hosted_file_id_random}]`)) {return false;}
|
||||
|
||||
ae_promises.delete__hosted_file_obj = core_func.delete_ae_obj_id__hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
hosted_file_id: hosted_file_obj.hosted_file_id_random,
|
||||
link_to_type: link_to_type,
|
||||
link_to_id: link_to_id,
|
||||
rm_orphan: true,
|
||||
fake_delete: false,
|
||||
log_lvl: 1
|
||||
})
|
||||
}}
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
|
||||
title="Delete a file from the host server."
|
||||
>
|
||||
<span class="fas fa-trash-alt m-1"></span>
|
||||
<span class="hidden">Delete</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
disabled={!$ae_loc.administrator_access}
|
||||
class:hidden={!$ae_loc.administrator_access}
|
||||
onclick={() => {
|
||||
// This should show/hide the editable fields for the file. This might need to be in a little modal.
|
||||
}}
|
||||
|
||||
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
|
||||
title="Edit file details"
|
||||
>
|
||||
<span class="fas fa-edit m-1"></span>
|
||||
<span class="hidden">Edit</span>
|
||||
</button>
|
||||
|
||||
<span class="text-xs text-gray-500">
|
||||
<span class="fas fa-calendar-day mx-1"></span>
|
||||
<span class="hidden">Created on:</span>
|
||||
{ae_util.iso_datetime_formatter(hosted_file_obj.created_on, 'datetime_medium_sec')}
|
||||
{#if hosted_file_obj.updated_on}
|
||||
<span class="fas fa-sync-alt mx-1"></span>
|
||||
Updated on
|
||||
{ae_util.iso_datetime_formatter(hosted_file_obj.updated_on, 'datetime_medium_sec')}
|
||||
{/if}
|
||||
</span>
|
||||
|
||||
<span class="text-sm font-semibold">
|
||||
<!-- <a href="" class="underline text-blue-500"> -->
|
||||
{hosted_file_obj.filename}
|
||||
<!-- </a> -->
|
||||
</span>
|
||||
<span class="text-xs text-gray-500">
|
||||
{ae_util.format_bytes(hosted_file_obj.size)}
|
||||
</span>
|
||||
|
||||
<span
|
||||
class:hidden={!$ae_loc.edit_mode}
|
||||
class="text-xs text-gray-500"
|
||||
>
|
||||
{hosted_file_obj.hash_sha256?.slice(0, 5)}...
|
||||
</span>
|
||||
|
||||
</li>
|
||||
{/each}
|
||||
</ol>
|
||||
|
||||
</div>
|
||||
|
||||
{:else}
|
||||
|
||||
<p
|
||||
class="w-96 text-center text-gray-500"
|
||||
class:hidden={display_mode != 'default'}
|
||||
>
|
||||
No files available to display
|
||||
</p>
|
||||
|
||||
{/if}
|
||||
<span class="text-sm font-semibold">
|
||||
<!-- <a href="" class="underline text-blue-500"> -->
|
||||
{hosted_file_obj.filename}
|
||||
<!-- </a> -->
|
||||
</span>
|
||||
<span class="text-xs text-gray-500">
|
||||
{ae_util.format_bytes(hosted_file_obj.size)}
|
||||
</span>
|
||||
|
||||
<span class:hidden={!$ae_loc.edit_mode} class="text-xs text-gray-500">
|
||||
{hosted_file_obj.hash_sha256?.slice(0, 5)}...
|
||||
</span>
|
||||
</li>
|
||||
{/each}
|
||||
</ol>
|
||||
</div>
|
||||
{:else}
|
||||
<p class="w-96 text-center text-gray-500" class:hidden={display_mode != 'default'}>
|
||||
No files available to display
|
||||
</p>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user