From 4a6e26dcc8a0af39166fe6440cd7aaa31ee609ba Mon Sep 17 00:00:00 2001
From: WithoutPants <53250216+WithoutPants@users.noreply.github.com>
Date: Sun, 20 Feb 2022 11:07:47 +1100
Subject: [PATCH] Add gallery icon to image card (#2324)

---
 ui/v2.5/src/components/Images/ImageCard.tsx | 23 +++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/ui/v2.5/src/components/Images/ImageCard.tsx b/ui/v2.5/src/components/Images/ImageCard.tsx
index e56733643..73a61a4f4 100644
--- a/ui/v2.5/src/components/Images/ImageCard.tsx
+++ b/ui/v2.5/src/components/Images/ImageCard.tsx
@@ -62,6 +62,27 @@ export const ImageCard: React.FC<IImageCardProps> = (
     }
   }
 
+  function maybeRenderGallery() {
+    if (props.image.galleries.length <= 0) return;
+
+    const popoverContent = props.image.galleries.map((gallery) => (
+      <TagLink key={gallery.id} gallery={gallery} />
+    ));
+
+    return (
+      <HoverPopover
+        className="gallery-count"
+        placement="bottom"
+        content={popoverContent}
+      >
+        <Button className="minimal">
+          <Icon icon="images" />
+          <span>{props.image.galleries.length}</span>
+        </Button>
+      </HoverPopover>
+    );
+  }
+
   function maybeRenderOrganized() {
     if (props.image.organized) {
       return (
@@ -79,6 +100,7 @@ export const ImageCard: React.FC<IImageCardProps> = (
       props.image.tags.length > 0 ||
       props.image.performers.length > 0 ||
       props.image.o_counter ||
+      props.image.galleries.length > 0 ||
       props.image.organized
     ) {
       return (
@@ -88,6 +110,7 @@ export const ImageCard: React.FC<IImageCardProps> = (
             {maybeRenderTagPopoverButton()}
             {maybeRenderPerformerPopoverButton()}
             {maybeRenderOCounter()}
+            {maybeRenderGallery()}
             {maybeRenderOrganized()}
           </ButtonGroup>
         </>