Clear all classes button

Author: Kazmer, Nagy-Betegh

src/ui/src/components/configuration-layout/ConfigurationLayout.jsx

@@ -776,14 +776,14 @@ const ConfigurationLayout = () => {
         const builtObject = buildObjectFromPaths(differences);
         console.log('DEBUG: Built object from paths:', builtObject);
 
-        // CRITICAL: Always include the current document schema (classes) if it exists
-        // This prevents the schema from being lost when saving other configuration changes
-        if (formValues.classes && Array.isArray(formValues.classes) && formValues.classes.length > 0) {
+        // CRITICAL: Always include the current document schema (classes) if it exists OR is explicitly empty
+        // This ensures empty arrays are saved (to wipe all classes) and prevents schema loss
+        if (formValues.classes && Array.isArray(formValues.classes)) {
           builtObject.classes = formValues.classes;
           console.log('DEBUG: Including document schema (classes) in save:', formValues.classes);
         }
 
-        // CRITICAL: If there are no differences AND no schema, don't send update to backend
+        // CRITICAL: If there are no differences AND no schema changes, don't send update to backend
         // This prevents unnecessary API calls and potential data issues
         if (Object.keys(builtObject).length === 0) {
           console.log('No changes detected, skipping save');
@@ -1245,7 +1245,11 @@ const ConfigurationLayout = () => {
                   setExtractionSchema(schemaData);
                   if (isDirty) {
                     const updatedConfig = { ...formValues };
-                    if (schemaData && schemaData.length > 0) {
+                    // CRITICAL: Always set classes, even if empty array (to support wipe all functionality)
+                    // Handle null (no classes) by setting empty array
+                    if (schemaData === null) {
+                      updatedConfig.classes = [];
+                    } else if (Array.isArray(schemaData)) {
                       // Store as 'classes' field with JSON Schema content
                       updatedConfig.classes = schemaData;
                     }

src/ui/src/components/json-schema-builder/SchemaBuilder.jsx

@@ -42,6 +42,7 @@ const SchemaBuilder = ({ initialSchema, onChange, onValidate }) => {
     exportSchema,
     getSelectedClass,
     getSelectedAttribute,
+    clearAllClasses,
   } = useSchemaDesigner(initialSchema || []);
 
   const { validateSchema } = useSchemaValidation();
@@ -59,6 +60,7 @@ const SchemaBuilder = ({ initialSchema, onChange, onValidate }) => {
   const [editingClass, setEditingClass] = useState(null);
   const [showDeleteConfirmModal, setShowDeleteConfirmModal] = useState(false);
   const [classToDelete, setClassToDelete] = useState(null);
+  const [showWipeAllModal, setShowWipeAllModal] = useState(false);
   const [aggregatedValidationErrors, setAggregatedValidationErrors] = useState([]);
   const lastExportedSchemaRef = useRef(null);
   const lastValidationResultRef = useRef(null);
@@ -186,6 +188,15 @@ const SchemaBuilder = ({ initialSchema, onChange, onValidate }) => {
     }
   };
 
+  const handleWipeAll = () => {
+    setShowWipeAllModal(true);
+  };
+
+  const handleConfirmWipeAll = () => {
+    clearAllClasses();
+    setShowWipeAllModal(false);
+  };
+
   const docTypeCount = classes.filter((c) => c[X_AWS_IDP_DOCUMENT_TYPE]).length;
   const sharedCount = classes.filter((c) => !c[X_AWS_IDP_DOCUMENT_TYPE]).length;
 
@@ -289,6 +300,9 @@ const SchemaBuilder = ({ initialSchema, onChange, onValidate }) => {
                       >
                         Export
                       </Button>
+                      <Button onClick={handleWipeAll} iconName="remove" disabled={classes.length === 0}>
+                        Wipe All
+                      </Button>
                     </SpaceBetween>
                   </Box>
                 }
@@ -775,6 +789,34 @@ const SchemaBuilder = ({ initialSchema, onChange, onValidate }) => {
             )}
           </SpaceBetween>
         </Modal>
+
+        <Modal
+          visible={showWipeAllModal}
+          onDismiss={() => setShowWipeAllModal(false)}
+          header="Wipe All Document Classes"
+          footer={
+            <Box float="right">
+              <SpaceBetween direction="horizontal" size="xs">
+                <Button variant="link" onClick={() => setShowWipeAllModal(false)}>
+                  Cancel
+                </Button>
+                <Button variant="primary" onClick={handleConfirmWipeAll}>
+                  Wipe All
+                </Button>
+              </SpaceBetween>
+            </Box>
+          }
+        >
+          <SpaceBetween size="m">
+            <Alert type="error">
+              Are you sure you want to delete <strong>all {classes.length} document class(es)</strong>? This action cannot be undone.
+            </Alert>
+            <Box variant="p">
+              All document classes and their attributes will be permanently removed. You will need to recreate them or use the discovery
+              feature to regenerate your schema.
+            </Box>
+          </SpaceBetween>
+        </Modal>
       </SpaceBetween>
     </>
   );

src/ui/src/hooks/useSchemaDesigner.js

@@ -646,10 +646,16 @@ export const useSchemaDesigner = (initialSchema = []) => {
 
   const getSelectedAttribute = useCallback(() => {
     const cls = getSelectedClass();
-    if (!cls || !selectedAttributeId) return null;
-    return cls.attributes.properties[selectedAttributeId] || null;
+    return cls?.attributes?.properties?.[selectedAttributeId];
   }, [getSelectedClass, selectedAttributeId]);
 
+  const clearAllClasses = useCallback(() => {
+    setClasses([]);
+    setSelectedClassId(null);
+    setSelectedAttributeId(null);
+    setIsDirty(true);
+  }, []);
+
   return {
     classes,
     selectedClassId,
@@ -670,5 +676,6 @@ export const useSchemaDesigner = (initialSchema = []) => {
     resetDirty,
     getSelectedClass,
     getSelectedAttribute,
+    clearAllClasses,
   };
 };