From 15f91fda13d1bcc4976a3c6a4f9669f393f37658 Mon Sep 17 00:00:00 2001
From: WithoutPants <53250216+WithoutPants@users.noreply.github.com>
Date: Tue, 1 Aug 2023 14:14:28 +1000
Subject: [PATCH] Fix parent/child links on tag pages (#3978)

---
 ui/v2.5/src/components/Shared/TagLink.tsx          |  7 +++++--
 .../components/Tags/TagDetails/TagDetailsPanel.tsx | 14 ++++++++++++--
 ui/v2.5/src/utils/navigation.ts                    |  5 +++++
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/ui/v2.5/src/components/Shared/TagLink.tsx b/ui/v2.5/src/components/Shared/TagLink.tsx
index 0049c3101bd..38cb1326623 100644
--- a/ui/v2.5/src/components/Shared/TagLink.tsx
+++ b/ui/v2.5/src/components/Shared/TagLink.tsx
@@ -34,7 +34,7 @@ type SceneMarkerFragment = Pick<GQL.SceneMarker, "id" | "title" | "seconds"> & {
 
 interface IProps {
   tag?: Partial<TagDataFragment>;
-  tagType?: "performer" | "scene" | "gallery" | "image";
+  tagType?: "performer" | "scene" | "gallery" | "image" | "details";
   performer?: Partial<PerformerDataFragment>;
   marker?: SceneMarkerFragment;
   movie?: Partial<MovieDataFragment>;
@@ -49,6 +49,7 @@ export const TagLink: React.FC<IProps> = (props: IProps) => {
   let link: string = "#";
   let title: string = "";
   if (props.tag) {
+    id = props.tag.id || "";
     switch (props.tagType) {
       case "scene":
       case undefined:
@@ -63,8 +64,10 @@ export const TagLink: React.FC<IProps> = (props: IProps) => {
       case "image":
         link = NavUtils.makeTagImagesUrl(props.tag);
         break;
+      case "details":
+        link = NavUtils.makeTagUrl(id);
+        break;
     }
-    id = props.tag.id || "";
     title = props.tag.name || "";
   } else if (props.performer) {
     link = NavUtils.makePerformerScenesUrl(props.performer);
diff --git a/ui/v2.5/src/components/Tags/TagDetails/TagDetailsPanel.tsx b/ui/v2.5/src/components/Tags/TagDetails/TagDetailsPanel.tsx
index af5f588b6db..39d8d19ed90 100644
--- a/ui/v2.5/src/components/Tags/TagDetails/TagDetailsPanel.tsx
+++ b/ui/v2.5/src/components/Tags/TagDetails/TagDetailsPanel.tsx
@@ -17,7 +17,12 @@ export const TagDetailsPanel: React.FC<ITagDetails> = ({ tag, fullWidth }) => {
     return (
       <>
         {tag.parents.map((p) => (
-          <TagLink key={p.id} tag={p} hoverPlacement="bottom" />
+          <TagLink
+            key={p.id}
+            tag={p}
+            hoverPlacement="bottom"
+            tagType="details"
+          />
         ))}
       </>
     );
@@ -31,7 +36,12 @@ export const TagDetailsPanel: React.FC<ITagDetails> = ({ tag, fullWidth }) => {
     return (
       <>
         {tag.children.map((c) => (
-          <TagLink key={c.id} tag={c} hoverPlacement="bottom" />
+          <TagLink
+            key={c.id}
+            tag={c}
+            hoverPlacement="bottom"
+            tagType="details"
+          />
         ))}
       </>
     );
diff --git a/ui/v2.5/src/utils/navigation.ts b/ui/v2.5/src/utils/navigation.ts
index 937a1132a90..ddefaeec75f 100644
--- a/ui/v2.5/src/utils/navigation.ts
+++ b/ui/v2.5/src/utils/navigation.ts
@@ -213,6 +213,10 @@ const makeMovieScenesUrl = (movie: Partial<GQL.MovieDataFragment>) => {
   return `/scenes?${filter.makeQueryParameters()}`;
 };
 
+const makeTagUrl = (id: string) => {
+  return `/tags/${id}`;
+};
+
 const makeParentTagsUrl = (tag: Partial<GQL.TagDataFragment>) => {
   if (!tag.id) return "#";
   const filter = new ListFilterModel(GQL.FilterMode.Tags, undefined);
@@ -373,6 +377,7 @@ const NavUtils = {
   makeStudioGalleriesUrl,
   makeStudioMoviesUrl,
   makeStudioPerformersUrl,
+  makeTagUrl,
   makeParentTagsUrl,
   makeChildTagsUrl,
   makeTagSceneMarkersUrl,