Hide empty journal attachments
This commit is contained in:
Scott Idem
@@ -191,124 +191,121 @@ async function handle_remove_file(file_id: string) {
|
||||
}
|
||||
</script>
|
||||
|
||||
<section class="ae_section journal_entry_files my-2 w-full space-y-4">
|
||||
<!-- Header -->
|
||||
<div
|
||||
class="border-surface-500/20 flex items-center justify-between border-b pb-2">
|
||||
<h3 class="h3 flex items-center gap-2 text-lg font-bold">
|
||||
<Paperclip size="1.1em" />
|
||||
Attachments
|
||||
{#if unified_file_li.length}
|
||||
<span class="badge preset-tonal-surface text-xs"
|
||||
>{unified_file_li.length}</span>
|
||||
{/if}
|
||||
</h3>
|
||||
|
||||
{#if $ae_loc.edit_mode}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm preset-tonal-warning font-semibold"
|
||||
onclick={() => {
|
||||
$ae_sess.files.add_to_use_files_method =
|
||||
$ae_sess.files.add_to_use_files_method === 'upload'
|
||||
? 'select'
|
||||
: 'upload';
|
||||
}}>
|
||||
<RefreshCw size="1em" class="mr-2" />
|
||||
{$ae_sess.files.add_to_use_files_method === 'select'
|
||||
? 'Switch to Upload'
|
||||
: 'Switch to Select'}
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- File Grid -->
|
||||
{#if unified_file_li.length}
|
||||
<div class="grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3">
|
||||
{#each unified_file_li as file (file.hosted_file_id ?? file.id)}
|
||||
{@const file_id =
|
||||
file.hosted_file_id || file.id || file.hosted_file_id}
|
||||
<div
|
||||
class="bg-surface-50-950 border-surface-500/10 group hover:border-primary-500 flex items-center justify-between rounded-xl border p-3 shadow-sm transition-all">
|
||||
<div class="flex grow items-center gap-3 overflow-hidden">
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file_id}
|
||||
hosted_file_obj={file}
|
||||
color="primary"
|
||||
variant="tonal"
|
||||
classes="w-full !justify-start !px-2"
|
||||
show_divider={true}
|
||||
max_filename={25}
|
||||
show_direct_download={$ae_loc.trusted_access &&
|
||||
$ae_loc.edit_mode} />
|
||||
</div>
|
||||
|
||||
<div class="ml-2 flex items-center gap-1">
|
||||
{#if $ae_loc.edit_mode}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm preset-tonal-error"
|
||||
onclick={() => handle_remove_file(file_id)}
|
||||
title="Remove attachment">
|
||||
<Trash2 size="1.1em" />
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{:else if !$ae_loc.edit_mode}
|
||||
<p
|
||||
class="text-surface-500 bg-surface-500/5 rounded-xl p-4 text-center text-sm italic">
|
||||
No files attached to this entry.
|
||||
</p>
|
||||
{/if}
|
||||
|
||||
<!-- Edit/Management Tools -->
|
||||
{#if $ae_loc.edit_mode}
|
||||
{#if $ae_loc.edit_mode || unified_file_li.length > 0}
|
||||
<section class="ae_section journal_entry_files my-2 w-full space-y-4">
|
||||
<!-- Header -->
|
||||
<div
|
||||
class="bg-surface-500/5 border-surface-500/20 mt-4 rounded-2xl border-2 border-dashed p-4">
|
||||
{#if $ae_sess.files.add_to_use_files_method === 'upload'}
|
||||
<Comp_hosted_files_upload
|
||||
{link_to_type}
|
||||
{link_to_id}
|
||||
bind:upload_complete
|
||||
bind:hosted_file_id_li={slct_hosted_file_id_li}
|
||||
bind:hosted_file_obj_li={slct_hosted_file_obj_li}
|
||||
bind:hosted_file_obj_kv={slct_hosted_file_kv}
|
||||
accept="*/*"
|
||||
class_li="!max-w-none">
|
||||
{#snippet label()}
|
||||
<div class="flex flex-col items-center gap-2 py-2">
|
||||
<div
|
||||
class="bg-primary-500/10 text-primary-500 rounded-full p-3">
|
||||
<FileUp size="1.8em" />
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="font-bold">Upload new attachment</p>
|
||||
<p class="text-xs opacity-60">
|
||||
Drag and drop or click to browse
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{/snippet}
|
||||
</Comp_hosted_files_upload>
|
||||
{:else}
|
||||
<div class="space-y-2">
|
||||
<p class="ml-1 text-sm font-bold opacity-70">
|
||||
Select from existing hosted files:
|
||||
</p>
|
||||
<Element_manage_hosted_file_li_wrap
|
||||
link_to_type={'account'}
|
||||
link_to_id={$ae_loc?.account_id}
|
||||
allow_basic={true}
|
||||
allow_moderator={true}
|
||||
class_li={''}
|
||||
bind:slct_hosted_file_kv
|
||||
bind:slct_hosted_file_id
|
||||
bind:slct_hosted_file_obj />
|
||||
</div>
|
||||
class="border-surface-500/20 flex items-center justify-between border-b pb-2">
|
||||
<h3 class="h3 flex items-center gap-2 text-lg font-bold">
|
||||
<Paperclip size="1.1em" />
|
||||
Attachments
|
||||
{#if unified_file_li.length}
|
||||
<span class="badge preset-tonal-surface text-xs"
|
||||
>{unified_file_li.length}</span>
|
||||
{/if}
|
||||
</h3>
|
||||
|
||||
{#if $ae_loc.edit_mode}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm preset-tonal-warning font-semibold"
|
||||
onclick={() => {
|
||||
$ae_sess.files.add_to_use_files_method =
|
||||
$ae_sess.files.add_to_use_files_method === 'upload'
|
||||
? 'select'
|
||||
: 'upload';
|
||||
}}>
|
||||
<RefreshCw size="1em" class="mr-2" />
|
||||
{$ae_sess.files.add_to_use_files_method === 'select'
|
||||
? 'Switch to Upload'
|
||||
: 'Switch to Select'}
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
<!-- File Grid -->
|
||||
{#if unified_file_li.length}
|
||||
<div class="grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3">
|
||||
{#each unified_file_li as file (file.hosted_file_id ?? file.id)}
|
||||
{@const file_id =
|
||||
file.hosted_file_id || file.id || file.hosted_file_id}
|
||||
<div
|
||||
class="bg-surface-50-950 border-surface-500/10 group hover:border-primary-500 flex items-center justify-between rounded-xl border p-3 shadow-sm transition-all">
|
||||
<div class="flex grow items-center gap-3 overflow-hidden">
|
||||
<AE_Comp_Hosted_Files_Download_Button
|
||||
hosted_file_id={file_id}
|
||||
hosted_file_obj={file}
|
||||
color="primary"
|
||||
variant="tonal"
|
||||
classes="w-full !justify-start !px-2"
|
||||
show_divider={true}
|
||||
max_filename={25}
|
||||
show_direct_download={$ae_loc.trusted_access &&
|
||||
$ae_loc.edit_mode} />
|
||||
</div>
|
||||
|
||||
<div class="ml-2 flex items-center gap-1">
|
||||
{#if $ae_loc.edit_mode}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm preset-tonal-error"
|
||||
onclick={() => handle_remove_file(file_id)}
|
||||
title="Remove attachment">
|
||||
<Trash2 size="1.1em" />
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Edit/Management Tools -->
|
||||
{#if $ae_loc.edit_mode}
|
||||
<div
|
||||
class="bg-surface-500/5 border-surface-500/20 mt-4 rounded-2xl border-2 border-dashed p-4">
|
||||
{#if $ae_sess.files.add_to_use_files_method === 'upload'}
|
||||
<Comp_hosted_files_upload
|
||||
{link_to_type}
|
||||
{link_to_id}
|
||||
bind:upload_complete
|
||||
bind:hosted_file_id_li={slct_hosted_file_id_li}
|
||||
bind:hosted_file_obj_li={slct_hosted_file_obj_li}
|
||||
bind:hosted_file_obj_kv={slct_hosted_file_kv}
|
||||
accept="*/*"
|
||||
class_li="!max-w-none">
|
||||
{#snippet label()}
|
||||
<div class="flex flex-col items-center gap-2 py-2">
|
||||
<div
|
||||
class="bg-primary-500/10 text-primary-500 rounded-full p-3">
|
||||
<FileUp size="1.8em" />
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="font-bold">Upload new attachment</p>
|
||||
<p class="text-xs opacity-60">
|
||||
Drag and drop or click to browse
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{/snippet}
|
||||
</Comp_hosted_files_upload>
|
||||
{:else}
|
||||
<div class="space-y-2">
|
||||
<p class="ml-1 text-sm font-bold opacity-70">
|
||||
Select from existing hosted files:
|
||||
</p>
|
||||
<Element_manage_hosted_file_li_wrap
|
||||
link_to_type={'account'}
|
||||
link_to_id={$ae_loc?.account_id}
|
||||
allow_basic={true}
|
||||
allow_moderator={true}
|
||||
class_li={''}
|
||||
bind:slct_hosted_file_kv
|
||||
bind:slct_hosted_file_id
|
||||
bind:slct_hosted_file_obj />
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
{/if}
|
||||
|
||||
Reference in New Issue
Block a user