feat(web): add a user setting for default album sort order. (#18950)

* Add a user setting for default album sort order.

Add a user setting under "Features" to control the initial sort order
when creating an album. Default to the existing behavior of
"newest first".

* chore: patch openapi

---------

Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
Dag Stuan 2025-06-06 06:31:34 +02:00 committed by GitHub
parent 55f4e93456
commit b46e066cc2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
18 changed files with 397 additions and 13 deletions

View file

@ -4,14 +4,18 @@
NotificationType,
} from '$lib/components/shared-components/notification/notification';
import SettingAccordion from '$lib/components/shared-components/settings/setting-accordion.svelte';
import SettingSelect from '$lib/components/shared-components/settings/setting-select.svelte';
import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
import { preferences } from '$lib/stores/user.store';
import { updateMyPreferences } from '@immich/sdk';
import { AssetOrder, updateMyPreferences } from '@immich/sdk';
import { Button } from '@immich/ui';
import { t } from 'svelte-i18n';
import { fade } from 'svelte/transition';
import { handleError } from '../../utils/handle-error';
// Albums
let defaultAssetOrder = $state($preferences?.albums?.defaultAssetOrder ?? AssetOrder.Desc);
// Folders
let foldersEnabled = $state($preferences?.folders?.enabled ?? false);
let foldersSidebar = $state($preferences?.folders?.sidebarWeb ?? false);
@ -41,6 +45,7 @@
try {
const data = await updateMyPreferences({
userPreferencesUpdateDto: {
albums: { defaultAssetOrder },
folders: { enabled: foldersEnabled, sidebarWeb: foldersSidebar },
memories: { enabled: memoriesEnabled },
people: { enabled: peopleEnabled, sidebarWeb: peopleSidebar },
@ -68,6 +73,20 @@
<div in:fade={{ duration: 500 }}>
<form autocomplete="off" {onsubmit}>
<div class="ms-4 mt-4 flex flex-col">
<SettingAccordion key="albums" title={$t('albums')} subtitle={$t('albums_feature_description')}>
<div class="ms-4 mt-6">
<SettingSelect
label={$t('albums_default_sort_order')}
desc={$t('albums_default_sort_order_description')}
options={[
{ value: AssetOrder.Asc, text: $t('oldest_first') },
{ value: AssetOrder.Desc, text: $t('newest_first') },
]}
bind:value={defaultAssetOrder}
/>
</div>
</SettingAccordion>
<SettingAccordion key="folders" title={$t('folders')} subtitle={$t('folders_feature_description')}>
<div class="ms-4 mt-6">
<SettingSwitch title={$t('enable')} bind:checked={foldersEnabled} />