pangolin_mirror/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-03-05 18:26:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1406 from Pallavikumarimdb/enhancement-#906/enter-key-form-behavior

Browse Source 
Enter key handling & hostname field reset in resource create
This commit is contained in:
Owen Schwartz
2025-09-15 14:26:29 -07:00
committed by GitHub
parent 5b840d73bb 2f89a16852
commit a4fe86e38a
5 changed files with 78 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/[orgId]/settings/api-keys/create/page.tsx
View File

@@ -210,6 +210,11 @@ export default function Page() {
<SettingsSectionForm> <SettingsSectionForm>
<Form {...form}> <Form {...form}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="create-site-form" id="create-site-form"
> >

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

@@ -448,6 +448,11 @@ export default function Page() {
<SettingsSectionForm> <SettingsSectionForm>
<Form {...form}> <Form {...form}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="create-client-form" id="create-client-form"
> >

73
src/app/[orgId]/settings/resources/create/page.tsx
View File

@@ -91,6 +91,8 @@ import { DockerManager, DockerState } from "@app/lib/docker";
import { parseHostTarget } from "@app/lib/parseHostTarget"; import { parseHostTarget } from "@app/lib/parseHostTarget";
import { toASCII, toUnicode } from 'punycode'; import { toASCII, toUnicode } from 'punycode';
import { DomainRow } from "../../../../../components/DomainsTable"; import { DomainRow } from "../../../../../components/DomainsTable";
import { finalizeSubdomainSanitize } from "@app/lib/subdomain-utils";
const baseResourceFormSchema = z.object({ const baseResourceFormSchema = z.object({
name: z.string().min(1).max(255), name: z.string().min(1).max(255),
@@ -366,10 +368,17 @@ export default function Page() {
http: baseData.http http: baseData.http
}; };
let sanitizedSubdomain: string | undefined;
if (isHttp) { if (isHttp) {
const httpData = httpForm.getValues(); const httpData = httpForm.getValues();
sanitizedSubdomain = httpData.subdomain
? finalizeSubdomainSanitize(httpData.subdomain)
: undefined;
Object.assign(payload, { Object.assign(payload, {
subdomain: httpData.subdomain ? toASCII(httpData.subdomain) : undefined, subdomain: sanitizedSubdomain ? toASCII(sanitizedSubdomain) : undefined,
domainId: httpData.domainId, domainId: httpData.domainId,
protocol: "tcp" protocol: "tcp"
}); });
@@ -401,6 +410,10 @@ export default function Page() {
const id = res.data.data.resourceId; const id = res.data.data.resourceId;
setResourceId(id); setResourceId(id);
toast({
description: `Subdomain: ${sanitizedSubdomain}`,
});
// Create targets if any exist // Create targets if any exist
if (targets.length > 0) { if (targets.length > 0) {
try { try {
@@ -755,19 +768,29 @@ export default function Page() {
defaultValue={row.original.ip} defaultValue={row.original.ip}
className="min-w-[150px]" className="min-w-[150px]"
onBlur={(e) => { onBlur={(e) => {
const parsed = parseHostTarget(e.target.value); const input = e.target.value.trim();
const hasProtocol = /^(https?|h2c):\/\//.test(input);
const hasPort = /:\d+(?:\/|$)/.test(input);
if (parsed) { if (hasProtocol || hasPort) {
updateTarget(row.original.targetId, { const parsed = parseHostTarget(input);
...row.original, if (parsed) {
method: parsed.protocol, updateTarget(row.original.targetId, {
ip: parsed.host, ...row.original,
port: parsed.port ? Number(parsed.port) : undefined, method: hasProtocol ? parsed.protocol : row.original.method,
}); ip: parsed.host,
port: hasPort ? parsed.port : row.original.port
});
} else {
updateTarget(row.original.targetId, {
...row.original,
ip: input
});
}
} else { } else {
updateTarget(row.original.targetId, { updateTarget(row.original.targetId, {
...row.original, ...row.original,
ip: e.target.value, ip: input
}); });
} }
}} }}
@@ -869,6 +892,11 @@ export default function Page() {
<SettingsSectionForm> <SettingsSectionForm>
<Form {...baseForm}> <Form {...baseForm}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="base-resource-form" id="base-resource-form"
> >
@@ -981,6 +1009,11 @@ export default function Page() {
<SettingsSectionForm> <SettingsSectionForm>
<Form {...tcpUdpForm}> <Form {...tcpUdpForm}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="tcp-udp-settings-form" id="tcp-udp-settings-form"
> >
@@ -1329,11 +1362,21 @@ export default function Page() {
id="ip" id="ip"
{...field} {...field}
onBlur={(e) => { onBlur={(e) => {
const parsed = parseHostTarget(e.target.value); const input = e.target.value.trim();
if (parsed) { const hasProtocol = /^(https?|h2c):\/\//.test(input);
addTargetForm.setValue("method", parsed.protocol); const hasPort = /:\d+(?:\/|$)/.test(input);
addTargetForm.setValue("ip", parsed.host);
addTargetForm.setValue("port", parsed.port); if (hasProtocol || hasPort) {
const parsed = parseHostTarget(input);
if (parsed) {
if (hasProtocol || !addTargetForm.getValues("method")) {
addTargetForm.setValue("method", parsed.protocol);
}
addTargetForm.setValue("ip", parsed.host);
if (hasPort || !addTargetForm.getValues("port")) {
addTargetForm.setValue("port", parsed.port);
}
}
} else { } else {
field.onBlur(); field.onBlur();
} }

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

@@ -643,6 +643,11 @@ WantedBy=default.target`
<SettingsSectionForm> <SettingsSectionForm>
<Form {...form}> <Form {...form}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="create-site-form" id="create-site-form"
> >

5
src/app/admin/api-keys/create/page.tsx
View File

@@ -200,6 +200,11 @@ export default function Page() {
<SettingsSectionForm> <SettingsSectionForm>
<Form {...form}> <Form {...form}>
<form <form
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault(); // block default enter refresh
}
}}
className="space-y-4" className="space-y-4"
id="create-site-form" id="create-site-form"
> >