pangolin_mirror/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-02-26 14:56:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

add advanced toggle to sites and clients create

Browse Source
This commit is contained in:
miloschwartz
2025-12-21 16:02:09 -05:00
parent 3f81b88073
commit b2df8eb72e
2 changed files with 112 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/app/[orgId]/settings/clients/machine/create/page.tsx
View File

@@ -25,7 +25,7 @@ import { createElement, useEffect, useState } from "react";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { Input } from "@app/components/ui/input"; import { Input } from "@app/components/ui/input";
import { InfoIcon, Terminal } from "lucide-react"; import { ChevronDown, ChevronUp, InfoIcon, Terminal } from "lucide-react";
import { Button } from "@app/components/ui/button"; import { Button } from "@app/components/ui/button";
import CopyTextBox from "@app/components/CopyTextBox"; import CopyTextBox from "@app/components/CopyTextBox";
import CopyToClipboard from "@app/components/CopyToClipboard"; import CopyToClipboard from "@app/components/CopyToClipboard";
@@ -121,6 +121,7 @@ export default function Page() {
const [olmCommand, setOlmCommand] = useState(""); const [olmCommand, setOlmCommand] = useState("");
const [createLoading, setCreateLoading] = useState(false); const [createLoading, setCreateLoading] = useState(false);
const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
const [clientDefaults, setClientDefaults] = const [clientDefaults, setClientDefaults] =
useState<PickClientDefaultsResponse | null>(null); useState<PickClientDefaultsResponse | null>(null);
@@ -443,12 +444,32 @@ export default function Page() {
</FormItem> </FormItem>
)} )}
/> />
<div className="flex items-center justify-end md:col-start-2">
<Button
type="button"
variant="ghost"
size="sm"
onClick={() =>
setShowAdvancedSettings(
!showAdvancedSettings
)
}
className="flex items-center gap-2"
>
{showAdvancedSettings ? (
<ChevronUp className="h-4 w-4" />
) : (
<ChevronDown className="h-4 w-4" />
)}
{t("advancedSettings")}
</Button>
</div>
{showAdvancedSettings && (
<FormField <FormField
control={form.control} control={form.control}
name="subnet" name="subnet"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem className="md:col-start-1 md:col-span-2">
<FormLabel> <FormLabel>
{t("clientAddress")} {t("clientAddress")}
</FormLabel> </FormLabel>
@@ -470,6 +491,7 @@ export default function Page() {
</FormItem> </FormItem>
)} )}
/> />
)}
</form> </form>
</Form> </Form>
</SettingsSectionBody> </SettingsSectionBody>

34
src/app/[orgId]/settings/sites/create/page.tsx
View File

@@ -25,7 +25,7 @@ import { createElement, useEffect, useState } from "react";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { Input } from "@app/components/ui/input"; import { Input } from "@app/components/ui/input";
import { InfoIcon, Terminal } from "lucide-react"; import { ChevronDown, ChevronUp, InfoIcon, Terminal } from "lucide-react";
import { Button } from "@app/components/ui/button"; import { Button } from "@app/components/ui/button";
import CopyTextBox from "@app/components/CopyTextBox"; import CopyTextBox from "@app/components/CopyTextBox";
import CopyToClipboard from "@app/components/CopyToClipboard"; import CopyToClipboard from "@app/components/CopyToClipboard";
@@ -204,6 +204,7 @@ export default function Page() {
const [createLoading, setCreateLoading] = useState(false); const [createLoading, setCreateLoading] = useState(false);
const [acceptClients, setAcceptClients] = useState(true); const [acceptClients, setAcceptClients] = useState(true);
const [newtVersion, setNewtVersion] = useState("latest"); const [newtVersion, setNewtVersion] = useState("latest");
const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
const [siteDefaults, setSiteDefaults] = const [siteDefaults, setSiteDefaults] =
useState<PickSiteDefaultsResponse | null>(null); useState<PickSiteDefaultsResponse | null>(null);
@@ -727,12 +728,33 @@ WantedBy=default.target`
</FormItem> </FormItem>
)} )}
/> />
{form.watch("method") === "newt" && ( <div className="flex items-center justify-end md:col-start-2">
<Button
type="button"
variant="ghost"
size="sm"
onClick={() =>
setShowAdvancedSettings(
!showAdvancedSettings
)
}
className="flex items-center gap-2"
>
{showAdvancedSettings ? (
<ChevronUp className="h-4 w-4" />
) : (
<ChevronDown className="h-4 w-4" />
)}
{t("advancedSettings")}
</Button>
</div>
{form.watch("method") === "newt" &&
showAdvancedSettings && (
<FormField <FormField
control={form.control} control={form.control}
name="clientAddress" name="clientAddress"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem className="md:col-start-1 md:col-span-2">
<FormLabel> <FormLabel>
{t("siteAddress")} {t("siteAddress")}
</FormLabel> </FormLabel>
@@ -746,11 +768,13 @@ WantedBy=default.target`
e e
) => { ) => {
setClientAddress( setClientAddress(
e.target e
.target
.value .value
); );
field.onChange( field.onChange(
e.target e
.target
.value .value
); );
}} }}