This is an automated email from the ASF dual-hosted git repository.

kaxilnaik pushed a commit to branch v3-0-test
in repository https://gitbox.apache.org/repos/asf/airflow.git

commit e7d3305b52bb0cea6f87d29b7558ad35103637c9
Author: Brent Bovenzi <[email protected]>
AuthorDate: Tue May 6 16:22:57 2025 -0400

    Add basic json check to variable value (#50277)
    
    (cherry picked from commit 89346411086c08d7755a5c4874078b722a300f01)
---
 .../Variables/ManageVariable/VariableForm.tsx      | 42 +++++++++++++++++-----
 1 file changed, 33 insertions(+), 9 deletions(-)

diff --git 
a/airflow-core/src/airflow/ui/src/pages/Variables/ManageVariable/VariableForm.tsx
 
b/airflow-core/src/airflow/ui/src/pages/Variables/ManageVariable/VariableForm.tsx
index 8ae39c58210..2b7c65e760e 100644
--- 
a/airflow-core/src/airflow/ui/src/pages/Variables/ManageVariable/VariableForm.tsx
+++ 
b/airflow-core/src/airflow/ui/src/pages/Variables/ManageVariable/VariableForm.tsx
@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Field, HStack, Input, Spacer, Textarea } from "@chakra-ui/react";
+import { Box, Field, HStack, Input, Spacer, Textarea, Text } from 
"@chakra-ui/react";
 import { Controller, useForm } from "react-hook-form";
 import { FiSave } from "react-icons/fi";
 
@@ -29,6 +29,16 @@ export type VariableBody = {
   value: string;
 };
 
+const isJsonString = (string: string) => {
+  try {
+    JSON.parse(string);
+  } catch {
+    return false;
+  }
+
+  return true;
+};
+
 type VariableFormProps = {
   readonly error: unknown;
   readonly initialVariable: VariableBody;
@@ -80,14 +90,28 @@ const VariableForm = ({ error, initialVariable, isPending, 
manageMutate, setErro
       <Controller
         control={control}
         name="value"
-        render={({ field }) => (
-          <Field.Root mt={4}>
-            <Field.Label fontSize="md">
-              Value <Field.RequiredIndicator />
-            </Field.Label>
-            <Textarea {...field} size="sm" />
-          </Field.Root>
-        )}
+        render={({ field, fieldState }) => {
+          const showJsonWarning =
+            field.value.startsWith("{") || field.value.startsWith("[") ? 
!isJsonString(field.value) : false;
+
+          return (
+            <Field.Root invalid={Boolean(fieldState.error)} mt={4} required>
+              <Field.Label fontSize="md">
+                Value <Field.RequiredIndicator />
+              </Field.Label>
+              <Textarea {...field} size="sm" />
+              {showJsonWarning ? (
+                <Text color="fg.warning" fontSize="xs">
+                  Invalid JSON
+                </Text>
+              ) : undefined}
+              {fieldState.error ? 
<Field.ErrorText>{fieldState.error.message}</Field.ErrorText> : undefined}
+            </Field.Root>
+          );
+        }}
+        rules={{
+          required: "Value is required",
+        }}
       />
 
       <Controller

Reply via email to