Merge pull request #231 from NDLANO/linting

Bump linting package

.eslintrc.js

@@ -3,6 +3,7 @@ module.exports = {
   env: {
     jest: true,
   },
+  ignorePatterns: ['graphqlTypes.ts'],
   rules: {
     'react/prop-types': [2, { ignore: ['children', 'className', 't'] }],
   },

package.json

@@ -61,8 +61,8 @@
     "cross-env": "^5.1.0",
     "css-loader": "^6.7.2",
     "css-minimizer-webpack-plugin": "^4.2.2",
-    "eslint": "^7.22.0",
-    "eslint-config-ndla": "^3.1.0",
+    "eslint": "^8.51.0",
+    "eslint-config-ndla": "^5.0.1",
     "jest": "^29.3.1",
     "mini-css-extract-plugin": "^2.7.2",
     "postcss": "^8.4.19",

src/client.tsx

@@ -9,9 +9,9 @@
 // import before all other imports component to make sure it is loaded before any emotion stuff.
 import './style/index.css';
 import { useState, useRef, useEffect, useLayoutEffect } from 'react';
+import ReactDOM from 'react-dom';
 import { HelmetProvider } from 'react-helmet-async';
 import { useTranslation, I18nextProvider } from 'react-i18next';
-import ReactDOM from 'react-dom';
 import { BrowserRouter } from 'react-router-dom';
 import { ApolloProvider, useApolloClient } from '@apollo/client';
 import { i18nInstance } from '@ndla/ui';
@@ -22,10 +22,10 @@ import '@fontsource/source-sans-pro/300-italic.css';
 import '@fontsource/source-sans-pro/600.css';
 import '@fontsource/source-sans-pro/700.css';
 
+import config, { getDefaultLocale } from './config';
+import App from './containers/App/App';
 import { initializeI18n, isValidLocale, supportedLanguages } from './i18n';
 import { createApolloClient, createApolloLinks } from './util/apiHelpers';
-import App from './containers/App/App';
-import config, { getDefaultLocale } from './config';
 const STORED_LANGUAGE_KEY = 'language';
 
 const paths = window.location.pathname.split('/');

src/components/Concept/ConceptBody.tsx

@@ -1,3 +1,13 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { ReactNode } from 'react';
+import { useTranslation } from 'react-i18next';
 import { gql } from '@apollo/client';
 import styled from '@emotion/styled';
 import {
@@ -7,11 +17,9 @@ import {
   NotionDialogTags,
   NotionDialogText,
 } from '@ndla/notion';
-import { ReactNode } from 'react';
-import { useTranslation } from 'react-i18next';
+import VisualElement from './VisualElement';
 import config from '../../config';
 import { GQLConceptBodyConceptFragment } from '../../graphqlTypes';
-import VisualElement from './VisualElement';
 
 const VisualElementWrapper = styled.div`
   flex-grow: 1;

src/components/Concept/ConceptPage.tsx

@@ -1,4 +1,4 @@
-/*
+/**
  * Copyright (c) 2020-present, NDLA.
  *
  * This source code is licensed under the GPLv3 license found in the
@@ -7,23 +7,23 @@
  */
 
 import { useEffect, useState } from 'react';
-import { gql, useQuery } from '@apollo/client';
-import { Remarkable } from 'remarkable';
+import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
+import { Remarkable } from 'remarkable';
+import { gql, useQuery } from '@apollo/client';
+import { Spinner } from '@ndla/icons';
 import {
   NotionDialogWrapper,
   NotionHeaderWithoutExitButton,
 } from '@ndla/notion';
 import { CreatedBy, OneColumn } from '@ndla/ui';
-import { Spinner } from '@ndla/icons';
-import { useTranslation } from 'react-i18next';
+import ConceptBody from './ConceptBody';
 import config from '../../config';
-import PostResizeMessage from '../PostResizeMessage';
 import NotFoundPage from '../../containers/NotFoundPage/NotFoundPage';
 import { GQLConceptPageQuery } from '../../graphqlTypes';
 import { ListItem } from '../../interfaces';
-import ConceptBody from './ConceptBody';
 import { LicenseBox } from '../LicenseBox';
+import PostResizeMessage from '../PostResizeMessage';
 
 interface Props {
   handleClose?: (item: ListItem | null) => void;

src/components/Concept/VisualElement.tsx

@@ -1,4 +1,4 @@
-/*
+/**
  * Copyright (c) 2020-present, NDLA.
  *
  * This source code is licensed under the GPLv3 license found in the

src/components/CopyTextButton.tsx

@@ -7,9 +7,9 @@
  */
 
 import { useEffect, useRef, useState } from 'react';
-import { copyTextToClipboard } from '@ndla/util';
-import { Code } from '@ndla/icons/editor';
 import Button from '@ndla/button';
+import { Code } from '@ndla/icons/editor';
+import { copyTextToClipboard } from '@ndla/util';
 
 interface Props {
   stringToCopy: string;

src/components/Footer.tsx

@@ -6,11 +6,10 @@
  *
  */
 
+import { useTranslation } from 'react-i18next';
 import styled from '@emotion/styled';
 import { Footer, FooterText, EditorName } from '@ndla/ui';
 
-import { useTranslation } from 'react-i18next';
-
 const StyledFooterWrapper = styled.div`
   margin-top: 52px;
 `;

src/components/LicenseBox.tsx

@@ -1,17 +1,20 @@
-/*
- *  Copyright (c) 2020-present, NDLA.
+/**
+ * Copyright (c) 2020-present, NDLA.
  *
- *  This source code is licensed under the GPLv3 license found in the
- *  LICENSE file in the root directory of this source tree.
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
  *
  */
 
-import { ReactNode } from 'react';
 import { TFunction } from 'i18next';
+import { ReactNode } from 'react';
 import { useTranslation } from 'react-i18next';
+import { gql } from '@apollo/client';
+import { StyledButton, ButtonV2 } from '@ndla/button';
+import { FileDocumentOutline } from '@ndla/icons/common';
+import { figureApa7CopyString, metaTypes } from '@ndla/licenses';
 import Modal, { ModalBody, ModalCloseButton, ModalHeader } from '@ndla/modal';
 import Tabs from '@ndla/tabs';
-import { gql } from '@apollo/client';
 import {
   MediaList,
   MediaListItem,
@@ -20,12 +23,8 @@ import {
   MediaListItemImage,
   MediaListItemMeta,
 } from '@ndla/ui';
-import { FileDocumentOutline } from '@ndla/icons/common';
-import { figureApa7CopyString, metaTypes } from '@ndla/licenses';
-import { StyledButton, ButtonV2 } from '@ndla/button';
 import CopyTextButton from './CopyTextButton';
-import { downloadUrl } from '../util/downloadHelpers';
-import formatDate from '../util/formatDate';
+import config from '../config';
 import {
   GQLConceptCopyright,
   GQLCopyright,
@@ -34,8 +33,9 @@ import {
   GQLLicenseBoxConceptFragment,
   GQLVisualElement,
 } from '../graphqlTypes';
-import config from '../config';
 import { copyrightInfoFragment } from '../queries';
+import { downloadUrl } from '../util/downloadHelpers';
+import formatDate from '../util/formatDate';
 
 interface LicenseItemEntity {
   title?: string;

src/constants.ts

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
 export const httpStatus = {
   ok: 200,
   internalServerError: 500,

src/containers/App/App.tsx

@@ -6,16 +6,15 @@
  *
  */
 
+import { Helmet } from 'react-helmet-async';
+import { useTranslation } from 'react-i18next';
 import { Outlet, Route, Routes } from 'react-router-dom';
 import styled from '@emotion/styled';
-import { Helmet } from 'react-helmet-async';
 import { PageContainer } from '@ndla/ui';
 
-import { useTranslation } from 'react-i18next';
-
-import ListingPage from '../ListingPage/ListingPage';
 import ConceptPage from '../../components/Concept';
 import { Matomo } from '../../components/Matomo';
+import ListingPage from '../ListingPage/ListingPage';
 import NotFoundPage from '../NotFoundPage/NotFoundPage';
 
 const StyledPageWrapper = styled.div`

src/containers/ListingPage/ListingContainer.tsx

@@ -6,18 +6,18 @@
  *
  */
 import { useState, useEffect, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 import { gql, useQuery } from '@apollo/client';
 
-import { useTranslation } from 'react-i18next';
 import ListingView, { ListItemType } from './ListingView';
-import useQueryParameter from '../../util/useQueryParameter';
-import { getTagsParameter } from '../../util/listingHelpers';
-import { Filter, ListItem } from '../../interfaces';
 import {
   GQLListingContainerConceptSearchQuery,
   GQLListingContainerConceptSearchQueryVariables,
   GQLListingContainerSubjectFragment,
 } from '../../graphqlTypes';
+import { Filter, ListItem } from '../../interfaces';
+import { getTagsParameter } from '../../util/listingHelpers';
+import useQueryParameter from '../../util/useQueryParameter';
 
 const PAGE_SIZE = 40;
 

src/containers/ListingPage/ListingPage.tsx

@@ -5,17 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import { gql, useQuery } from '@apollo/client';
+import qs from 'query-string';
 import { useLocation } from 'react-router-dom';
+import { gql, useQuery } from '@apollo/client';
 import { Spinner } from '@ndla/icons';
-import qs from 'query-string';
-import { mapTagsToFilters, filterTags } from '../../util/listingHelpers';
 import ListingContainer from './ListingContainer';
-import NotFoundPage from '../NotFoundPage/NotFoundPage';
 import {
   GQLListingPageQuery,
   GQLListingPageQueryVariables,
 } from '../../graphqlTypes';
+import { mapTagsToFilters, filterTags } from '../../util/listingHelpers';
+import NotFoundPage from '../NotFoundPage/NotFoundPage';
 
 interface Props {
   isOembed: boolean;

src/containers/ListingPage/ListingView.tsx

@@ -5,18 +5,23 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import { ChangeEvent, ComponentProps, useState } from 'react';
-import { Helmet } from 'react-helmet-async';
-import { useLocation } from 'react-router-dom';
-import { Remarkable } from 'remarkable';
 import Downshift, {
   StateChangeOptions,
   ControllerStateAndHelpers,
 } from 'downshift';
+import { ChangeEvent, ComponentProps, useState } from 'react';
+import { Helmet } from 'react-helmet-async';
+import { useTranslation } from 'react-i18next';
+import { useLocation } from 'react-router-dom';
+import { Remarkable } from 'remarkable';
 import { gql } from '@apollo/client';
-import styled from '@emotion/styled';
 import { css, SerializedStyles } from '@emotion/react';
+import styled from '@emotion/styled';
+import { ButtonV2 } from '@ndla/button';
 import { colors, fonts, spacing } from '@ndla/core';
+import { DropdownInput, DropdownMenu } from '@ndla/forms';
+import { Spinner } from '@ndla/icons';
+import { ChevronDown, Search } from '@ndla/icons/common';
 import ListView from '@ndla/listview';
 import {
   OneColumn,
@@ -26,23 +31,18 @@ import {
   MastheadItem,
   CreatedBy,
 } from '@ndla/ui';
-import { Spinner } from '@ndla/icons';
 // @ts-ignore
-import { DropdownInput, DropdownMenu } from '@ndla/forms';
-import { ChevronDown, Search } from '@ndla/icons/common';
-import { ButtonV2 } from '@ndla/button';
-import { useTranslation } from 'react-i18next';
-import { mapConceptToListItem } from '../../util/listingHelpers';
 import ConceptPage from '../../components/Concept/ConceptPage';
-import Footer from '../../components/Footer';
 import CopyTextButton from '../../components/CopyTextButton';
+import Footer from '../../components/Footer';
 import config from '../../config';
-import { Filter, ListItem } from '../../interfaces';
-import { supportedLanguages } from '../../i18n';
 import {
   GQLListingViewConceptFragment,
   GQLListingViewSubjectFragment,
 } from '../../graphqlTypes';
+import { supportedLanguages } from '../../i18n';
+import { Filter, ListItem } from '../../interfaces';
+import { mapConceptToListItem } from '../../util/listingHelpers';
 
 const SubjectFilterWrapper = styled.div`
   margin-top: ${spacing.large};

src/global.d.ts

@@ -1,7 +1,9 @@
-/*
+/**
  * Copyright (c) 2021-present, NDLA.
+ *
  * This source code is licensed under the GPLv3 license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
 
 /*

src/i18n.ts

@@ -1,9 +1,17 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
 import { i18n } from 'i18next';
-import nb from './phrases/phrases-nb';
-import nn from './phrases/phrases-nn';
-import en from './phrases/phrases-en';
 import { getDefaultLocale } from './config';
 import { LocaleType } from './interfaces';
+import en from './phrases/phrases-en';
+import nb from './phrases/phrases-nb';
+import nn from './phrases/phrases-nn';
 
 const appLocales = ['nb', 'en', 'nn'];
 

src/node.d.ts

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
 declare namespace NodeJS {
   interface Global {
     __SERVER__: boolean;

src/phrases/__tests__/translations-test.ts

@@ -7,9 +7,9 @@
  */
 
 import { validateTranslationFiles } from '@ndla/util';
+import en from '../phrases-en';
 import nb from '../phrases-nb';
 import nn from '../phrases-nn';
-import en from '../phrases-en';
 
 test('That all translations has all language keys', () => {
   const anyMissing = validateTranslationFiles(

src/server/contentSecurityPolicy.js

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2020-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
 const hmrPort = parseInt(process.env.PORT, 10) + 1;
 
 const scriptSrc = (() => {