From 28f77601208612e5c3b340febc77226ad92c77c3 Mon Sep 17 00:00:00 2001
From: orangecoding <christian.kellner.privat@gmail.com>
Date: Mon, 26 Jan 2026 10:43:38 +0100
Subject: [PATCH] adapt link to listing in grid view to behave like a real link

---
 .../components/grid/listings/ListingsGrid.jsx | 26 +++++++++----------
 .../grid/listings/ListingsGrid.less           | 13 ++++++++++
 2 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/ui/src/components/grid/listings/ListingsGrid.jsx b/ui/src/components/grid/listings/ListingsGrid.jsx
index ca98318..e291de2 100644
--- a/ui/src/components/grid/listings/ListingsGrid.jsx
+++ b/ui/src/components/grid/listings/ListingsGrid.jsx
@@ -103,6 +103,10 @@ const ListingsGrid = () => {
     setPage(_page);
   };
 
+  const cap = (val) => {
+    return String(val).charAt(0).toUpperCase() + String(val).slice(1);
+  };
+
   return (
     <div className="listingsGrid">
       <div className="listingsGrid__searchbar">
@@ -251,11 +255,9 @@ const ListingsGrid = () => {
               bodyStyle={{ padding: '12px' }}
             >
               <div className="listingsGrid__content">
-                <a href={item.url} target="_blank" rel="noopener noreferrer" className="listingsGrid__titleLink">
-                  <Text strong ellipsis={{ showTooltip: true }} className="listingsGrid__title">
-                    {item.title}
-                  </Text>
-                </a>
+                <Text strong ellipsis={{ showTooltip: true }} className="listingsGrid__title">
+                  {cap(item.title)}
+                </Text>
                 <Space vertical align="start" spacing={2} style={{ width: '100%', marginTop: 8 }}>
                   <Text type="secondary" icon={<IconCart />} size="small">
                     {item.price} €
@@ -287,15 +289,11 @@ const ListingsGrid = () => {
                 </Space>
                 <Divider margin=".6rem" />
                 <div style={{ display: 'flex', justifyContent: 'space-between' }}>
-                  <Button
-                    title="Link to listing"
-                    type="primary"
-                    size="small"
-                    onClick={async () => {
-                      window.open(item.link);
-                    }}
-                    icon={<IconLink />}
-                  />
+                  <div className="listingsGrid__linkButton">
+                    <a href={item.link} target="_blank" rel="noopener noreferrer">
+                      <IconLink />
+                    </a>
+                  </div>
 
                   <Button
                     title="Remove"
diff --git a/ui/src/components/grid/listings/ListingsGrid.less b/ui/src/components/grid/listings/ListingsGrid.less
index 9f6a170..6fd7c1c 100644
--- a/ui/src/components/grid/listings/ListingsGrid.less
+++ b/ui/src/components/grid/listings/ListingsGrid.less
@@ -103,4 +103,17 @@
   &__setupButton {
     margin-bottom: 1rem;
   }
+
+  &__linkButton {
+    background: var(--semi-color-fill-0);
+    font-size: 14px;
+    line-height: 20px;
+    font-weight: 600;
+    height: 24px;
+    width: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 3px;
+  }
 }