♻️ refactor(atoms): update Publication props

src/components/atoms/Publication/Publication.test.tsx

@@ -1,11 +1,9 @@
 import { render, screen } from '@testing-library/react'
-import userEvent from '@testing-library/user-event'
 import { Box } from '@mui/material'
 
-import Publication from '.'
+import Publication from './index.js'
 
 vi.stubGlobal('open', vi.fn())
-const open = vi.spyOn(window, 'open')
 
 describe('Publication component', () => {
   const defaultProps = {
@@ -13,10 +11,10 @@ describe('Publication component', () => {
     authors: 'Test Author',
     title: 'Test Title',
     location: 'Test Location',
-    link: 'https://test.com',
+    href: 'https://test.com',
   }
   test('renders without crashing and displays the correct year, authors, title, and location', () => {
-    render(<Publication {...defaultProps} link={undefined} />)
+    render(<Publication {...defaultProps} href={undefined} />)
     expect(screen.getByText(defaultProps.year)).toBeInTheDocument()
     expect(screen.getByText(defaultProps.title)).toBeInTheDocument()
     expect(screen.getByText(defaultProps.authors, { exact: false })).toBeInTheDocument()
@@ -26,8 +24,10 @@ describe('Publication component', () => {
 
   test('opens the correct link when the link button is clicked', async () => {
     render(<Publication {...defaultProps} />)
-    await userEvent.click(screen.getByRole('button'))
-    expect(open).toHaveBeenCalledWith(defaultProps.link, '_blank')
+    const link = screen.getByRole('link')
+    expect(link).toHaveAttribute('href', defaultProps.href)
+    expect(link).toHaveAttribute('target', '_blank')
+    expect(link).toHaveAttribute('rel', 'noopener noreferrer')
   })
 
   test('renders correctly with a custom base component', () => {

src/components/atoms/Publication/Publication.tsx

@@ -1,36 +0,0 @@
-import React from 'react'
-import { Box, SxProps, Theme, Typography, TypographyProps } from '@mui/material'
-import { ExternalIconLink } from '..'
-
-type AwardEntryProps = {
-  year: string | number
-  title: string
-  authors: React.ReactNode
-  location: string
-  link?: string
-  titleProps?: TypographyProps
-  Component?: React.ElementType
-  sx?: SxProps<Theme>
-}
-
-const Publication = ({ Component = Box, ...props }: AwardEntryProps) => {
-  return (
-    <Component sx={{ pl: 2, ...props.sx }}>
-      <Box display="flex" gap={1} alignItems="flex-start">
-        <Typography variant="subtitle1" color="primary.main">
-          {props.year}
-        </Typography>
-        <Typography color="text.secondary">
-          {props.authors},{' '}
-          <Typography component="span" color="text.primary">
-            <b>{props.title}</b>
-          </Typography>
-          , In: {props.location}
-          {typeof props.link !== 'undefined' && <ExternalIconLink fontSize="inherit" href={props.link} sx={{ color: 'text.secondary' }} />}
-        </Typography>
-      </Box>
-    </Component>
-  )
-}
-
-export default Publication

src/components/atoms/Publication/index.tsx

@@ -1 +1,37 @@
-export { default } from './Publication'
+import React from 'react'
+import { Box, SxProps, Theme, Typography, TypographyProps } from '@mui/material'
+
+import { ExternalIconLink } from 'components/atoms/IconLinks/index.js'
+
+type AwardEntryProps = {
+  year: string | number
+  title: string
+  authors: React.ReactNode
+  location: string
+  href?: string
+  titleProps?: TypographyProps
+  Component?: React.ElementType
+  sx?: SxProps<Theme>
+}
+
+const Publication = ({ Component = Box, ...props }: AwardEntryProps) => {
+  return (
+    <Component sx={{ pl: 2, ...props.sx }}>
+      <Box display="flex" gap={1} alignItems="flex-start">
+        <Typography variant="subtitle1" color="primary.main">
+          {props.year}
+        </Typography>
+        <Typography color="text.secondary">
+          {props.authors},{' '}
+          <Typography component="span" color="text.primary">
+            <b>{props.title}</b>
+          </Typography>
+          , In: {props.location}
+          {typeof props.href !== 'undefined' && <ExternalIconLink fontSize="inherit" href={props.href} sx={{ color: 'text.secondary' }} />}
+        </Typography>
+      </Box>
+    </Component>
+  )
+}
+
+export default Publication

src/components/pages/CurriculumPage/CurriculumPage.tsx

@@ -419,7 +419,7 @@ const Curriculum = () => {
             }
             location="ROMANSY 23 - Robot Design, Dynamics and Control. CISM International Centre for Mechanical Sciences (Courses and Lectures), vol
               601. Springer, Cham."
-            link="https://doi.org/10.1007/978-3-030-58380-4_7"
+            href="https://doi.org/10.1007/978-3-030-58380-4_7"
           />
         </Box>