Merge pull request #23 from MoTrPAC/main

Update dev branch with main branch's changes

.circleci/config.yml

@@ -1,17 +1,25 @@
 version: 2.1
 orbs:
-  node: circleci/node@1.1.6
+  node: circleci/node@5.2.0
 jobs:
   build-and-test:
-    executor:
-      name: node/default
+    executor: node/default
     steps:
       - checkout
-      - node/with-cache:
-          steps:
-            - run: yarn install
-            - run: yarn sass
-            - run: yarn test
+      - node/install-packages:
+          pkg-manager: yarn
+      - run:
+          name: Install dependencies
+          command: yarn install
+      - run:
+          name: Build CSS
+          command: yarn sass
+      - run:
+          name: Run tests
+          command: yarn test
+      - run:
+          name: Build app
+          command: yarn build
 workflows:
   build-and-test:
     jobs:

.eslintrc.js

@@ -3,7 +3,7 @@ module.exports = {
     "react-app",
     "react-app/jest",
     "plugin:prettier/recommended",
-    "prettier/react"
+    "prettier"
   ],
   "plugins": [
     "prettier"

package.json

@@ -3,35 +3,37 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@reduxjs/toolkit": "^1.1.0",
-    "@testing-library/jest-dom": "^4.2.4",
-    "@testing-library/react": "^9.3.2",
-    "@testing-library/user-event": "^7.1.2",
-    "axios": "^0.21.1",
+    "@reduxjs/toolkit": "^2.2.2",
+    "@testing-library/jest-dom": "^6.4.2",
+    "@testing-library/react": "^12.1.5",
+    "@testing-library/user-event": "^14.5.2",
+    "autoprefixer": "^10.4.19",
+    "axios": "^0.28.1",
     "bootstrap": "4.6.0",
-    "from-exponential": "^1.0.0",
-    "ga-gtag": "^1.1.0",
-    "jquery": "^3.5.1",
-    "popper.js": "1.14.3",
-    "prop-types": "15.7.2",
-    "react": "^17.0.1",
+    "from-exponential": "^1.1.1",
+    "ga-gtag": "^1.2.0",
+    "jquery": "^3.7.1",
+    "popper.js": "1.16.1",
+    "prop-types": "15.8.1",
+    "react": "^17.0.2",
     "react-autosuggest": "^10.1.0",
-    "react-dom": "^17.0.1",
-    "react-redux": "^7.1.3",
-    "react-router-dom": "^5.1.2",
-    "react-scripts": "4.0.1",
-    "redux": "^4.0.1",
-    "redux-thunk": "^2.3.0",
-    "victory": "^35.4.0"
+    "react-dom": "^17.0.2",
+    "react-redux": "^7.2.9",
+    "react-router-dom": "^5.3.4",
+    "react-scripts": "^5.0.1",
+    "redux": "^4.2.1",
+    "redux-thunk": "^3.1.0",
+    "victory": "^37.0.1"
   },
   "devDependencies": {
-    "eslint-config-prettier": "7.2.0",
-    "eslint-plugin-prettier": "^3.1.4",
-    "prettier": "2.2.1",
-    "redux-devtools-extension": "^2.13.8",
-    "sass": "^1.25.0",
-    "stylelint": "^13.2.0",
-    "stylelint-config-recommended": "^3.0.0"
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "prettier": "^3.2.5",
+    "redux-devtools-extension": "^2.13.9",
+    "sass": "^1.72.0",
+    "stylelint": "^16.3.1",
+    "stylelint-config-recommended": "^14.0.0"
   },
   "scripts": {
     "start": "react-scripts start",
@@ -44,6 +46,9 @@
   "eslintConfig": {
     "extends": "react-app"
   },
+  "resolutions": {
+    "autoprefixer": "10.4.5"
+  },
   "browserslist": {
     "production": [
       ">0.2%",

src/app/__test__/App.test.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event'
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-redux';
 import configureStore from '../configureStore';
 import App from '../App';
@@ -12,7 +12,8 @@ const store = configureStore();
 jest.mock('ga-gtag');
 
 describe('ExtraMeta', () => {
-  test('full app rendering/navigating', () => {
+  test('full app rendering/navigating', async () => {
+    const user = userEvent.setup();
     render (
       <Provider store={store}>
         <App />
@@ -23,7 +24,7 @@ describe('ExtraMeta', () => {
     expect(screen.getByText(/Meta-analysis of published exercise transcriptome data/i)).toBeInTheDocument();
 
     const leftClick = { button: 0 };
-    userEvent.click(screen.getByText(/about/i), leftClick);
+    await user.click(screen.getByText(/about/i), leftClick);
 
     // check that the content changed to the new page
     expect(screen.getByText(/About this site/i)).toBeInTheDocument();

src/app/configureStore.js

@@ -1,13 +1,13 @@
 import { applyMiddleware, createStore } from 'redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { composeWithDevTools } from 'redux-devtools-extension';
 
 import monitorReducersEnhancer from './enhancers/monitorReducer';
 import loggerMiddleware from './middleware/logger';
 import rootReducer from './reducers';
 
 export default function configureStore(preloadedState) {
-  const middlewares = process.env.NODE_ENV !== 'production' ? [loggerMiddleware, thunkMiddleware] : [thunkMiddleware];
+  const middlewares = process.env.NODE_ENV !== 'production' ? [loggerMiddleware, thunk] : [thunk];
   const middlewareEnhancer = applyMiddleware(...middlewares);
 
   const enhancers = [middlewareEnhancer, monitorReducersEnhancer];

src/components/google-analytics.jsx

@@ -12,10 +12,10 @@ const trackingId = () => {
   let analyticsTrackerHostname = document.location.hostname;
 
   // match hostname to google analytics domain identified for tracker
-  if (/^(www\.)?extrameta.org/.test(analyticsTrackerHostname)) {
+  if (/^(www\.)?extrameta\.org\//.test(analyticsTrackerHostname)) {
     // production app
     analyticsTrackerHostname = 'extrameta.org';
-  } else if (/^test.extra-meta.org/.test(analyticsTrackerHostname)) {
+  } else if (/^test\.extra-meta\.org\//.test(analyticsTrackerHostname)) {
     // test app
     analyticsTrackerHostname = 'test.extra-meta.org';
   } else {

src/features/about/__test__/about.test.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-redux';
 import { BrowserRouter as Router } from 'react-router-dom';
 import configureStore from '../../../app/configureStore';

src/features/analysis/__test__/analysis.test.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-redux';
 import { BrowserRouter as Router } from 'react-router-dom';
 import configureStore from '../../../app/configureStore';

src/index.js

@@ -1,7 +1,9 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
+// eslint-disable-next-line
 import $ from 'jquery';
+// eslint-disable-next-line
 import Popper from 'popper.js';
 import 'bootstrap/dist/js/bootstrap.bundle.min';
 import { install } from 'ga-gtag';

src/lib/__test__/auto-suggest.test.js

@@ -1,4 +1,4 @@
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import getSuggestions from '../auto-suggest';
 
 const mockList = [

src/lib/__test__/round-numbers.test.js

@@ -1,4 +1,4 @@
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import roundNumbers from '../round-numbers';
 
 describe('Rounding numbers', () => {

src/sass/_base.scss

@@ -167,12 +167,12 @@ html, body {
 
 .cloud {
   background: #0c67a8;
-  background: -moz-linear-gradient(top,  #fff 5%, #f1f1f1 100%);
+  background: -moz-linear-gradient('to bottom',  #fff 5%, #f1f1f1 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(5%,#fff), color-stop(100%,#f1f1f1));
-  background: -webkit-linear-gradient(top,  #fff 5%,#f1f1f1 100%);
-  background: -o-linear-gradient(top,  #fff 5%,#f1f1f1 100%);
-  background: -ms-linear-gradient(top,  #fff 5%,#f1f1f1 100%);
-  background: linear-gradient(top,  #fff 5%,#f1f1f1 100%);
+  background: -webkit-linear-gradient('to bottom',  #fff 5%,#f1f1f1 100%);
+  background: -o-linear-gradient('to bottom',  #fff 5%,#f1f1f1 100%);
+  background: -ms-linear-gradient('to bottom',  #fff 5%,#f1f1f1 100%);
+  background: linear-gradient('to bottom',  #fff 5%,#f1f1f1 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#f1f1f1',GradientType=0 );
 
   -webkit-border-radius: 100px;

src/setupTests.js

@@ -2,4 +2,4 @@
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';