From 757142c20ec572348ef59cbe56a25328a3316858 Mon Sep 17 00:00:00 2001
From: Shams mosowi <shams.mosowi@gmail.com>
Date: Mon, 26 Apr 2021 22:23:05 +1000
Subject: [PATCH] validation regex

---
 .../components/fields/ShortText/Settings.tsx   | 11 +++++++++++
 .../fields/_withTableCell/withBasicCell.tsx    | 18 +++++++++++-------
 2 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/www/src/components/fields/ShortText/Settings.tsx b/www/src/components/fields/ShortText/Settings.tsx
index b770d0a9..75f17f7d 100644
--- a/www/src/components/fields/ShortText/Settings.tsx
+++ b/www/src/components/fields/ShortText/Settings.tsx
@@ -19,6 +19,17 @@ export default function Settings({ handleChange, config }) {
           else handleChange("maxLength")(e.target.value);
         }}
       />
+      <Subheading>Validation Regex</Subheading>
+      <TextField
+        type="text"
+        value={config.maxLength}
+        label={"Validation Regex"}
+        fullWidth
+        onChange={(e) => {
+          if (e.target.value === "") handleChange("validationRegex")(null);
+          else handleChange("validationRegex")(e.target.value);
+        }}
+      />
     </>
   );
 }
diff --git a/www/src/components/fields/_withTableCell/withBasicCell.tsx b/www/src/components/fields/_withTableCell/withBasicCell.tsx
index ed642315..597129c3 100644
--- a/www/src/components/fields/_withTableCell/withBasicCell.tsx
+++ b/www/src/components/fields/_withTableCell/withBasicCell.tsx
@@ -17,16 +17,20 @@ export default function withBasicCell(
   return function BasicCell(props: FormatterProps<any>) {
     const { name, key } = props.column;
     const value = getCellValue(props.row, key);
-    const isMissing =
-      props.row._ft_missingRequiredFields?.includes(key) && value === undefined;
+    const { validationRegex, required } = (props.column as any).config;
+    const invalidInput =
+      validationRegex && !new RegExp(validationRegex).test(value);
+    const isMissing = required && value === undefined;
     if (isMissing) return <>missing!</>;
     return (
       <ErrorBoundary fullScreen={false} basic wrap="nowrap">
-        <BasicCellComponent
-          value={value}
-          name={name}
-          type={(props.column as any).type as FieldType}
-        />
+        <span style={invalidInput ? { color: "#f00" } : {}}>
+          <BasicCellComponent
+            value={value}
+            name={name}
+            type={(props.column as any).type as FieldType}
+          />
+        </span>
       </ErrorBoundary>
     );
   };