From 5146dd23487f98080bf246f50101e6d13ed79aea Mon Sep 17 00:00:00 2001
From: Innei <i@innei.in>
Date: Mon, 30 Sep 2024 22:35:34 +0800
Subject: [PATCH] fix: modal title overflow tooltip

Signed-off-by: Innei <i@innei.in>
---
 apps/renderer/src/components/ui/modal/stacked/modal.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/apps/renderer/src/components/ui/modal/stacked/modal.tsx b/apps/renderer/src/components/ui/modal/stacked/modal.tsx
index a8fdd2cc83..4085fb265c 100644
--- a/apps/renderer/src/components/ui/modal/stacked/modal.tsx
+++ b/apps/renderer/src/components/ui/modal/stacked/modal.tsx
@@ -30,6 +30,7 @@ import { cn } from "~/lib/utils"
 
 import { Divider } from "../../divider"
 import { RootPortalProvider } from "../../portal/provider"
+import { EllipsisHorizontalTextWithTooltip } from "../../typography"
 import { modalStackAtom } from "./atom"
 import { MODAL_STACK_Z_INDEX, modalMontionConfig } from "./constants"
 import type { CurrentModalContentProps, ModalActionsInternal } from "./context"
@@ -359,9 +360,11 @@ export const ModalInternal = memo(
                       onPointerDownCapture={handleDrag}
                       onPointerDown={handleResizeEnable}
                     >
-                      <Dialog.Title className="flex max-w-full shrink-0 grow items-center gap-2 px-4 py-1 text-lg font-semibold">
+                      <Dialog.Title className="flex w-0 max-w-full grow items-center gap-2 px-4 py-1 text-lg font-semibold">
                         {icon && <span className="size-4">{icon}</span>}
-                        <span className="truncate">{title}</span>
+                        <EllipsisHorizontalTextWithTooltip className="truncate">
+                          <span>{title}</span>
+                        </EllipsisHorizontalTextWithTooltip>
                       </Dialog.Title>
                       {canClose && (
                         <Dialog.DialogClose className="center p-2" tabIndex={1} onClick={close}>