Some checks are pending
E2E / Playwright e2e (push) Waiting to run
- Introduced new components for managing admin settings, including AdminListControls, AdminSettingsCard, and TechBrandSelectLabel. - Implemented dynamic loading for admin settings sections to optimize performance. - Enhanced the layout of various admin settings sections for better user experience. - Updated the AiAssistantSection to include LLM provider management and improved model selection. - Refactored authentication settings to streamline configuration and improve accessibility.
61 lines
1.4 KiB
TypeScript
61 lines
1.4 KiB
TypeScript
"use client"
|
|
|
|
import { Children, type ReactNode } from "react"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
function MasonryStack({ children }: { children: ReactNode }) {
|
|
return (
|
|
<div className="flex min-w-0 flex-1 flex-col gap-4 lg:gap-5">{children}</div>
|
|
)
|
|
}
|
|
|
|
export function AutomationTabMasonry({
|
|
columns,
|
|
children,
|
|
className,
|
|
}: {
|
|
columns: 1 | 2
|
|
children: ReactNode
|
|
className?: string
|
|
}) {
|
|
const items = Children.toArray(children).filter(Boolean)
|
|
|
|
if (columns === 1) {
|
|
return (
|
|
<div className={cn("flex w-full flex-col gap-4", className)}>{children}</div>
|
|
)
|
|
}
|
|
|
|
const left = items.filter((_, index) => index % 2 === 0)
|
|
const right = items.filter((_, index) => index % 2 === 1)
|
|
|
|
return (
|
|
<div className={cn("w-full", className)}>
|
|
<div className="flex flex-col gap-4 lg:hidden">
|
|
{items.map((child, index) => (
|
|
<div key={index} className="min-w-0">
|
|
{child}
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
<div className="hidden items-start gap-5 lg:flex">
|
|
<MasonryStack>
|
|
{left.map((child, index) => (
|
|
<div key={index} className="min-w-0">
|
|
{child}
|
|
</div>
|
|
))}
|
|
</MasonryStack>
|
|
<MasonryStack>
|
|
{right.map((child, index) => (
|
|
<div key={index} className="min-w-0">
|
|
{child}
|
|
</div>
|
|
))}
|
|
</MasonryStack>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|