Merge branch 'master' of github.com:neurostuff/neurostore into enh/ad…

…v_search
neurostuff · Nov 11, 2024 · 16e19d9 · 16e19d9
2 parents f675e09 + efdf3d9
commit 16e19d9
Show file tree

Hide file tree

Showing 103 changed files with 12,894 additions and 39,405 deletions.
diff --git a/.github/workflows/workflow.yml b/.github/workflows/workflow.yml
@@ -332,9 +332,9 @@ jobs:
         AUTH0_BASE_URL: ${{ secrets.AUTH0_BASE_URL }}
         AUTH0_ACCESS_TOKEN_URL: ${{ secrets.AUTH0_ACCESS_TOKEN_URL }}
         AUTH0_AUTH_URL: ${{ secrets.AUTH0_AUTH_URL }}
-        REACT_APP_AUTH0_CLIENT_ID: ${{ secrets.REACT_APP_AUTH0_CLIENT_ID }}
-        REACT_APP_AUTH0_DOMAIN: ${{ secrets.REACT_APP_AUTH0_DOMAIN }}
-        REACT_APP_AUTH0_CLIENT_SECRET: ${{ secrets.REACT_APP_AUTH0_CLIENT_SECRET }}
+        VITE_APP_AUTH0_CLIENT_ID: ${{ secrets.VITE_APP_AUTH0_CLIENT_ID }}
+        VITE_APP_AUTH0_DOMAIN: ${{ secrets.VITE_APP_AUTH0_DOMAIN }}
+        VITE_APP_AUTH0_CLIENT_SECRET: ${{ secrets.VITE_APP_AUTH0_CLIENT_SECRET }}
       run: |
         cp neurosynth-frontend/.env.example neurosynth-frontend/.env.dev && \
         docker compose run \
@@ -344,14 +344,14 @@ jobs:
           -e "AUTH0_BASE_URL=${AUTH0_BASE_URL}" \
           -e "AUTH0_ACCESS_TOKEN_URL=${AUTH0_ACCESS_TOKEN_URL}" \
           -e "AUTH0_AUTH_URL=${AUTH0_AUTH_URL}" \
-          -e "REACT_APP_AUTH0_DOMAIN=${REACT_APP_AUTH0_DOMAIN}" \
-          -e "REACT_APP_AUTH0_CLIENT_ID=${REACT_APP_AUTH0_CLIENT_ID}" \
-          -e "REACT_APP_AUTH0_AUDIENCE=localhost" \
-          -e "REACT_APP_AUTH0_CLIENT_SECRET=${REACT_APP_AUTH0_CLIENT_SECRET}" \
-          -e "REACT_APP_ENV=DEV" \
-          -e "REACT_APP_NEUROSTORE_API_DOMAIN=http://localhost/api" \
+          -e "VITE_APP_AUTH0_DOMAIN=${VITE_APP_AUTH0_DOMAIN}" \
+          -e "VITE_APP_AUTH0_CLIENT_ID=${VITE_APP_AUTH0_CLIENT_ID}" \
+          -e "VITE_APP_AUTH0_AUDIENCE=https://neurostore.xyz/api/" \
+          -e "VITE_APP_AUTH0_CLIENT_SECRET=${VITE_APP_AUTH0_CLIENT_SECRET}" \
+          -e "VITE_APP_ENV=STAGING" \
+          -e "VITE_APP_NEUROSTORE_API_DOMAIN=http://localhost/api" \
           -e "CI=true" \
-          -e "REACT_APP_NEUROSYNTH_API_DOMAIN=http://localhost:81/api" \
+          -e "VITE_APP_NEUROSYNTH_API_DOMAIN=http://localhost:81/api" \
           --rm -w /compose/neurosynth-frontend \
           compose \
           bash -c "cd /compose/neurosynth-frontend && \
@@ -475,20 +475,22 @@ jobs:
       name: Frontend Cypress E2E Tests
       uses: cypress-io/github-action@v6
       env:
-        CYPRESS_auth0ClientId: ${{ secrets.REACT_APP_AUTH0_CLIENT_ID }}
-        CYPRESS_auth0ClientSecret: ${{ secrets.REACT_APP_AUTH0_CLIENT_SECRET }}
-        CYPRESS_auth0Domain: ${{ secrets.REACT_APP_AUTH0_DOMAIN }}
-        CYPRESS_auth0Audience: localhost
-        REACT_APP_AUTH0_AUDIENCE: localhost
-        REACT_APP_AUTH0_CLIENT_ID: ${{ secrets.REACT_APP_AUTH0_CLIENT_ID }}
-        REACT_APP_AUTH0_DOMAIN: ${{ secrets.REACT_APP_AUTH0_DOMAIN }}
-        REACT_APP_AUTH0_CLIENT_SECRET: ${{ secrets.REACT_APP_AUTH0_CLIENT_SECRET }}
-        REACT_APP_ENV: DEV
-        REACT_APP_NEUROSTORE_API_DOMAIN: ${{ secrets.REACT_APP_NEUROSTORE_API_DOMAIN }}
-        REACT_APP_NEUROSYNTH_API_DOMAIN: ${{ secrets.REACT_APP_NEUROSYNTH_API_DOMAIN }}
+        CYPRESS_auth0ClientId: ${{ secrets.VITE_APP_AUTH0_CLIENT_ID }}
+        CYPRESS_auth0ClientSecret: ${{ secrets.VITE_APP_AUTH0_CLIENT_SECRET }}
+        CYPRESS_: ${{ secrets.VITE_APP_AUTH0_DOMAIN }}
+        CYPRESS_auth0Audience: https://neurostore.xyz/api/
+        CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+        VITE_APP_AUTH0_AUDIENCE: https://neurostore.xyz/api/
+        VITE_APP_AUTH0_CLIENT_ID: ${{ secrets.VITE_APP_AUTH0_CLIENT_ID }}
+        VITE_APP_AUTH0_DOMAIN: ${{ secrets.VITE_APP_AUTH0_DOMAIN }}
+        VITE_APP_AUTH0_CLIENT_SECRET: ${{ secrets.VITE_APP_AUTH0_CLIENT_SECRET }}
+        VITE_APP_ENV: STAGING
+        VITE_APP_NEUROSTORE_API_DOMAIN: ${{ secrets.VITE_APP_NEUROSTORE_API_DOMAIN }}
+        VITE_APP_NEUROSYNTH_API_DOMAIN: ${{ secrets.VITE_APP_NEUROSYNTH_API_DOMAIN }}
       with:
-        build: npm run build:dev
-        start: npm run start-ci:dev
+        build: npm run build:staging
+        record: true
+        start: npm run serve-build
         browser: chrome
         wait-on: http://localhost:3000
         working-directory: /home/runner/work/neurostore/neurostore/compose/neurosynth-frontend
diff --git a/.gitignore b/.gitignore
@@ -102,7 +102,6 @@ ENV/
 
 # Spyder project settings
 .spyderproject
-.vscode
 
 # Rope project settings
 .ropeproject

diff --git a/compose/neurosynth-frontend/.babelrc b/compose/neurosynth-frontend/.babelrc
diff --git a/compose/neurosynth-frontend/.env.example b/compose/neurosynth-frontend/.env.example
@@ -1,8 +1,8 @@
-REACT_APP_AUTH0_DOMAIN=dev-mui7zm42.us.auth0.com
-REACT_APP_AUTH0_CLIENT_ID=YOUR_NEUROSTORE_API_AUTH0_CLIENT_ID
-REACT_APP_AUTH0_CLIENT_SECRET=YOUR_AUTH0_CLIENT_SECRET
-REACT_APP_AUTH0_AUDIENCE=localhost
-REACT_APP_NEUROSTORE_API_DOMAIN=http://localhost/api
-REACT_APP_NEUROSYNTH_API_DOMAIN=http://localhost:81/api
-REACT_APP_ENV=DEV
-REACT_APP_PUBMED_API_KEY=YOUR_PUBMED_KEY
+VITE_APP_AUTH0_DOMAIN=dev-mui7zm42.us.auth0.com
+VITE_APP_AUTH0_CLIENT_ID=YOUR_NEUROSTORE_API_AUTH0_CLIENT_ID
+VITE_APP_AUTH0_CLIENT_SECRET=YOUR_AUTH0_CLIENT_SECRET
+VITE_APP_AUTH0_AUDIENCE=localhost
+VITE_APP_NEUROSTORE_API_DOMAIN=http://localhost/api
+VITE_APP_NEUROSYNTH_API_DOMAIN=http://localhost:81/api
+VITE_APP_ENV=DEV
+VITE_APP_PUBMED_API_KEY=YOUR_PUBMED_KEY
diff --git a/compose/neurosynth-frontend/.eslintrc b/compose/neurosynth-frontend/.eslintrc
diff --git a/compose/neurosynth-frontend/.prettierrc.json b/compose/neurosynth-frontend/.prettierrc.json
@@ -0,0 +1,8 @@
+{
+    "singleQuote": true,
+    "semi": true,
+    "trailingComma": "es5",
+    "tabWidth": 4,
+    "tabs": false,
+    "printWidth": 120
+}
diff --git a/compose/neurosynth-frontend/__mocks__/@auth0/auth0-react.ts b/compose/neurosynth-frontend/__mocks__/@auth0/auth0-react.ts
@@ -0,0 +1,16 @@
+import { vi } from 'vitest';
+
+const useAuth0 = vi.fn().mockReturnValue({
+    getAccessTokenSilently: vi.fn().mockImplementation(() => {
+        return Promise.resolve('test-token');
+    }),
+    loginWithPopup: vi.fn(),
+    logout: vi.fn(),
+    isAuthenticated: false,
+    isLoading: false,
+    user: {
+        sub: 'some-github-user',
+    },
+});
+
+export { useAuth0 };
diff --git a/compose/neurosynth-frontend/__mocks__/notistack.ts b/compose/neurosynth-frontend/__mocks__/notistack.ts
@@ -0,0 +1,7 @@
+import { vi } from 'vitest';
+
+const useSnackbar = vi.fn().mockReturnValue({
+    enqueueSnackbar: vi.fn(),
+});
+
+export { useSnackbar };
diff --git a/compose/neurosynth-frontend/__mocks__/react-query.ts b/compose/neurosynth-frontend/__mocks__/react-query.ts
@@ -0,0 +1,13 @@
+import { vi } from 'vitest';
+
+const useQueryClient = vi.fn().mockReturnValue({
+    invalidateQueries: vi.fn(),
+});
+
+const useQuery = vi.fn().mockReturnValue({
+    data: null,
+    isLoading: false,
+    isError: false,
+});
+
+export { useQueryClient, useQuery };
diff --git a/...ontend/src/__mocks__/react-router-dom.tsx → ...h-frontend/__mocks__/react-router-dom.tsx b/...ontend/src/__mocks__/react-router-dom.tsx → ...h-frontend/__mocks__/react-router-dom.tsx
@@ -1,12 +1,13 @@
+import { vi } from 'vitest';
 import { NavigateProps } from 'react-router-dom';
 
-const useParams = jest.fn().mockReturnValue({
+const useParams = vi.fn().mockReturnValue({
     projectId: 'test-project-id',
 });
 
-const useNavigate = jest.fn().mockReturnValue(jest.fn());
+const useNavigate = vi.fn().mockReturnValue(vi.fn());
 
-const useLocation = jest.fn().mockReturnValue({
+const useLocation = vi.fn().mockReturnValue({
     location: {
         search: '',
     },

diff --git a/compose/neurosynth-frontend/cypress.config.ts b/compose/neurosynth-frontend/cypress.config.ts
@@ -24,11 +24,11 @@ export default defineConfig({
     env: {
         auth0Username: '[email protected]',
         auth0Password: 'password',
-        auth0ClientId: process.env.REACT_APP_AUTH0_CLIENT_ID,
-        auth0ClientSecret: process.env.REACT_APP_AUTH0_CLIENT_SECRET,
-        auth0Domain: process.env.REACT_APP_AUTH0_DOMAIN,
-        auth0Audience: process.env.REACT_APP_AUTH0_AUDIENCE,
-        neurostoreAPIBaseURL: process.env.REACT_APP_NEUROSTORE_API_DOMAIN,
-        neurosynthAPIBaseURL: process.env.REACT_APP_NEUROSYNTH_API_DOMAIN,
+        auth0ClientId: process.env.VITE_APP_AUTH0_CLIENT_ID,
+        auth0ClientSecret: process.env.VITE_APP_AUTH0_CLIENT_SECRET,
+        auth0Domain: process.env.VITE_APP_AUTH0_DOMAIN,
+        auth0Audience: process.env.VITE_APP_AUTH0_AUDIENCE,
+        neurostoreAPIBaseURL: process.env.VITE_APP_NEUROSTORE_API_DOMAIN,
+        neurosynthAPIBaseURL: process.env.VITE_APP_NEUROSYNTH_API_DOMAIN,
     },
 });
diff --git a/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx b/compose/neurosynth-frontend/cypress/e2e/workflows/Extraction/ExtractionTable.cy.tsx
@@ -154,24 +154,30 @@ describe('ExtractionTable', () => {
             });
         });
 
-        it('should remove the filter if the delete button is clicked', () => {
+        it.only('should remove the filter if the delete button is clicked', () => {
+            let studysetYear = '';
             // ARRANGE
             cy.wait('@studysetFixture').then((studysetFixture) => {
                 const studyset = studysetFixture?.response?.body as StudysetReturn;
                 const studysetStudies = studyset.studies as StudyReturn[];
+                studysetYear = studysetStudies[0].year?.toString() || "";
                 cy.get('input').eq(0).click();
                 cy.get(`input`)
                     .eq(0)
                     .type(studysetStudies[0].year?.toString() || '');
             });
             cy.get('tbody > tr').should('have.length', 1);
-            cy.get('[data-testid="CancelIcon"]').should('exist');
+
             // ACT
-            cy.get('[data-testid="CancelIcon"]').click();
+            cy.contains(
+                `Filtering YEAR: ${studysetYear}`
+            ).parent().find('[data-testid="CancelIcon"]').click();
 
             // ASSERT
             cy.get('tbody > tr').should('have.length', 3);
-            cy.get(`[data-testid="CancelIcon"]`).should('not.exist');
+            cy.contains(
+                `Filtering YEAR: ${studysetYear}`
+            ).should('not.exist')
         });
     });
 

diff --git a/compose/neurosynth-frontend/cypress/e2e/workflows/SleuthImport/DoSleuthImport.cy.tsx b/compose/neurosynth-frontend/cypress/e2e/workflows/SleuthImport/DoSleuthImport.cy.tsx
@@ -422,7 +422,7 @@ describe('DoSleuthImport', () => {
 
         it('should select MKDA and create an MKDA meta analysis', () => {
             cy.contains('button', 'Yes').click();
-            cy.get('[type="radio"]').eq(1).click();
+            cy.get('[type="radio"]').eq(1).click({ force: true });
             cy.contains('button', 'create')
                 .click()
                 .wait('@specificationPostFixture')

diff --git a/compose/neurosynth-frontend/eslint.config.js b/compose/neurosynth-frontend/eslint.config.js
@@ -0,0 +1,38 @@
+import tsParser from '@typescript-eslint/parser';
+import eslint from '@eslint/js';
+import teslint from 'typescript-eslint';
+import eslintHooks from 'eslint-plugin-react-hooks';
+import eslintCypress from 'eslint-plugin-cypress/flat';
+import eslintPrettier from 'eslint-plugin-prettier/recommended';
+import globals from 'globals';
+import eslintReactRefresh from 'eslint-plugin-react-refresh';
+
+export default [
+    eslint.configs.recommended,
+    ...teslint.configs.recommended,
+    eslintCypress.configs.recommended,
+    eslintPrettier,
+    {
+        languageOptions: {
+            globals: {
+                ...globals.browser,
+            },
+            parser: tsParser,
+            parserOptions: {
+                ecmaFeatures: {
+                    modules: true,
+                },
+                ecmaVersion: 2020,
+                project: './tsconfig.json',
+            },
+        },
+        plugins: {
+            'react-hooks': eslintHooks,
+            'react-refresh': eslintReactRefresh,
+        },
+        rules: {
+            ...eslintHooks.configs.recommended.rules,
+            'react-refresh/only-export-components': 'warn',
+        },
+    },
+];
diff --git a/...ose/neurosynth-frontend/public/index.html → compose/neurosynth-frontend/index.html b/...ose/neurosynth-frontend/public/index.html → compose/neurosynth-frontend/index.html
@@ -2,21 +2,23 @@
 <html lang="en">
     <head>
         <meta charset="utf-8" />
-        <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+        <link rel="icon" href="/favicon.ico" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <meta name="theme-color" content="#000000" />
         <meta name="description" content="Neurosynth-Compose App" />
-        <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+        <link rel="apple-touch-icon" href="/logo192.png" />
         <!--
             manifest.json provides metadata used when your web app is installed on a
             user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
         -->
-        <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+        <link rel="manifest" href="/manifest.json" />
 
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 
         <link rel="preload" as="image" href="/static/brain-analysis.png" type="image/png">
 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.css" />
+
         <link
             rel="stylesheet"
             media="print"
@@ -46,16 +48,6 @@
         <script async src="https://w.appzi.io/w.js"></script>
 
         <!-- End Appzi -->
-
-        <!--
-            Notice the use of %PUBLIC_URL% in the tags above.
-            It will be replaced with the URL of the `public` folder during the build.
-            Only files inside the `public` folder can be referenced from the HTML.
-
-            Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-            work correctly both with client-side routing and a non-root public URL.
-            Learn how to configure a non-root public URL by running `npm run build`.
-        -->
         <title>neurosynth compose</title>
     </head>
     <body>
@@ -71,6 +63,7 @@
             To begin the development, run `npm start` or `yarn start`.
             To create a production bundle, use `npm run build` or `yarn build`.
         -->
-        <div id="portal" style="position: fixed; left: 0; top: 0; z-index: 9999;" />
+        <div id="portal" style="position: fixed; left: 0; top: 0; z-index: 9999;"></div>
+        <script type="module" src="/src/index.tsx"></script>
     </body>
 </html>
diff --git a/compose/neurosynth-frontend/jest.config.js b/compose/neurosynth-frontend/jest.config.js