mirror of
https://github.com/fosrl/pangolin.git
synced 2026-03-07 19:26:36 +00:00
add advanced section to org create form
This commit is contained in:
@@ -1524,6 +1524,7 @@
|
|||||||
"addNewTarget": "Add New Target",
|
"addNewTarget": "Add New Target",
|
||||||
"targetsList": "Targets List",
|
"targetsList": "Targets List",
|
||||||
"advancedMode": "Advanced Mode",
|
"advancedMode": "Advanced Mode",
|
||||||
|
"advancedSettings": "Advanced Settings",
|
||||||
"targetErrorDuplicateTargetFound": "Duplicate target found",
|
"targetErrorDuplicateTargetFound": "Duplicate target found",
|
||||||
"healthCheckHealthy": "Healthy",
|
"healthCheckHealthy": "Healthy",
|
||||||
"healthCheckUnhealthy": "Unhealthy",
|
"healthCheckUnhealthy": "Unhealthy",
|
||||||
|
|||||||
@@ -30,6 +30,13 @@ import {
|
|||||||
} from "@app/components/ui/form";
|
} from "@app/components/ui/form";
|
||||||
import { Alert, AlertDescription } from "@app/components/ui/alert";
|
import { Alert, AlertDescription } from "@app/components/ui/alert";
|
||||||
import { useTranslations } from "next-intl";
|
import { useTranslations } from "next-intl";
|
||||||
|
import {
|
||||||
|
Collapsible,
|
||||||
|
CollapsibleContent,
|
||||||
|
CollapsibleTrigger
|
||||||
|
} from "@app/components/ui/collapsible";
|
||||||
|
import { ChevronsUpDown } from "lucide-react";
|
||||||
|
import { cn } from "@app/lib/cn";
|
||||||
|
|
||||||
type Step = "org" | "site" | "resources";
|
type Step = "org" | "site" | "resources";
|
||||||
|
|
||||||
@@ -43,6 +50,7 @@ export default function StepperForm() {
|
|||||||
const [isChecked, setIsChecked] = useState(false);
|
const [isChecked, setIsChecked] = useState(false);
|
||||||
// Removed error state, now using toast for API errors
|
// Removed error state, now using toast for API errors
|
||||||
const [orgCreated, setOrgCreated] = useState(false);
|
const [orgCreated, setOrgCreated] = useState(false);
|
||||||
|
const [isAdvancedOpen, setIsAdvancedOpen] = useState(false);
|
||||||
|
|
||||||
const orgSchema = z.object({
|
const orgSchema = z.object({
|
||||||
orgName: z.string().min(1, { message: t("orgNameRequired") }),
|
orgName: z.string().min(1, { message: t("orgNameRequired") }),
|
||||||
@@ -304,53 +312,85 @@ export default function StepperForm() {
|
|||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<FormField
|
<Collapsible
|
||||||
control={orgForm.control}
|
open={isAdvancedOpen}
|
||||||
name="subnet"
|
onOpenChange={setIsAdvancedOpen}
|
||||||
render={({ field }) => (
|
className="space-y-2"
|
||||||
<FormItem>
|
>
|
||||||
<FormLabel>
|
<div className="flex items-center justify-between space-x-4">
|
||||||
{t("setupSubnetAdvanced")}
|
<CollapsibleTrigger asChild>
|
||||||
</FormLabel>
|
<Button
|
||||||
<FormControl>
|
type="button"
|
||||||
<Input
|
variant="text"
|
||||||
type="text"
|
size="sm"
|
||||||
{...field}
|
className="p-0 flex items-center justify-between w-full"
|
||||||
/>
|
>
|
||||||
</FormControl>
|
<h4 className="text-sm">
|
||||||
<FormMessage />
|
{t("advancedSettings")}
|
||||||
<FormDescription>
|
</h4>
|
||||||
{t(
|
<div>
|
||||||
"setupSubnetDescription"
|
<ChevronsUpDown className="h-4 w-4" />
|
||||||
)}
|
<span className="sr-only">
|
||||||
</FormDescription>
|
{t("toggle")}
|
||||||
</FormItem>
|
</span>
|
||||||
)}
|
</div>
|
||||||
/>
|
</Button>
|
||||||
|
</CollapsibleTrigger>
|
||||||
|
</div>
|
||||||
|
<CollapsibleContent className="space-y-4">
|
||||||
|
<FormField
|
||||||
|
control={orgForm.control}
|
||||||
|
name="subnet"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>
|
||||||
|
{t(
|
||||||
|
"setupSubnetAdvanced"
|
||||||
|
)}
|
||||||
|
</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
<FormDescription>
|
||||||
|
{t(
|
||||||
|
"setupSubnetDescription"
|
||||||
|
)}
|
||||||
|
</FormDescription>
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
<FormField
|
<FormField
|
||||||
control={orgForm.control}
|
control={orgForm.control}
|
||||||
name="utilitySubnet"
|
name="utilitySubnet"
|
||||||
render={({ field }) => (
|
render={({ field }) => (
|
||||||
<FormItem>
|
<FormItem>
|
||||||
<FormLabel>
|
<FormLabel>
|
||||||
{t("setupUtilitySubnet")}
|
{t(
|
||||||
</FormLabel>
|
"setupUtilitySubnet"
|
||||||
<FormControl>
|
)}
|
||||||
<Input
|
</FormLabel>
|
||||||
type="text"
|
<FormControl>
|
||||||
{...field}
|
<Input
|
||||||
/>
|
type="text"
|
||||||
</FormControl>
|
{...field}
|
||||||
<FormMessage />
|
/>
|
||||||
<FormDescription>
|
</FormControl>
|
||||||
{t(
|
<FormMessage />
|
||||||
"setupUtilitySubnetDescription"
|
<FormDescription>
|
||||||
)}
|
{t(
|
||||||
</FormDescription>
|
"setupUtilitySubnetDescription"
|
||||||
</FormItem>
|
)}
|
||||||
)}
|
</FormDescription>
|
||||||
/>
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
</CollapsibleContent>
|
||||||
|
</Collapsible>
|
||||||
|
|
||||||
{orgIdTaken && !orgCreated ? (
|
{orgIdTaken && !orgCreated ? (
|
||||||
<Alert variant="destructive">
|
<Alert variant="destructive">
|
||||||
@@ -366,10 +406,7 @@ export default function StepperForm() {
|
|||||||
<Button
|
<Button
|
||||||
type="submit"
|
type="submit"
|
||||||
loading={loading}
|
loading={loading}
|
||||||
disabled={
|
disabled={loading || orgIdTaken}
|
||||||
loading ||
|
|
||||||
orgIdTaken
|
|
||||||
}
|
|
||||||
>
|
>
|
||||||
{t("setupCreateOrg")}
|
{t("setupCreateOrg")}
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
Reference in New Issue
Block a user