From a2acddab5fd7b6387cbe68b7e20429403f9f11c6 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Mon, 10 Mar 2025 23:15:48 +0100
Subject: [PATCH] Show tooltip for metadata on ChapterCards

Text that was too long got cut of, but it was never shown as the tooltip, which caused the information about the full text to get lost
---
 .../components/cards/ChapterCardMetadata.tsx  | 37 ++++++++++++++-----
 1 file changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/modules/chapter/components/cards/ChapterCardMetadata.tsx b/src/modules/chapter/components/cards/ChapterCardMetadata.tsx
index 87268dd3..64995de3 100644
--- a/src/modules/chapter/components/cards/ChapterCardMetadata.tsx
+++ b/src/modules/chapter/components/cards/ChapterCardMetadata.tsx
@@ -10,6 +10,7 @@ import Box from '@mui/material/Box';
 import { ComponentProps, ReactNode } from 'react';
 import Stack from '@mui/material/Stack';
 import { TypographyMaxLines } from '@/modules/core/components/TypographyMaxLines.tsx';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
 
 export const ChapterCardMetadata = ({
     title,
@@ -46,19 +47,37 @@ export const ChapterCardMetadata = ({
             }}
         >
             {infoIcons}
-            <TypographyMaxLines variant="h6" component="h3" {...slotProps?.title}>
-                {title}
-            </TypographyMaxLines>
+            <CustomTooltip title={title}>
+                <TypographyMaxLines variant="h6" component="h3" {...slotProps?.title}>
+                    {title}
+                </TypographyMaxLines>
+            </CustomTooltip>
         </Stack>
         {secondaryText && (
-            <TypographyMaxLines variant="caption" display="block" lines={1} {...slotProps?.secondaryText}>
-                {secondaryText}
-            </TypographyMaxLines>
+            <CustomTooltip title={secondaryText}>
+                <TypographyMaxLines
+                    variant="caption"
+                    display="block"
+                    lines={1}
+                    {...slotProps?.secondaryText}
+                    sx={{ maxWidth: 'fit-content', ...slotProps?.secondaryText?.sx }}
+                >
+                    {secondaryText}
+                </TypographyMaxLines>
+            </CustomTooltip>
         )}
         {ternaryText && (
-            <TypographyMaxLines variant="caption" display="block" lines={1} {...slotProps?.ternaryText}>
-                {ternaryText}
-            </TypographyMaxLines>
+            <CustomTooltip title={ternaryText}>
+                <TypographyMaxLines
+                    variant="caption"
+                    display="block"
+                    lines={1}
+                    {...slotProps?.ternaryText}
+                    sx={{ maxWidth: 'fit-content', ...slotProps?.ternaryText?.sx }}
+                >
+                    {ternaryText}
+                </TypographyMaxLines>
+            </CustomTooltip>
         )}
     </Box>
 );