fix(Publication Card): add link to card and arg name fix

eea · Mar 9, 2022 · 36a7c96 · 36a7c96
1 parent 08d495b
commit 36a7c96
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 7 deletions.
diff --git a/src/ui/PublicationCard/PublicationCard.jsx b/src/ui/PublicationCard/PublicationCard.jsx
@@ -1,7 +1,11 @@
 import React from 'react';
 
 function PublicationCard({ children, ...rest }) {
-  return <div className="eea publication card">{children}</div>;
+  return (
+    <div className="eea publication card">
+      <a href={rest.href}>{children}</a>
+    </div>
+  );
 }
 
 PublicationCard.Header = ({ children, ...rest }) => (
@@ -14,9 +18,9 @@ PublicationCard.Header = ({ children, ...rest }) => (
 );
 
 PublicationCard.Info = ({ children, ...rest }) => (
-  <div className="descripiton">
+  <div className="description">
     <div className="tag">#{rest.tag}</div>
-    <p className="text">{rest.descripiton}</p>
+    <p className="text">{rest.description}</p>
   </div>
 );
 

diff --git a/src/ui/PublicationCard/PublicationCard.stories.jsx b/src/ui/PublicationCard/PublicationCard.stories.jsx
@@ -15,13 +15,20 @@ export default {
         defaultValue: { summary: '' },
       },
     },
-    descripiton: {
+    description: {
       description: 'publication description',
       table: {
         type: { summary: 'string' },
         defaultValue: { summary: '' },
       },
     },
+    href: {
+      description: 'publication link url',
+      table: {
+        type: { summary: 'string' },
+        defaultValue: { summary: '' },
+      },
+    },
   },
 };
 
@@ -31,23 +38,25 @@ const Template = (args) => (
       image_url={args.image ? imageUrl : null}
       image={args.image}
     />
-    <PublicationCard.Info descripiton={args.descripiton} tag={args.tag} />
+    <PublicationCard.Info description={args.description} tag={args.tag} />
   </PublicationCard>
 );
 
 export const Default = Template.bind({});
 Default.args = {
   tag: 'Publication',
-  descripiton:
+  description:
     'Leo fermentum sollicitudin suspendisse iaculis feugiat. Eget tellus blandit aenean mattis.',
+  href: '/#',
 };
 
 export const PublicationCardWithImage = Template.bind({});
 PublicationCardWithImage.args = {
   tag: 'Publication',
-  descripiton:
+  description:
     'Leo fermentum sollicitudin suspendisse iaculis feugiat. Eget tellus blandit aenean mattis.',
   image: true,
+  href: '/#',
 };
 PublicationCardWithImage.argTypes = {
   image: {