From 769f34d6210f848f0641e0c43b407c2be5327dbe Mon Sep 17 00:00:00 2001
From: Tore Brede <Tore.Brede@uib.no>
Date: Sun, 19 Sep 2021 18:45:15 +0200
Subject: [PATCH] Fixing and temporarily ignoring some eslint warnings
---
frontend/src/appConfig.ts | 4 +-
.../src/components/dropdownmenu/index.tsx | 51 ++++++++++++++-----
frontend/src/components/logobars/LogoBar.tsx | 5 +-
frontend/src/components/logobars/UiB.tsx | 4 --
frontend/src/components/logobars/UiO.tsx | 6 +--
frontend/src/routes/components/footer.tsx | 2 +-
6 files changed, 44 insertions(+), 28 deletions(-)
diff --git a/frontend/src/appConfig.ts b/frontend/src/appConfig.ts
index d387c508..84880d70 100644
--- a/frontend/src/appConfig.ts
+++ b/frontend/src/appConfig.ts
@@ -17,7 +17,7 @@ export const appVersion: string = process.env.REACT_APP_VERSION as string
export const appName: string = process.env.REACT_APP_NAME as string
/* Institution */
-export const appInst: string = env.REACT_APP_INST as string;
+export const appInst: string = env.REACT_APP_INST as string
/* Theming */
export const appTheme: string = env.REACT_APP_THEME
@@ -26,7 +26,7 @@ export const appTheme: string = env.REACT_APP_THEME
/* Show warning in the footer about this being a staging/test system */
export const appStagingWarning: boolean =
- env.REACT_APP_STAGING_WARNING === 'true';
+ env.REACT_APP_STAGING_WARNING === 'true'
/* Footer content */
export const appTechnicalSupportLink: string = env.REACT_APP_SUPPORT_URL as string
diff --git a/frontend/src/components/dropdownmenu/index.tsx b/frontend/src/components/dropdownmenu/index.tsx
index 9feb7fed..fbdbd36f 100644
--- a/frontend/src/components/dropdownmenu/index.tsx
+++ b/frontend/src/components/dropdownmenu/index.tsx
@@ -69,14 +69,25 @@ function DropDown(props: IProps) {
}
return (
+
<DropDownMenu
aria-haspopup='true'
aria-expanded={open}
+ /* eslint-disable-next-line react/jsx-no-bind */
onFocus={openMenu}
tabIndex={0}
>
<div>
- <div onClick={openMenu}>
+ <div role='button'
+ onKeyDown={(event) => {
+ if (event.key === 'Enter' || event.key === ' ') {
+ openMenu()
+ }
+ }}
+ onClick={openMenu}
+ tabIndex={0}
+ >
+ {/* eslint-disable-next-line */}
{placeholder
? placeholder
: getValueName(value, options).toLowerCase()}
@@ -85,19 +96,25 @@ function DropDown(props: IProps) {
<div>
{open && (
<DropDownList>
- {options.map((option, index) => {
- return (
- <li
- onClick={(
- event: React.MouseEvent<HTMLElement, MouseEvent>,
- ) => {
- handleClick(option)
- }}
- >
- <p>{option.name}</p>
- </li>
- )
- })}
+ {options.map((option) => (
+ // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+ <li
+ onKeyDown={(event) => {
+ if (event.key === 'Enter' || event.key === ' ') {
+ openMenu()
+ }
+ }}
+
+ onClick={(
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
+ event: React.MouseEvent<HTMLElement, MouseEvent>,
+ ) => {
+ handleClick(option)
+ }}
+ >
+ <p>{option.name}</p>
+ </li>
+ ))}
</DropDownList>
)}
</div>
@@ -105,4 +122,10 @@ function DropDown(props: IProps) {
)
}
+
+DropDown.defaultProps =
+ {
+ placeholder: undefined,
+ }
+
export default DropDown
diff --git a/frontend/src/components/logobars/LogoBar.tsx b/frontend/src/components/logobars/LogoBar.tsx
index f7937948..2af512f3 100644
--- a/frontend/src/components/logobars/LogoBar.tsx
+++ b/frontend/src/components/logobars/LogoBar.tsx
@@ -1,10 +1,11 @@
-import { appInst } from 'appConfig'
+import React from 'react'
+import { appTheme } from 'appConfig'
import UiOLogoBar from './UiO'
import UiBLogoBar from './UiB'
function LogoBar() {
- switch (appInst) {
+ switch (appTheme) {
case 'uio':
return <UiOLogoBar />
case 'uib':
diff --git a/frontend/src/components/logobars/UiB.tsx b/frontend/src/components/logobars/UiB.tsx
index 0475fa93..059ac0d0 100644
--- a/frontend/src/components/logobars/UiB.tsx
+++ b/frontend/src/components/logobars/UiB.tsx
@@ -1,8 +1,6 @@
import React from 'react'
import styled from 'styled-components/macro'
-import { useTranslation } from 'react-i18next'
-
const LogoBarWrapper = styled.div`
background-color: ${(props) => props.theme.colors.secondary});
@@ -15,8 +13,6 @@ const LogoBar = styled.div`
`
function UiBLogoBar() {
- const { i18n, t } = useTranslation(['common', 'footer'])
-
return (
<LogoBarWrapper>
<LogoBar>
diff --git a/frontend/src/components/logobars/UiO.tsx b/frontend/src/components/logobars/UiO.tsx
index a95cb7a4..8796ac58 100644
--- a/frontend/src/components/logobars/UiO.tsx
+++ b/frontend/src/components/logobars/UiO.tsx
@@ -10,10 +10,6 @@ const LogoBarWrapper = styled.div`
background-color: ${({ theme }) => theme.page.headerBackgroundColor};
`
-const LogoBar = styled.div`
- margin: 0 auto;
-`
-
type Language = {
language: string
}
@@ -25,7 +21,7 @@ const Logo = styled.div<Language>`
`
function UiOLogoBar() {
- const { i18n, t } = useTranslation(['common', 'footer'])
+ const { i18n } = useTranslation(['common', 'footer'])
return (
<LogoBarWrapper>
diff --git a/frontend/src/routes/components/footer.tsx b/frontend/src/routes/components/footer.tsx
index ee2b9535..f6821a56 100644
--- a/frontend/src/routes/components/footer.tsx
+++ b/frontend/src/routes/components/footer.tsx
@@ -44,7 +44,7 @@ const ContentContainer = styled.div`
`
const Footer: React.FunctionComponent = () => {
- const { i18n, t } = useTranslation(['common', 'footer'])
+ const { t } = useTranslation(['common', 'footer'])
return (
<>
--
GitLab