From d8da94c233d072cca260ff29a01af55ce1996922 Mon Sep 17 00:00:00 2001
From: Kevin Burnett <18027+burnettk@users.noreply.github.com>
Date: Fri, 3 May 2024 17:32:57 +0000
Subject: [PATCH] allowing switch form to MUI using ui:theme mui in the ui
 schema (#1482)

Co-authored-by: burnettk <burnettk@users.noreply.github.com>
---
 .../src/components/CustomForm.tsx             | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/spiffworkflow-frontend/src/components/CustomForm.tsx b/spiffworkflow-frontend/src/components/CustomForm.tsx
index ea115e6ad..db04738dc 100644
--- a/spiffworkflow-frontend/src/components/CustomForm.tsx
+++ b/spiffworkflow-frontend/src/components/CustomForm.tsx
@@ -59,6 +59,20 @@ export default function CustomForm({
     'numeric-range': NumericRangeField,
   };
 
+  let reactJsonSchemaFormTheme = reactJsonSchemaForm;
+  if ('ui:theme' in uiSchema) {
+    if (uiSchema['ui:theme'] === 'carbon') {
+      reactJsonSchemaFormTheme = 'carbon';
+    } else if (uiSchema['ui:theme'] === 'mui') {
+      reactJsonSchemaFormTheme = 'mui';
+    } else {
+      console.error(
+        `Unsupported theme: ${uiSchema['ui:theme']}. Defaulting to mui`
+      );
+      reactJsonSchemaFormTheme = 'mui';
+    }
+  }
+
   const rjsfTemplates: any = {};
   if (restrictedWidth) {
     rjsfTemplates.ObjectFieldTemplate = ObjectFieldRestrictedGridTemplate;
@@ -475,16 +489,16 @@ export default function CustomForm({
     templates: rjsfTemplates,
     omitExtraData: true,
   };
-  if (reactJsonSchemaForm === 'carbon') {
+  if (reactJsonSchemaFormTheme === 'carbon') {
     // eslint-disable-next-line react/jsx-props-no-spreading
     return <CarbonForm {...formProps}>{childrenToUse}</CarbonForm>;
   }
 
-  if (reactJsonSchemaForm === 'mui') {
+  if (reactJsonSchemaFormTheme === 'mui') {
     // eslint-disable-next-line react/jsx-props-no-spreading
     return <MuiForm {...formProps}>{childrenToUse}</MuiForm>;
   }
 
-  console.error(`Unsupported form type: ${reactJsonSchemaForm}`);
+  console.error(`Unsupported form type: ${reactJsonSchemaFormTheme}`);
   return null;
 }