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

align template rules table columns with resource rules page

Browse Source
This commit is contained in:
Adrian Astles
2025-08-07 23:14:24 +08:00
parent 9dce7b2cde
commit 2cb2a115b0
1 changed files with 61 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
src/components/ruleTemplate/TemplateRulesManager.tsx
View File

@@ -76,6 +76,17 @@ export function TemplateRulesManager({ templateId, orgId }: TemplateRulesManager
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [addingRule, setAddingRule] = useState(false); const [addingRule, setAddingRule] = useState(false);
const RuleAction = {
ACCEPT: t('alwaysAllow'),
DROP: t('alwaysDeny')
} as const;
const RuleMatch = {
PATH: t('path'),
IP: "IP",
CIDR: t('ipAddressRange')
} as const;
const form = useForm<z.infer<typeof addRuleSchema>>({ const form = useForm<z.infer<typeof addRuleSchema>>({
resolver: zodResolver(addRuleSchema), resolver: zodResolver(addRuleSchema),
defaultValues: { defaultValues: {
@@ -183,72 +194,93 @@ export function TemplateRulesManager({ templateId, orgId }: TemplateRulesManager
const columns: ColumnDef<TemplateRule>[] = [ const columns: ColumnDef<TemplateRule>[] = [
{ {
accessorKey: "priority", accessorKey: "priority",
header: ({ column }) => ( header: ({ column }) => {
<Button return (
variant="ghost" <Button
onClick={() => column.toggleSorting(column.getIsSorted() === "asc")} variant="ghost"
> onClick={() =>
Priority column.toggleSorting(column.getIsSorted() === "asc")
<ArrowUpDown className="ml-2 h-4 w-4" /> }
</Button> >
), {t('rulesPriority')}
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
);
},
cell: ({ row }) => ( cell: ({ row }) => (
<Input <Input
type="number"
defaultValue={row.original.priority} defaultValue={row.original.priority}
className="w-20" className="w-[75px]"
onBlur={(e) => type="number"
onBlur={(e) => {
const parsed = z.coerce
.number()
.int()
.optional()
.safeParse(e.target.value);
if (!parsed.data) {
toast({
variant: "destructive",
title: t('rulesErrorInvalidIpAddress'),
description: t('rulesErrorInvalidPriorityDescription')
});
return;
}
updateRule(row.original.ruleId, { updateRule(row.original.ruleId, {
priority: parseInt(e.target.value, 10) priority: parsed.data
}) });
} }}
/> />
) )
}, },
{ {
accessorKey: "action", accessorKey: "action",
header: "Action", header: t('rulesAction'),
cell: ({ row }) => ( cell: ({ row }) => (
<Select <Select
defaultValue={row.original.action} defaultValue={row.original.action}
onValueChange={(value) => onValueChange={(value: "ACCEPT" | "DROP") =>
updateRule(row.original.ruleId, { action: value }) updateRule(row.original.ruleId, { action: value })
} }
> >
<SelectTrigger className="w-24"> <SelectTrigger className="min-w-[150px]">
<SelectValue /> <SelectValue />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
<SelectItem value="ACCEPT">Accept</SelectItem> <SelectItem value="ACCEPT">
<SelectItem value="DROP">Drop</SelectItem> {RuleAction.ACCEPT}
</SelectItem>
<SelectItem value="DROP">{RuleAction.DROP}</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
) )
}, },
{ {
accessorKey: "match", accessorKey: "match",
header: "Match", header: t('rulesMatchType'),
cell: ({ row }) => ( cell: ({ row }) => (
<Select <Select
defaultValue={row.original.match} defaultValue={row.original.match}
onValueChange={(value) => onValueChange={(value: "CIDR" | "IP" | "PATH") =>
updateRule(row.original.ruleId, { match: value }) updateRule(row.original.ruleId, { match: value })
} }
> >
<SelectTrigger className="w-24"> <SelectTrigger className="min-w-[125px]">
<SelectValue /> <SelectValue />
</SelectTrigger> </SelectTrigger>
<SelectContent> <SelectContent>
<SelectItem value="IP">IP</SelectItem> <SelectItem value="PATH">{RuleMatch.PATH}</SelectItem>
<SelectItem value="CIDR">CIDR</SelectItem> <SelectItem value="IP">{RuleMatch.IP}</SelectItem>
<SelectItem value="PATH">Path</SelectItem> <SelectItem value="CIDR">{RuleMatch.CIDR}</SelectItem>
</SelectContent> </SelectContent>
</Select> </Select>
) )
}, },
{ {
accessorKey: "value", accessorKey: "value",
header: "Value", header: t('value'),
cell: ({ row }) => ( cell: ({ row }) => (
<Input <Input
defaultValue={row.original.value} defaultValue={row.original.value}
@@ -261,7 +293,7 @@ export function TemplateRulesManager({ templateId, orgId }: TemplateRulesManager
}, },
{ {
accessorKey: "enabled", accessorKey: "enabled",
header: "Enabled", header: t('enabled'),
cell: ({ row }) => ( cell: ({ row }) => (
<Switch <Switch
defaultChecked={row.original.enabled} defaultChecked={row.original.enabled}
@@ -276,10 +308,9 @@ export function TemplateRulesManager({ templateId, orgId }: TemplateRulesManager
cell: ({ row }) => ( cell: ({ row }) => (
<Button <Button
variant="outline" variant="outline"
size="sm"
onClick={() => removeRule(row.original.ruleId)} onClick={() => removeRule(row.original.ruleId)}
> >
<Trash2 className="h-4 w-4" /> {t('delete')}
</Button> </Button>
) )
} }