diff --git a/src/components/NextLink/NextLink.jsx b/src/components/NextLink/NextLink.jsx index fd165ad..c0c3598 100644 --- a/src/components/NextLink/NextLink.jsx +++ b/src/components/NextLink/NextLink.jsx @@ -2,24 +2,27 @@ import React from 'react' import Link from 'next/link' import PropTypes from 'prop-types' -const NextLink = ({ addClass, text, path }) => ( +const NextLink = ({ addClass, children, path }) => ( ) -const NextLinkWrapper = React.forwardRef(({ addClass, text, href }, ref) => ( +const NextLinkWrapper = React.forwardRef(({ addClass, children, href }, ref) => ( - {text} + {children} )) NextLink.propTypes = { - text: PropTypes.string.isRequired, + children: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.elementType, + ]).isRequired, addClass: PropTypes.string, path: PropTypes.exact({ pathname: PropTypes.string.isRequired, diff --git a/src/components/NextLink/NextLink.stories.jsx b/src/components/NextLink/NextLink.stories.jsx index e838d0e..f12c501 100644 --- a/src/components/NextLink/NextLink.stories.jsx +++ b/src/components/NextLink/NextLink.stories.jsx @@ -10,7 +10,7 @@ const Template = (args) => export const Default = Template.bind({}) Default.args = { - text: 'Text Here', + children: 'Text Here', addClass: '', path: { pathname: '/test', diff --git a/src/compounds/Item/CardBody.jsx b/src/compounds/Item/CardBody.jsx index 0346b90..e02c93d 100644 --- a/src/compounds/Item/CardBody.jsx +++ b/src/compounds/Item/CardBody.jsx @@ -24,7 +24,7 @@ const CardBody = ({ buttonLink, buttonProps, item, {(withTitleLink) && ( diff --git a/src/compounds/Item/Item.jsx b/src/compounds/Item/Item.jsx index f10f10a..035096c 100644 --- a/src/compounds/Item/Item.jsx +++ b/src/compounds/Item/Item.jsx @@ -5,6 +5,7 @@ import Image from '../../components/Image/Image' import CardBody from './CardBody' import LinkedButton from '../LinkedButton/LinkedButton' import ItemLoading from './ItemLoading' +import NextLink from '../../components/NextLink/NextLink' import './item.scss' const Item = ({ buttonLink, buttonProps, href, isLoading, item, orientation, titleLink, withButtonLink, @@ -52,22 +53,28 @@ const Item = ({ buttonLink, buttonProps, href, isLoading, item, orientation, tit ) : ( - <> - {alt} - - + + {alt} + + + )} + path={{ pathname: item.href, query: { id }}} + addClass="text-decoration-none link-hover" + /> )} )