Hide empty journal attachments
This commit is contained in:
Scott Idem
@@ -191,124 +191,121 @@ async function handle_remove_file(file_id: string) {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section class="ae_section journal_entry_files my-2 w-full space-y-4">
|
{#if $ae_loc.edit_mode || unified_file_li.length > 0}
|
||||||
<!-- Header -->
|
<section class="ae_section journal_entry_files my-2 w-full space-y-4">
|
||||||
<div
|
<!-- Header -->
|
||||||
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}
|
|
||||||
<div
|
<div
|
||||||
class="bg-surface-500/5 border-surface-500/20 mt-4 rounded-2xl border-2 border-dashed p-4">
|
class="border-surface-500/20 flex items-center justify-between border-b pb-2">
|
||||||
{#if $ae_sess.files.add_to_use_files_method === 'upload'}
|
<h3 class="h3 flex items-center gap-2 text-lg font-bold">
|
||||||
<Comp_hosted_files_upload
|
<Paperclip size="1.1em" />
|
||||||
{link_to_type}
|
Attachments
|
||||||
{link_to_id}
|
{#if unified_file_li.length}
|
||||||
bind:upload_complete
|
<span class="badge preset-tonal-surface text-xs"
|
||||||
bind:hosted_file_id_li={slct_hosted_file_id_li}
|
>{unified_file_li.length}</span>
|
||||||
bind:hosted_file_obj_li={slct_hosted_file_obj_li}
|
{/if}
|
||||||
bind:hosted_file_obj_kv={slct_hosted_file_kv}
|
</h3>
|
||||||
accept="*/*"
|
|
||||||
class_li="!max-w-none">
|
{#if $ae_loc.edit_mode}
|
||||||
{#snippet label()}
|
<button
|
||||||
<div class="flex flex-col items-center gap-2 py-2">
|
type="button"
|
||||||
<div
|
class="btn btn-sm preset-tonal-warning font-semibold"
|
||||||
class="bg-primary-500/10 text-primary-500 rounded-full p-3">
|
onclick={() => {
|
||||||
<FileUp size="1.8em" />
|
$ae_sess.files.add_to_use_files_method =
|
||||||
</div>
|
$ae_sess.files.add_to_use_files_method === 'upload'
|
||||||
<div class="text-center">
|
? 'select'
|
||||||
<p class="font-bold">Upload new attachment</p>
|
: 'upload';
|
||||||
<p class="text-xs opacity-60">
|
}}>
|
||||||
Drag and drop or click to browse
|
<RefreshCw size="1em" class="mr-2" />
|
||||||
</p>
|
{$ae_sess.files.add_to_use_files_method === 'select'
|
||||||
</div>
|
? 'Switch to Upload'
|
||||||
</div>
|
: 'Switch to Select'}
|
||||||
{/snippet}
|
</button>
|
||||||
</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}
|
{/if}
|
||||||
</div>
|
</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