Remove minimum height on elements in Flexible Form (apache#46591)

* Remove minimum height on elements in Flexible Form * Fix helper description consistency in display
aws-mwaa · Feb 12, 2025 · f4165fe · f4165fe
1 parent 34261d0
commit f4165fe
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 10 deletions.
diff --git a/airflow/ui/src/components/FlexibleForm/FieldRow.tsx b/airflow/ui/src/components/FlexibleForm/FieldRow.tsx
@@ -40,17 +40,21 @@ export const FieldRow = ({ name }: FlexibleFormElementProps) => {
   return (
     <Field.Root orientation="horizontal" required={isRequired(param)}>
       <Stack>
-        <Field.Label fontSize="md">
+        <Field.Label fontSize="md" style={{ flexBasis: "30%" }}>
           {param.schema.title ?? name} <Field.RequiredIndicator />
         </Field.Label>
       </Stack>
-      <Stack css={{ "flex-basis": "70%" }}>
+      <Stack css={{ flexBasis: "70%" }}>
         <FieldSelector name={name} />
-        <Field.HelperText>
-          {param.description ?? (
-            <Markdown remarkPlugins={[remarkGfm]}>{param.schema.description_md}</Markdown>
-          )}
-        </Field.HelperText>
+        {param.description === null ? (
+          param.schema.description_md === undefined ? undefined : (
+            <Field.HelperText>
+              <Markdown remarkPlugins={[remarkGfm]}>{param.schema.description_md}</Markdown>
+            </Field.HelperText>
+          )
+        ) : (
+          <Field.HelperText>{param.description}</Field.HelperText>
+        )}
       </Stack>
     </Field.Root>
   );

diff --git a/airflow/ui/src/components/TriggerDag/useParamStore.ts b/airflow/ui/src/components/TriggerDag/useParamStore.ts
@@ -21,7 +21,8 @@ import { create } from "zustand";
 import type { DagParamsSpec, ParamSpec } from "src/queries/useDagParams";
 
 export const paramPlaceholder: ParamSpec = {
-  description: undefined,
+  // eslint-disable-next-line unicorn/no-null
+  description: null,
   schema: {
     const: undefined,
     description_md: undefined,
@@ -70,7 +71,8 @@ export const useParamStore = create<FormStore>((set) => ({
           return [
             key,
             {
-              description: existingParam?.description,
+              // eslint-disable-next-line unicorn/no-null
+              description: existingParam?.description ?? null,
               schema: existingParam?.schema ?? paramPlaceholder.schema,
               value: value as unknown,
             },

diff --git a/airflow/ui/src/queries/useDagParams.ts b/airflow/ui/src/queries/useDagParams.ts
@@ -22,7 +22,7 @@ import { toaster } from "src/components/ui";
 export type DagParamsSpec = Record<string, ParamSpec>;
 
 export type ParamSpec = {
-  description: string | undefined;
+  description: string | null;
   schema: ParamSchema;
   value: unknown;
 };