diff options
Diffstat (limited to 'frontend/src/routes/archives/+page.svelte')
| -rw-r--r-- | frontend/src/routes/archives/+page.svelte | 24 |
1 files changed, 5 insertions, 19 deletions
diff --git a/frontend/src/routes/archives/+page.svelte b/frontend/src/routes/archives/+page.svelte index b75c140..2bc6703 100644 --- a/frontend/src/routes/archives/+page.svelte +++ b/frontend/src/routes/archives/+page.svelte @@ -4,7 +4,7 @@ import type { ArchiveFragment } from '$gql/graphql'; import { ArchiveSortLabel } from '$lib/Enums'; import { ArchiveFilterContext } from '$lib/Filter.svelte'; - import Card from '$lib/components/Card.svelte'; + import ArchiveCard from '$lib/components/ArchiveCard.svelte'; import Empty from '$lib/components/Empty.svelte'; import Guard from '$lib/components/Guard.svelte'; import Head from '$lib/components/Head.svelte'; @@ -12,7 +12,6 @@ import Cards from '$lib/containers/Cards.svelte'; import Column from '$lib/containers/Column.svelte'; import Pagination from '$lib/pagination/Pagination.svelte'; - import Pill from '$lib/pills/Pill.svelte'; import Selectable from '$lib/selection/Selectable.svelte'; import { initSelectionContext } from '$lib/selection/Selection.svelte'; import SelectionOverlay from '$lib/selection/SelectionOverlay.svelte'; @@ -26,7 +25,6 @@ import SelectionControls from '$lib/toolbar/SelectionControls.svelte'; import Toolbar from '$lib/toolbar/Toolbar.svelte'; import { getContextClient } from '@urql/svelte'; - import { filesize } from 'filesize'; import type { PageProps } from './$types'; let { data }: PageProps = $props(); @@ -79,26 +77,14 @@ <Pagination {pagination} total={archives.count} /> <main> <Cards> - {#each archives.edges as { id, name, cover, size, pageCount }, index (id)} - <Selectable {index} {id}> + {#each archives.edges as archive, index (archive.id)} + <Selectable {index} id={archive.id}> {#snippet children({ onclick, selected })} - <Card href={id.toString()} details={{ title: name, cover }} {onclick}> + <ArchiveCard {archive} {onclick}> {#snippet overlay()} <SelectionOverlay position="left" {selected} /> {/snippet} - <div class="flex gap-1 text-xs"> - <Pill name={`${pageCount} pages`}> - {#snippet icon()} - <span class="icon-[material-symbols--note] mr-0.5"></span> - {/snippet} - </Pill> - <Pill name={filesize(size, { base: 2 })}> - {#snippet icon()} - <span class="icon-[material-symbols--hard-drive] mr-0.5"></span> - {/snippet} - </Pill> - </div> - </Card> + </ArchiveCard> {/snippet} </Selectable> {:else} |