diff --git a/web/src/beta/components/fields/PropertyFields/index.tsx b/web/src/beta/components/fields/PropertyFields/index.tsx
index 33d7122f50..7be829a1c8 100644
--- a/web/src/beta/components/fields/PropertyFields/index.tsx
+++ b/web/src/beta/components/fields/PropertyFields/index.tsx
@@ -20,44 +20,39 @@ const PropertyFields: React.FC<Props> = ({ propertyId, item }) => {
         const isList = item && "items" in item;
         const value = !isList ? item.fields.find(f => f.id === sf.id)?.value : sf.defaultValue;
 
-        switch (sf.type) {
-          case "string":
-            // TODO: Can also be turned into a switch and infact bunch of props are common
-            return sf.ui === "color" ? (
-              <ColorField
-                key={sf.id}
-                name={sf.name}
-                value={(value as string) ?? ""}
-                description={sf.description}
-                onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
-              />
-            ) : sf.ui === "selection" || sf.choices ? (
-              <p key={sf.id}>Selection or choices field</p>
-            ) : sf.ui === "buttons" ? (
-              <p key={sf.id}>Button radio field</p>
-            ) : (
-              <TextInput
-                key={sf.id}
-                name={sf.name}
-                value={(value as string) ?? ""}
-                description={sf.description}
-                onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
-              />
-            );
-          case "bool":
-            return (
-              <ToggleField
-                key={sf.id}
-                name={sf.name}
-                checked={value as boolean}
-                description={sf.description}
-                onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
-              />
-            );
-
-          default:
-            return <p key={sf.id}>{sf.name} field</p>;
-        }
+        return sf.type === "string" ? (
+          sf.ui === "color" ? (
+            <ColorField
+              key={sf.id}
+              name={sf.name}
+              value={(value as string) ?? ""}
+              description={sf.description}
+              onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
+            />
+          ) : sf.ui === "selection" || sf.choices ? (
+            <p key={sf.id}>Selection or choices field</p>
+          ) : sf.ui === "buttons" ? (
+            <p key={sf.id}>Button radio field</p>
+          ) : (
+            <TextInput
+              key={sf.id}
+              name={sf.name}
+              value={(value as string) ?? ""}
+              description={sf.description}
+              onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
+            />
+          )
+        ) : sf.type == "bool" ? (
+          <ToggleField
+            key={sf.id}
+            name={sf.name}
+            checked={value as boolean}
+            description={sf.description}
+            onChange={handlePropertyValueUpdate(item.schemaGroup, propertyId, sf.id, sf.type)}
+          />
+        ) : (
+          <p key={sf.id}>{sf.name} field</p>
+        );
       })}
     </>
   );