From 6d8d0ec6363c8c24538e1194f23c1337cca5782e Mon Sep 17 00:00:00 2001
From: glax <johanna@bernloehr.eu>
Date: Mon, 19 May 2025 19:29:42 +0200
Subject: [PATCH] Move Popup-Tags to MangaPopup.tsx

---
 tranga-website/src/Components/AuthorTag.tsx  | 10 ----------
 tranga-website/src/Components/LinkTag.tsx    | 10 ----------
 tranga-website/src/Components/MangaPopup.tsx | 12 +++++++-----
 3 files changed, 7 insertions(+), 25 deletions(-)
 delete mode 100644 tranga-website/src/Components/AuthorTag.tsx
 delete mode 100644 tranga-website/src/Components/LinkTag.tsx

diff --git a/tranga-website/src/Components/AuthorTag.tsx b/tranga-website/src/Components/AuthorTag.tsx
deleted file mode 100644
index d457271..0000000
--- a/tranga-website/src/Components/AuthorTag.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import {Chip, ColorPaletteProp} from "@mui/joy";
-import IAuthor from "../api/types/IAuthor.ts";
-
-export default function AuthorTag({author, color} : {author: IAuthor, color?: ColorPaletteProp }) {
-    return (
-        <Chip variant={"outlined"} size={"md"} color={color??"primary"}>
-            {author.authorName ?? "Load Failed"}
-        </Chip>
-    );
-}
\ No newline at end of file
diff --git a/tranga-website/src/Components/LinkTag.tsx b/tranga-website/src/Components/LinkTag.tsx
deleted file mode 100644
index 3e0c1c4..0000000
--- a/tranga-website/src/Components/LinkTag.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import {Chip, Link, ColorPaletteProp} from "@mui/joy";
-import ILink from "../api/types/ILink.ts";
-
-export default function LinkTag({link, color} : { link: ILink | undefined, color?: ColorPaletteProp }) {
-    return (
-        <Chip variant={"soft"} size={"sm"} color={color??"primary"}>
-            <Link sx={{textDecoration:"underline"}} level={"body-xs"} href={link?.linkUrl}>{link?.linkProvider??"Load Failed"}</Link>
-        </Chip>
-    );
-}
\ No newline at end of file
diff --git a/tranga-website/src/Components/MangaPopup.tsx b/tranga-website/src/Components/MangaPopup.tsx
index ac4c296..cdc962e 100644
--- a/tranga-website/src/Components/MangaPopup.tsx
+++ b/tranga-website/src/Components/MangaPopup.tsx
@@ -3,8 +3,6 @@ import {Badge, Box, Chip, CircularProgress, Drawer, Input, Link, Skeleton, Stack
 import {ReactElement, useCallback, useContext, useEffect, useRef, useState} from "react";
 import {GetLatestChapterAvailable, GetMangaCoverImageUrl, SetIgnoreThreshold} from "../api/Manga.tsx";
 import {ApiUriContext, getData} from "../api/fetchApi.tsx";
-import AuthorTag from "./AuthorTag.tsx";
-import LinkTag from "./LinkTag.tsx";
 import MarkdownPreview from "@uiw/react-markdown-preview";
 import {CardHeight} from "./Manga.tsx";
 import IChapter from "../api/types/IChapter.ts";
@@ -73,10 +71,14 @@ export default function MangaPopup({manga, open, children} : {manga: IManga | nu
                         <Link href={manga?.websiteUrl} level={"h2"}>
                             {manga?.name}
                         </Link>
-                        <Stack direction={"row"} flexWrap={"wrap"} spacing={0.5} sx={{maxHeight:CardHeight*0.3+"px", overflowY:"auto", scrollbarWidth: "thin"}}>
-                            {manga?.authors?.map(author => <AuthorTag key={author.authorId} author={author} color={"success"} />)}
+                        <Stack direction={"row"} flexWrap={"wrap"} useFlexGap={true} spacing={0.3} sx={{maxHeight:CardHeight*0.3+"px", overflowY:"auto", scrollbarWidth: "thin"}}>
+                            {manga?.authors?.map(author => <Chip key={author.authorId} variant={"outlined"} size={"md"} color={"success"}>{author.authorName}</Chip>)}
                             {manga?.mangaTags?.map(tag => <Chip key={tag.tag} variant={"soft"} size={"md"} color={"primary"}>{tag.tag}</Chip>)}
-                            {manga?.links?.map(link => <LinkTag key={link.linkId} link={link} color={"warning"} />)}
+                            {manga?.links?.map(link =>
+                                <Chip key={link.linkId} variant={"soft"} size={"md"} color={"warning"}>
+                                    <Link sx={{textDecoration:"underline"}} level={"body-xs"} href={link?.linkUrl}>{link?.linkProvider??"Load Failed"}</Link>
+                                </Chip>
+                            )}
                         </Stack>
                         <MarkdownPreview source={manga?.description} style={{backgroundColor: "transparent", color: "var(--joy-palette-neutral-50)", maxHeight:CardHeight*0.7+"px", overflowY:"auto", marginTop:"10px", scrollbarWidth: "thin"}} />
                     </Box>