upgrade to nextjs 12, add visible logic check

ohmyform · Jan 2, 2022 · e54da2b · e54da2b
1 parent 26c2f9e
commit e54da2b
Show file tree

Hide file tree

Showing 70 changed files with 2,371 additions and 2,376 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -6,22 +6,64 @@ module.exports = {
     tsconfigRootDir: __dirname,
     project: ['./tsconfig.json'],
   },
+  plugins: [
+    '@typescript-eslint/eslint-plugin',
+    '@typescript-eslint',
+    'unused-imports'
+  ],
   extends: [
     'eslint:recommended',
     'plugin:@typescript-eslint/eslint-recommended',
     'plugin:@typescript-eslint/recommended',
+    'plugin:@typescript-eslint/recommended-requiring-type-checking',
     'plugin:react/recommended',
     'plugin:jsx-a11y/recommended',
-    'prettier/@typescript-eslint',
-    'plugin:prettier/recommended',
     'plugin:@typescript-eslint/recommended-requiring-type-checking',
+    'prettier',
   ],
   rules: {
-    'prettier/prettier': ['error', {}, { usePrettierrc: true }],
+    '@typescript-eslint/no-unsafe-assignment': 'off',
+    '@typescript-eslint/no-unsafe-argument': 'off',
+    '@typescript-eslint/no-unsafe-member-access': 'off',
     'react/prop-types': 'off',
     '@typescript-eslint/no-empty-interface': 'off',
-    '@typescript-eslint/no-var-requires': 'off',
-    'jsx-a11y/no-autofocus': 'off'
+    'jsx-a11y/no-autofocus': 'off',
+    'array-element-newline': ['error', {
+      'ArrayExpression': 'consistent',
+      'ArrayPattern': {
+        'minItems': 3,
+        'multiline': true,
+      }
+    }],
+    'array-bracket-newline': ['error', {
+      'minItems': 3,
+      'multiline': true,
+    }],
+    'indent': [
+      'error',
+      2,
+      {
+        'SwitchCase': 1
+      }
+    ],
+    'no-tabs': ['error'],
+    'max-len': ['error', {
+      'code': 100,
+      'ignoreComments': true,
+      'ignoreUrls': true,
+      'ignoreTemplateLiterals': true,
+      'ignoreTrailingComments': true,
+      'ignoreStrings': true,
+    }],
+    'quotes': ['error', 'single', { 'avoidEscape': true }],
+    'comma-dangle': ['error', 'always-multiline'],
+    'linebreak-style': [
+      'error',
+      'unix'
+    ],
+    'no-trailing-spaces': 'error',
+    'eol-last': 'error',
+    'unused-imports/no-unused-imports': 'error',
   },
   settings: {
     react: {

diff --git a/.gitignore b/.gitignore
@@ -30,3 +30,4 @@ yarn-error.log*
 
 # development environments
 /.idea
+schema.graphql
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -16,12 +16,14 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - new slider field type
 - new card layout for forms
 - field logic
+- add enviroment config
 
 ### Changed
 
 - combined notificationts to become more versatile
 - use exported hooks for graphql
 - disable swipe gesture
+- upgrade to nextjs 12
 
 ### Fixed
 

diff --git a/Dockerfile b/Dockerfile
@@ -30,7 +30,8 @@ WORKDIR /usr/src/app
 
 COPY --from=builder /usr/src/app /usr/src/app
 
-ENV PORT=4000
+ENV PORT=4000 \
+    NODE_ENV=production
 
 # Change to non-root privilege
 USER ohmyform

diff --git a/components/auth/footer.tsx b/components/auth/footer.tsx
@@ -31,66 +31,66 @@ const AuthFooterInner: React.FC<Props> = (props) => {
     <footer className={scss.footer}>
       {props.me
         ? [
-            <span style={{ color: '#FFF' }} key={'user'}>
+          <span style={{ color: '#FFF' }} key={'user'}>
               Hi, {props.me.username}
-            </span>,
-            props.me.roles.includes('admin') && (
-              <Link key={'admin'} href={'/admin'}>
-                <Button
-                  type={'link'}
-                  style={{
-                    color: '#FFF',
-                  }}
-                >
-                  {t('admin')}
-                </Button>
-              </Link>
-            ),
-            <Link key={'profile'} href={'/admin/profile'}>
+          </span>,
+          props.me.roles.includes('admin') && (
+            <Link key={'admin'} href={'/admin'}>
               <Button
                 type={'link'}
                 style={{
                   color: '#FFF',
                 }}
               >
-                {t('profile')}
+                {t('admin')}
               </Button>
-            </Link>,
+            </Link>
+          ),
+          <Link key={'profile'} href={'/admin/profile'}>
             <Button
-              key={'logout'}
               type={'link'}
-              onClick={logout}
               style={{
                 color: '#FFF',
               }}
             >
-              {t('logout')}
-            </Button>,
-          ]
+              {t('profile')}
+            </Button>
+          </Link>,
+          <Button
+            key={'logout'}
+            type={'link'}
+            onClick={logout}
+            style={{
+              color: '#FFF',
+            }}
+          >
+            {t('logout')}
+          </Button>,
+        ]
         : [
-            <Link href={'/login'} key={'login'}>
+          <Link href={'/login'} key={'login'}>
+            <Button
+              type={'link'}
+              style={{
+                color: '#FFF',
+              }}
+            >
+              {t('login')}
+            </Button>
+          </Link>,
+          !loading && !data?.disabledSignUp.value && (
+            <Link href={'/register'} key={'register'}>
               <Button
                 type={'link'}
                 style={{
                   color: '#FFF',
                 }}
               >
-                {t('login')}
+                {t('register')}
               </Button>
-            </Link>,
-            !loading && !data?.disabledSignUp.value && (
-              <Link href={'/register'} key={'register'}>
-                <Button
-                  type={'link'}
-                  style={{
-                    color: '#FFF',
-                  }}
-                >
-                  {t('register')}
-                </Button>
-              </Link>
-            ),
-          ]}
+            </Link>
+          ),
+        ]}
       <div style={{ flex: 1 }} />
       <Select
         bordered={false}

diff --git a/components/form/admin/design.tab.tsx b/components/form/admin/design.tab.tsx
@@ -9,10 +9,14 @@ export const DesignTab: React.FC<TabPaneProps> = (props) => {
 
   return (
     <Tabs.TabPane {...props}>
-      <Form.Item label={t('form:design.font')} name={['form', 'design', 'font']}>
+      <Form.Item label={t('form:design.font')} name={[
+        'form', 'design', 'font',
+      ]}>
         <Input />
       </Form.Item>
-      <Form.Item label={t('form:design.layouts')} name={['form', 'design', 'layout']}>
+      <Form.Item label={t('form:design.layouts')} name={[
+        'form', 'design', 'layout',
+      ]}>
         <Select
           options={[
             {
@@ -27,11 +31,15 @@ export const DesignTab: React.FC<TabPaneProps> = (props) => {
         />
       </Form.Item>
 
-      {['background', 'question', 'answer', 'button', 'buttonActive', 'buttonText'].map((name) => (
+      {[
+        'background', 'question', 'answer', 'button', 'buttonActive', 'buttonText',
+      ].map((name) => (
         <Form.Item
           key={name}
           label={t(`form:design.color.${name}`)}
-          name={['form', 'design', 'colors', name]}
+          name={[
+            'form', 'design', 'colors', name,
+          ]}
         >
           <InputColor />
         </Form.Item>

diff --git a/components/form/admin/end.page.tab.tsx b/components/form/admin/end.page.tab.tsx
@@ -12,32 +12,42 @@ export const EndPageTab: React.FC<TabPaneProps> = (props) => {
     <Tabs.TabPane {...props}>
       <Form.Item
         label={t('form:endPage.show')}
-        name={['form', 'endPage', 'show']}
+        name={[
+          'form', 'endPage', 'show',
+        ]}
         valuePropName={'checked'}
       >
         <Switch />
       </Form.Item>
 
-      <Form.Item label={t('form:endPage.title')} name={['form', 'endPage', 'title']}>
+      <Form.Item label={t('form:endPage.title')} name={[
+        'form', 'endPage', 'title',
+      ]}>
         <Input />
       </Form.Item>
 
       <Form.Item
         label={t('form:endPage.paragraph')}
-        name={['form', 'endPage', 'paragraph']}
+        name={[
+          'form', 'endPage', 'paragraph',
+        ]}
         extra={t('type:descriptionInfo')}
       >
         <Input.TextArea autoSize />
       </Form.Item>
 
       <Form.Item
         label={t('form:endPage.continueButtonText')}
-        name={['form', 'endPage', 'buttonText']}
+        name={[
+          'form', 'endPage', 'buttonText',
+        ]}
       >
         <Input />
       </Form.Item>
 
-      <Form.List name={['form', 'endPage', 'buttons']}>
+      <Form.List name={[
+        'form', 'endPage', 'buttons',
+      ]}>
         {(fields, { add, remove }) => {
           return (
             <div>

diff --git a/components/form/admin/export.submission.action.tsx b/components/form/admin/export.submission.action.tsx
@@ -108,7 +108,9 @@ export const ExportSubmissionAction: React.FC<Props> = (props) => {
       })
     }
     setLoading(false)
-  }, [form, getSubmissions, props.form, setLoading, loading])
+  }, [
+    form, getSubmissions, props.form, setLoading, loading,
+  ])
 
   return props.trigger(() => exportSubmissions(), loading)
 }
Original file line number	Diff line number	Diff line change
Expand Up		@@ -30,3 +30,4 @@ yarn-error.log*

		# development environments
		/.idea
		schema.graphql