Merge pull request #128 from DiSSCo/FIxedAnnotationCasesForDigitalSpe…

…cimenAndDigitalMedia

Apply dynamic annotation cases

src/app/Hooks.ts

@@ -451,8 +451,6 @@ const useSearchFilters = () => {
      */
     const ResetSearchFilters = () => {
         [...searchParams.entries()].forEach(searchParam => {
-            console.log(searchParam);
-
             searchParams.delete(searchParam[0]);
         });
 

src/components/digitalMedia/DigitalMedia.tsx

@@ -15,6 +15,7 @@ import { DigitalMedia as DigitalMediaType } from "app/types/DigitalMedia";
 
 /* Import Sources */
 import DigitalMediaSchema from 'sources/dataModel/digitalMedia.json';
+import DigitalMediaAnnotationCases from 'sources/annotationCases/DigitalMediaAnnotationCases.json';
 
 /* Import API */
 import GetDigitalMedia from "api/digitalMedia/GetDigitalMedia";
@@ -144,6 +145,7 @@ const DigitalMedia = () => {
                         <div className={`${annotationSidePanelClass} h-100 tr-smooth`}>
                             <AnnotationSidePanel superClass={digitalMedia}
                                 schema={DigitalMediaSchema}
+                                annotationCases={DigitalMediaAnnotationCases.annotationCases}
                                 GetAnnotations={GetDigitalMediaAnnotations}
                                 GetMas={GetDigitalMediaMas}
                                 GetMasJobRecords={GetDigitalMediaMasJobRecords}

src/components/digitalSpecimen/DigitalSpecimen.tsx

@@ -16,6 +16,7 @@ import { DigitalSpecimen as DigitalSpecimenType } from 'app/types/DigitalSpecime
 
 /* Import Sources */
 import DigitalSpecimenSchema from 'sources/dataModel/digitalSpecimen.json';
+import DigitalSpecimenAnnotationCases from 'sources/annotationCases/DigitalSpecimenAnnotationCases.json';
 
 /* Import API */
 import GetDigitalSpecimen from 'api/digitalSpecimen/GetDigitalSpecimen';
@@ -167,6 +168,7 @@ const DigitalSpecimen = () => {
                         <div className={`${annotationSidePanelClass} h-100 tr-smooth`}>
                             <AnnotationSidePanel superClass={digitalSpecimen}
                                 schema={DigitalSpecimenSchema}
+                                annotationCases={DigitalSpecimenAnnotationCases.annotationCases}
                                 GetAnnotations={GetDigitalSpecimenAnnotations}
                                 GetMas={GetDigitalSpecimenMas}
                                 GetMasJobRecords={GetDigitalSpecimenMasJobRecords}

src/components/elements/annotationSidePanel/AnnotationSidePanel.tsx

@@ -25,6 +25,12 @@ import { LoadingScreen } from '../customUI/CustomUI';
 type Props = {
     superClass: SuperClass,
     schema: Dict,
+    annotationCases: {
+        name: string;
+        type: string;
+        jsonPath: string;
+        icon: string;
+    }[],
     GetAnnotations: Function,
     GetMas: Function,
     GetMasJobRecords: Function,
@@ -35,8 +41,9 @@ type Props = {
 
 /**
  * Component that renders the annotation side panel
- * @param annotationMode Boolean indicating if the annotation mode is on or not
  * @param superClass The super class reigning the annotation side panel
+ * @param schema The base schema of the selected super class
+ * @param annotationCases Default annotation cases that can be selected as the annotation target
  * @param GetAnnotations Function that fetches the annotations of the super class
  * @param GetMas Function that fetches the potential MASs to be run
  * @param GetMasJobRecords Function that fetches the MAS job records of the super class
@@ -45,7 +52,7 @@ type Props = {
  * @returns JSX Component
  */
 const AnnotationSidePanel = (props: Props) => {
-    const { superClass, schema, GetAnnotations, GetMas, GetMasJobRecords, ScheduleMas, HideAnnotationSidePanel } = props;
+    const { superClass, schema, annotationCases, GetAnnotations, GetMas, GetMasJobRecords, ScheduleMas, HideAnnotationSidePanel } = props;
 
     /* Hooks */
     const dispatch = useAppDispatch();
@@ -118,6 +125,7 @@ const AnnotationSidePanel = (props: Props) => {
                     {(annotationWizardToggle && superClass) ?
                         <AnnotationWizard schema={schema}
                             superClass={superClass}
+                            annotationCases={annotationCases}
                             StopAnnotationWizard={() => {
                                 setAnnotationWizardToggle(false);
                                 dispatch(setAnnotationTarget(annotationTarget ? {

src/components/elements/annotationSidePanel/components/annotationWizard/AnnotationWizard.tsx

@@ -29,6 +29,12 @@ import { Button, ProgressDots, Tabs } from 'components/elements/customUI/CustomU
 type Props = {
     schema: Dict,
     superClass: SuperClass,
+    annotationCases: {
+        name: string;
+        type: string;
+        jsonPath: string;
+        icon: string;
+    }[],
     StopAnnotationWizard: Function,
     SetLoading: Function,
     SetFilterSortValues: Function
@@ -39,13 +45,14 @@ type Props = {
  * Component that renders the annotation wizard for adding annotations
  * @param schema The base schema to build upon
  * @param superClass The super class on which the annotation wizard should act
+ * @param annotationCases Default annotation cases that can be selected as the annotation target
  * @param StopAnnotationWizard Function to stop and shut down the annotation wizard
  * @param SetLoading Function to set the loading state of the annotation side panel
  * @param SetFilterSortValues Function to set the filter and sort values in the annotations overview
  * @returns JSX Component
  */
 const AnnotationWizard = (props: Props) => {
-    const { schema, superClass, StopAnnotationWizard, SetLoading, SetFilterSortValues } = props;
+    const { schema, superClass, annotationCases, StopAnnotationWizard, SetLoading, SetFilterSortValues } = props;
 
     /* Hooks */
     const dispatch = useAppDispatch();
@@ -54,7 +61,11 @@ const AnnotationWizard = (props: Props) => {
     /* Define wizard step components using tabs */
     const annotationTarget = useAppSelector(getAnnotationTarget);
     const tabs: { [name: string]: JSX.Element } = {
-        ...(!annotationTarget?.annotation && { annotationTarget: <AnnotationTargetStep schema={schema} /> }),
+        ...(!annotationTarget?.annotation && {
+            annotationTarget: <AnnotationTargetStep schema={schema}
+                annotationCases={annotationCases}
+            />
+        }),
         ...(!annotationTarget?.annotation && {
             annotationSelectInstance: <AnnotationSelectInstanceStep superClass={superClass}
                 schemaTitle={schema.title}

src/components/elements/annotationSidePanel/components/annotationWizard/steps/AnnotationTargetStep.tsx

@@ -15,16 +15,19 @@ import { getAnnotationTarget } from 'redux-store/AnnotateSlice';
 /* Import Types */
 import { Dict } from 'app/Types';
 
-/* Import Sources */
-import DigitalSpecimenAnnotationCases from 'sources/annotationCases/DigitalSpecimenAnnotationCases.json';
-
 /* Import Components */
 import { Button } from 'components/elements/customUI/CustomUI';
 
 
 /* Props Type */
 type Props = {
     schema: Dict,
+    annotationCases: {
+        name: string;
+        type: string;
+        jsonPath: string;
+        icon: string;
+    }[],
     formValues?: Dict,
     SetFieldValue?: Function,
     SetAnnotationTarget?: Function
@@ -33,10 +36,15 @@ type Props = {
 
 /**
  * Component that renders the cases target selection of the annotation wizard
+ * @param schema The base schema to build upon
+ * @param annotationCases Default annotation cases that can be selected as the annotation target
+ * @param formValues The values of the annotation wizard form state
+ * @param SetFieldValue Function to set the value of form field in the annotation wizard form
+ * @param SetAnnotationTarget Function to set the annotation target
  * @returns JSX Component
  */
 const AnnotationTargetStep = (props: Props) => {
-    const { schema, formValues, SetFieldValue, SetAnnotationTarget } = props;
+    const { schema, annotationCases, formValues, SetFieldValue, SetAnnotationTarget } = props;
 
     /* Hooks */
     const trigger = useTrigger();
@@ -78,7 +86,7 @@ const AnnotationTargetStep = (props: Props) => {
                     </Row>
                     {/* Case blocks */}
                     <Row className="mt-1">
-                        {DigitalSpecimenAnnotationCases.annotationCases.map(annotationCase => {
+                        {annotationCases.map(annotationCase => {
                             return (
                                 <Col key={annotationCase.name}
                                     lg={{ span: 6 }}

src/sources/annotationCases/DigitalMediaAnnotationCases.json

@@ -0,0 +1,10 @@
+{
+    "annotationCases": [
+        {
+            "name": "The whole media item",
+            "type": "superClass",
+            "jsonPath": "$",
+            "icon": ""
+        }
+    ]
+}