2023-09-24 15:22:46 +02:00
|
|
|
<script lang="ts">
|
2024-03-14 20:05:57 +01:00
|
|
|
import { albumViewSettings } from '$lib/stores/preferences.store';
|
|
|
|
|
import type { Sort } from '$lib/components/album-page/albums-list.svelte';
|
2023-09-24 15:22:46 +02:00
|
|
|
|
|
|
|
|
export let option: Sort;
|
|
|
|
|
|
|
|
|
|
const handleSort = () => {
|
2024-03-14 20:05:57 +01:00
|
|
|
if ($albumViewSettings.sortBy === option.title) {
|
|
|
|
|
$albumViewSettings.sortDesc = !option.sortDesc;
|
2023-09-24 15:22:46 +02:00
|
|
|
option.sortDesc = !option.sortDesc;
|
|
|
|
|
} else {
|
2024-03-14 20:05:57 +01:00
|
|
|
$albumViewSettings.sortBy = option.title;
|
2023-09-24 15:22:46 +02:00
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<th class="{option.widthClass} text-sm font-medium"
|
|
|
|
|
><button
|
|
|
|
|
class="rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
|
|
|
|
|
on:click={() => handleSort()}
|
|
|
|
|
>
|
2024-03-14 20:05:57 +01:00
|
|
|
{#if $albumViewSettings.sortBy === option.title}
|
2023-09-24 15:22:46 +02:00
|
|
|
{#if option.sortDesc}
|
|
|
|
|
↓
|
|
|
|
|
{:else}
|
|
|
|
|
↑
|
|
|
|
|
{/if}
|
2023-11-26 16:23:43 +01:00
|
|
|
{/if}{option.title}</button
|
2023-09-24 15:22:46 +02:00
|
|
|
></th
|
|
|
|
|
>
|