diff --git a/.github/workflows/build_push_docker_latest.yml b/.github/workflows/build_push_docker_latest.yml index a12941df3..f26857358 100644 --- a/.github/workflows/build_push_docker_latest.yml +++ b/.github/workflows/build_push_docker_latest.yml @@ -21,21 +21,20 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and push Immich Mono Repo uses: docker/build-push-action@v3.1.0 with: context: ./server file: ./server/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 + push: true tags: | altran1502/immich-server:latest - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - run: docker push altran1502/immich-server:latest build_and_push_machine_learning_latest: runs-on: ubuntu-latest @@ -50,21 +49,20 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Machine Learning uses: docker/build-push-action@v3.1.0 with: context: ./machine-learning file: ./machine-learning/Dockerfile platforms: linux/arm/v7,linux/amd64 + push: true tags: | altran1502/immich-machine-learning:latest - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - run: docker push altran1502/immich-machine-learning:latest build_and_push_web_latest: runs-on: ubuntu-latest @@ -78,6 +76,11 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Web uses: docker/build-push-action@v3.1.0 with: @@ -85,15 +88,9 @@ jobs: file: ./web/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 target: prod + push: true tags: | altran1502/immich-web:latest - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - run: docker push altran1502/immich-web:latest build_and_push_nginx_latest: runs-on: ubuntu-latest @@ -107,18 +104,17 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Proxy uses: docker/build-push-action@v3.1.0 with: context: ./nginx file: ./nginx/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 + push: true tags: | altran1502/immich-proxy:latest - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - run: docker push altran1502/immich-proxy:latest diff --git a/.github/workflows/build_push_docker_staging.yml b/.github/workflows/build_push_docker_staging.yml index d359b86c6..31823ce28 100644 --- a/.github/workflows/build_push_docker_staging.yml +++ b/.github/workflows/build_push_docker_staging.yml @@ -23,22 +23,20 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and push Immich Mono Repo uses: docker/build-push-action@v3.1.0 with: context: ./server file: ./server/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 + push: ${{ github.event_name == 'pull_request' }} tags: | altran1502/immich-server:staging - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - if: ${{ github.event_name == 'pull_request' }} - run: docker push altran1502/immich-server:staging build_and_push_machine_learning_staging: runs-on: ubuntu-latest @@ -53,22 +51,20 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Machine Learning uses: docker/build-push-action@v3.1.0 with: context: ./machine-learning file: ./machine-learning/Dockerfile platforms: linux/arm/v7,linux/amd64 + push: ${{ github.event_name == 'pull_request' }} tags: | altran1502/immich-machine-learning:staging - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - if: ${{ github.event_name == 'pull_request' }} - run: docker push altran1502/immich-machine-learning:staging build_and_push_web_staging: runs-on: ubuntu-latest @@ -82,6 +78,11 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Web uses: docker/build-push-action@v3.1.0 with: @@ -89,16 +90,9 @@ jobs: file: ./web/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 target: prod + push: ${{ github.event_name == 'pull_request' }} tags: | altran1502/immich-web:staging - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - if: ${{ github.event_name == 'pull_request' }} - run: docker push altran1502/immich-web:staging build_and_push_nginx_staging: runs-on: ubuntu-latest @@ -112,19 +106,17 @@ jobs: - name: Set up Docker Buildx id: buildx uses: docker/setup-buildx-action@v2.0.0 + - name: Login to Docker Hub + uses: docker/login-action@v2 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} - name: Build and Push Proxy uses: docker/build-push-action@v3.1.0 with: context: ./nginx file: ./nginx/Dockerfile platforms: linux/arm/v7,linux/amd64,linux/arm64 + push: ${{ github.event_name == 'pull_request' }} tags: | altran1502/immich-proxy:staging - - name: Login to Docker Hub - uses: docker/login-action@v2 - with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} - - name: Docker push - if: ${{ github.event_name == 'pull_request' }} - run: docker push altran1502/immich-proxy:staging \ No newline at end of file diff --git a/Makefile b/Makefile index b4587f788..259759c2b 100644 --- a/Makefile +++ b/Makefile @@ -10,6 +10,9 @@ dev-scale: stage: docker-compose -f ./docker/docker-compose.staging.yml up --build -V --remove-orphans +pull-stage: + docker-compose -f ./docker/docker-compose.staging.yml pull + test-e2e: docker-compose -f ./docker/docker-compose.test.yml --env-file ./docker/.env.test -p immich-test-e2e up --renew-anon-volumes --abort-on-container-exit --exit-code-from immich-server-test --remove-orphans --build diff --git a/web/src/app.css b/web/src/app.css index 12b80cf28..082e03dfc 100644 --- a/web/src/app.css +++ b/web/src/app.css @@ -7,6 +7,34 @@ :root { font-family: 'Work Sans', sans-serif; + /* --immich-icon-button-hover-color: #d3d3d3; */ +} + +html { + height: 100%; + width: 100%; +} + +html::-webkit-scrollbar { + width: 8px; +} + +/* Track */ +html::-webkit-scrollbar-track { + background: #f1f1f1; + border-radius: 16px; +} + +/* Handle */ +html::-webkit-scrollbar-thumb { + background: rgba(85, 86, 87, 0.408); + border-radius: 16px; +} + +/* Handle on hover */ +html::-webkit-scrollbar-thumb:hover { + background: #4250afad; + border-radius: 16px; } body { diff --git a/web/src/lib/components/album-page/album-app-bar.svelte b/web/src/lib/components/album-page/album-app-bar.svelte index ba700eb26..a5bec62d2 100644 --- a/web/src/lib/components/album-page/album-app-bar.svelte +++ b/web/src/lib/components/album-page/album-app-bar.svelte @@ -1,18 +1,30 @@ @@ -22,17 +34,19 @@ class={`flex justify-between ${appBarBorder} rounded-lg p-2 mx-2 mt-2 transition-all place-items-center`} >
- + logo={backIcon} + backgroundColor={'transparent'} + logoColor={'rgb(75 85 99)'} + hoverColor={'#e2e7e9'} + size={'24'} + /> +
-
+
diff --git a/web/src/lib/components/album-page/album-viewer.svelte b/web/src/lib/components/album-page/album-viewer.svelte index b87c8dc3c..df206e52a 100644 --- a/web/src/lib/components/album-page/album-viewer.svelte +++ b/web/src/lib/components/album-page/album-viewer.svelte @@ -6,15 +6,16 @@ import ArrowLeft from 'svelte-material-icons/ArrowLeft.svelte'; import Plus from 'svelte-material-icons/Plus.svelte'; import FileImagePlusOutline from 'svelte-material-icons/FileImagePlusOutline.svelte'; + import ShareVariantOutline from 'svelte-material-icons/ShareVariantOutline.svelte'; import AssetViewer from '../asset-viewer/asset-viewer.svelte'; import CircleAvatar from '../shared-components/circle-avatar.svelte'; import ImmichThumbnail from '../shared-components/immich-thumbnail.svelte'; import AssetSelection from './asset-selection.svelte'; import _ from 'lodash-es'; - import { assets } from '$app/paths'; - import UserSelection from './user-selection-modal.svelte'; import AlbumAppBar from './album-app-bar.svelte'; import UserSelectionModal from './user-selection-modal.svelte'; + import ShareInfoModal from './share-info-modal.svelte'; + import CircleIconButton from '../shared-components/circle-icon-button.svelte'; const dispatch = createEventDispatcher(); export let album: AlbumResponseDto; @@ -24,6 +25,7 @@ let isShowShareUserSelection = false; let isEditingTitle = false; let isCreatingSharedAlbum = false; + let isShowShareInfoModal = false; let selectedAsset: AssetResponseDto; let currentViewAssetIndex = 0; @@ -34,7 +36,6 @@ let backUrl = '/albums'; let currentAlbumName = ''; let currentUser: UserResponseDto; - let bodyElement: HTMLElement; $: isOwned = currentUser?.id == album.ownerId; @@ -70,14 +71,6 @@ }; onMount(async () => { - window.onscroll = (event: Event) => { - if (window.pageYOffset > 80) { - border = 'border border-gray-200 bg-gray-50'; - } else { - border = ''; - } - }; - currentAlbumName = album.albumName; try { @@ -178,28 +171,40 @@ } }; - // Prevent scrolling when modal is open - $: { - if (isShowShareUserSelection == true) { - document.body.style.overflow = 'hidden'; - } else { - document.body.style.overflow = ''; + const sharedUserDeletedHandler = async (event: CustomEvent) => { + const { userId }: { userId: string } = event.detail; + + if (userId == 'me') { + isShowShareInfoModal = false; + goto(backUrl); } - } + + try { + const { data } = await api.albumApi.getAlbumInfo(album.id); + + album = data; + isShowShareInfoModal = false; + } catch (e) { + console.log('Error [sharedUserDeletedHandler] ', e); + } + }; - -
+
goto(backUrl)} backIcon={ArrowLeft}> {#if album.assets.length > 0} - + logo={FileImagePlusOutline} + /> + + (isShowShareUserSelection = true)} + logo={ShareVariantOutline} + /> {/if} {#if isCreatingSharedAlbum && album.sharedUsers.length == 0} @@ -226,14 +231,14 @@ /> {#if album.assets.length > 0} -

{getDateRange()}

+

{getDateRange()}

{/if} {#if album.shared} -
+
{#each album.sharedUsers as user} - + (isShowShareInfoModal = true)} /> {/each} @@ -248,7 +253,7 @@ {/if} {#if album.assets.length > 0} -
+
{#each album.assets as asset} {#if album.assets.length < 7} {/if} + +{#if isShowShareInfoModal} + (isShowShareInfoModal = false)} + {album} + on:user-deleted={sharedUserDeletedHandler} + /> +{/if} diff --git a/web/src/lib/components/album-page/asset-selection.svelte b/web/src/lib/components/album-page/asset-selection.svelte index 362dc6f2d..8fe964fc7 100644 --- a/web/src/lib/components/album-page/asset-selection.svelte +++ b/web/src/lib/components/album-page/asset-selection.svelte @@ -133,8 +133,8 @@
dispatch('go-back')}> @@ -155,7 +155,7 @@ -
+
{#each $assetsGroupByDate as assetsInDateGroup, groupIndex}
diff --git a/web/src/lib/components/album-page/share-info-modal.svelte b/web/src/lib/components/album-page/share-info-modal.svelte new file mode 100644 index 000000000..d1fcc380e --- /dev/null +++ b/web/src/lib/components/album-page/share-info-modal.svelte @@ -0,0 +1,98 @@ + + + dispatch('close')}> + + +

Options

+ + + +
+ {#each album.sharedUsers as user} +
+
+ +

{user.firstName} {user.lastName}

+
+ +
+ {#if isOwned} + showContextMenu(user.id)} + logo={DotsVertical} + backgroundColor={'transparent'} + logoColor={'#5f6368'} + hoverColor={'#e2e7e9'} + size={'20'} + /> + {:else if user.id == currentUser?.id} + + {/if} +
+
+ {/each} +
+ + {#if isShowMenu} + (isShowMenu = false)}> + removeUser(targetUserId)} text="Remove" /> + + {/if} + diff --git a/web/src/lib/components/album-page/user-selection-modal.svelte b/web/src/lib/components/album-page/user-selection-modal.svelte index 60cfd83bb..e2deb6c3d 100644 --- a/web/src/lib/components/album-page/user-selection-modal.svelte +++ b/web/src/lib/components/album-page/user-selection-modal.svelte @@ -50,7 +50,7 @@ -
+
{#if selectedUsers.size > 0}

To

diff --git a/web/src/lib/components/asset-viewer/asset-viewer.svelte b/web/src/lib/components/asset-viewer/asset-viewer.svelte index e3cdbd3a7..8ee6d6a31 100644 --- a/web/src/lib/components/asset-viewer/asset-viewer.svelte +++ b/web/src/lib/components/asset-viewer/asset-viewer.svelte @@ -10,6 +10,7 @@ import { downloadAssets } from '$lib/stores/download'; import VideoViewer from './video-viewer.svelte'; import { api, AssetResponseDto, AssetTypeEnum } from '@api'; + import { browser } from '$app/env'; const dispatch = createEventDispatcher(); @@ -20,7 +21,9 @@ let isShowDetail = false; onMount(() => { - document.addEventListener('keydown', (keyInfo) => handleKeyboardPress(keyInfo.key)); + if (browser) { + document.addEventListener('keydown', (keyInfo) => handleKeyboardPress(keyInfo.key)); + } }); const handleKeyboardPress = (key: string) => { @@ -123,7 +126,7 @@
- import { fly } from 'svelte/transition'; + import { fade } from 'svelte/transition'; import { quintOut } from 'svelte/easing'; import Close from 'svelte-material-icons/Close.svelte'; - import { createEventDispatcher } from 'svelte'; + import { createEventDispatcher, onMount, onDestroy } from 'svelte'; + import { browser } from '$app/env'; + import CircleIconButton from './circle-icon-button.svelte'; + import { clickOutside } from '$lib/utils/click-outside'; const dispatch = createEventDispatcher(); + export let zIndex = 9999; + + onMount(() => { + if (browser) { + const scrollTop = document.documentElement.scrollTop; + const scrollLeft = document.documentElement.scrollLeft; + window.onscroll = function () { + window.scrollTo(scrollLeft, scrollTop); + }; + } + }); + + onDestroy(() => { + if (browser) { + window.onscroll = function () {}; + } + });
-
+
dispatch('close')} + class="bg-white w-[450px] min-h-[200px] max-h-[500px] rounded-lg shadow-md" + >

Modal Title
- + + dispatch('close')} logo={Close} size={'20'} />
-
+
diff --git a/web/src/lib/components/shared-components/circle-avatar.svelte b/web/src/lib/components/shared-components/circle-avatar.svelte index 1fea03910..1c6761526 100644 --- a/web/src/lib/components/shared-components/circle-avatar.svelte +++ b/web/src/lib/components/shared-components/circle-avatar.svelte @@ -1,11 +1,13 @@ {#await getUserAvatar()} -
dispatch('click')} style:width={`${size}px`} style:height={`${size}px`} class={` rounded-full bg-immich-primary/25`} /> {:then data} - profile-img + {/await} diff --git a/web/src/lib/components/shared-components/circle-icon-button.svelte b/web/src/lib/components/shared-components/circle-icon-button.svelte index 075321170..059a0fd06 100644 --- a/web/src/lib/components/shared-components/circle-icon-button.svelte +++ b/web/src/lib/components/shared-components/circle-icon-button.svelte @@ -1,18 +1,41 @@ + + diff --git a/web/src/lib/components/shared-components/context-menu/context-menu.svelte b/web/src/lib/components/shared-components/context-menu/context-menu.svelte new file mode 100644 index 000000000..f5e394d9f --- /dev/null +++ b/web/src/lib/components/shared-components/context-menu/context-menu.svelte @@ -0,0 +1,33 @@ + + +
dispatch('clickoutside')} +> + +
diff --git a/web/src/lib/components/shared-components/context-menu/menu-option.svelte b/web/src/lib/components/shared-components/context-menu/menu-option.svelte new file mode 100644 index 000000000..fedc5a548 --- /dev/null +++ b/web/src/lib/components/shared-components/context-menu/menu-option.svelte @@ -0,0 +1,26 @@ + + + diff --git a/web/src/lib/components/shared-components/context-menu/menu.ts b/web/src/lib/components/shared-components/context-menu/menu.ts new file mode 100644 index 000000000..108b2fd1a --- /dev/null +++ b/web/src/lib/components/shared-components/context-menu/menu.ts @@ -0,0 +1,3 @@ +const key = {}; + +export { key }; diff --git a/web/src/routes/__layout.svelte b/web/src/routes/__layout.svelte index 52b94e1bd..dc1233eda 100644 --- a/web/src/routes/__layout.svelte +++ b/web/src/routes/__layout.svelte @@ -16,7 +16,7 @@