feat: Optional Clear (#109)

* Can have the clear field be optional on study creation

Author: cbolles

packages/client/public/locales/en/translation.json

@@ -100,6 +100,7 @@
     "newStudy": {
       "completed": "All steps completed - your new study is created",
       "createStudy": "Create New Study",
+      "disableClear": "Disable Clear Button",
       "disableSameUserTagging": "Disable users tagging entries they recorded",
       "formTitle": "Study Information",
       "noDatasets": "No datasets available, create a dataset and grant the project access under Datasets > Project Access",

packages/client/public/locales/es/translation.json

@@ -100,6 +100,7 @@
     "newStudy": {
       "completed": "All steps completed - your new study is created",
       "createStudy": "Create New Study",
+      "disableClear": "",
       "disableSameUserTagging": "Disable users tagging entries they recorded",
       "formTitle": "Study Information",
       "noDatasets": "No datasets available, create a dataset and grant the project access under Datasets > Project Access",

packages/client/src/components/NewStudyJsonForm.component.tsx

@@ -45,6 +45,10 @@ export const NewStudyJsonForm: React.FC<NewStudyFormProps> = (props) => {
           sortByEntryID: {
             type: 'boolean',
             default: false
+          },
+          disableClear: {
+            type: 'boolean',
+            default: 'false'
           }
         }
       }
@@ -85,6 +89,11 @@ export const NewStudyJsonForm: React.FC<NewStudyFormProps> = (props) => {
         type: 'Control',
         label: t('components.newStudy.sortByEntryID'),
         scope: '#/properties/studyConfig/properties/sortByEntryID'
+      },
+      {
+        type: 'Control',
+        label: t('components.newStudy.disableClear'),
+        scope: '#/properties/studyConfig/properties/disableClear'
       }
     ]
   };

packages/client/src/components/contribute/TagForm.component.tsx

@@ -20,6 +20,26 @@ export const TagForm: React.FC<TagFormProps> = (props) => {
   const [dataValid, setDataValid] = useState<boolean>(false);
   const { t } = useTranslation();
 
+  // Controls if a clear button should be present
+  const [hasClearButton, setHasClearButton] = useState<boolean>(false);
+
+  useEffect(() => {
+    // If the study config is not present, by default have a clear button
+    if (!props.study.studyConfig) {
+      setHasClearButton(true);
+      return;
+    }
+
+    // If the "disableClear" field isn't present, default have a clear button
+    if (props.study.studyConfig.disableClear === undefined || props.study.studyConfig.disableClear === null) {
+      setHasClearButton(true);
+      return;
+    }
+
+    // Otherwise use the field
+    setHasClearButton(!props.study.studyConfig.disableClear);
+  }, [props.study]);
+
   const handleFormChange = (data: any, errors: ErrorObject[] | undefined) => {
     setData(data);
 
@@ -81,9 +101,12 @@ export const TagForm: React.FC<TagFormProps> = (props) => {
           <Button variant="outlined" onClick={handleSubmit} disabled={!dataValid}>
             {t('common.submit')}
           </Button>
-          <Button variant="outlined" onClick={handleClear}>
-            {t('common.clear')}
-          </Button>
+
+          {hasClearButton && (
+            <Button variant="outlined" onClick={handleClear}>
+              {t('common.clear')}
+            </Button>
+          )}
         </Stack>
       </Stack>
     </Box>

packages/client/src/graphql/graphql.ts

@@ -646,11 +646,13 @@ export type Study = {
 
 export type StudyConfig = {
   __typename?: 'StudyConfig';
+  disableClear?: Maybe<Scalars['Boolean']['output']>;
   disableSameUserEntryTagging?: Maybe<Scalars['Boolean']['output']>;
   sortByEntryID?: Maybe<Scalars['Boolean']['output']>;
 };
 
 export type StudyConfigInput = {
+  disableClear?: InputMaybe<Scalars['Boolean']['input']>;
   disableSameUserEntryTagging?: InputMaybe<Scalars['Boolean']['input']>;
   sortByEntryID?: InputMaybe<Scalars['Boolean']['input']>;
 };

packages/client/src/graphql/study/study.graphql

@@ -10,6 +10,11 @@ query findStudies($project: ID!) {
       dataSchema
       uiSchema
     }
+    studyConfig {
+      disableSameUserEntryTagging
+      sortByEntryID
+      disableClear
+    }
   }
 }
 

packages/client/src/graphql/study/study.ts

@@ -10,7 +10,7 @@ export type FindStudiesQueryVariables = Types.Exact<{
 }>;
 
 
-export type FindStudiesQuery = { __typename?: 'Query', findStudies: Array<{ __typename?: 'Study', _id: string, name: string, description: string, instructions: string, project: string, tagsPerEntry: number, tagSchema: { __typename?: 'TagSchema', dataSchema: any, uiSchema: any } }> };
+export type FindStudiesQuery = { __typename?: 'Query', findStudies: Array<{ __typename?: 'Study', _id: string, name: string, description: string, instructions: string, project: string, tagsPerEntry: number, tagSchema: { __typename?: 'TagSchema', dataSchema: any, uiSchema: any }, studyConfig?: { __typename?: 'StudyConfig', disableSameUserEntryTagging?: boolean | null, sortByEntryID?: boolean | null, disableClear?: boolean | null } | null }> };
 
 export type DeleteStudyMutationVariables = Types.Exact<{
   study: Types.Scalars['ID']['input'];
@@ -62,6 +62,11 @@ export const FindStudiesDocument = gql`
       dataSchema
       uiSchema
     }
+    studyConfig {
+      disableSameUserEntryTagging
+      sortByEntryID
+      disableClear
+    }
   }
 }
     `;

packages/server/src/study/study.model.ts

@@ -36,6 +36,13 @@ export class StudyConfig {
   @Prop({ required: false })
   @Field({ nullable: true })
   sortByEntryID?: boolean;
+
+  /**
+   * If set, clear button will not be present in the UI of the study
+   */
+  @Prop({ required: false })
+  @Field({ nullable: true })
+  disableClear?: boolean;
 }
 
 const StudyConfigSchema = SchemaFactory.createForClass(StudyConfig);