dima/supabase
1
0 Fork 0
mirror of https://github.com/supabase/supabase.git synced 2026-10-05 09:25:06 +03:00
Code Issues Packages Projects Releases Wiki Activity

Revert form layout changes (#40048)

Browse Source
This commit is contained in:
Joshen Lim authored and GitHub committed 2025-11-01 01:16:42 +08:00
1 parent 922780fcc1
commit dad5f01140
2 files changed
+80 -77
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/studio/components/interfaces/Settings/Integrations/GithubIntegration/GitHubIntegrationConnectionForm.tsx
+6 -1
View File
@@ -464,7 +464,12 @@ const GitHubIntegrationConnectionForm = ({
</Button>
</FormControl_Shadcn_>
</PopoverTrigger_Shadcn_>
<PopoverContent_Shadcn_ className="p-0 w-80" side="bottom" align="start">
<PopoverContent_Shadcn_
portal
className="p-0 w-80"
side="bottom"
align="start"
>
<Command_Shadcn_>
<CommandInput_Shadcn_ placeholder="Search repositories..." />
<CommandList_Shadcn_ className="!max-h-[200px]">
packages/ui-patterns/src/form/Layout/FormLayout.tsx
+74 -76
View File
@@ -42,11 +42,11 @@ const ContainerVariants = cva('relative grid gap-10', {
false: '',
},
layout: {
horizontal: 'flex flex-col gap-2 md:grid @lg:grid-cols-12',
horizontal: 'flex flex-col gap-2 md:grid md:grid-cols-12',
vertical: 'flex flex-col gap-2',
flex: 'flex flex-row gap-3',
'flex-row-reverse':
'flex flex-col-reverse gap-2 @lg:gap-6 @lg:flex-row-reverse @lg:justify-between',
'flex flex-col-reverse gap-2 md:gap-6 md:flex-row-reverse md:justify-between',
},
flex: {
true: '',
@@ -233,7 +233,7 @@ const FlexContainer = cva('', {
},
{
layout: 'flex-row-reverse',
className: 'flex flex-col justify-center items-start @lg:items-end shrink-0',
className: 'flex flex-col justify-center items-start md:items-end shrink-0',
},
],
})
@@ -359,85 +359,83 @@ export const FormLayout = React.forwardRef<
)
return (
<div className="@container">
<div
ref={ref}
{...props}
className={cn(ContainerVariants({ size, flex, align, layout }), className)}
>
{flex && (
<div className={cn(FlexContainer({ flex, align, layout }))}>
{props.children}
{layout === 'flex-row-reverse' && renderError}
<div
ref={ref}
{...props}
className={cn(ContainerVariants({ size, flex, align, layout }), className)}
>
{flex && (
<div className={cn(FlexContainer({ flex, align, layout }))}>
{props.children}
{layout === 'flex-row-reverse' && renderError}
</div>
)}
{hasLabel || labelOptional || layout === 'horizontal' ? (
<>
<div
className={cn(LabelContainerVariants({ align, labelLayout, flex, layout }))}
data-formlayout-id={'labelContainer'}
>
{hasLabel && isReactForm ? (
<FormLabel_Shadcn_
className="text-foreground flex gap-2 items-center break-all"
data-formlayout-id="formLabel"
htmlFor={props.name || id}
>
<LabelContents />
</FormLabel_Shadcn_>
) : (
<Label_Shadcn_
className="text-foreground flex gap-2 items-center break-all leading-normal"
data-formlayout-id="label"
htmlFor={props.name || id}
>
<LabelContents />
</Label_Shadcn_>
)}
{labelOptional && (
<span
className={cn(LabelOptionalVariants({ size }))}
id={id + '-optional'}
data-formlayout-id={'labelOptional'}
>
{labelOptional}
</span>
)}
{flex && (
<>
{renderDescription}
{layout !== 'flex-row-reverse' && renderError}
</>
)}
</div>
)}
{hasLabel || labelOptional || layout === 'horizontal' ? (
</>
) : null}
{!flex && (
<div
className={cn(DataContainerVariants({ align, layout }))}
style={style}
data-formlayout-id={'dataContainer'}
>
<>
<div
className={cn(LabelContainerVariants({ align, labelLayout, flex, layout }))}
data-formlayout-id={'labelContainer'}
className={cn(
NonBoxInputContainer({
nonBoxInput,
// @ts-expect-error
label,
layout,
})
)}
data-formlayout-id={'nonBoxInputContainer'}
>
{hasLabel && isReactForm ? (
<FormLabel_Shadcn_
className="text-foreground flex gap-2 items-center break-all"
data-formlayout-id="formLabel"
htmlFor={props.name || id}
>
<LabelContents />
</FormLabel_Shadcn_>
) : (
<Label_Shadcn_
className="text-foreground flex gap-2 items-center break-all leading-normal"
data-formlayout-id="label"
htmlFor={props.name || id}
>
<LabelContents />
</Label_Shadcn_>
)}
{labelOptional && (
<span
className={cn(LabelOptionalVariants({ size }))}
id={id + '-optional'}
data-formlayout-id={'labelOptional'}
>
{labelOptional}
</span>
)}
{flex && (
<>
{renderDescription}
{layout !== 'flex-row-reverse' && renderError}
</>
)}
{props.children}
</div>
{renderError}
{renderDescription}
</>
) : null}
{!flex && (
<div
className={cn(DataContainerVariants({ align, layout }))}
style={style}
data-formlayout-id={'dataContainer'}
>
<>
<div
className={cn(
NonBoxInputContainer({
nonBoxInput,
// @ts-expect-error
label,
layout,
})
)}
data-formlayout-id={'nonBoxInputContainer'}
>
{props.children}
</div>
{renderError}
{renderDescription}
</>
</div>
)}
</div>
</div>
)}
</div>
)
}