From 8a232c7d911f67c6a123d50d7686214ac6247e2d Mon Sep 17 00:00:00 2001
From: daniyal <daniyal@nostrdev.com>
Date: Thu, 29 Aug 2024 13:24:15 +0500
Subject: [PATCH] fix: ability to right-click on a mod post to open in new tab
 or copy link

---
 src/components/ModCard.tsx | 11 ++++++++++-
 src/pages/mods.tsx         | 39 +++++++++++++++++++-------------------
 2 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/src/components/ModCard.tsx b/src/components/ModCard.tsx
index 68cc1fb..a47c927 100644
--- a/src/components/ModCard.tsx
+++ b/src/components/ModCard.tsx
@@ -4,6 +4,7 @@ type ModCardProps = {
   title: string
   summary: string
   backgroundLink: string
+  link: string
   handleClick: () => void
 }
 
@@ -11,10 +12,18 @@ export const ModCard = ({
   title,
   summary,
   backgroundLink,
+  link,
   handleClick
 }: ModCardProps) => {
   return (
-    <a className='cardModMainWrapperLink' onClick={handleClick}>
+    <a
+      className='cardModMainWrapperLink'
+      href={link}
+      onClick={(e) => {
+        e.preventDefault()
+        handleClick()
+      }}
+    >
       <div className='cardModMain'>
         <div
           className='cMMPicture'
diff --git a/src/pages/mods.tsx b/src/pages/mods.tsx
index 7fbe7c0..e5bc6e0 100644
--- a/src/pages/mods.tsx
+++ b/src/pages/mods.tsx
@@ -177,25 +177,26 @@ export const ModsPage = () => {
 
             <div className='IBMSecMain IBMSMListWrapper'>
               <div className='IBMSMList'>
-                {filteredModList.map((mod) => (
-                  <ModCard
-                    key={mod.id}
-                    title={mod.title}
-                    summary={mod.summary}
-                    backgroundLink={mod.featuredImageUrl}
-                    handleClick={() =>
-                      navigate(
-                        getModsInnerPageRoute(
-                          nip19.naddrEncode({
-                            identifier: mod.aTag,
-                            pubkey: mod.author,
-                            kind: kinds.ClassifiedListing
-                          })
-                        )
-                      )
-                    }
-                  />
-                ))}
+                {filteredModList.map((mod) => {
+                  const route = getModsInnerPageRoute(
+                    nip19.naddrEncode({
+                      identifier: mod.aTag,
+                      pubkey: mod.author,
+                      kind: kinds.ClassifiedListing
+                    })
+                  )
+
+                  return (
+                    <ModCard
+                      key={mod.id}
+                      title={mod.title}
+                      summary={mod.summary}
+                      backgroundLink={mod.featuredImageUrl}
+                      link={`#${route}`}
+                      handleClick={() => navigate(route)}
+                    />
+                  )
+                })}
               </div>
             </div>