mirror of https://github.com/immich-app/immich.git
feat(web): shared link filters (#15948)
Jason Rasmussen
GitHub
parent
23014c263b
commit
c5360e78c5
@ -0,0 +1,107 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.18
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
class SharedLinksResponse {
|
||||
/// Returns a new [SharedLinksResponse] instance.
|
||||
SharedLinksResponse({
|
||||
this.enabled = true,
|
||||
this.sidebarWeb = false,
|
||||
});
|
||||
|
||||
bool enabled;
|
||||
|
||||
bool sidebarWeb;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) => identical(this, other) || other is SharedLinksResponse &&
|
||||
other.enabled == enabled &&
|
||||
other.sidebarWeb == sidebarWeb;
|
||||
|
||||
@override
|
||||
int get hashCode =>
|
||||
// ignore: unnecessary_parenthesis
|
||||
(enabled.hashCode) +
|
||||
(sidebarWeb.hashCode);
|
||||
|
||||
@override
|
||||
String toString() => 'SharedLinksResponse[enabled=$enabled, sidebarWeb=$sidebarWeb]';
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
final json = <String, dynamic>{};
|
||||
json[r'enabled'] = this.enabled;
|
||||
json[r'sidebarWeb'] = this.sidebarWeb;
|
||||
return json;
|
||||
}
|
||||
|
||||
/// Returns a new [SharedLinksResponse] instance and imports its values from
|
||||
/// [value] if it's a [Map], null otherwise.
|
||||
// ignore: prefer_constructors_over_static_methods
|
||||
static SharedLinksResponse? fromJson(dynamic value) {
|
||||
upgradeDto(value, "SharedLinksResponse");
|
||||
if (value is Map) {
|
||||
final json = value.cast<String, dynamic>();
|
||||
|
||||
return SharedLinksResponse(
|
||||
enabled: mapValueOfType<bool>(json, r'enabled')!,
|
||||
sidebarWeb: mapValueOfType<bool>(json, r'sidebarWeb')!,
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
static List<SharedLinksResponse> listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SharedLinksResponse>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SharedLinksResponse.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
|
||||
static Map<String, SharedLinksResponse> mapFromJson(dynamic json) {
|
||||
final map = <String, SharedLinksResponse>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SharedLinksResponse.fromJson(entry.value);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
// maps a json object with a list of SharedLinksResponse-objects as value to a dart map
|
||||
static Map<String, List<SharedLinksResponse>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||
final map = <String, List<SharedLinksResponse>>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
// ignore: parameter_assignments
|
||||
json = json.cast<String, dynamic>();
|
||||
for (final entry in json.entries) {
|
||||
map[entry.key] = SharedLinksResponse.listFromJson(entry.value, growable: growable,);
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/// The list of required keys that must be present in a JSON.
|
||||
static const requiredKeys = <String>{
|
||||
'enabled',
|
||||
'sidebarWeb',
|
||||
};
|
||||
}
|
||||
|
||||
@ -0,0 +1,125 @@
|
||||
//
|
||||
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||
//
|
||||
// @dart=2.18
|
||||
|
||||
// ignore_for_file: unused_element, unused_import
|
||||
// ignore_for_file: always_put_required_named_parameters_first
|
||||
// ignore_for_file: constant_identifier_names
|
||||
// ignore_for_file: lines_longer_than_80_chars
|
||||
|
||||
part of openapi.api;
|
||||
|
||||
class SharedLinksUpdate {
|
||||
/// Returns a new [SharedLinksUpdate] instance.
|
||||
SharedLinksUpdate({
|
||||
this.enabled,
|
||||
this.sidebarWeb,
|
||||
});
|
||||
|
||||
///
|
||||
/// Please note: This property should have been non-nullable! Since the specification file
|
||||
/// does not include a default value (using the "default:" property), however, the generated
|
||||
/// source code must fall back to having a nullable type.
|
||||
/// Consider adding a "default:" property in the specification file to hide this note.
|
||||
///
|
||||
bool? enabled;
|
||||
|
||||
///
|
||||
/// Please note: This property should have been non-nullable! Since the specification file
|
||||
/// does not include a default value (using the "default:" property), however, the generated
|
||||
/// source code must fall back to having a nullable type.
|
||||
/// Consider adding a "default:" property in the specification file to hide this note.
|
||||
///
|
||||
bool? sidebarWeb;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) => identical(this, other) || other is SharedLinksUpdate &&
|
||||
other.enabled == enabled &&
|
||||
other.sidebarWeb == sidebarWeb;
|
||||
|
||||
@override
|
||||
int get hashCode =>
|
||||
// ignore: unnecessary_parenthesis
|
||||
(enabled == null ? 0 : enabled!.hashCode) +
|
||||
(sidebarWeb == null ? 0 : sidebarWeb!.hashCode);
|
||||
|
||||
@override
|
||||
String toString() => 'SharedLinksUpdate[enabled=$enabled, sidebarWeb=$sidebarWeb]';
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
final json = <String, dynamic>{};
|
||||
if (this.enabled != null) {
|
||||
json[r'enabled'] = this.enabled;
|
||||
} else {
|
||||
// json[r'enabled'] = null;
|
||||
}
|
||||
if (this.sidebarWeb != null) {
|
||||
json[r'sidebarWeb'] = this.sidebarWeb;
|
||||
} else {
|
||||
// json[r'sidebarWeb'] = null;
|
||||
}
|
||||
return json;
|
||||
}
|
||||
|
||||
/// Returns a new [SharedLinksUpdate] instance and imports its values from
|
||||
/// [value] if it's a [Map], null otherwise.
|
||||
// ignore: prefer_constructors_over_static_methods
|
||||
static SharedLinksUpdate? fromJson(dynamic value) {
|
||||
upgradeDto(value, "SharedLinksUpdate");
|
||||
if (value is Map) {
|
||||
final json = value.cast<String, dynamic>();
|
||||
|
||||
return SharedLinksUpdate(
|
||||
enabled: mapValueOfType<bool>(json, r'enabled'),
|
||||
sidebarWeb: mapValueOfType<bool>(json, r'sidebarWeb'),
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
static List<SharedLinksUpdate> listFromJson(dynamic json, {bool growable = false,}) {
|
||||
final result = <SharedLinksUpdate>[];
|
||||
if (json is List && json.isNotEmpty) {
|
||||
for (final row in json) {
|
||||
final value = SharedLinksUpdate.fromJson(row);
|
||||
if (value != null) {
|
||||
result.add(value);
|
||||
}
|
||||
}
|
||||
}
|
||||
return result.toList(growable: growable);
|
||||
}
|
||||
|
||||
static Map<String, SharedLinksUpdate> mapFromJson(dynamic json) {
|
||||
final map = <String, SharedLinksUpdate>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||
for (final entry in json.entries) {
|
||||
final value = SharedLinksUpdate.fromJson(entry.value);
|
||||
if (value != null) {
|
||||
map[entry.key] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
// maps a json object with a list of SharedLinksUpdate-objects as value to a dart map
|
||||
static Map<String, List<SharedLinksUpdate>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||
final map = <String, List<SharedLinksUpdate>>{};
|
||||
if (json is Map && json.isNotEmpty) {
|
||||
// ignore: parameter_assignments
|
||||
json = json.cast<String, dynamic>();
|
||||
for (final entry in json.entries) {
|
||||
map[entry.key] = SharedLinksUpdate.listFromJson(entry.value, growable: growable,);
|
||||
}
|
||||
}
|
||||
return map;
|
||||
}
|
||||
|
||||
/// The list of required keys that must be present in a JSON.
|
||||
static const requiredKeys = <String>{
|
||||
};
|
||||
}
|
||||
|
||||
@ -0,0 +1,119 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { page } from '$app/state';
|
||||
import GroupTab from '$lib/components/elements/group-tab.svelte';
|
||||
import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
|
||||
import CreateSharedLinkModal from '$lib/components/shared-components/create-share-link-modal/create-shared-link-modal.svelte';
|
||||
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType,
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import SharedLinkCard from '$lib/components/sharedlinks-page/shared-link-card.svelte';
|
||||
import { AppRoute } from '$lib/constants';
|
||||
import { handleError } from '$lib/utils/handle-error';
|
||||
import { getAllSharedLinks, removeSharedLink, SharedLinkType, type SharedLinkResponseDto } from '@immich/sdk';
|
||||
import { onMount } from 'svelte';
|
||||
import { t } from 'svelte-i18n';
|
||||
import type { PageData } from './$types';
|
||||
|
||||
type Props = {
|
||||
data: PageData;
|
||||
};
|
||||
|
||||
const { data }: Props = $props();
|
||||
|
||||
let sharedLinks: SharedLinkResponseDto[] = $state([]);
|
||||
let sharedLink = $derived(sharedLinks.find(({ id }) => id === page.params.id));
|
||||
|
||||
const refresh = async () => {
|
||||
sharedLinks = await getAllSharedLinks();
|
||||
};
|
||||
|
||||
onMount(async () => {
|
||||
await refresh();
|
||||
});
|
||||
|
||||
const handleDeleteLink = async (id: string) => {
|
||||
const isConfirmed = await dialogController.show({
|
||||
title: $t('delete_shared_link'),
|
||||
prompt: $t('confirm_delete_shared_link'),
|
||||
confirmText: $t('delete'),
|
||||
});
|
||||
|
||||
if (!isConfirmed) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await removeSharedLink({ id });
|
||||
notificationController.show({ message: $t('deleted_shared_link'), type: NotificationType.Info });
|
||||
await refresh();
|
||||
} catch (error) {
|
||||
handleError(error, $t('errors.unable_to_delete_shared_link'));
|
||||
}
|
||||
};
|
||||
|
||||
const handleEditDone = async () => {
|
||||
await refresh();
|
||||
await goto(AppRoute.SHARED_LINKS);
|
||||
};
|
||||
|
||||
type Filter = 'all' | 'album' | 'individual';
|
||||
|
||||
const filterMap: Record<Filter, string> = {
|
||||
all: $t('all'),
|
||||
album: $t('albums'),
|
||||
individual: $t('individual_shares'),
|
||||
};
|
||||
|
||||
let filters = Object.keys(filterMap);
|
||||
let labels = Object.values(filterMap);
|
||||
|
||||
const getActiveTab = (url: URL) => {
|
||||
const filter = url.searchParams.get('filter');
|
||||
return filter && filters.includes(filter) ? filter : 'all';
|
||||
};
|
||||
|
||||
let selectedTab = $derived(getActiveTab(page.url));
|
||||
const handleSelectTab = async (value: string) => {
|
||||
await goto(`${AppRoute.SHARED_LINKS}?filter=${value}`);
|
||||
};
|
||||
|
||||
let filteredSharedLinks = $derived(
|
||||
sharedLinks.filter(
|
||||
({ type }) =>
|
||||
selectedTab === 'all' ||
|
||||
(type === SharedLinkType.Album && selectedTab === 'album') ||
|
||||
(type === SharedLinkType.Individual && selectedTab === 'individual'),
|
||||
),
|
||||
);
|
||||
</script>
|
||||
|
||||
<UserPageLayout title={data.meta.title}>
|
||||
{#snippet buttons()}
|
||||
<div class="hidden xl:block h-10">
|
||||
<GroupTab label={$t('show_shared_links')} {filters} {labels} selected={selectedTab} onSelect={handleSelectTab} />
|
||||
</div>
|
||||
{/snippet}
|
||||
|
||||
<div>
|
||||
{#if sharedLinks.length === 0}
|
||||
<div
|
||||
class="flex place-content-center place-items-center rounded-lg bg-gray-100 dark:bg-immich-dark-gray dark:text-immich-gray p-12"
|
||||
>
|
||||
<p>{$t('you_dont_have_any_shared_links')}</p>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex flex-col gap-2">
|
||||
{#each filteredSharedLinks as link (link.id)}
|
||||
<SharedLinkCard {link} onDelete={() => handleDeleteLink(link.id)} />
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if sharedLink}
|
||||
<CreateSharedLinkModal editingLink={sharedLink} onClose={handleEditDone} />
|
||||
{/if}
|
||||
</div>
|
||||
</UserPageLayout>
|
||||
@ -0,0 +1,14 @@
|
||||
import { authenticate } from '$lib/utils/auth';
|
||||
import { getFormatter } from '$lib/utils/i18n';
|
||||
import type { PageLoad } from './$types';
|
||||
|
||||
export const load = (async () => {
|
||||
await authenticate();
|
||||
const $t = await getFormatter();
|
||||
|
||||
return {
|
||||
meta: {
|
||||
title: $t('shared_links'),
|
||||
},
|
||||
};
|
||||
}) satisfies PageLoad;
|
||||
@ -1,89 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { goto, afterNavigate } from '$app/navigation';
|
||||
import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';
|
||||
import CreateSharedLinkModal from '$lib/components/shared-components/create-share-link-modal/create-shared-link-modal.svelte';
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType,
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import SharedLinkCard from '$lib/components/sharedlinks-page/shared-link-card.svelte';
|
||||
import { AppRoute } from '$lib/constants';
|
||||
import { handleError } from '$lib/utils/handle-error';
|
||||
import { getAllSharedLinks, removeSharedLink, type SharedLinkResponseDto } from '@immich/sdk';
|
||||
import { mdiArrowLeft } from '@mdi/js';
|
||||
import { onMount } from 'svelte';
|
||||
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
let sharedLinks: SharedLinkResponseDto[] = $state([]);
|
||||
let editSharedLink: SharedLinkResponseDto | null = $state(null);
|
||||
|
||||
const refresh = async () => {
|
||||
sharedLinks = await getAllSharedLinks();
|
||||
};
|
||||
|
||||
onMount(async () => {
|
||||
await refresh();
|
||||
});
|
||||
|
||||
const handleDeleteLink = async (id: string) => {
|
||||
const isConfirmed = await dialogController.show({
|
||||
title: $t('delete_shared_link'),
|
||||
prompt: $t('confirm_delete_shared_link'),
|
||||
confirmText: $t('delete'),
|
||||
});
|
||||
|
||||
if (!isConfirmed) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await removeSharedLink({ id });
|
||||
notificationController.show({ message: $t('deleted_shared_link'), type: NotificationType.Info });
|
||||
await refresh();
|
||||
} catch (error) {
|
||||
handleError(error, $t('errors.unable_to_delete_shared_link'));
|
||||
}
|
||||
};
|
||||
|
||||
const handleEditDone = async () => {
|
||||
await refresh();
|
||||
editSharedLink = null;
|
||||
};
|
||||
|
||||
let backUrl: string = AppRoute.SHARING;
|
||||
|
||||
afterNavigate(({ from }) => {
|
||||
let url: string | undefined = from?.url?.pathname;
|
||||
backUrl = url || AppRoute.SHARING;
|
||||
});
|
||||
</script>
|
||||
|
||||
<ControlAppBar backIcon={mdiArrowLeft} onClose={() => goto(backUrl)}>
|
||||
{#snippet leading()}
|
||||
{$t('shared_links')}
|
||||
{/snippet}
|
||||
</ControlAppBar>
|
||||
|
||||
<section class="mt-[120px] flex flex-col pb-[120px] container max-w-screen-lg mx-auto px-3">
|
||||
<div class="mb-4 dark:text-immich-gray">
|
||||
<p>{$t('manage_shared_links')}</p>
|
||||
</div>
|
||||
{#if sharedLinks.length === 0}
|
||||
<div
|
||||
class="flex place-content-center place-items-center rounded-lg bg-gray-100 dark:bg-immich-dark-gray dark:text-immich-gray p-12"
|
||||
>
|
||||
<p>{$t('you_dont_have_any_shared_links')}</p>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex flex-col">
|
||||
{#each sharedLinks as link (link.id)}
|
||||
<SharedLinkCard {link} onDelete={() => handleDeleteLink(link.id)} onEdit={() => (editSharedLink = link)} />
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
{#if editSharedLink}
|
||||
<CreateSharedLinkModal editingLink={editSharedLink} onClose={handleEditDone} />
|
||||
{/if}
|
||||
@ -1,14 +1,7 @@
|
||||
import { authenticate } from '$lib/utils/auth';
|
||||
import { getFormatter } from '$lib/utils/i18n';
|
||||
import { AppRoute } from '$lib/constants';
|
||||
import { redirect } from '@sveltejs/kit';
|
||||
import type { PageLoad } from './$types';
|
||||
|
||||
export const load = (async () => {
|
||||
await authenticate();
|
||||
const $t = await getFormatter();
|
||||
|
||||
return {
|
||||
meta: {
|
||||
title: $t('shared_links'),
|
||||
},
|
||||
};
|
||||
export const load = (() => {
|
||||
redirect(307, AppRoute.SHARED_LINKS);
|
||||
}) satisfies PageLoad;
|
||||
|
||||
Loading…
Reference in New Issue