💄 show geoip flag in policy access rule tab

This commit is contained in:
Fred KISSIE
2026-06-23 23:45:59 +02:00
parent e104489257
commit bb7729df00

View File

@@ -74,6 +74,7 @@ import {
sortPolicyRulesForResourceOverlay, sortPolicyRulesForResourceOverlay,
type PolicyAccessRule type PolicyAccessRule
} from "./policy-access-rule-utils"; } from "./policy-access-rule-utils";
import { countryCodeToFlagEmoji } from "@app/lib/countryCodeToFlagEmoji";
export type PolicyAccessRulesTableProps = { export type PolicyAccessRulesTableProps = {
rules: PolicyAccessRule[]; rules: PolicyAccessRule[];
@@ -490,8 +491,17 @@ export function PolicyAccessRulesTable({
{ {
accessorKey: "value", accessorKey: "value",
header: () => <span className="p-3">{t("value")}</span>, header: () => <span className="p-3">{t("value")}</span>,
cell: ({ row }) => cell: ({ row }) => {
row.original.match === "COUNTRY" ? ( let selectedCountry: (typeof COUNTRIES)[number] | undefined;
if (
row.original.match === "COUNTRY" &&
row.original.value
) {
selectedCountry = COUNTRIES.find(
(c) => c.code === row.original.value
);
}
return row.original.match === "COUNTRY" ? (
<Popover> <Popover>
<PopoverTrigger asChild> <PopoverTrigger asChild>
<Button <Button
@@ -502,15 +512,22 @@ export function PolicyAccessRulesTable({
} }
className="w-full min-w-0 justify-between" className="w-full min-w-0 justify-between"
> >
{row.original.value {selectedCountry ? (
? COUNTRIES.find( <>
(c) => <span>
c.code === row.original.value {selectedCountry.code === "ALL"
)?.name + ? "🌍"
" (" + : countryCodeToFlagEmoji(
row.original.value + selectedCountry.code
")" )}
: t("selectCountry")} &nbsp;&nbsp;
{selectedCountry.name} (
{selectedCountry.code})
</span>
</>
) : (
t("selectCountry")
)}
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" /> <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button> </Button>
</PopoverTrigger> </PopoverTrigger>
@@ -540,6 +557,13 @@ export function PolicyAccessRulesTable({
<Check <Check
className={`mr-2 h-4 w-4 ${row.original.value === country.code ? "opacity-100" : "opacity-0"}`} className={`mr-2 h-4 w-4 ${row.original.value === country.code ? "opacity-100" : "opacity-0"}`}
/> />
<span>
{country.code === "ALL"
? "🌍"
: countryCodeToFlagEmoji(
country.code
)}
</span>
{country.name} ( {country.name} (
{country.code}) {country.code})
</CommandItem> </CommandItem>
@@ -767,7 +791,8 @@ export function PolicyAccessRulesTable({
}); });
}} }}
/> />
) );
}
}, },
{ {
accessorKey: "enabled", accessorKey: "enabled",