openstatus.dev
Openstatus
www.openstatus.dev
fix: region code formatter (#1425)
authored by
Maximilian Kaske
and committed by
GitHub
6c74a62c
0935d8dc
+193
-146
+2
-2
apps/dashboard/src/components/controls-search/command-region.tsx
+2
-2
apps/dashboard/src/components/controls-search/command-region.tsx
···
25
25
import { REGIONS } from "@/data/metrics.client";
26
26
import { useTRPC } from "@/lib/trpc/client";
27
27
import { cn } from "@/lib/utils";
28
-
import { groupByContinent } from "@openstatus/utils";
28
+
import { formatRegionCode, groupByContinent } from "@openstatus/utils";
29
29
import { useQuery } from "@tanstack/react-query";
30
30
import { Check, Lock } from "lucide-react";
31
31
import { parseAsArrayOf, parseAsStringLiteral, useQueryState } from "nuqs";
···
129
129
className="size-3"
130
130
/>
131
131
<span className="font-mono">
132
-
{region.code.replace(/(koyeb_|railway_|fly_)/g, "")}
132
+
{formatRegionCode(region.code)}
133
133
</span>
134
134
<span className="truncate text-muted-foreground text-xs">
135
135
{region.location}
+2
-3
apps/dashboard/src/components/data-table/response-logs/regions/columns.tsx
+2
-3
apps/dashboard/src/components/data-table/response-logs/regions/columns.tsx
···
12
12
} from "@/components/ui/tooltip";
13
13
import type { RegionMetric } from "@/data/region-metrics";
14
14
import { getActions } from "@/data/region-metrics.client";
15
-
import { regionDict } from "@openstatus/utils";
15
+
import { formatRegionCode, regionDict } from "@openstatus/utils";
16
16
import type { ColumnDef } from "@tanstack/react-table";
17
17
// import { toast } from "sonner";
18
18
import { useRouter } from "next/navigation";
···
33
33
<TooltipProvider>
34
34
<Tooltip>
35
35
<TooltipTrigger className="flex h-[50px] items-center gap-1">
36
-
{region.flag}{" "}
37
-
{region.code.replace(/(koyeb_|railway_|fly_)/g, "")}
36
+
{region.flag} {formatRegionCode(region.code)}
38
37
</TooltipTrigger>
39
38
<TooltipContent side="left">
40
39
{region.location} ({region.provider})
+2
-5
apps/dashboard/src/components/forms/monitor/form-scheduling-regions.tsx
+2
-5
apps/dashboard/src/components/forms/monitor/form-scheduling-regions.tsx
···
37
37
import { Note, NoteButton } from "@/components/common/note";
38
38
import { UpgradeDialog } from "@/components/dialogs/upgrade";
39
39
import { useTRPC } from "@/lib/trpc/client";
40
-
import { groupByContinent } from "@openstatus/utils";
40
+
import { formatRegionCode, groupByContinent } from "@openstatus/utils";
41
41
import { useQuery } from "@tanstack/react-query";
42
42
import { isTRPCClientError } from "@trpc/client";
43
43
import { CircleX, Info } from "lucide-react";
···
298
298
className="w-full truncate font-mono font-normal text-sm"
299
299
>
300
300
<span className="text-nowrap">
301
-
{region.code.replace(
302
-
/(koyeb_|railway_|fly_)/g,
303
-
"",
304
-
)}{" "}
301
+
{formatRegionCode(region.code)}{" "}
305
302
{region.flag}
306
303
</span>
307
304
<span className="truncate font-normal text-muted-foreground text-xs leading-[inherit]">
+156
apps/web/src/app/(pages)/(content)/play/checker/api/mock.ts
+156
apps/web/src/app/(pages)/(content)/play/checker/api/mock.ts
···
1619
1619
},
1620
1620
region: "koyeb_was",
1621
1621
},
1622
+
{
1623
+
type: "http",
1624
+
state: "success",
1625
+
status: 200,
1626
+
latency: 1100,
1627
+
headers: {
1628
+
Age: "0",
1629
+
"Cache-Control":
1630
+
"private, no-cache, no-store, max-age=0, must-revalidate",
1631
+
"Content-Type": "text/html; charset=utf-8",
1632
+
Date: "Fri, 23 Aug 2024 12:17:58 GMT",
1633
+
Link: '</_next/static/media/162bf645eb375add-s.p.ttf>; rel=preload; as="font"; crossorigin=""; type="font/ttf", </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; rel=preload; as="font"; crossorigin=""; type="font/woff2"',
1634
+
Server: "Railway",
1635
+
"Set-Cookie":
1636
+
"__Host-authjs.csrf-token=e5f6a7b8c9d0e1f2a3b4c5d6e7f8a9b0c1d2e3f4a5b6c7d8e9f0a1b2c3d4e5f6a7b8c%7C0d1e2f3a4b5c6d7e8f9a0b1c2d3e4f5a6b7c8d9e0f1a2b3c4d5e6f7a8b9c0d1e2f3a; Path=/; HttpOnly; Secure; SameSite=Lax",
1637
+
"Strict-Transport-Security": "max-age=63072000",
1638
+
Vary: "RSC, Next-Router-State-Tree, Next-Router-Prefetch",
1639
+
"X-Matched-Path": "/",
1640
+
"X-Powered-By": "Next.js",
1641
+
"X-Railway-Cache": "MISS",
1642
+
"X-Railway-Execution-Region": "us-west2",
1643
+
"X-Railway-Id":
1644
+
"railway-us-west2::us-west2::klm345-1724415477600-nop67890",
1645
+
},
1646
+
timestamp: 1724415477600,
1647
+
timing: {
1648
+
dnsStart: 1724415477700,
1649
+
dnsDone: 1724415477702,
1650
+
connectStart: 1724415477702,
1651
+
connectDone: 1724415477703,
1652
+
tlsHandshakeStart: 1724415477703,
1653
+
tlsHandshakeDone: 1724415477720,
1654
+
firstByteStart: 1724415477720,
1655
+
firstByteDone: 1724415478720,
1656
+
transferStart: 1724415478720,
1657
+
transferDone: 1724415478720,
1658
+
},
1659
+
region: "railway_us-west2",
1660
+
},
1661
+
{
1662
+
type: "http",
1663
+
state: "success",
1664
+
status: 200,
1665
+
latency: 1201,
1666
+
headers: {
1667
+
Age: "0",
1668
+
"Cache-Control":
1669
+
"private, no-cache, no-store, max-age=0, must-revalidate",
1670
+
"Content-Type": "text/html; charset=utf-8",
1671
+
Date: "Fri, 23 Aug 2024 12:17:58 GMT",
1672
+
Link: '</_next/static/media/162bf645eb375add-s.p.ttf>; rel=preload; as="font"; crossorigin=""; type="font/ttf", </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; rel=preload; as="font"; crossorigin=""; type="font/woff2"',
1673
+
Server: "Railway",
1674
+
"Set-Cookie":
1675
+
"__Host-authjs.csrf-token=e5f6a7b8c9d0e1f2a3b4c5d6e7f8a9b0c1d2e3f4a5b6c7d8e9f0a1b2c3d4e5f6a7b8c%7C0d1e2f3a4b5c6d7e8f9a0b1c2d3e4f5a6b7c8d9e0f1a2b3c4d5e6f7a8b9c0d1e2f3a; Path=/; HttpOnly; Secure; SameSite=Lax",
1676
+
"Strict-Transport-Security": "max-age=63072000",
1677
+
Vary: "RSC, Next-Router-State-Tree, Next-Router-Prefetch",
1678
+
"X-Matched-Path": "/",
1679
+
"X-Powered-By": "Next.js",
1680
+
"X-Railway-Cache": "MISS",
1681
+
"X-Railway-Execution-Region": "us-west2",
1682
+
"X-Railway-Id":
1683
+
"railway-us-west2::us-west2::klm345-1724415477600-nop67890",
1684
+
},
1685
+
timestamp: 1724415477700,
1686
+
timing: {
1687
+
dnsStart: 1724415477800,
1688
+
dnsDone: 1724415477802,
1689
+
connectStart: 1724415477802,
1690
+
connectDone: 1724415477803,
1691
+
tlsHandshakeStart: 1724415477803,
1692
+
tlsHandshakeDone: 1724415477820,
1693
+
firstByteStart: 1724415477820,
1694
+
firstByteDone: 1724415478820,
1695
+
transferStart: 1724415478820,
1696
+
transferDone: 1724415478820,
1697
+
},
1698
+
region: "railway_us-east4-eqdc4a",
1699
+
},
1700
+
{
1701
+
type: "http",
1702
+
state: "success",
1703
+
status: 200,
1704
+
latency: 612,
1705
+
headers: {
1706
+
Age: "0",
1707
+
"Cache-Control":
1708
+
"private, no-cache, no-store, max-age=0, must-revalidate",
1709
+
"Content-Type": "text/html; charset=utf-8",
1710
+
Date: "Fri, 23 Aug 2024 12:17:58 GMT",
1711
+
Link: '</_next/static/media/162bf645eb375add-s.p.ttf>; rel=preload; as="font"; crossorigin=""; type="font/ttf", </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; rel=preload; as="font"; crossorigin=""; type="font/woff2"',
1712
+
Server: "Railway",
1713
+
"Set-Cookie":
1714
+
"__Host-authjs.csrf-token=e5f6a7b8c9d0e1f2a3b4c5d6e7f8a9b0c1d2e3f4a5b6c7d8e9f0a1b2c3d4e5f6a7b8c%7C0d1e2f3a4b5c6d7e8f9a0b1c2d3e4f5a6b7c8d9e0f1a2b3c4d5e6f7a8b9c0d1e2f3a; Path=/; HttpOnly; Secure; SameSite=Lax",
1715
+
"Strict-Transport-Security": "max-age=63072000",
1716
+
Vary: "RSC, Next-Router-State-Tree, Next-Router-Prefetch",
1717
+
"X-Matched-Path": "/",
1718
+
"X-Powered-By": "Next.js",
1719
+
"X-Railway-Cache": "MISS",
1720
+
"X-Railway-Execution-Region": "us-west2",
1721
+
"X-Railway-Id":
1722
+
"railway-us-west2::us-west2::klm345-1724415477600-nop67890",
1723
+
},
1724
+
timestamp: 1724415477800,
1725
+
timing: {
1726
+
dnsStart: 1724415477900,
1727
+
dnsDone: 1724415477902,
1728
+
connectStart: 1724415477902,
1729
+
connectDone: 1724415477903,
1730
+
tlsHandshakeStart: 1724415477903,
1731
+
tlsHandshakeDone: 1724415477920,
1732
+
firstByteStart: 1724415477920,
1733
+
firstByteDone: 1724415478920,
1734
+
transferStart: 1724415478920,
1735
+
transferDone: 1724415478920,
1736
+
},
1737
+
region: "railway_europe-west4-drams3a",
1738
+
},
1739
+
{
1740
+
type: "http",
1741
+
state: "success",
1742
+
status: 200,
1743
+
latency: 705,
1744
+
headers: {
1745
+
Age: "0",
1746
+
"Cache-Control":
1747
+
"private, no-cache, no-store, max-age=0, must-revalidate",
1748
+
"Content-Type": "text/html; charset=utf-8",
1749
+
Date: "Fri, 23 Aug 2024 12:17:58 GMT",
1750
+
Link: '</_next/static/media/162bf645eb375add-s.p.ttf>; rel=preload; as="font"; crossorigin=""; type="font/ttf", </_next/static/media/a34f9d1faa5f3315-s.p.woff2>; rel=preload; as="font"; crossorigin=""; type="font/woff2"',
1751
+
Server: "Railway",
1752
+
"Set-Cookie":
1753
+
"__Host-authjs.csrf-token=e5f6a7b8c9d0e1f2a3b4c5d6e7f8a9b0c1d2e3f4a5b6c7d8e9f0a1b2c3d4e5f6a7b8c%7C0d1e2f3a4b5c6d7e8f9a0b1c2d3e4f5a6b7c8d9e0f1a2b3c4d5e6f7a8b9c0d1e2f3a; Path=/; HttpOnly; Secure; SameSite=Lax",
1754
+
"Strict-Transport-Security": "max-age=63072000",
1755
+
Vary: "RSC, Next-Router-State-Tree, Next-Router-Prefetch",
1756
+
"X-Matched-Path": "/",
1757
+
"X-Powered-By": "Next.js",
1758
+
"X-Railway-Cache": "MISS",
1759
+
"X-Railway-Execution-Region": "us-west2",
1760
+
"X-Railway-Id":
1761
+
"railway-us-west2::us-west2::klm345-1724415477600-nop67890",
1762
+
},
1763
+
timestamp: 1724415477900,
1764
+
timing: {
1765
+
dnsStart: 1724415478000,
1766
+
dnsDone: 1724415478002,
1767
+
connectStart: 1724415478002,
1768
+
connectDone: 1724415478003,
1769
+
tlsHandshakeStart: 1724415478003,
1770
+
tlsHandshakeDone: 1724415478020,
1771
+
firstByteStart: 1724415478020,
1772
+
firstByteDone: 1724415479020,
1773
+
transferStart: 1724415479020,
1774
+
transferDone: 1724415479020,
1775
+
},
1776
+
region: "railway_asia-southeast1-eqsg3a",
1777
+
},
1622
1778
],
1623
1779
};
+7
-2
apps/web/src/components/forms/monitor/select-region.tsx
+7
-2
apps/web/src/components/forms/monitor/select-region.tsx
···
17
17
PopoverContent,
18
18
PopoverTrigger,
19
19
} from "@openstatus/ui/src/components/popover";
20
-
import { type Continent, type RegionInfo, regionDict } from "@openstatus/utils";
20
+
import {
21
+
type Continent,
22
+
type RegionInfo,
23
+
formatRegionCode,
24
+
regionDict,
25
+
} from "@openstatus/utils";
21
26
22
27
import { cn } from "@/lib/utils";
23
28
import {
···
118
123
</div>
119
124
<div className="flex w-full justify-between">
120
125
<span>
121
-
{code.replace(/(koyeb_|railway_|fly_)/g, "")}{" "}
126
+
{formatRegionCode(code)}{" "}
122
127
<span className="truncate text-muted-foreground">
123
128
{location}
124
129
</span>
+7
-2
apps/web/src/components/monitor-dashboard/region-preset.tsx
+7
-2
apps/web/src/components/monitor-dashboard/region-preset.tsx
···
17
17
PopoverContent,
18
18
PopoverTrigger,
19
19
} from "@openstatus/ui/src/components/popover";
20
-
import { type Continent, type RegionInfo, regionDict } from "@openstatus/utils";
20
+
import {
21
+
type Continent,
22
+
type RegionInfo,
23
+
formatRegionCode,
24
+
regionDict,
25
+
} from "@openstatus/utils";
21
26
22
27
import { IconCloudProvider } from "@/components/icon-cloud-provider";
23
28
import { cn } from "@/lib/utils";
···
142
147
<IconCloudProvider provider={region.provider} />
143
148
</span>
144
149
<span>
145
-
{code.replace(/(koyeb_|railway_|fly_)/g, "")}{" "}
150
+
{formatRegionCode(code)}{" "}
146
151
<span className="truncate text-muted-foreground">
147
152
{location}
148
153
</span>
+4
-5
apps/web/src/components/ping-response-analysis/columns.tsx
+4
-5
apps/web/src/components/ping-response-analysis/columns.tsx
···
12
12
HoverCardPortal,
13
13
HoverCardTrigger,
14
14
} from "@openstatus/ui";
15
-
import { regionDict } from "@openstatus/utils";
15
+
import { formatRegionCode, regionDict } from "@openstatus/utils";
16
16
17
17
export const columns: ColumnDef<RegionChecker>[] = [
18
18
{
···
21
21
header: "Region",
22
22
cell: ({ row }) => {
23
23
const region = regionDict[row.original.region];
24
+
const code = formatRegionCode(row.original.region);
24
25
return (
25
26
<div className="flex items-center gap-1.5">
26
27
<IconCloudProviderTooltip provider={region.provider} />
27
-
<div>
28
-
<span className="font-mono">
29
-
{row.original.region.replace(/(koyeb_|railway_|fly_)/g, "")}
30
-
</span>{" "}
28
+
<div className="truncate">
29
+
<span className="font-mono">{code}</span>{" "}
31
30
<span className="text-muted-foreground">
32
31
{regionFormatter(row.original.region, "long")}
33
32
</span>
+2
-2
apps/web/src/components/ping-response-analysis/multi-region-chart.tsx
+2
-2
apps/web/src/components/ping-response-analysis/multi-region-chart.tsx
···
14
14
ChartTooltip,
15
15
ChartTooltipContent,
16
16
} from "@openstatus/ui/src/components/chart";
17
-
import { regionDict } from "@openstatus/utils";
17
+
import { formatRegionCode, regionDict } from "@openstatus/utils";
18
18
19
19
const chartConfig = {
20
20
dns: {
···
79
79
transform="rotate(-35)"
80
80
className="font-mono"
81
81
>
82
-
{payload.value.replace(/(koyeb_|railway_|fly_)/g, "")}
82
+
{formatRegionCode(payload.value)}
83
83
</text>
84
84
</g>
85
85
);
+1
apps/web/src/components/ping-response-analysis/multi-region-tabs.tsx
+1
apps/web/src/components/ping-response-analysis/multi-region-tabs.tsx
+10
-125
packages/utils/index.ts
+10
-125
packages/utils/index.ts
···
1
-
/**
2
-
* AWS data center informations from 18 regions, supported by vercel.
3
-
* https://vercel.com/docs/concepts/edge-network/regions#region-list
4
-
*/
5
-
6
1
import type { Region } from "@openstatus/db/src/schema/constants";
7
2
8
3
import { base } from "@openstatus/assertions";
9
4
import { monitorMethods, monitorStatus } from "@openstatus/db/src/schema";
10
5
11
6
import { z } from "zod";
12
-
// export const vercelRegionsDict = {
13
-
// /**
14
-
// * A random location will be chosen
15
-
// */
16
-
// auto: {
17
-
// code: "auto",
18
-
// name: "random",
19
-
// location: "Random",
20
-
// flag: "🌍",
21
-
// },
22
-
// arn1: {
23
-
// code: "arn1",
24
-
// name: "eu-north-1",
25
-
// location: "Stockholm, Sweden",
26
-
// flag: "🇸🇪",
27
-
// },
28
-
// bom1: {
29
-
// code: "bom1",
30
-
// name: "ap-south-1",
31
-
// location: "Mumbai, India",
32
-
// flag: "🇮🇳",
33
-
// },
34
-
// cdg1: {
35
-
// code: "cdg1",
36
-
// name: "eu-west-3",
37
-
// location: "Paris, France",
38
-
// flag: "🇫🇷",
39
-
// },
40
-
// cle1: {
41
-
// code: "cle1",
42
-
// name: "us-east-2",
43
-
// location: "Cleveland, USA",
44
-
// flag: "🇺🇸",
45
-
// },
46
-
// cpt1: {
47
-
// code: "cpt1",
48
-
// name: "af-south-1",
49
-
// location: "Cape Town, South Africa",
50
-
// flag: "🇿🇦",
51
-
// },
52
-
// dub1: {
53
-
// code: "dub1",
54
-
// name: "eu-west-1",
55
-
// location: "Dublin, Ireland",
56
-
// flag: "🇮🇪",
57
-
// },
58
-
// fra1: {
59
-
// code: "fra1",
60
-
// name: "eu-central-1",
61
-
// location: "Frankfurt, Germany",
62
-
// flag: "🇩🇪",
63
-
// },
64
-
// gru1: {
65
-
// code: "gru1",
66
-
// name: "sa-east-1",
67
-
// location: "São Paulo, Brazil",
68
-
// flag: "🇧🇷",
69
-
// },
70
-
// hkg1: {
71
-
// code: "hkg1",
72
-
// name: "ap-east-1",
73
-
// location: "Hong Kong",
74
-
// flag: "🇭🇰",
75
-
// },
76
-
// hnd1: {
77
-
// code: "hnd1",
78
-
// name: "ap-northeast-1",
79
-
// location: "Tokyo, Japan",
80
-
// flag: "🇯🇵",
81
-
// },
82
-
// iad1: {
83
-
// code: "iad1",
84
-
// name: "us-east-1",
85
-
// location: "Washington, D.C., USA",
86
-
// flag: "🇺🇸",
87
-
// },
88
-
// icn1: {
89
-
// code: "icn1",
90
-
// name: "ap-northeast-2",
91
-
// location: "Seoul, South Korea",
92
-
// flag: "🇰🇷",
93
-
// },
94
-
// kix1: {
95
-
// code: "kix1",
96
-
// name: "ap-northeast-3",
97
-
// location: "Osaka, Japan",
98
-
// flag: "🇯🇵",
99
-
// },
100
-
// lhr1: {
101
-
// code: "lhr1",
102
-
// name: "eu-west-2",
103
-
// location: "London, United Kingdom",
104
-
// flag: "🇬🇧",
105
-
// },
106
-
// pdx1: {
107
-
// code: "pdx1",
108
-
// name: "us-west-2",
109
-
// location: "Portland, USA",
110
-
// flag: "🇺🇸",
111
-
// },
112
-
// sfo1: {
113
-
// code: "sfo1",
114
-
// name: "us-west-1",
115
-
// location: "San Francisco, USA",
116
-
// flag: "🇺🇸",
117
-
// },
118
-
// sin1: {
119
-
// code: "sin1",
120
-
// name: "ap-southeast-1",
121
-
// location: "Singapore",
122
-
// flag: "🇸🇬",
123
-
// },
124
-
// syd1: {
125
-
// code: "syd1",
126
-
// name: "ap-southeast-2",
127
-
// location: "Sydney, Australia",
128
-
// flag: "🇦🇺",
129
-
// },
130
-
// } as const;
131
7
132
8
export type Continent =
133
9
| "Europe"
···
474
350
},
475
351
} as const;
476
352
477
-
// const r = t.flatMap((u) => u[1].continent);
353
+
export function formatRegionCode(region: RegionInfo | Region) {
354
+
const r = typeof region === "string" ? regionDict[region] : region;
355
+
const suffix = r.code.replace(/(koyeb_|railway_|fly_)/g, "");
356
+
357
+
if (r.provider === "railway") {
358
+
return suffix.replace(/(-eqdc4a|-eqsg3a|-drams3a)/g, "");
359
+
}
360
+
361
+
return suffix;
362
+
}
478
363
479
364
export const groupByContinent = Object.entries(regionDict).reduce<
480
365
Record<Continent, RegionInfo[]>