feat: open links with A instead of JS (#457)

Signed-off-by: GitHub <[email protected]> Co-authored-by: Karl Johan Grahn <[email protected]>
stakater · Nov 27, 2024 · 29c3b8f · 29c3b8f
1 parent ebd4c4f
commit 29c3b8f
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 11 deletions.
diff --git a/frontend/src/components/AppCard/AppCard.js b/frontend/src/components/AppCard/AppCard.js
@@ -14,22 +14,17 @@ const AppCard = ({ card }) => {
     SetIsDetailsExpanded(!isDetailsExpanded);
   };
 
-  const handleOpenAppLink = url => {
-    window.open(url, "_blank");
-  };
-
   return (
     <Card>
       <AppCardHeader
         name={card.name}
         url={card.url}
-        onOpenAppLink={() => handleOpenAppLink(card.url)}
       />
 
       <AppCardContent
         name={card.name}
         icon={card.icon}
-        onOpenAppLink={() => handleOpenAppLink(card.url)}
+        url={card.url}
       />
 
       <AppCardFooter

diff --git a/frontend/src/components/AppCardContent/AppCardContent.js b/frontend/src/components/AppCardContent/AppCardContent.js
@@ -14,11 +14,11 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-const AppCardContent = ({ icon, name, onOpenAppLink }) => {
+const AppCardContent = ({ icon, name, url }) => {
   const classes = useStyles();
 
   return (
-    <CardActionArea onClick={onOpenAppLink}>
+    <CardActionArea href={url} target="_blank">
       <Grid className={classes.mediaWrapper}>
         <CardMedia className={classes.media} image={icon} title={name} />
       </Grid>
@@ -29,7 +29,7 @@ const AppCardContent = ({ icon, name, onOpenAppLink }) => {
 AppCardContent.propTypes = {
   icon: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
-  onOpenAppLink: PropTypes.func.isRequired
+  url: PropTypes.string.isRequired
 };
 
 export default AppCardContent;
diff --git a/frontend/src/components/AppCardHeader/AppCardHeader.js b/frontend/src/components/AppCardHeader/AppCardHeader.js
@@ -17,7 +17,7 @@ const useStyles = makeStyles(theme => ({
     right: "0.5rem"
   }
 }));
-const AppCardHeader = ({ name, url, onOpenAppLink }) => {
+const AppCardHeader = ({ name, url }) => {
   const classes = useStyles();
 
   return (
@@ -53,7 +53,6 @@ const AppCardHeader = ({ name, url, onOpenAppLink }) => {
 AppCardHeader.propTypes = {
   name: PropTypes.string.isRequired,
   url: PropTypes.string.isRequired,
-  onOpenAppLink: PropTypes.func.isRequired
 };
 
 export default AppCardHeader;