KevinMidboe/immich
1
0
Fork 0
mirror of https://github.com/KevinMidboe/immich.git synced 2025-10-29 17:40:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(web) Disable draggable on common usage element to avoid trigger drag-n-drop layer (#1330)

Browse Source
This commit is contained in:
Alex
2023-01-15 14:01:10 -06:00
committed by GitHub
parent 036d0556a4
commit eace0af7a5
25 changed files with 241 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

346
server/immich-openapi-specs.json
View File

@@ -1476,6 +1476,153 @@
] ]
} }
}, },
"/tag": {
"post": {
"operationId": "create",
"description": "",
"parameters": [],
"requestBody": {
"required": true,
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/CreateTagDto"
}
}
}
},
"responses": {
"201": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"get": {
"operationId": "findAll",
"description": "",
"parameters": [],
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"type": "array",
"items": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
}
},
"tags": [
"Tag"
]
}
},
"/tag/{id}": {
"get": {
"operationId": "findOne",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"patch": {
"operationId": "update",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"requestBody": {
"required": true,
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/UpdateTagDto"
}
}
}
},
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"delete": {
"operationId": "delete",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"responses": {
"200": {
"description": ""
}
},
"tags": [
"Tag"
]
}
},
"/album/count-by-user-id": { "/album/count-by-user-id": {
"get": { "get": {
"operationId": "getAlbumCountByUserId", "operationId": "getAlbumCountByUserId",
@@ -1947,153 +2094,6 @@
] ]
} }
}, },
"/tag": {
"post": {
"operationId": "create",
"description": "",
"parameters": [],
"requestBody": {
"required": true,
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/CreateTagDto"
}
}
}
},
"responses": {
"201": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"get": {
"operationId": "findAll",
"description": "",
"parameters": [],
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"type": "array",
"items": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
}
},
"tags": [
"Tag"
]
}
},
"/tag/{id}": {
"get": {
"operationId": "findOne",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"patch": {
"operationId": "update",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"requestBody": {
"required": true,
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/UpdateTagDto"
}
}
}
},
"responses": {
"200": {
"description": "",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/TagResponseDto"
}
}
}
}
},
"tags": [
"Tag"
]
},
"delete": {
"operationId": "delete",
"description": "",
"parameters": [
{
"name": "id",
"required": true,
"in": "path",
"schema": {
"type": "string"
}
}
],
"responses": {
"200": {
"description": ""
}
},
"tags": [
"Tag"
]
}
},
"/auth/login": { "/auth/login": {
"post": { "post": {
"operationId": "login", "operationId": "login",
@@ -3786,6 +3786,32 @@
} }
} }
}, },
"CreateTagDto": {
"type": "object",
"properties": {
"type": {
"$ref": "#/components/schemas/TagTypeEnum"
},
"name": {
"type": "string"
}
},
"required": [
"type",
"name"
]
},
"UpdateTagDto": {
"type": "object",
"properties": {
"name": {
"type": "string"
},
"renameTagId": {
"type": "string"
}
}
},
"AlbumCountResponseDto": { "AlbumCountResponseDto": {
"type": "object", "type": "object",
"properties": { "properties": {
@@ -3922,32 +3948,6 @@
"albumId" "albumId"
] ]
}, },
"CreateTagDto": {
"type": "object",
"properties": {
"type": {
"$ref": "#/components/schemas/TagTypeEnum"
},
"name": {
"type": "string"
}
},
"required": [
"type",
"name"
]
},
"UpdateTagDto": {
"type": "object",
"properties": {
"name": {
"type": "string"
},
"renameTagId": {
"type": "string"
}
}
},
"LoginCredentialDto": { "LoginCredentialDto": {
"type": "object", "type": "object",
"properties": { "properties": {

1
web/src/lib/components/album-page/album-card.svelte
View File

@@ -79,6 +79,7 @@
alt={album.id} alt={album.id}
class={`object-cover h-full w-full transition-all z-0 rounded-xl duration-300 hover:shadow-lg`} class={`object-cover h-full w-full transition-all z-0 rounded-xl duration-300 hover:shadow-lg`}
data-testid="album-image" data-testid="album-image"
draggable="false"
/> />
</div> </div>

8
web/src/lib/components/album-page/album-viewer.svelte
View File

@@ -418,7 +418,13 @@
class="flex gap-2 place-items-center hover:cursor-pointer ml-6" class="flex gap-2 place-items-center hover:cursor-pointer ml-6"
href="https://immich.app" href="https://immich.app"
> >
<img src="/immich-logo.svg" alt="immich logo" height="30" width="30" /> <img
src="/immich-logo.svg"
alt="immich logo"
height="30"
width="30"
draggable="false"
/>
<h1 class="font-immich-title text-lg text-immich-primary dark:text-immich-dark-primary"> <h1 class="font-immich-title text-lg text-immich-primary dark:text-immich-dark-primary">
IMMICH IMMICH
</h1> </h1>

2
web/src/lib/components/album-page/user-selection-modal.svelte
View File

@@ -53,7 +53,7 @@
<BaseModal on:close={() => dispatch('close')}> <BaseModal on:close={() => dispatch('close')}>
<svelte:fragment slot="title"> <svelte:fragment slot="title">
<span class="flex gap-2 place-items-center"> <span class="flex gap-2 place-items-center">
<img src="/immich-logo.svg" width="24" alt="Immich" /> <img src="/immich-logo.svg" width="24" alt="Immich" draggable="false" />
<p class="font-medium">Invite to album</p> <p class="font-medium">Invite to album</p>
</span> </span>
</svelte:fragment> </svelte:fragment>

1
web/src/lib/components/asset-viewer/album-list-item.svelte
View File

@@ -33,6 +33,7 @@
alt={album.albumName} alt={album.albumName}
class={`object-cover h-full w-full transition-all z-0 rounded-xl duration-300 hover:shadow-lg`} class={`object-cover h-full w-full transition-all z-0 rounded-xl duration-300 hover:shadow-lg`}
data-testid="album-image" data-testid="album-image"
draggable="false"
/> />
</div> </div>
<div class="h-12 flex flex-col items-start justify-center"> <div class="h-12 flex flex-col items-start justify-center">

1
web/src/lib/components/asset-viewer/detail-panel.svelte
View File

@@ -208,6 +208,7 @@
alt={album.albumName} alt={album.albumName}
class="w-[50px] h-[50px] object-cover rounded" class="w-[50px] h-[50px] object-cover rounded"
src={`/api/asset/thumbnail/${album.albumThumbnailAssetId}?format=JPEG`} src={`/api/asset/thumbnail/${album.albumThumbnailAssetId}?format=JPEG`}
draggable="false"
/> />
</div> </div>

1
web/src/lib/components/asset-viewer/photo-viewer.svelte
View File

@@ -85,6 +85,7 @@
alt={assetId} alt={assetId}
class="object-contain h-full transition-all" class="object-contain h-full transition-all"
loading="lazy" loading="lazy"
draggable="false"
/> />
{/await} {/await}
{/if} {/if}

9
web/src/lib/components/forms/admin-registration-form.svelte
View File

@@ -55,7 +55,14 @@
class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg"
> >
<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> <div class="flex flex-col place-items-center place-content-center gap-4 px-4">
<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> <img
class="text-center"
src="/immich-logo.svg"
height="100"
width="100"
alt="immich-logo"
draggable="false"
/>
<h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium"> <h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium">
Admin Registration Admin Registration
</h1> </h1>

9
web/src/lib/components/forms/change-password-form.svelte
View File

@@ -47,7 +47,14 @@
class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg"
> >
<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> <div class="flex flex-col place-items-center place-content-center gap-4 px-4">
<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> <img
class="text-center"
src="/immich-logo.svg"
height="100"
width="100"
alt="immich-logo"
draggable="false"
/>
<h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium"> <h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium">
Change Password Change Password
</h1> </h1>

9
web/src/lib/components/forms/create-user-form.svelte
View File

@@ -80,7 +80,14 @@
class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg" class="border bg-immich-bg dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-3xl py-8 dark:text-immich-dark-fg"
> >
<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> <div class="flex flex-col place-items-center place-content-center gap-4 px-4">
<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> <img
class="text-center"
src="/immich-logo.svg"
height="100"
width="100"
alt="immich-logo"
draggable="false"
/>
<h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium"> <h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium">
Create new user Create new user
</h1> </h1>

9
web/src/lib/components/forms/login-form.svelte
View File

@@ -77,7 +77,14 @@
class="border bg-white dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-md py-8" class="border bg-white dark:bg-immich-dark-gray dark:border-immich-dark-gray p-4 shadow-sm w-[500px] max-w-[95vw] rounded-md py-8"
> >
<div class="flex flex-col place-items-center place-content-center gap-4 px-4"> <div class="flex flex-col place-items-center place-content-center gap-4 px-4">
<img class="text-center" src="/immich-logo.svg" height="100" width="100" alt="immich-logo" /> <img
class="text-center"
src="/immich-logo.svg"
height="100"
width="100"
alt="immich-logo"
draggable="false"
/>
<h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium">Login</h1> <h1 class="text-2xl text-immich-primary dark:text-immich-dark-primary font-medium">Login</h1>
</div> </div>

2
web/src/lib/components/share-page/individual-shared-viewer.svelte
View File

@@ -120,7 +120,7 @@
class="flex gap-2 place-items-center hover:cursor-pointer ml-6" class="flex gap-2 place-items-center hover:cursor-pointer ml-6"
href="https://immich.app" href="https://immich.app"
> >
<img src="/immich-logo.svg" alt="immich logo" height="30" width="30" /> <img src="/immich-logo.svg" alt="immich logo" height="30" width="30" draggable="false" />
<h1 class="font-immich-title text-lg text-immich-primary dark:text-immich-dark-primary"> <h1 class="font-immich-title text-lg text-immich-primary dark:text-immich-dark-primary">
IMMICH IMMICH
</h1> </h1>

1
web/src/lib/components/shared-components/circle-avatar.svelte
View File

@@ -45,6 +45,7 @@
style:height={`${size}px`} style:height={`${size}px`}
class={`inline rounded-full object-cover border shadow-md`} class={`inline rounded-full object-cover border shadow-md`}
title={user.email} title={user.email}
draggable="false"
/> />
</button> </button>
{:catch} {:catch}

1
web/src/lib/components/shared-components/drag-and-drop-upload-overlay.svelte
View File

@@ -20,6 +20,7 @@
height="200" height="200"
width="200" width="200"
class="animate-bounce pb-16" class="animate-bounce pb-16"
draggable="false"
/> />
<div class="text-2xl">Drop files anywhere to upload</div> <div class="text-2xl">Drop files anywhere to upload</div>
</div> </div>

1
web/src/lib/components/shared-components/immich-thumbnail.svelte
View File

@@ -252,6 +252,7 @@
alt={asset.id} alt={asset.id}
class={`object-cover ${getSize()} transition-all z-0 ${getThumbnailBorderStyle()}`} class={`object-cover ${getSize()} transition-all z-0 ${getThumbnailBorderStyle()}`}
loading="lazy" loading="lazy"
draggable="false"
/> />
{/if} {/if}

1
web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
View File

@@ -38,6 +38,7 @@
src={`${$page.url.origin}/api/user/profile-image/${user.id}`} src={`${$page.url.origin}/api/user/profile-image/${user.id}`}
alt="profile-img" alt="profile-img"
class="inline rounded-full h-20 w-20 object-cover shadow-md" class="inline rounded-full h-20 w-20 object-cover shadow-md"
draggable="false"
/> />
{:catch} {:catch}
<div transition:fade={{ duration: 200 }} class="text-lg"> <div transition:fade={{ duration: 200 }} class="text-lg">

3
web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte
View File

@@ -50,7 +50,7 @@
class="flex gap-2 place-items-center hover:cursor-pointer" class="flex gap-2 place-items-center hover:cursor-pointer"
href="/photos" href="/photos"
> >
<img src="/immich-logo.svg" alt="immich logo" height="35" width="35" /> <img src="/immich-logo.svg" alt="immich logo" height="35" width="35" draggable="false" />
<h1 class="font-immich-title text-2xl text-immich-primary dark:text-immich-dark-primary"> <h1 class="font-immich-title text-2xl text-immich-primary dark:text-immich-dark-primary">
IMMICH IMMICH
</h1> </h1>
@@ -102,6 +102,7 @@
src={`${$page.url.origin}/api/user/profile-image/${user.id}`} src={`${$page.url.origin}/api/user/profile-image/${user.id}`}
alt="profile-img" alt="profile-img"
class="inline rounded-full h-12 w-12 object-cover shadow-md" class="inline rounded-full h-12 w-12 object-cover shadow-md"
draggable="false"
/> />
{:catch} {:catch}
{getFirstLetter(user.firstName)}{getFirstLetter(user.lastName)} {getFirstLetter(user.firstName)}{getFirstLetter(user.lastName)}

5
web/src/lib/components/shared-components/side-bar/side-bar.svelte
View File

@@ -40,6 +40,7 @@
data-sveltekit-noscroll data-sveltekit-noscroll
href={AppRoute.PHOTOS} href={AppRoute.PHOTOS}
class="relative" class="relative"
draggable="false"
> >
<SideBarButton <SideBarButton
title={`Photos`} title={`Photos`}
@@ -71,7 +72,7 @@
</div> </div>
</a> </a>
<a data-sveltekit-preload-data="hover" href={AppRoute.SHARING} class="relative"> <a data-sveltekit-preload-data="hover" href={AppRoute.SHARING} class="relative" draggable="false">
<SideBarButton <SideBarButton
title="Sharing" title="Sharing"
logo={AccountMultipleOutline} logo={AccountMultipleOutline}
@@ -103,7 +104,7 @@
<div class="text-xs ml-5 my-4 dark:text-immich-dark-fg"> <div class="text-xs ml-5 my-4 dark:text-immich-dark-fg">
<p>LIBRARY</p> <p>LIBRARY</p>
</div> </div>
<a data-sveltekit-preload-data="hover" href={AppRoute.ALBUMS} class="relative"> <a data-sveltekit-preload-data="hover" href={AppRoute.ALBUMS} class="relative" draggable="false">
<SideBarButton <SideBarButton
title="Albums" title="Albums"
logo={ImageAlbum} logo={ImageAlbum}

1
web/src/lib/components/shared-components/upload-panel.svelte
View File

@@ -100,6 +100,7 @@
src="/immich-logo.svg" src="/immich-logo.svg"
alt="" alt=""
class="h-[70px] w-[70px] object-cover rounded-tl-lg rounded-bl-lg " class="h-[70px] w-[70px] object-cover rounded-tl-lg rounded-bl-lg "
draggable="false"
/> />
<div class="bottom-0 left-0 absolute w-full h-[25px] bg-immich-primary/30"> <div class="bottom-0 left-0 absolute w-full h-[25px] bg-immich-primary/30">

1
web/src/lib/components/sharedlinks-page/shared-link-card.svelte
View File

@@ -73,6 +73,7 @@
alt={asset.id} alt={asset.id}
class="object-cover w-[100px] h-[100px] rounded-lg" class="object-cover w-[100px] h-[100px] rounded-lg"
loading="lazy" loading="lazy"
draggable="false"
/> />
{/await} {/await}
</div> </div>

1
web/src/lib/components/sharing-page/shared-album-list-tile.svelte
View File

@@ -41,6 +41,7 @@
src={imageData} src={imageData}
alt={album.id} alt={album.id}
class={`object-cover w-[75px] h-[75px] transition-all z-0 rounded-xl duration-300 `} class={`object-cover w-[75px] h-[75px] transition-all z-0 rounded-xl duration-300 `}
draggable="false"
/> />
{/await} {/await}
</div> </div>

2
web/src/routes/+error.svelte
View File

@@ -33,7 +33,7 @@
<section class="bg-immich-bg dark:bg-immich-dark-bg"> <section class="bg-immich-bg dark:bg-immich-dark-bg">
<div class="flex border-b dark:border-b-immich-dark-gray place-items-center px-6 py-4"> <div class="flex border-b dark:border-b-immich-dark-gray place-items-center px-6 py-4">
<a class="flex gap-2 place-items-center hover:cursor-pointer" href="/photos"> <a class="flex gap-2 place-items-center hover:cursor-pointer" href="/photos">
<img src="/immich-logo.svg" alt="immich logo" height="35" width="35" /> <img src="/immich-logo.svg" alt="immich logo" height="35" width="35" draggable="false" />
<h1 class="font-immich-title text-2xl text-immich-primary dark:text-immich-dark-primary"> <h1 class="font-immich-title text-2xl text-immich-primary dark:text-immich-dark-primary">
IMMICH IMMICH
</h1> </h1>

9
web/src/routes/+page.svelte
View File

@@ -5,7 +5,14 @@
<section class="h-screen w-screen flex place-items-center place-content-center"> <section class="h-screen w-screen flex place-items-center place-content-center">
<div class="flex flex-col place-items-center gap-8 text-center max-w-[350px]"> <div class="flex flex-col place-items-center gap-8 text-center max-w-[350px]">
<div class="flex place-items-center place-content-center "> <div class="flex place-items-center place-content-center ">
<img class="text-center" src="immich-logo.svg" height="200" width="200" alt="immich-logo" /> <img
class="text-center"
src="immich-logo.svg"
height="200"
width="200"
alt="immich-logo"
draggable="false"
/>
</div> </div>
<h1 <h1
class="text-4xl text-immich-primary dark:text-immich-dark-primary font-bold font-immich-title" class="text-4xl text-immich-primary dark:text-immich-dark-primary font-bold font-immich-title"

2
web/src/routes/albums/+page.svelte
View File

@@ -93,7 +93,7 @@
on:keydown={handleCreateAlbum} on:keydown={handleCreateAlbum}
class="border dark:border-immich-dark-gray hover:bg-immich-primary/5 dark:hover:bg-immich-dark-primary/25 hover:cursor-pointer p-5 w-[50%] m-auto mt-10 bg-gray-50 dark:bg-immich-dark-gray rounded-3xl flex flex-col place-content-center place-items-center" class="border dark:border-immich-dark-gray hover:bg-immich-primary/5 dark:hover:bg-immich-dark-primary/25 hover:cursor-pointer p-5 w-[50%] m-auto mt-10 bg-gray-50 dark:bg-immich-dark-gray rounded-3xl flex flex-col place-content-center place-items-center"
> >
<img src="/empty-1.svg" alt="Empty shared album" width="500" /> <img src="/empty-1.svg" alt="Empty shared album" width="500" draggable="false" />
<p class="text-center text-immich-text-gray-500 dark:text-immich-dark-fg"> <p class="text-center text-immich-text-gray-500 dark:text-immich-dark-fg">
Create an album to organize your photos and videos Create an album to organize your photos and videos

2
web/src/routes/sharing/+page.svelte
View File

@@ -94,7 +94,7 @@
<div <div
class="border dark:border-immich-dark-gray p-5 w-[50%] m-auto mt-10 bg-gray-50 dark:bg-immich-dark-gray rounded-3xl flex flex-col place-content-center place-items-center dark:text-immich-dark-fg" class="border dark:border-immich-dark-gray p-5 w-[50%] m-auto mt-10 bg-gray-50 dark:bg-immich-dark-gray rounded-3xl flex flex-col place-content-center place-items-center dark:text-immich-dark-fg"
> >
<img src="/empty-2.svg" alt="Empty shared album" width="500" /> <img src="/empty-2.svg" alt="Empty shared album" width="500" draggable="false" />
<p class="text-center text-immich-text-gray-500"> <p class="text-center text-immich-text-gray-500">
Create a shared album to share photos and videos with people in your network Create a shared album to share photos and videos with people in your network
</p> </p>