pierrejeambrun commented on code in PR #53035: URL: https://github.com/apache/airflow/pull/53035#discussion_r2248455078
########## airflow-core/src/airflow/ui/src/components/FlexibleForm/FlexibleForm.tsx: ########## @@ -95,60 +107,82 @@ export const FlexibleForm = ({ } }; - return Object.entries(params).some(([, param]) => typeof param.schema.section !== "string") - ? Object.entries(params).map(([, secParam]) => { - const currentSection = secParam.schema.section ?? flexibleFormDefaultSection; - - if (processedSections.has(currentSection)) { - return undefined; - } else { - processedSections.set(currentSection, true); - - return ( - <Accordion.Item - // We need to make the item content overflow visible for dropdowns to work, but directly applying the style does not work - css={{ - "& > div:nth-of-type(1)": { - overflow: "visible", - }, - }} - key={currentSection} - value={currentSection} - > - <Accordion.ItemTrigger cursor="button"> - <Text color={sectionError.get(currentSection) ? "fg.error" : undefined}> - {currentSection} - </Text> - {sectionError.get(currentSection) ? ( - <Icon color="fg.error" margin="-1"> - <MdError /> - </Icon> + return Object.entries(params).some(([, param]) => typeof param.schema.section !== "string") ? ( + Object.entries(params).map(([, secParam]) => { + const currentSection = secParam.schema.section ?? flexibleFormDefaultSection; + + if (processedSections.has(currentSection)) { + return undefined; + } else { + processedSections.set(currentSection, true); + + return ( + <Accordion.Item + // We need to make the item content overflow visible for dropdowns to work, but directly applying the style does not work + css={{ + "& > div:nth-of-type(1)": { + overflow: "visible", + }, + }} + key={currentSection} + value={currentSection} + > + <Accordion.ItemTrigger cursor="button"> + <Text color={sectionError.get(currentSection) ? "fg.error" : undefined}>{currentSection}</Text> + {sectionError.get(currentSection) ? ( + <Icon color="fg.error" margin="-1"> + <MdError /> + </Icon> + ) : undefined} + </Accordion.ItemTrigger> + + <Accordion.ItemContent pt={0}> + <Accordion.ItemBody> + {Boolean(subHeader) ? ( + <Text color="fg.muted" fontSize="xs" mb={2}> + {subHeader} + </Text> ) : undefined} - </Accordion.ItemTrigger> - - <Accordion.ItemContent pt={0}> - <Accordion.ItemBody> - {Boolean(subHeader) ? ( - <Text color="fg.muted" fontSize="xs" mb={2}> - {subHeader} - </Text> + <Stack separator={<StackSeparator py={2} />}> + {Boolean(flexFormDescription) ? ( + <Markdown remarkPlugins={[remarkGfm]}>{flexFormDescription}</Markdown> Review Comment: You shouldn't use `Markdown` from the lib directly, but our Markdown component `ReactMarkdown`. I won't go into details but this add broader supports to the markdown syntax. I think you took that from `FieldRow` which is wrong, i'll update that -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: commits-unsubscr...@airflow.apache.org For queries about this service, please contact Infrastructure at: us...@infra.apache.org