Nv indicator in analysis list

.github/workflows/tests.yml

@@ -76,6 +76,6 @@ jobs:
         CHOKIDAR_USEPOLLING: 1
       run: |
        bash setup_frontend_tests.sh
-       sleep 15
+       sleep 60
        cd neuroscout/frontend && ./node_modules/.bin/cypress run --record --key ${{ secrets.CYPRESS_RECORD_KEY }}
       if: matrix.type == 'frontend'

README.md

@@ -168,3 +168,4 @@ In a separate window, you can run cypress:
 Once done, kill the first command, and run the following to tear down the test db
 
    docker-compose exec -e APP_SETTINGS=neuroscout.config.app.DockerTestConfig neuroscout python manage.py teardown_test_db
+

neuroscout/frontend/.prettierrc

@@ -1,5 +1,4 @@
 singleQuote: true
-jsxBracketSameLine: true
 semi: false
 trailingComma: all
 arrowParens: avoid

neuroscout/frontend/README.md

@@ -51,3 +51,4 @@ All application state is contained in two main components:
 
 `coretypes.tsx` contains the type definitinos for most key models, such as analysis, run, predictor, contrast, transformation, etc. The data models in this module are largely UI agonstic. This file is a good starting point to understand the
  shape of the data in the frontend app. All resusable type definitions should go into this module.
+

neuroscout/frontend/cypress/integration/analysis_builder.spec.js

@@ -1,7 +1,7 @@
 describe('Analysis Builder', () => {
   beforeEach(() => {
     cy.login('user@example.com', 'string')
-    cy.get('.newAnalysis > a')
+    cy.get('.newAnalysis a')
     cy.visit('/builder')
   })
 

neuroscout/frontend/package.json

@@ -53,6 +53,7 @@
     "jest-canvas-mock": "^2.3.1",
     "prettier": "^2.3.0",
     "prettier-eslint": "^12.0.0",
+    "prettier-eslint-cli": "^5.0.1",
     "react-app-rewired": "^2.1.8",
     "react-scripts": "^4.0.3",
     "source-map-explorer": "^2.0.1",

neuroscout/frontend/src/AnalysisList.tsx

@@ -4,6 +4,7 @@ the home page or on the 'browse public analysis' page
 */
 import * as React from 'react'
 import { Button, Row, Table, Input } from 'antd'
+import { CheckCircleTwoTone } from '@ant-design/icons'
 import { MainCol, Space, StatusTag } from './HelperComponents'
 import { AppAnalysis, Dataset } from './coretypes'
 import { Link, Redirect } from 'react-router-dom'
@@ -185,7 +186,18 @@ export class AnalysisListTable extends React.Component<
         width: `${this.state.ownersWidth}ch`,
       })
     }
-
+    analysisTableColumns.push({
+      title: 'NeuroVault',
+      dataIndex: 'nv_count',
+      width: '2ch',
+      sorter: (a, b) => a.nv_count - b.nv_count,
+      render: (text, record: AppAnalysis) => {
+        if (record.nv_count) {
+          return <CheckCircleTwoTone twoToneColor="#52c41a" />
+        }
+        return
+      },
+    })
     if (publicList) {
       analysisTableColumns.splice(2, 1)
     }
@@ -204,7 +216,8 @@ export class AnalysisListTable extends React.Component<
                     void this.props.cloneAnalysis(record.id).then(id => {
                       this.setState({ redirectId: id })
                     })
-                  }}>
+                  }}
+                >
                   Clone
                 </Button>
                 <Space />

neuroscout/frontend/src/HelperComponents.tsx

@@ -14,7 +14,8 @@ export const MainCol = (props: { children: React.ReactNode }): JSX.Element => {
       xl={{ span: 18 }}
       lg={{ span: 20 }}
       xs={{ span: 24 }}
-      className="mainCol">
+      className="mainCol"
+    >
       {props.children}
     </Col>
   )

neuroscout/frontend/src/Home.tsx

@@ -37,15 +37,17 @@ class Home extends React.Component<UserStore, Record<string, never>> {
                   size="large"
                   className="splashButton"
                   type="default"
-                  href="/public">
+                  href="/public"
+                >
                   Browse public analyses
                 </Button>{' '}
                 {this.props.loggedIn === false && (
                   <Button
                     size="large"
                     className="splashButton"
                     type="primary"
-                    onClick={e => this.props.update({ openSignup: true })}>
+                    onClick={e => this.props.update({ openSignup: true })}
+                  >
                     Sign up to get started!
                   </Button>
                 )}
@@ -59,7 +61,8 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             xxl={{ span: 5 }}
             xl={{ span: 6 }}
             lg={{ span: 7 }}
-            xs={{ span: 8 }}>
+            xs={{ span: 8 }}
+          >
             <div className="stat-container">
               <div className="stat-title">Active Datasets</div>
               <div className="stat-value">13</div>
@@ -69,7 +72,8 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             xxl={{ span: 5 }}
             xl={{ span: 6 }}
             lg={{ span: 7 }}
-            xs={{ span: 8 }}>
+            xs={{ span: 8 }}
+          >
             <div className="stat-container">
               <div className="stat-title">Number of Tasks</div>
               <div className="stat-value">40</div>
@@ -82,11 +86,13 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             xxl={{ span: 5 }}
             xl={{ span: 6 }}
             lg={{ span: 7 }}
-            xs={{ span: 8 }}>
+            xs={{ span: 8 }}
+          >
             <Card
               title="Re-use public data"
               headStyle={titleStyle}
-              bordered={false}>
+              bordered={false}
+            >
               <img className="splashLogo" src="/static/browse.svg" />
               <br />
               <div className="introCardsText">
@@ -102,11 +108,13 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             xxl={{ span: 5 }}
             xl={{ span: 6 }}
             lg={{ span: 7 }}
-            xs={{ span: 8 }}>
+            xs={{ span: 8 }}
+          >
             <Card
               title="Design your analysis"
               headStyle={titleStyle}
-              bordered={false}>
+              bordered={false}
+            >
               <img className="splashLogo" src="/static/design.svg" />
               <br />
               <div className="introCardsText">
@@ -121,11 +129,13 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             xxl={{ span: 5 }}
             xl={{ span: 6 }}
             lg={{ span: 7 }}
-            xs={{ span: 8 }}>
+            xs={{ span: 8 }}
+          >
             <Card
               title="Execute and share"
               headStyle={titleStyle}
-              bordered={false}>
+              bordered={false}
+            >
               <img className="splashLogo" src="/static/share.svg" />
               <br />
               <div className="introCardsText">
@@ -145,7 +155,8 @@ class Home extends React.Component<UserStore, Record<string, never>> {
               <Button
                 size="large"
                 className="splashButton"
-                href="https://neuroscout.github.io/neuroscout/">
+                href="https://neuroscout.github.io/neuroscout/"
+              >
                 <BookOutlined />
                 Learn more
               </Button>
@@ -157,7 +168,8 @@ class Home extends React.Component<UserStore, Record<string, never>> {
             <Card
               title="Support provided by"
               headStyle={titleStyle}
-              bordered={false}>
+              bordered={false}
+            >
               <Row justify="center">
                 <Col span={5}>
                   <img className="instLogo2" src="/static/utlogo.png" />

neuroscout/frontend/src/Modals.tsx

@@ -26,7 +26,8 @@ class GoogleLoginBtn extends React.Component<UserStore, Record<string, never>> {
             style={{ width: '100%' }}
             htmlType="submit"
             type="primary"
-            ghost={true}>
+            ghost={true}
+          >
             <GoogleOutlined />
           </Button>
         )}
@@ -69,12 +70,14 @@ export class ResetPasswordModal extends React.Component<
         maskClosable={true}
         onCancel={e => {
           this.props.update({ openReset: false })
-        }}>
+        }}
+      >
         <p>Please enter an email address to send reset instructions</p>
         <Form
           onFinish={e => {
             this.props.resetPassword()
-          }}>
+          }}
+        >
           <FormItem>
             <Input
               prefix={<MailOutlined style={{ fontSize: 13 }} />}
@@ -109,7 +112,8 @@ export class EnterResetTokenModal extends React.Component<
         maskClosable={true}
         onCancel={e => {
           this.props.update({ openEnterResetToken: false })
-        }}>
+        }}
+      >
         <p>
           We have sent a reset token to {this.props.profile.email} <br />
           Please enter the token below, along with a new password for the
@@ -118,7 +122,8 @@ export class EnterResetTokenModal extends React.Component<
         <Form
           onFinish={e => {
             this.props.submitToken()
-          }}>
+          }}
+        >
           <FormItem>
             <Input
               prefix={<TagsOutlined style={{ fontSize: 13 }} />}
@@ -164,13 +169,15 @@ export class LoginModal extends React.Component<
         onCancel={e => {
           this.props.logout()
           this.props.update({ openLogin: false })
-        }}>
+        }}
+      >
         <p>{this.props.loginError ? this.props.loginError : ''}</p>
         <br />
         <Form
           onFinish={e => {
             void this.props.login()
-          }}>
+          }}
+        >
           <FormItem>
             <Input
               prefix={<MailOutlined style={{ fontSize: 13 }} />}
@@ -196,7 +203,8 @@ export class LoginModal extends React.Component<
             <a
               onClick={e => {
                 this.props.update({ openLogin: false, openReset: true })
-              }}>
+              }}
+            >
               Forgot password
             </a>
             <br />
@@ -252,7 +260,8 @@ class RegistrationForm extends React.Component<RegistrationFormProps> {
               required: true,
               message: 'Please input your name!',
             },
-          ]}>
+          ]}
+        >
           <Input />
         </FormItem>
         <FormItem
@@ -267,7 +276,8 @@ class RegistrationForm extends React.Component<RegistrationFormProps> {
               required: true,
               message: 'Please input your email address.',
             },
-          ]}>
+          ]}
+        >
           <Input />
         </FormItem>
         <FormItem
@@ -282,7 +292,8 @@ class RegistrationForm extends React.Component<RegistrationFormProps> {
             {
               validator: this.validateToNextPassword,
             },
-          ]}>
+          ]}
+        >
           <Input.Password />
         </FormItem>
         <FormItem
@@ -297,7 +308,8 @@ class RegistrationForm extends React.Component<RegistrationFormProps> {
             {
               validator: this.compareToFirstPassword,
             },
-          ]}>
+          ]}
+        >
           <Input.Password />
         </FormItem>
         <FormItem>
@@ -323,7 +335,8 @@ export class SignupModal extends React.Component<
         visible={this.props.openSignup}
         footer={null}
         maskClosable={true}
-        onCancel={e => this.props.update({ openSignup: false })}>
+        onCancel={e => this.props.update({ openSignup: false })}
+      >
         {this.props.signupError && (
           <Alert message={this.props.signupError} type="error" />
         )}