diff --git a/messages/en-US.json b/messages/en-US.json index 6565143c..6cfd663d 100644 --- a/messages/en-US.json +++ b/messages/en-US.json @@ -2237,5 +2237,7 @@ "deviceLoginUseDifferentAccount": "Not you? Use a different account.", "deviceLoginDeviceRequestingAccessToAccount": "A device is requesting access to this account.", "noData": "No Data", - "machineClients": "Machine Clients" + "machineClients": "Machine Clients", + "install": "Install", + "run": "Run" } diff --git a/src/app/[orgId]/settings/clients/machine/create/page.tsx b/src/app/[orgId]/settings/clients/machine/create/page.tsx index 3971fb74..4bb2d24c 100644 --- a/src/app/[orgId]/settings/clients/machine/create/page.tsx +++ b/src/app/[orgId]/settings/clients/machine/create/page.tsx @@ -68,9 +68,11 @@ interface TunnelTypeOption { disabled?: boolean; } +type CommandItem = string | { title: string; command: string }; + type Commands = { - unix: Record; - windows: Record; + unix: Record; + windows: Record; }; const platforms = ["unix", "windows"] as const; @@ -132,14 +134,26 @@ export default function Page() { const commands = { unix: { All: [ - `curl -fsSL https://pangolin.net/get-olm.sh | bash`, - `sudo olm --id ${id} --secret ${secret} --endpoint ${endpoint}` + { + title: t("install"), + command: `curl -fsSL https://pangolin.net/get-olm.sh | bash` + }, + { + title: t("run"), + command: `sudo olm --id ${id} --secret ${secret} --endpoint ${endpoint}` + } ] }, windows: { x64: [ - `curl -o olm.exe -L "https://github.com/fosrl/olm/releases/download/${version}/olm_windows_installer.exe"`, - `olm.exe --id ${id} --secret ${secret} --endpoint ${endpoint}` + { + title: t("install"), + command: `curl -o olm.exe -L "https://github.com/fosrl/olm/releases/download/${version}/olm_windows_installer.exe"` + }, + { + title: t("run"), + command: `olm.exe --id ${id} --secret ${secret} --endpoint ${endpoint}` + } ] } }; @@ -170,8 +184,8 @@ export default function Page() { } }; - const getCommand = () => { - const placeholder = [t("unknownCommand")]; + const getCommand = (): CommandItem[] => { + const placeholder: CommandItem[] = [t("unknownCommand")]; if (!commands) { return placeholder; } @@ -645,13 +659,43 @@ export default function Page() {

{t("commands")}

-
- +
+ {getCommand().map( + (item, index) => { + const commandText = + typeof item === + "string" + ? item + : item.command; + const title = + typeof item === + "string" + ? undefined + : item.title; + + return ( +
+ {title && ( +

+ { + title + } +

+ )} + +
+ ); + } + )}
diff --git a/src/app/[orgId]/settings/sites/create/page.tsx b/src/app/[orgId]/settings/sites/create/page.tsx index 6866025e..c107ef57 100644 --- a/src/app/[orgId]/settings/sites/create/page.tsx +++ b/src/app/[orgId]/settings/sites/create/page.tsx @@ -78,13 +78,15 @@ interface RemoteExitNodeOption { disabled?: boolean; } +type CommandItem = string | { title: string; command: string }; + type Commands = { - unix: Record; - windows: Record; - docker: Record; - kubernetes: Record; - podman: Record; - nixos: Record; + unix: Record; + windows: Record; + docker: Record; + kubernetes: Record; + podman: Record; + nixos: Record; }; const platforms = [ @@ -248,14 +250,26 @@ PersistentKeepalive = 5`; const commands = { unix: { All: [ - `curl -fsSL https://pangolin.net/get-newt.sh | bash`, - `newt --id ${id} --secret ${secret} --endpoint ${endpoint}${acceptClientsFlag}` + { + title: t("install"), + command: `curl -fsSL https://pangolin.net/get-newt.sh | bash` + }, + { + title: t("run"), + command: `newt --id ${id} --secret ${secret} --endpoint ${endpoint}${acceptClientsFlag}` + } ] }, windows: { x64: [ - `curl -o newt.exe -L "https://github.com/fosrl/newt/releases/download/${version}/newt_windows_amd64.exe"`, - `newt.exe --id ${id} --secret ${secret} --endpoint ${endpoint}${acceptClientsFlag}` + { + title: t("install"), + command: `curl -o newt.exe -L "https://github.com/fosrl/newt/releases/download/${version}/newt_windows_amd64.exe"` + }, + { + title: t("run"), + command: `newt.exe --id ${id} --secret ${secret} --endpoint ${endpoint}${acceptClientsFlag}` + } ] }, docker: { @@ -356,8 +370,8 @@ WantedBy=default.target` } }; - const getCommand = () => { - const placeholder = [t("unknownCommand")]; + const getCommand = (): CommandItem[] => { + const placeholder: CommandItem[] = [t("unknownCommand")]; if (!commands) { return placeholder; } @@ -1002,13 +1016,43 @@ WantedBy=default.target`

{t("commands")}

-
- +
+ {getCommand().map( + (item, index) => { + const commandText = + typeof item === + "string" + ? item + : item.command; + const title = + typeof item === + "string" + ? undefined + : item.title; + + return ( +
+ {title && ( +

+ { + title + } +

+ )} + +
+ ); + } + )}