From 6abf440f5e5d50ed67dea6f17a9d2e133456b7ce Mon Sep 17 00:00:00 2001
From: Dhaverd <jedi55@mail.ru>
Date: Mon, 11 May 2026 23:42:35 +0800
Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20?=
 =?UTF-8?q?=D0=BA=D0=BB=D0=B8=D0=BA=D0=B0=D0=B1=D0=B5=D0=BB=D1=8C=D0=BD?=
 =?UTF-8?q?=D0=BE=D1=81=D1=82=D1=8C=20=D1=81=D1=81=D1=8B=D0=BB=D0=BE=D0=BA?=
 =?UTF-8?q?=20=D0=BD=D0=B0=20=D0=BF=D1=80=D0=BE=D1=84=D0=B8=D0=BB=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/assets/styles/home.css                |  4 ++++
 app/components/itemDialog.tsx             |  2 +-
 app/components/itemDialog/NameField.tsx   | 18 ++++++++++++++++++
 app/components/itemDialog/titleHeader.tsx |  5 +++--
 app/components/reportDialog.tsx           |  2 +-
 5 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 app/components/itemDialog/NameField.tsx

diff --git a/app/assets/styles/home.css b/app/assets/styles/home.css
index 90fd37c..002183a 100644
--- a/app/assets/styles/home.css
+++ b/app/assets/styles/home.css
@@ -96,6 +96,10 @@
     justify-content: space-around
 }
 
+.title-header-link:hover {
+    color: #6F7E8C;
+}
+
 
 @media (width <= 570px) {
 
diff --git a/app/components/itemDialog.tsx b/app/components/itemDialog.tsx
index eafe944..28e5667 100644
--- a/app/components/itemDialog.tsx
+++ b/app/components/itemDialog.tsx
@@ -16,7 +16,7 @@ export default function ItemDialog({ blacklistItem, open, handleClose }: { black
                 onClose={() => handleClose()}
             >
                 <DialogTitle>
-                    <TitleHeader name={width < 570 ? trimLink(blacklistItem?.link) : blacklistItem?.link} handleClose={handleClose}/>
+                    <TitleHeader name={blacklistItem?.link} handleClose={handleClose} isLink={true}/>
                     <TagList
                         afk={blacklistItem?.afk}
                         cheater={blacklistItem?.cheater}
diff --git a/app/components/itemDialog/NameField.tsx b/app/components/itemDialog/NameField.tsx
new file mode 100644
index 0000000..a334bde
--- /dev/null
+++ b/app/components/itemDialog/NameField.tsx
@@ -0,0 +1,18 @@
+import useWindowDimensions from "~/hooks/windowDimensions";
+import trimLink from "~/functions/trimLink";
+
+export  default function NameField ({name, isLink} : {name: string|undefined, isLink: boolean} ) {
+    if (!name){
+        return (<p>???</p>)
+    }
+    const { width } = useWindowDimensions();
+    if (isLink){
+        return (
+            <a href={name} target="_blank" className="title-header-link">{width < 570 ? trimLink(name) : name}</a>
+        )
+    } else {
+        return (
+            <p>{width < 570 ? trimLink(name) : name}</p>
+        )
+    }
+}
\ No newline at end of file
diff --git a/app/components/itemDialog/titleHeader.tsx b/app/components/itemDialog/titleHeader.tsx
index 54da542..2cbfe6e 100644
--- a/app/components/itemDialog/titleHeader.tsx
+++ b/app/components/itemDialog/titleHeader.tsx
@@ -1,11 +1,12 @@
 import {IconButton} from "@mui/material";
 import CloseIcon from '@mui/icons-material/Close';
+import NameField from "~/components/itemDialog/NameField";
 
-export default function TitleHeader({ name, handleClose }:{ name: string|undefined, handleClose: Function }){
+export default function TitleHeader({ name, handleClose, isLink }:{ name: string|undefined, handleClose: Function, isLink: boolean }){
     return (
         <>
             <div className="report-title-header">
-                <p>{name}</p>
+                <NameField name={name} isLink={isLink}/>
                 <IconButton aria-label="Close">
                     <CloseIcon sx={{color: "#E0E3E7"}} onClick={() => handleClose()}/>
                 </IconButton>
diff --git a/app/components/reportDialog.tsx b/app/components/reportDialog.tsx
index d18df3a..3be7d30 100644
--- a/app/components/reportDialog.tsx
+++ b/app/components/reportDialog.tsx
@@ -74,7 +74,7 @@ export default function ReportDialog({ open, handleClose }: { open: boolean, han
                 onClose={() => handleClose()}
             >
                 <DialogTitle>
-                    <TitleHeader name={'Creating Hunt: Showdown player report'} handleClose={handleClose}/>
+                    <TitleHeader name={'Creating Hunt: Showdown player report'} handleClose={handleClose} isLink={false}/>
                 </DialogTitle>
                 <Divider sx={{marginTop: '10px', marginBottom: '10px', alignSelf: 'center'}}/>
                 <DialogContent>