Add prefix to ui and resource

This commit is contained in:
Owen
2025-09-11 21:20:33 -07:00
parent 2551e0c291
commit d51e7f7e40
8 changed files with 280 additions and 17 deletions

View File

@@ -20,11 +20,15 @@ resources:
- X-Another-Header: another-value
targets:
- site: lively-yosemite-toad
path: /path
pathMatchType: prefix
hostname: localhost
method: http
port: 8000
- site: slim-alpine-chipmunk
hostname: localhost
path: /yoman
pathMatchType: exact
method: http
port: 8001
resource-nice-id2:

View File

@@ -98,7 +98,9 @@ export async function updateResources(
method: targetData.method,
port: targetData.port,
enabled: targetData.enabled,
internalPort: internalPortToCreate
internalPort: internalPortToCreate,
path: targetData.path,
pathMatchType: targetData.pathMatchType
})
.returning();
@@ -121,6 +123,7 @@ export async function updateResources(
const protocol =
resourceData.protocol == "http" ? "tcp" : resourceData.protocol;
const resourceEnabled = resourceData.enabled == undefined || resourceData.enabled == null ? true : resourceData.enabled;
const resourceSsl = resourceData.ssl == undefined || resourceData.ssl == null ? true : resourceData.ssl;
let headers = "";
for (const headerObj of resourceData.headers || []) {
for (const [key, value] of Object.entries(headerObj)) {
@@ -165,7 +168,7 @@ export async function updateResources(
domainId: domain ? domain.domainId : null,
enabled: resourceEnabled,
sso: resourceData.auth?.["sso-enabled"] || false,
ssl: resourceData.ssl ? true : false,
ssl: resourceSsl,
setHostHeader: resourceData["host-header"] || null,
tlsServerName: resourceData["tls-server-name"] || null,
emailWhitelistEnabled: resourceData.auth?.[
@@ -311,7 +314,9 @@ export async function updateResources(
ip: targetData.hostname,
method: http ? targetData.method : null,
port: targetData.port,
enabled: targetData.enabled
enabled: targetData.enabled,
path: targetData.path,
pathMatchType: targetData.pathMatchType
})
.where(eq(targets.targetId, existingTarget.targetId))
.returning();
@@ -395,7 +400,7 @@ export async function updateResources(
sso: resourceData.auth?.["sso-enabled"] || false,
setHostHeader: resourceData["host-header"] || null,
tlsServerName: resourceData["tls-server-name"] || null,
ssl: resourceData.ssl ? true : false,
ssl: resourceSsl,
headers: headers || null
})
.returning();

View File

@@ -13,6 +13,8 @@ export const TargetSchema = z.object({
port: z.number().int().min(1).max(65535),
enabled: z.boolean().optional().default(true),
"internal-port": z.number().int().min(1).max(65535).optional(),
path: z.string().optional(),
pathMatchType: z.enum(["exact", "prefix", "regex"]).optional().nullable()
});
export type TargetData = z.infer<typeof TargetSchema>;

View File

@@ -30,7 +30,9 @@ const createTargetSchema = z
ip: z.string().refine(isTargetValid),
method: z.string().optional().nullable(),
port: z.number().int().min(1).max(65535),
enabled: z.boolean().default(true)
enabled: z.boolean().default(true),
path: z.string().optional().nullable(),
pathMatchType: z.enum(["exact", "prefix", "regex"]).optional().nullable()
})
.strict();

View File

@@ -44,7 +44,9 @@ function queryTargets(resourceId: number) {
enabled: targets.enabled,
resourceId: targets.resourceId,
siteId: targets.siteId,
siteType: sites.type
siteType: sites.type,
path: targets.path,
pathMatchType: targets.pathMatchType
})
.from(targets)
.leftJoin(sites, eq(sites.siteId, targets.siteId))

View File

@@ -26,7 +26,9 @@ const updateTargetBodySchema = z
ip: z.string().refine(isTargetValid),
method: z.string().min(1).max(10).optional().nullable(),
port: z.number().int().min(1).max(65535).optional(),
enabled: z.boolean().optional()
enabled: z.boolean().optional(),
path: z.string().optional().nullable(),
pathMatchType: z.enum(["exact", "prefix", "regex"]).optional().nullable()
})
.strict()
.refine((data) => Object.keys(data).length > 0, {

View File

@@ -101,8 +101,42 @@ const addTargetSchema = z.object({
ip: z.string().refine(isTargetValid),
method: z.string().nullable(),
port: z.coerce.number().int().positive(),
siteId: z.number().int().positive()
});
siteId: z.number().int().positive(),
path: z.string().optional().nullable(),
pathMatchType: z.enum(["exact", "prefix", "regex"]).optional().nullable()
}).refine(
(data) => {
// If path is provided, pathMatchType must be provided
if (data.path && !data.pathMatchType) {
return false;
}
// If pathMatchType is provided, path must be provided
if (data.pathMatchType && !data.path) {
return false;
}
// Validate path based on pathMatchType
if (data.path && data.pathMatchType) {
switch (data.pathMatchType) {
case "exact":
case "prefix":
// Path should start with /
return data.path.startsWith("/");
case "regex":
// Validate regex
try {
new RegExp(data.path);
return true;
} catch {
return false;
}
}
}
return true;
},
{
message: "Invalid path configuration"
}
);
const targetsSettingsSchema = z.object({
stickySession: z.boolean()
@@ -221,7 +255,9 @@ export default function ReverseProxyTargets(props: {
defaultValues: {
ip: "",
method: resource.http ? "http" : null,
port: "" as any as number
port: "" as any as number,
path: null,
pathMatchType: null
} as z.infer<typeof addTargetSchema>
});
@@ -396,6 +432,8 @@ export default function ReverseProxyTargets(props: {
const newTarget: LocalTarget = {
...data,
path: data.path || null,
pathMatchType: data.pathMatchType || null,
siteType: site?.type || null,
enabled: true,
targetId: new Date().getTime(),
@@ -407,7 +445,9 @@ export default function ReverseProxyTargets(props: {
addTargetForm.reset({
ip: "",
method: resource.http ? "http" : null,
port: "" as any as number
port: "" as any as number,
path: null,
pathMatchType: null
});
}
@@ -450,7 +490,9 @@ export default function ReverseProxyTargets(props: {
port: target.port,
method: target.method,
enabled: target.enabled,
siteId: target.siteId
siteId: target.siteId,
path: target.path,
pathMatchType: target.pathMatchType
};
if (target.new) {
@@ -720,6 +762,87 @@ export default function ReverseProxyTargets(props: {
/>
)
},
{
accessorKey: "path",
header: t("path"),
cell: ({ row }) => {
const [showPathInput, setShowPathInput] = useState(
!!(row.original.path || row.original.pathMatchType)
);
if (!showPathInput) {
return (
<Button
variant="outline"
onClick={() => setShowPathInput(true)}
>
+ Path
</Button>
);
}
return (
<div className="flex gap-2 min-w-[200px]">
<Select
defaultValue={row.original.pathMatchType || "exact"}
onValueChange={(value) =>
updateTarget(row.original.targetId, {
...row.original,
pathMatchType: value as "exact" | "prefix" | "regex"
})
}
>
<SelectTrigger className="w-25">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="exact">Exact</SelectItem>
<SelectItem value="prefix">Prefix</SelectItem>
<SelectItem value="regex">Regex</SelectItem>
</SelectContent>
</Select>
<Input
placeholder={
row.original.pathMatchType === "regex"
? "^/api/.*"
: "/path"
}
defaultValue={row.original.path || ""}
className="flex-1 min-w-[150px]"
onBlur={(e) => {
const value = e.target.value.trim();
if (!value) {
setShowPathInput(false);
updateTarget(row.original.targetId, {
...row.original,
path: null,
pathMatchType: null
});
} else {
updateTarget(row.original.targetId, {
...row.original,
path: value
});
}
}}
/>
<Button
variant="outline"
onClick={() => {
setShowPathInput(false);
updateTarget(row.original.targetId, {
...row.original,
path: null,
pathMatchType: null
});
}}
>
×
</Button>
</div>
);
}
},
// {
// accessorKey: "protocol",
// header: t('targetProtocol'),

View File

@@ -112,8 +112,42 @@ const addTargetSchema = z.object({
ip: z.string().refine(isTargetValid),
method: z.string().nullable(),
port: z.coerce.number().int().positive(),
siteId: z.number().int().positive()
});
siteId: z.number().int().positive(),
path: z.string().optional().nullable(),
pathMatchType: z.enum(["exact", "prefix", "regex"]).optional().nullable()
}).refine(
(data) => {
// If path is provided, pathMatchType must be provided
if (data.path && !data.pathMatchType) {
return false;
}
// If pathMatchType is provided, path must be provided
if (data.pathMatchType && !data.path) {
return false;
}
// Validate path based on pathMatchType
if (data.path && data.pathMatchType) {
switch (data.pathMatchType) {
case "exact":
case "prefix":
// Path should start with /
return data.path.startsWith("/");
case "regex":
// Validate regex
try {
new RegExp(data.path);
return true;
} catch {
return false;
}
}
}
return true;
},
{
message: "Invalid path configuration"
}
);
type BaseResourceFormValues = z.infer<typeof baseResourceFormSchema>;
type HttpResourceFormValues = z.infer<typeof httpResourceFormSchema>;
@@ -202,7 +236,9 @@ export default function Page() {
defaultValues: {
ip: "",
method: baseForm.watch("http") ? "http" : null,
port: "" as any as number
port: "" as any as number,
path: null,
pathMatchType: null
} as z.infer<typeof addTargetSchema>
});
@@ -273,6 +309,8 @@ export default function Page() {
const newTarget: LocalTarget = {
...data,
path: data.path || null,
pathMatchType: data.pathMatchType || null,
siteType: site?.type || null,
enabled: true,
targetId: new Date().getTime(),
@@ -284,7 +322,9 @@ export default function Page() {
addTargetForm.reset({
ip: "",
method: baseForm.watch("http") ? "http" : null,
port: "" as any as number
port: "" as any as number,
path: null,
pathMatchType: null
});
}
@@ -370,7 +410,9 @@ export default function Page() {
port: target.port,
method: target.method,
enabled: target.enabled,
siteId: target.siteId
siteId: target.siteId,
path: target.path,
pathMatchType: target.pathMatchType
};
await api.put(`/resource/${id}/target`, data);
@@ -666,6 +708,87 @@ export default function Page() {
/>
)
},
{
accessorKey: "path",
header: t("path"),
cell: ({ row }) => {
const [showPathInput, setShowPathInput] = useState(
!!(row.original.path || row.original.pathMatchType)
);
if (!showPathInput) {
return (
<Button
variant="outline"
onClick={() => setShowPathInput(true)}
>
+ Path
</Button>
);
}
return (
<div className="flex gap-2 min-w-[200px]">
<Select
defaultValue={row.original.pathMatchType || "exact"}
onValueChange={(value) =>
updateTarget(row.original.targetId, {
...row.original,
pathMatchType: value as "exact" | "prefix" | "regex"
})
}
>
<SelectTrigger className="w-25">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="exact">Exact</SelectItem>
<SelectItem value="prefix">Prefix</SelectItem>
<SelectItem value="regex">Regex</SelectItem>
</SelectContent>
</Select>
<Input
placeholder={
row.original.pathMatchType === "regex"
? "^/api/.*"
: "/path"
}
defaultValue={row.original.path || ""}
className="flex-1 min-w-[150px]"
onBlur={(e) => {
const value = e.target.value.trim();
if (!value) {
setShowPathInput(false);
updateTarget(row.original.targetId, {
...row.original,
path: null,
pathMatchType: null
});
} else {
updateTarget(row.original.targetId, {
...row.original,
path: value
});
}
}}
/>
<Button
variant="outline"
onClick={() => {
setShowPathInput(false);
updateTarget(row.original.targetId, {
...row.original,
path: null,
pathMatchType: null
});
}}
>
×
</Button>
</div>
);
}
},
{
accessorKey: "enabled",
header: t("enabled"),