Skip to content

Commit 1daa32f

Browse files
EmyrkEmyrk
committed
Update proxy page for regions endpoint
1 parent 69ce5f0 commit 1daa32f

File tree

6 files changed

+48
-99
lines changed

6 files changed

+48
-99
lines changed

‎site/src/api/api.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -898,9 +898,9 @@ export const getFile = async (fileId: string): Promise<ArrayBuffer> => {
898898
}
899899

900900

901-
export const getWorkspaceProxies = async (): Promise<TypesGen.WorkspaceProxy[]> => {
902-
const response = await axios.get<TypesGen.WorkspaceProxy[]>(
903-
`/api/v2/workspaceproxies`,
901+
export const getWorkspaceProxies = async (): Promise<TypesGen.RegionsResponse> => {
902+
const response = await axios.get<TypesGen.RegionsResponse>(
903+
`/api/v2/regions`,
904904
{},
905905
)
906906
return response.data

‎site/src/api/typesGenerated.ts

+2-5
Original file line numberDiff line numberDiff line change
@@ -1258,7 +1258,6 @@ export interface WorkspaceOptions {
12581258
export interface WorkspaceProxy {
12591259
readonly id: string
12601260
readonly name: string
1261-
readonly display_name: string
12621261
readonly icon: string
12631262
readonly url: string
12641263
readonly wildcard_hostname: string
@@ -1480,15 +1479,13 @@ export const ProvisionerTypes: ProvisionerType[] = ["echo", "terraform"]
14801479

14811480
// From codersdk/workspaceproxy.go
14821481
export type ProxyHealthStatus =
1483-
| "ok"
1482+
| "reachable"
14841483
| "unhealthy"
1485-
| "unknown"
14861484
| "unreachable"
14871485
| "unregistered"
14881486
export const ProxyHealthStatuses: ProxyHealthStatus[] = [
1489-
"ok",
1487+
"reachable",
14901488
"unhealthy",
1491-
"unknown",
14921489
"unreachable",
14931490
"unregistered",
14941491
]

‎site/src/components/DeploySettingsLayout/Badges.tsx

+23
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,24 @@ export const EntitledBadge: FC = () => {
2222
)
2323
}
2424

25+
export const HealthyBadge: FC = () => {
26+
const styles = useStyles()
27+
return (
28+
<span className={combineClasses([styles.badge, styles.enabledBadge])}>
29+
Healthy
30+
</span>
31+
)
32+
}
33+
34+
export const NotHealthyBadge: FC = () => {
35+
const styles = useStyles()
36+
return (
37+
<span className={combineClasses([styles.badge, styles.errorBadge])}>
38+
Error
39+
</span>
40+
)
41+
}
42+
2543
export const DisabledBadge: FC = () => {
2644
const styles = useStyles()
2745
return (
@@ -92,6 +110,11 @@ const useStyles = makeStyles((theme) => ({
92110
backgroundColor: theme.palette.success.dark,
93111
},
94112

113+
errorBadge: {
114+
border: `1px solid ${theme.palette.error.light}`,
115+
backgroundColor: theme.palette.error.dark,
116+
},
117+
95118
disabledBadge: {
96119
border: `1px solid ${theme.palette.divider}`,
97120
backgroundColor: theme.palette.background.paper,

‎site/src/i18n/en/proxyPage.json

+1-37
Original file line numberDiff line numberDiff line change
@@ -14,42 +14,6 @@
1414
"table": {
1515
"icon": "Proxy",
1616
"url": "URL",
17-
"status": "Status",
18-
"expiresAt": "Expires At",
19-
"createdAt": "Created At"
20-
},
21-
"createToken": {
22-
"title": "Create Token",
23-
"detail": "All tokens are unscoped and therefore have full resource access.",
24-
"nameSection": {
25-
"title": "Name",
26-
"description": "What is this token for?"
27-
},
28-
"lifetimeSection": {
29-
"title": "Expiration",
30-
"description": "The token will expire on {{date}}.",
31-
"emptyDescription": "Please set a token expiration.",
32-
"7": "7 days",
33-
"30": "30 days",
34-
"60": "60 days",
35-
"90": "90 days",
36-
"custom": "Custom",
37-
"noExpiration": "No expiration",
38-
"expiresOn": "Expires on"
39-
},
40-
"fields": {
41-
"name": "Name",
42-
"lifetime": "Lifetime"
43-
},
44-
"footer": {
45-
"retry": "Retry",
46-
"submit": "Create token"
47-
},
48-
"createSuccess": "Token has been created",
49-
"createError": "Failed to create token",
50-
"successModal": {
51-
"title": "Creation successful",
52-
"description": "Make sure you copy the below token before proceeding:"
53-
}
17+
"status": "Status"
5418
}
5519
}

‎site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { useWorkspaceProxiesData } from "./hooks"
1313

1414
export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
1515
const styles = useStyles()
16-
const { t } = useTranslation("workspaceProxyPage")
16+
const { t } = useTranslation("proxyPage")
1717

1818
const description = (
1919
<Trans t={t} i18nKey="description" values={{}}>
@@ -28,7 +28,7 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
2828
// >(undefined)
2929

3030
const {
31-
data: proxies,
31+
data: response,
3232
error: getProxiesError,
3333
isFetching,
3434
isFetched,
@@ -43,7 +43,7 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
4343
layout="fluid"
4444
>
4545
<WorkspaceProxyPageView
46-
proxies={proxies}
46+
proxies={response ? response.regions : []}
4747
isLoading={isFetching}
4848
hasLoaded={isFetched}
4949
getWorkspaceProxiesError={getProxiesError}

‎site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyView.tsx

+16-51
Original file line numberDiff line numberDiff line change
@@ -13,31 +13,20 @@ import { FC } from "react"
1313
import { AlertBanner } from "components/AlertBanner/AlertBanner"
1414
import IconButton from "@material-ui/core/IconButton/IconButton"
1515
import { useTranslation } from "react-i18next"
16-
import { WorkspaceProxy } from "api/typesGenerated"
16+
import { Region } from "api/typesGenerated"
1717
import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
1818
import { Avatar } from "components/Avatar/Avatar"
1919
import { AvatarData } from "components/AvatarData/AvatarData"
20-
import {
21-
HelpTooltip,
22-
HelpTooltipText,
23-
HelpTooltipTitle,
24-
} from "components/Tooltips/HelpTooltip/HelpTooltip"
25-
import CheckCircleIcon from '@material-ui/icons/CheckCircle';
26-
// import LinkOffIcon from '@material-ui/icons/LinkOff';
27-
// import CancelIcon from '@material-ui/icons/Cancel';
28-
import SyncProblemIcon from '@material-ui/icons/SyncProblem';
29-
import SyncDisabledIcon from '@material-ui/icons/SyncDisabled';
30-
import SyncIcon from '@material-ui/icons/Sync';
31-
import HourglassEmptyIcon from '@material-ui/icons/HourglassEmpty';
32-
import WarningIcon from '@material-ui/icons/Warning';
20+
import { HealthyBadge, NotHealthyBadge } from "components/DeploySettingsLayout/Badges"
21+
3322

3423

3524
export interface WorkspaceProxyPageViewProps {
36-
proxies?: WorkspaceProxy[]
25+
proxies?: Region[]
3726
getWorkspaceProxiesError?: Error | unknown
3827
isLoading: boolean
3928
hasLoaded: boolean
40-
onSelect: (proxy: WorkspaceProxy) => void
29+
onSelect: (proxy: Region) => void
4130
selectProxyError?: Error | unknown
4231
}
4332

@@ -52,7 +41,7 @@ export const WorkspaceProxyPageView: FC<
5241
selectProxyError,
5342
}) => {
5443
const theme = useTheme()
55-
const { t } = useTranslation("workspaceProxyPage")
44+
const { t } = useTranslation("proxyPage")
5645

5746
return (
5847
<Stack>
@@ -66,9 +55,9 @@ export const WorkspaceProxyPageView: FC<
6655
<Table>
6756
<TableHead>
6857
<TableRow>
69-
<TableCell width="20%">{t("table.icon")}</TableCell>
70-
<TableCell width="20%">{t("table.url")}</TableCell>
71-
<TableCell width="20%">{t("table.status")}</TableCell>
58+
<TableCell width="40%">{t("table.icon")}</TableCell>
59+
<TableCell width="30%">{t("table.url")}</TableCell>
60+
<TableCell width="10%">{t("table.status")}</TableCell>
7261
<TableCell width="0%"></TableCell>
7362
</TableRow>
7463
</TableHead>
@@ -97,7 +86,7 @@ export const WorkspaceProxyPageView: FC<
9786
}
9887
// subtitle={proxy.description}
9988
avatar={
100-
proxy.icon !== "" && <Avatar src={proxy.icon} variant="square" fitImage />
89+
proxy.icon_url !== "" && <Avatar src={proxy.icon_url} variant="square" fitImage />
10190
}
10291
/>
10392
</TableCell>
@@ -108,7 +97,7 @@ export const WorkspaceProxyPageView: FC<
10897
</span>
10998
</TableCell> */}
11099

111-
<TableCell>{proxy.url}</TableCell>
100+
<TableCell>{proxy.path_app_url}</TableCell>
112101
{/* <TableCell>{lastUsedOrNever(token.last_used)}</TableCell> */}
113102
{/* <TableCell>{proxy.wildcard_hostname}</TableCell> */}
114103
{/* <TableCell>
@@ -153,38 +142,14 @@ export const WorkspaceProxyPageView: FC<
153142

154143

155144
export interface WorkspaceProxyStatusProps {
156-
proxy: WorkspaceProxy
145+
proxy: Region
157146
}
158147

159148
const ProxyStatus: FC<React.PropsWithChildren<WorkspaceProxyStatusProps>> = ({ proxy }) => {
160-
let text = ""
161-
let icon = CheckCircleIcon
162-
switch (proxy.status?.status) {
163-
case "ok":
164-
text = "Proxy is healthy and ready to use"
165-
icon = SyncIcon
166-
break;
167-
case "unregistered":
168-
text = "Proxy has not been started"
169-
icon = HourglassEmptyIcon
170-
break;
171-
case "unreachable":
172-
text = "Proxy is unreachable"
173-
icon = SyncDisabledIcon
174-
break;
175-
case "unhealthy":
176-
text = "Proxy is reachable, but is not healthy to use"
177-
icon = SyncProblemIcon
178-
break;
179-
default:
180-
text = `Unknown status: ${proxy.status?.status}`
181-
icon = WarningIcon
149+
let icon = <NotHealthyBadge />
150+
if (proxy.healthy) {
151+
icon = <HealthyBadge />
182152
}
183153

184-
return (
185-
<HelpTooltip icon={icon} size="medium">
186-
<HelpTooltipTitle>{proxy.status?.status}</HelpTooltipTitle>
187-
<HelpTooltipText>{text}</HelpTooltipText>
188-
</HelpTooltip>
189-
)
154+
return icon
190155
}

0 commit comments

Comments
 (0)