From 610cd0e89927e8759c2a748a82115149d34e7fee Mon Sep 17 00:00:00 2001
From: Varun Raj <mailme@varunraj.in>
Date: Sat, 7 Sep 2024 20:17:25 +0530
Subject: [PATCH] feat: added option in immich for potential albums asset

Signed-off-by: Varun Raj <mailme@varunraj.in>
---
 .../PotentialAlbumsAssets.tsx                 | 21 ++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/components/albums/potential-albums/PotentialAlbumsAssets.tsx b/src/components/albums/potential-albums/PotentialAlbumsAssets.tsx
index c0d0d2d..ba4d894 100644
--- a/src/components/albums/potential-albums/PotentialAlbumsAssets.tsx
+++ b/src/components/albums/potential-albums/PotentialAlbumsAssets.tsx
@@ -8,8 +8,10 @@ import Lightbox, { SlideImage, SlideTypes } from "yet-another-react-lightbox";
 import Captions from "yet-another-react-lightbox/plugins/captions";
 import { CalendarArrowDown, CalendarArrowUp, Hourglass } from "lucide-react";
 import Video from "yet-another-react-lightbox/plugins/video";
+import { useConfig } from "@/contexts/ConfigContext";
 
 export default function PotentialAlbumsAssets() {
+  const { exImmichUrl } = useConfig();
   const { startDate, selectedIds, assets, updateContext } =
     usePotentialAlbumContext();
 
@@ -37,12 +39,22 @@ export default function PotentialAlbumsAssets() {
       width: p.exifImageWidth as number,
       height: p.exifImageHeight as number,
       isSelected: selectedIds.includes(p.id),
+      tags: [
+        {
+          title: "Immich Link",
+          value: (
+            <a href={exImmichUrl + "/photos/" + p.id} target="_blank">
+              Open in Immich
+            </a>
+          ),
+        },
+      ],
     }));
   }, [assets, selectedIds]);
 
   const slides = useMemo(
     () =>
-      images.map(({ original, width, height, type, videoURL }) => ({
+      images.map(({ original, width, height, type, videoURL}) => ({
         src: original,
         width,
         height,
@@ -111,6 +123,13 @@ export default function PotentialAlbumsAssets() {
           onClick={handleClick}
           enableImageSelection={true}
           onSelect={handleSelect}
+          tagStyle={{
+            color: "white",
+            fontSize: "12px",
+            backgroundColor: "rgba(0, 0, 0)",
+            padding: "2px",
+            borderRadius: "5px",
+          }}
         />
       </div>
     </>