refactor: app init event (#17937)

This commit is contained in:
Jason Rasmussen
2025-04-28 14:48:33 -04:00
committed by GitHub
parent 895b2bf5cd
commit 7f69abbf0d
19 changed files with 81 additions and 75 deletions

View File

@@ -5,6 +5,7 @@
import NextAssetAction from '$lib/components/asset-viewer/actions/next-asset-action.svelte';
import PreviousAssetAction from '$lib/components/asset-viewer/actions/previous-asset-action.svelte';
import { AssetAction, ProjectionType } from '$lib/constants';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { updateNumberOfComments } from '$lib/stores/activity.store';
import { closeEditorCofirm } from '$lib/stores/asset-editor.store';
import { assetViewingStore } from '$lib/stores/asset-viewing.store';
@@ -12,7 +13,7 @@
import { SlideshowNavigation, SlideshowState, slideshowStore } from '$lib/stores/slideshow.store';
import { user } from '$lib/stores/user.store';
import { websocketEvents } from '$lib/stores/websocket';
import { getAssetJobMessage, getSharedLink, handlePromiseError, isSharedLink } from '$lib/utils';
import { getAssetJobMessage, getSharedLink, handlePromiseError } from '$lib/utils';
import { handleError } from '$lib/utils/handle-error';
import { SlideshowHistory } from '$lib/utils/slideshow-history';
import {
@@ -116,7 +117,7 @@
let zoomToggle = $state(() => void 0);
const refreshStack = async () => {
if (isSharedLink()) {
if (authManager.key) {
return;
}
@@ -243,7 +244,7 @@
});
const handleGetAllAlbums = async () => {
if (isSharedLink()) {
if (authManager.key) {
return;
}
@@ -412,7 +413,7 @@
}
});
$effect(() => {
if (asset.id && !sharedLink) {
if (asset.id) {
handlePromiseError(handleGetAllAlbums());
}
});

View File

@@ -1,10 +1,11 @@
<script lang="ts">
import StarRating from '$lib/components/shared-components/star-rating.svelte';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { preferences } from '$lib/stores/user.store';
import { handlePromiseError } from '$lib/utils';
import { handleError } from '$lib/utils/handle-error';
import { updateAsset, type AssetResponseDto } from '@immich/sdk';
import { t } from 'svelte-i18n';
import StarRating from '$lib/components/shared-components/star-rating.svelte';
import { handlePromiseError, isSharedLink } from '$lib/utils';
import { preferences } from '$lib/stores/user.store';
interface Props {
asset: AssetResponseDto;
@@ -24,7 +25,7 @@
};
</script>
{#if !isSharedLink() && $preferences?.ratings.enabled}
{#if !authManager.key && $preferences?.ratings.enabled}
<section class="px-4 pt-2">
<StarRating {rating} readOnly={!isOwner} onRating={(rating) => handlePromiseError(handleChangeRating(rating))} />
</section>

View File

@@ -3,7 +3,7 @@
import TagAssetForm from '$lib/components/forms/tag-asset-form.svelte';
import Portal from '$lib/components/shared-components/portal/portal.svelte';
import { AppRoute } from '$lib/constants';
import { isSharedLink } from '$lib/utils';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { removeTag, tagAssets } from '$lib/utils/asset-utils';
import { getAssetInfo, type AssetResponseDto } from '@immich/sdk';
import { mdiClose, mdiPlus } from '@mdi/js';
@@ -41,7 +41,7 @@
};
</script>
{#if isOwner && !isSharedLink()}
{#if isOwner && !authManager.key}
<section class="px-4 mt-4">
<div class="flex h-10 w-full items-center justify-between text-sm">
<h2>{$t('tags').toUpperCase()}</h2>

View File

@@ -6,15 +6,19 @@
import DetailPanelTags from '$lib/components/asset-viewer/detail-panel-tags.svelte';
import Icon from '$lib/components/elements/icon.svelte';
import ChangeDate from '$lib/components/shared-components/change-date.svelte';
import Portal from '$lib/components/shared-components/portal/portal.svelte';
import { AppRoute, QueryParameter, timeToLoadTheMap } from '$lib/constants';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { isFaceEditMode } from '$lib/stores/face-edit.svelte';
import { boundingBoxesArray } from '$lib/stores/people.store';
import { locale } from '$lib/stores/preferences.store';
import { featureFlags } from '$lib/stores/server-config.store';
import { preferences, user } from '$lib/stores/user.store';
import { getAssetThumbnailUrl, getPeopleThumbnailUrl, handlePromiseError, isSharedLink } from '$lib/utils';
import { getAssetThumbnailUrl, getPeopleThumbnailUrl, handlePromiseError } from '$lib/utils';
import { delay, isFlipped } from '$lib/utils/asset-utils';
import { getByteUnitString } from '$lib/utils/byte-units';
import { handleError } from '$lib/utils/handle-error';
import { getMetadataSearchQuery } from '$lib/utils/metadata-search';
import { fromDateTimeOriginal, fromLocalDateTime } from '$lib/utils/timeline-util';
import {
AssetMediaSize,
@@ -44,9 +48,6 @@
import LoadingSpinner from '../shared-components/loading-spinner.svelte';
import UserAvatar from '../shared-components/user-avatar.svelte';
import AlbumListItemDetails from './album-list-item-details.svelte';
import Portal from '$lib/components/shared-components/portal/portal.svelte';
import { getMetadataSearchQuery } from '$lib/utils/metadata-search';
import { isFaceEditMode } from '$lib/stores/face-edit.svelte';
interface Props {
asset: AssetResponseDto;
@@ -84,7 +85,7 @@
const handleNewAsset = async (newAsset: AssetResponseDto) => {
// TODO: check if reloading asset data is necessary
if (newAsset.id && !isSharedLink()) {
if (newAsset.id && !authManager.key) {
const data = await getAssetInfo({ id: asset.id });
people = data?.people || [];
unassignedFaces = data?.unassignedFaces || [];
@@ -187,7 +188,7 @@
<DetailPanelDescription {asset} {isOwner} />
<DetailPanelRating {asset} {isOwner} />
{#if !isSharedLink() && isOwner}
{#if !authManager.key && isOwner}
<section class="px-4 pt-4 text-sm">
<div class="flex h-10 w-full items-center justify-between">
<h2>{$t('people').toUpperCase()}</h2>

View File

@@ -1,10 +1,11 @@
<script lang="ts">
import { getAssetOriginalUrl, getKey } from '$lib/utils';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { getAssetOriginalUrl } from '$lib/utils';
import { isWebCompatibleImage } from '$lib/utils/asset-utils';
import { AssetMediaSize, viewAsset, type AssetResponseDto } from '@immich/sdk';
import { t } from 'svelte-i18n';
import { fade } from 'svelte/transition';
import LoadingSpinner from '../shared-components/loading-spinner.svelte';
import { t } from 'svelte-i18n';
interface Props {
asset: AssetResponseDto;
@@ -13,7 +14,7 @@
const { asset }: Props = $props();
const loadAssetData = async (id: string) => {
const data = await viewAsset({ id, size: AssetMediaSize.Preview, key: getKey() });
const data = await viewAsset({ id, size: AssetMediaSize.Preview, key: authManager.key });
return URL.createObjectURL(data);
};
</script>

View File

@@ -25,6 +25,7 @@ describe('Thumbnail component', () => {
vi.stubGlobal('IntersectionObserver', getIntersectionObserverMock());
vi.mock('$lib/utils/navigation', () => ({
currentUrlReplaceAssetId: vi.fn(),
isSharedLinkRoute: vi.fn().mockReturnValue(false),
}));
});

View File

@@ -2,7 +2,7 @@
import Icon from '$lib/components/elements/icon.svelte';
import { ProjectionType } from '$lib/constants';
import { locale, playVideoThumbnailOnHover } from '$lib/stores/preferences.store';
import { getAssetPlaybackUrl, getAssetThumbnailUrl, isSharedLink } from '$lib/utils';
import { getAssetPlaybackUrl, getAssetThumbnailUrl } from '$lib/utils';
import { timeToSeconds } from '$lib/utils/date-time';
import { getAltText } from '$lib/utils/thumbnail-util';
import { AssetMediaSize, AssetTypeEnum, type AssetResponseDto } from '@immich/sdk';
@@ -17,15 +17,16 @@
} from '@mdi/js';
import { thumbhash } from '$lib/actions/thumbhash';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { mobileDevice } from '$lib/stores/mobile-device.svelte';
import { getFocusable } from '$lib/utils/focus-util';
import { currentUrlReplaceAssetId } from '$lib/utils/navigation';
import { TUNABLES } from '$lib/utils/tunables';
import { onMount } from 'svelte';
import type { ClassValue } from 'svelte/elements';
import { fade } from 'svelte/transition';
import ImageThumbnail from './image-thumbnail.svelte';
import VideoThumbnail from './video-thumbnail.svelte';
import { onMount } from 'svelte';
import { getFocusable } from '$lib/utils/focus-util';
interface Props {
asset: AssetResponseDto;
@@ -331,13 +332,13 @@
></div>
<!-- Favorite asset star -->
{#if !isSharedLink() && asset.isFavorite}
{#if !authManager.key && asset.isFavorite}
<div class="absolute bottom-2 start-2 z-10">
<Icon path={mdiHeart} size="24" class="text-white" />
</div>
{/if}
{#if !isSharedLink() && showArchiveIcon && asset.isArchived}
{#if !authManager.key && showArchiveIcon && asset.isArchived}
<div class={['absolute start-2 z-10', asset.isFavorite ? 'bottom-10' : 'bottom-2']}>
<Icon path={mdiArchiveArrowDownOutline} size="24" class="text-white" />
</div>

View File

@@ -1,13 +1,13 @@
<script lang="ts">
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
import { getKey } from '$lib/utils';
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { handleError } from '$lib/utils/handle-error';
import { removeSharedLinkAssets, type SharedLinkResponseDto } from '@immich/sdk';
import { mdiDeleteOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
import { NotificationType, notificationController } from '../../shared-components/notification/notification';
import { getAssetControlContext } from '../asset-select-control-bar.svelte';
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
import { t } from 'svelte-i18n';
interface Props {
sharedLink: SharedLinkResponseDto;
@@ -34,7 +34,7 @@
assetIdsDto: {
assetIds: [...getAssets()].map((asset) => asset.id),
},
key: getKey(),
key: authManager.key,
});
for (const result of results) {

View File

@@ -1,27 +1,27 @@
<script lang="ts">
import { goto } from '$app/navigation';
import type { Action } from '$lib/components/asset-viewer/actions/action';
import ImmichLogoSmallLink from '$lib/components/shared-components/immich-logo-small-link.svelte';
import { AppRoute, AssetAction } from '$lib/constants';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
import type { Viewport } from '$lib/stores/assets-store.svelte';
import { dragAndDropFilesStore } from '$lib/stores/drag-and-drop-files.store';
import { getKey, handlePromiseError } from '$lib/utils';
import { downloadArchive } from '$lib/utils/asset-utils';
import { handlePromiseError } from '$lib/utils';
import { cancelMultiselect, downloadArchive } from '$lib/utils/asset-utils';
import { fileUploadHandler, openFileUploadDialog } from '$lib/utils/file-uploader';
import { handleError } from '$lib/utils/handle-error';
import { addSharedLinkAssets, type SharedLinkResponseDto } from '@immich/sdk';
import { mdiArrowLeft, mdiFileImagePlusOutline, mdiFolderDownloadOutline, mdiSelectAll } from '@mdi/js';
import { t } from 'svelte-i18n';
import AssetViewer from '../asset-viewer/asset-viewer.svelte';
import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
import DownloadAction from '../photos-page/actions/download-action.svelte';
import RemoveFromSharedLink from '../photos-page/actions/remove-from-shared-link.svelte';
import AssetSelectControlBar from '../photos-page/asset-select-control-bar.svelte';
import ControlAppBar from '../shared-components/control-app-bar.svelte';
import GalleryViewer from '../shared-components/gallery-viewer/gallery-viewer.svelte';
import AssetViewer from '../asset-viewer/asset-viewer.svelte';
import { cancelMultiselect } from '$lib/utils/asset-utils';
import ImmichLogoSmallLink from '$lib/components/shared-components/immich-logo-small-link.svelte';
import { NotificationType, notificationController } from '../shared-components/notification/notification';
import type { Viewport } from '$lib/stores/assets-store.svelte';
import { t } from 'svelte-i18n';
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
interface Props {
sharedLink: SharedLinkResponseDto;
@@ -57,7 +57,7 @@
assetIdsDto: {
assetIds: results.filter((id) => !!id) as string[],
},
key: getKey(),
key: authManager.key,
});
const added = data.filter((item) => item.success).length;

View File

@@ -1,15 +1,15 @@
<script lang="ts">
import { page } from '$app/state';
import { shouldIgnoreEvent } from '$lib/actions/shortcut';
import { authManager } from '$lib/managers/auth-manager.svelte';
import { dragAndDropFilesStore } from '$lib/stores/drag-and-drop-files.store';
import { fileUploadHandler } from '$lib/utils/file-uploader';
import { isAlbumsRoute, isSharedLinkRoute } from '$lib/utils/navigation';
import { isAlbumsRoute } from '$lib/utils/navigation';
import { t } from 'svelte-i18n';
import { fade } from 'svelte/transition';
import ImmichLogo from './immich-logo.svelte';
let albumId = $derived(isAlbumsRoute(page.route?.id) ? page.params.albumId : undefined);
let isShare = $derived(isSharedLinkRoute(page.route?.id));
let dragStartTarget: EventTarget | null = $state(null);
@@ -123,7 +123,7 @@
}
const filesArray: File[] = Array.from<File>(files);
if (isShare) {
if (authManager.key) {
dragAndDropFilesStore.set({ isDragging: true, files: filesArray });
} else {
await fileUploadHandler(filesArray, albumId);