diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json
index 21c1a59a36d030287a69a03b2610b5d2dc52231e..bb8bd932c649b6e9a08b974e7f43df0fc324d08f 100644
--- a/frontend/.eslintrc.json
+++ b/frontend/.eslintrc.json
@@ -25,6 +25,7 @@
"react/jsx-props-no-spreading": "off",
"@typescript-eslint/semi": ["error", "never"],
"react/jsx-uses-react": "off",
+ "jsx-quotes": "error",
"react/react-in-jsx-scope": "off"
}
}
diff --git a/frontend/src/components/link/link.test.tsx b/frontend/src/components/link/link.test.tsx
index 6662674008c7c35a84994ff41ee79b61d3aa85cc..0028d1af0f47f55b990bbc757c38a320f2e40499 100644
--- a/frontend/src/components/link/link.test.tsx
+++ b/frontend/src/components/link/link.test.tsx
@@ -2,13 +2,12 @@ import React from 'react'
import { render, waitFor, screen } from '@testing-library/react'
import Link from './index'
-
describe('Tests for Link component', () => {
test('External link prefixes route link with //', async () => {
- render(<Link external to='example.org' />)
+ render(<Link external to="example.org" />)
await waitFor(() => screen.getByRole('link'))
expect(screen.getByRole('link')).toHaveAttribute('href', '//example.org')
})
-})
\ No newline at end of file
+})
diff --git a/frontend/src/routes/components/sponsorGuestButtons.tsx b/frontend/src/routes/components/sponsorGuestButtons.tsx
index f0aa91e3ae3ef36e712a8a9d5996d33bef65ad08..ac290e105bee2aca2213036c3e9455552cbad579 100644
--- a/frontend/src/routes/components/sponsorGuestButtons.tsx
+++ b/frontend/src/routes/components/sponsorGuestButtons.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next'
import { useHistory } from 'react-router-dom'
interface SponsorGuestButtonsProps {
- yourGuestsActive?: boolean,
+ yourGuestsActive?: boolean
registerNewGuestActive?: boolean
}
@@ -24,41 +24,70 @@ export default function SponsorGuestButtons(props: SponsorGuestButtonsProps) {
}
return (
- <Box sx={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-evenly', marginBottom: '2rem' }}>
- <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+ <Box
+ sx={{
+ display: 'flex',
+ flexDirection: 'row',
+ justifyContent: 'space-evenly',
+ marginBottom: '2rem',
+ }}
+ >
+ <Box
+ sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}
+ >
<IconButton onClick={goToOverview}>
<PersonIcon
- fontSize='large'
+ fontSize="large"
sx={{
borderRadius: '2rem',
borderStyle: 'solid',
- borderColor: (theme: Theme) => yourGuestsActive ? theme.palette.primary.main : theme.greg.deactivatedColor,
+ borderColor: (theme: Theme) =>
+ yourGuestsActive
+ ? theme.palette.primary.main
+ : theme.greg.deactivatedColor,
fill: 'white',
- backgroundColor: (theme: Theme) => yourGuestsActive ? theme.palette.primary.main : theme.greg.deactivatedColor,
- }} />
+ backgroundColor: (theme: Theme) =>
+ yourGuestsActive
+ ? theme.palette.primary.main
+ : theme.greg.deactivatedColor,
+ }}
+ />
</IconButton>
- <Box sx={{
- typography: 'caption',
- }}>
+ <Box
+ sx={{
+ typography: 'caption',
+ }}
+ >
{t('yourGuests')}
</Box>
</Box>
- <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+ <Box
+ sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}
+ >
<IconButton onClick={goToRegister}>
<PersonAddIcon
- fontSize='large'
+ fontSize="large"
sx={{
borderRadius: '2rem',
borderStyle: 'solid',
- borderColor: (theme: Theme) => registerNewGuestActive ? theme.palette.primary.main : theme.greg.deactivatedColor,
+ borderColor: (theme: Theme) =>
+ registerNewGuestActive
+ ? theme.palette.primary.main
+ : theme.greg.deactivatedColor,
fill: 'white',
- backgroundColor: (theme: Theme) => registerNewGuestActive ? theme.palette.primary.main : theme.greg.deactivatedColor,
- }} />
+ backgroundColor: (theme: Theme) =>
+ registerNewGuestActive
+ ? theme.palette.primary.main
+ : theme.greg.deactivatedColor,
+ }}
+ />
</IconButton>
- <Box sx={{
- typography: 'caption',
- }}>
+ <Box
+ sx={{
+ typography: 'caption',
+ }}
+ >
{t('registerNewGuest')}
</Box>
</Box>
diff --git a/frontend/src/routes/sponsor/guestInfo/index.tsx b/frontend/src/routes/sponsor/guestInfo/index.tsx
index 4758303a8ec21a4aa088faba3f25aedbadf8eb21..dac10d60ca10b30a6525a340b5e5ee1e99ed9250 100644
--- a/frontend/src/routes/sponsor/guestInfo/index.tsx
+++ b/frontend/src/routes/sponsor/guestInfo/index.tsx
@@ -33,13 +33,13 @@ const RoleLine = ({ guest }: RoleLineProps) => {
key={guest.id}
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
>
- <TableCell align='left'>
+ <TableCell align="left">
{i18n.language === 'en' ? guest.role_en : guest.role_nb}
</TableCell>
- <TableCell component='th' scope='row'>
+ <TableCell component="th" scope="row">
{guest.period}
</TableCell>
- <TableCell align='left'>
+ <TableCell align="left">
{i18n.language === 'en' ? guest.ou_en : guest.ou_nb}
</TableCell>
</TableRow>
@@ -68,7 +68,7 @@ export default function GuestInfo({ guests }: GuestInfoProps) {
}}
>
<Box>
- <IconButton component={Link} to='/sponsor'>
+ <IconButton component={Link} to="/sponsor">
<ArrowBackIcon />
</IconButton>
</Box>
@@ -80,7 +80,7 @@ export default function GuestInfo({ guests }: GuestInfoProps) {
}}
>
<PersonOutlineRoundedIcon
- fontSize='large'
+ fontSize="large"
sx={{
borderRadius: '2rem',
borderStyle: 'solid',
@@ -100,41 +100,41 @@ export default function GuestInfo({ guests }: GuestInfoProps) {
</Box>
<h4>{t('sponsor.contactInfo')}</h4>
<TableContainer component={Paper}>
- <Table sx={{ minWidth: 650 }} aria-label='simple table'>
+ <Table sx={{ minWidth: 650 }} aria-label="simple table">
<TableHead sx={{ backgroundColor: 'primary.light' }}>
<TableRow>
- <TableCell align='left'>{t('sponsor.contactInfo')}</TableCell>
+ <TableCell align="left">{t('sponsor.contactInfo')}</TableCell>
<TableCell />
</TableRow>
</TableHead>
<TableBody>
<TableRow>
- <TableCell align='left'>{t('input.fullName')}</TableCell>
- <TableCell align='left'>{guestInfo.name}</TableCell>
+ <TableCell align="left">{t('input.fullName')}</TableCell>
+ <TableCell align="left">{guestInfo.name}</TableCell>
</TableRow>
<TableRow>
- <TableCell align='left'>{t('input.email')}</TableCell>
- <TableCell align='left'>{guestInfo.email}</TableCell>
+ <TableCell align="left">{t('input.email')}</TableCell>
+ <TableCell align="left">{guestInfo.email}</TableCell>
</TableRow>
<TableRow>
- <TableCell align='left'>{t('input.nationalIdNumber')}</TableCell>
- <TableCell align='left'>{guestInfo.fnr}</TableCell>
+ <TableCell align="left">{t('input.nationalIdNumber')}</TableCell>
+ <TableCell align="left">{guestInfo.fnr}</TableCell>
</TableRow>
<TableRow>
- <TableCell align='left'>{t('input.mobilePhone')}</TableCell>
- <TableCell align='left'>{guestInfo.mobile}</TableCell>
+ <TableCell align="left">{t('input.mobilePhone')}</TableCell>
+ <TableCell align="left">{guestInfo.mobile}</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
<h4>{t('sponsor.roleInfo')}</h4>
<TableContainer component={Paper}>
- <Table sx={{ minWidth: 650 }} aria-label='simple table'>
+ <Table sx={{ minWidth: 650 }} aria-label="simple table">
<TableHead sx={{ backgroundColor: 'primary.light' }}>
<TableRow>
- <TableCell align='left'>{t('common:role')}</TableCell>
- <TableCell align='left'>{t('common:period')}</TableCell>
- <TableCell align='left'>{t('common:ou')}</TableCell>
+ <TableCell align="left">{t('common:role')}</TableCell>
+ <TableCell align="left">{t('common:period')}</TableCell>
+ <TableCell align="left">{t('common:ou')}</TableCell>
</TableRow>
</TableHead>
<TableBody>