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 in
another PR.
--
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: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
