diff --git a/.github/workflows/eslint.yml b/.github/workflows/eslint.yml index 4dc838d4..ec4dbab3 100644 --- a/.github/workflows/eslint.yml +++ b/.github/workflows/eslint.yml @@ -7,20 +7,20 @@ # More details at https://github.com/eslint/eslint # and https://eslint.org -name: ESLint +name: workflow on: push: - branches: [ "master" ] + branches: ["master"] pull_request: # The branches below must be a subset of the branches above - branches: [ "master" ] + branches: ["master"] schedule: - - cron: '35 15 * * 3' + - cron: "35 15 * * 3" jobs: eslint: - name: Run eslint scanning + name: Eslint runs-on: ubuntu-latest permissions: contents: read @@ -30,21 +30,27 @@ jobs: - name: Checkout code uses: actions/checkout@v3 - - name: Install ESLint - run: | - npm install eslint@7.23.0 - npm install @microsoft/eslint-formatter-sarif@2.1.7 + - name: Install Packages + run: yarn - name: Run ESLint - run: npx eslint . - --config .eslintrc.js - --ext .js,.jsx,.ts,.tsx - --format @microsoft/eslint-formatter-sarif - --output-file eslint-results.sarif - continue-on-error: true - - - name: Upload analysis results to GitHub - uses: github/codeql-action/upload-sarif@v2 - with: - sarif_file: eslint-results.sarif - wait-for-processing: true + run: yarn lint + continue-on-error: false + + jest: + name: Jest + runs-on: ubuntu-latest + permissions: + contents: read + security-events: write + actions: read + steps: + - name: Checkout code + uses: actions/checkout@v3 + + - name: Install Packages + run: yarn + + - name: Run Jest + run: yarn jest + continue-on-error: false diff --git a/package.json b/package.json index e4807749..3c5282ca 100644 --- a/package.json +++ b/package.json @@ -48,14 +48,14 @@ "babel-loader": "^8.2.2", "clsx": "^1.0.4", "css-loader": "^5.2.0", - "eslint": "^7.23.0", + "eslint": "7.32.0", "eslint-config-prettier": "^8.8.0", "eslint-import-resolver-alias": "^1.1.2", "eslint-plugin-import": "^2.27.5", "eslint-plugin-jest": "^27.2.3", "eslint-plugin-jsx-a11y": "^6.7.1", "eslint-plugin-prettier": "^5.0.0", - "eslint-plugin-react": "^7.23.1", + "eslint-plugin-react": "^7.33.0", "eslint-plugin-react-hooks": "^4.6.0", "file-loader": "^6.2.0", "identity-obj-proxy": "^3.0.0", @@ -69,7 +69,7 @@ "react": "^18.0.0", "react-dom": "^18.0.0", "react-fast-compare": "^3.2.0", - "react-swipeable": "6.0.1", + "react-swipeable": "7.0.1", "remove-files-webpack-plugin": "^1.4.5", "resize-observer-polyfill": "^1.5.0", "sass": "^1.35.2", diff --git a/src/Item.js b/src/Item.js index ae74e2b5..f4e18d12 100644 --- a/src/Item.js +++ b/src/Item.js @@ -1,17 +1,17 @@ -import React from 'react'; -import { bool, func, string } from 'prop-types'; +import React from "react"; +import { bool, func, string } from "prop-types"; const defaultProps = { - description: '', - fullscreen: '', + description: "", + fullscreen: "", isFullscreen: false, - originalAlt: '', - originalHeight: '', - originalWidth: '', - originalTitle: '', - sizes: '', - srcSet: '', - loading: 'eager', + originalAlt: "", + originalHeight: "", + originalWidth: "", + originalTitle: "", + sizes: "", + srcSet: "", + loading: "eager", }; const Item = React.memo((props) => { @@ -29,8 +29,8 @@ const Item = React.memo((props) => { sizes, srcSet, loading, - } = {...defaultProps, ...props}; - const itemSrc = isFullscreen ? (fullscreen || original) : original; + } = { ...defaultProps, ...props }; + const itemSrc = isFullscreen ? fullscreen || original : original; return ( @@ -43,22 +43,18 @@ const Item = React.memo((props) => { width={originalWidth} sizes={sizes} title={originalTitle} - onLoad={event => handleImageLoaded(event, original)} + onLoad={(event) => handleImageLoaded(event, original)} onError={onImageError} loading={loading} /> - { - description && ( - - {description} - - ) - } + {description && ( + {description} + )} ); }); -Item.displayName = 'Item'; +Item.displayName = "Item"; Item.propTypes = { description: string, diff --git a/src/SVG.js b/src/SVG.js index ba399a7c..58aa9bcb 100644 --- a/src/SVG.js +++ b/src/SVG.js @@ -1,10 +1,14 @@ -import React from 'react'; -import { number, oneOf, string } from 'prop-types'; +import React from "react"; +import { number, oneOf, string } from "prop-types"; const left = ; const right = ; -const maximize = ; -const minimize = ; +const maximize = ( + +); +const minimize = ( + +); const play = ; const pause = ( @@ -24,15 +28,11 @@ const iconMapper = { const defaultProps = { strokeWidth: 1, - viewBox: '0 0 24 24', + viewBox: "0 0 24 24", }; const SVG = (props) => { - const { - strokeWidth, - viewBox, - icon, - } = {...defaultProps, ...props}; + const { strokeWidth, viewBox, icon } = { ...defaultProps, ...props }; return ( { SVG.propTypes = { strokeWidth: number, viewBox: string, - icon: oneOf([ - 'left', - 'right', - 'maximize', - 'minimize', - 'play', - 'pause', - ]).isRequired, + icon: oneOf(["left", "right", "maximize", "minimize", "play", "pause"]) + .isRequired, }; export default SVG; diff --git a/src/SwipeWrapper.js b/src/SwipeWrapper.js index 1b2ddc31..f0c50cec 100644 --- a/src/SwipeWrapper.js +++ b/src/SwipeWrapper.js @@ -1,27 +1,19 @@ -import React from 'react'; -import { - string, - node, - number, - func, -} from 'prop-types'; -import { useSwipeable } from 'react-swipeable'; +import React from "react"; +import { string, node, number, func } from "prop-types"; +import { useSwipeable } from "react-swipeable"; const defaultProps = { - className: '', + className: "", delta: 0, onSwiping: () => {}, onSwiped: () => {}, }; const SwipeWrapper = (props) => { - const { - children, - className, - delta, - onSwiping, - onSwiped, - } = {...defaultProps, ...props}; + const { children, className, delta, onSwiping, onSwiped } = { + ...defaultProps, + ...props, + }; const swipeHandlers = useSwipeable({ delta, onSwiping, diff --git a/src/controls/Fullscreen.js b/src/controls/Fullscreen.js index 4584bc84..3fde6e45 100644 --- a/src/controls/Fullscreen.js +++ b/src/controls/Fullscreen.js @@ -1,11 +1,8 @@ -import React from 'react'; -import { bool, func } from 'prop-types'; -import SVG from 'src/SVG'; +import React from "react"; +import { bool, func } from "prop-types"; +import SVG from "src/SVG"; -const Fullscreen = React.memo(({ - isFullscreen, - onClick, -}) => { +const Fullscreen = React.memo(({ isFullscreen, onClick }) => { return ( ); }); -Fullscreen.displayName = 'Fullscreen'; +Fullscreen.displayName = "Fullscreen"; Fullscreen.propTypes = { isFullscreen: bool.isRequired, onClick: func.isRequired, }; - export default Fullscreen; diff --git a/src/controls/LeftNav.js b/src/controls/LeftNav.js index f6a6c2da..a2a864c6 100644 --- a/src/controls/LeftNav.js +++ b/src/controls/LeftNav.js @@ -1,11 +1,8 @@ -import React from 'react'; -import { bool, func } from 'prop-types'; -import SVG from 'src/SVG'; +import React from "react"; +import { bool, func } from "prop-types"; +import SVG from "src/SVG"; -const LeftNav = React.memo(({ - disabled, - onClick, -}) => { +const LeftNav = React.memo(({ disabled, onClick }) => { return (