Begin work on FE to add workspace proxy options to account settings

coder · Emyrk · Apr 28, 2023 · Apr 24, 2023 · Apr 24, 2023 · Apr 25, 2023
commit 3203ad72ba16092933cd29ee49d0f1bb8867a1dc
diff --git a/coderd/apidoc/docs.go b/coderd/apidoc/docs.go
diff --git a/coderd/apidoc/swagger.json b/coderd/apidoc/swagger.json
diff --git a/coderd/rbac/object_gen.go b/coderd/rbac/object_gen.go
diff --git a/codersdk/workspaceproxy.go b/codersdk/workspaceproxy.go
@@ -15,9 +15,10 @@ import (
 type ProxyHealthStatus string
 
 const (
-	// ProxyReachable means the proxy access url is reachable and returns a healthy
+	ProxyUnknown ProxyHealthStatus = "unknown"
+	// ProxyHealthy means the proxy access url is reachable and returns a healthy
 	// status code.
-	ProxyReachable ProxyHealthStatus = "reachable"
+	ProxyHealthy ProxyHealthStatus = "ok"
 	// ProxyUnreachable means the proxy access url is not responding.
 	ProxyUnreachable ProxyHealthStatus = "unreachable"
 	// ProxyUnhealthy means the proxy access url is responding, but there is some
@@ -48,9 +49,10 @@ type ProxyHealthReport struct {
 }
 
 type WorkspaceProxy struct {
-	ID   uuid.UUID `json:"id" format:"uuid" table:"id"`
-	Name string    `json:"name" table:"name,default_sort"`
-	Icon string    `json:"icon" table:"icon"`
+	ID          uuid.UUID `json:"id" format:"uuid" table:"id"`
+	Name        string    `json:"name" table:"name,default_sort"`
+	DisplayName string    `json:"display_name" table:"display_name"`
+	Icon        string    `json:"icon" table:"icon"`
 	// Full url including scheme of the proxy api url: https://us.example.com
 	URL string `json:"url" table:"url"`
 	// WildcardHostname with the wildcard for subdomain based app hosting: *.us.example.com

diff --git a/docs/api/enterprise.md b/docs/api/enterprise.md
@@ -1182,6 +1182,7 @@ curl -X GET http://coder-server:8080/api/v2/workspaceproxies \
   {
     "created_at": "2019-08-24T14:15:22Z",
     "deleted": true,
+    "display_name": "string",
     "icon": "string",
     "id": "497f6eca-6276-4993-bfeb-53cbbbba6f08",
     "name": "string",
@@ -1191,7 +1192,7 @@ curl -X GET http://coder-server:8080/api/v2/workspaceproxies \
         "errors": ["string"],
         "warnings": ["string"]
       },
-      "status": "reachable"
+      "status": "unknown"
     },
     "updated_at": "2019-08-24T14:15:22Z",
     "url": "string",
@@ -1215,12 +1216,13 @@ Status Code **200**
 | `[array item]`        | array                                                                    | false    |              |                                                                                                                                                                               |
 | `» created_at`        | string(date-time)                                                        | false    |              |                                                                                                                                                                               |
 | `» deleted`           | boolean                                                                  | false    |              |                                                                                                                                                                               |
+| `» display_name`      | string                                                                   | false    |              |                                                                                                                                                                               |
 | `» icon`              | string                                                                   | false    |              |                                                                                                                                                                               |
 | `» id`                | string(uuid)                                                             | false    |              |                                                                                                                                                                               |
 | `» name`              | string                                                                   | false    |              |                                                                                                                                                                               |
 | `» status`            | [codersdk.WorkspaceProxyStatus](schemas.md#codersdkworkspaceproxystatus) | false    |              | Status is the latest status check of the proxy. This will be empty for deleted proxies. This value can be used to determine if a workspace proxy is healthy and ready to use. |
 | `»» checked_at`       | string(date-time)                                                        | false    |              |                                                                                                                                                                               |
-| `»» report`           | [codersdk.ProxyHealthReport](schemas.md#codersdkproxyhealthreport)       | false    |              | Report provides more information about the health of the workspace proxy.                                                                                                     |
+| `»» report`           | [codersdk.ProxyHealthReport](schemas.md#codersdkproxyhealthreport)       | false    |              | Report provides more information about the health of the workspace proxy. This is not provided if the user does not have permission to view workspace proxy metadata.         |
 | `»»» errors`          | array                                                                    | false    |              | Errors are problems that prevent the workspace proxy from being healthy                                                                                                       |
 | `»»» warnings`        | array                                                                    | false    |              | Warnings do not prevent the workspace proxy from being healthy, but should be addressed.                                                                                      |
 | `»» status`           | [codersdk.ProxyHealthStatus](schemas.md#codersdkproxyhealthstatus)       | false    |              |                                                                                                                                                                               |
@@ -1232,7 +1234,8 @@ Status Code **200**
 
 | Property | Value          |
 | -------- | -------------- |
-| `status` | `reachable`    |
+| `status` | `unknown`      |
+| `status` | `ok`           |
 | `status` | `unreachable`  |
 | `status` | `unhealthy`    |
 | `status` | `unregistered` |
@@ -1277,6 +1280,7 @@ curl -X POST http://coder-server:8080/api/v2/workspaceproxies \
 {
   "created_at": "2019-08-24T14:15:22Z",
   "deleted": true,
+  "display_name": "string",
   "icon": "string",
   "id": "497f6eca-6276-4993-bfeb-53cbbbba6f08",
   "name": "string",
@@ -1286,7 +1290,7 @@ curl -X POST http://coder-server:8080/api/v2/workspaceproxies \
       "errors": ["string"],
       "warnings": ["string"]
     },
-    "status": "reachable"
+    "status": "unknown"
   },
   "updated_at": "2019-08-24T14:15:22Z",
   "url": "string",

diff --git a/docs/api/schemas.md b/docs/api/schemas.md
@@ -3401,7 +3401,7 @@ Parameter represents a set value for the scope.
 ## codersdk.ProxyHealthStatus
 
 ```json
-"reachable"
+"unknown"
 ```
 
 ### Properties
@@ -3410,7 +3410,8 @@ Parameter represents a set value for the scope.
 
 | Value          |
 | -------------- |
-| `reachable`    |
+| `unknown`      |
+| `ok`           |
 | `unreachable`  |
 | `unhealthy`    |
 | `unregistered` |
@@ -5272,6 +5273,7 @@ Parameter represents a set value for the scope.
 {
   "created_at": "2019-08-24T14:15:22Z",
   "deleted": true,
+  "display_name": "string",
   "icon": "string",
   "id": "497f6eca-6276-4993-bfeb-53cbbbba6f08",
   "name": "string",
@@ -5281,7 +5283,7 @@ Parameter represents a set value for the scope.
       "errors": ["string"],
       "warnings": ["string"]
     },
-    "status": "reachable"
+    "status": "unknown"
   },
   "updated_at": "2019-08-24T14:15:22Z",
   "url": "string",
@@ -5295,6 +5297,7 @@ Parameter represents a set value for the scope.
 | ------------------- | -------------------------------------------------------------- | -------- | ------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | `created_at`        | string                                                         | false    |              |                                                                                                                                                                               |
 | `deleted`           | boolean                                                        | false    |              |                                                                                                                                                                               |
+| `display_name`      | string                                                         | false    |              |                                                                                                                                                                               |
 | `icon`              | string                                                         | false    |              |                                                                                                                                                                               |
 | `id`                | string                                                         | false    |              |                                                                                                                                                                               |
 | `name`              | string                                                         | false    |              |                                                                                                                                                                               |
@@ -5312,17 +5315,17 @@ Parameter represents a set value for the scope.
     "errors": ["string"],
     "warnings": ["string"]
   },
-  "status": "reachable"
+  "status": "unknown"
 }
 ```
 
 ### Properties
 
-| Name         | Type                                                     | Required | Restrictions | Description                                                               |
-| ------------ | -------------------------------------------------------- | -------- | ------------ | ------------------------------------------------------------------------- |
-| `checked_at` | string                                                   | false    |              |                                                                           |
-| `report`     | [codersdk.ProxyHealthReport](#codersdkproxyhealthreport) | false    |              | Report provides more information about the health of the workspace proxy. |
-| `status`     | [codersdk.ProxyHealthStatus](#codersdkproxyhealthstatus) | false    |              |                                                                           |
+| Name         | Type                                                     | Required | Restrictions | Description                                                                                                                                                           |
+| ------------ | -------------------------------------------------------- | -------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `checked_at` | string                                                   | false    |              |                                                                                                                                                                       |
+| `report`     | [codersdk.ProxyHealthReport](#codersdkproxyhealthreport) | false    |              | Report provides more information about the health of the workspace proxy. This is not provided if the user does not have permission to view workspace proxy metadata. |
+| `status`     | [codersdk.ProxyHealthStatus](#codersdkproxyhealthstatus) | false    |              |                                                                                                                                                                       |
 
 ## codersdk.WorkspaceQuota
 

diff --git a/enterprise/coderd/workspaceproxy.go b/enterprise/coderd/workspaceproxy.go
@@ -459,6 +459,7 @@ func convertProxy(p database.WorkspaceProxy, status proxyhealth.ProxyStatus) cod
 	return codersdk.WorkspaceProxy{
 		ID:               p.ID,
 		Name:             p.Name,
+		DisplayName:      p.DisplayName,
 		Icon:             p.Icon,
 		URL:              p.Url,
 		WildcardHostname: p.WildcardHostname,

diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
@@ -38,6 +38,9 @@ const SSHKeysPage = lazy(
 const TokensPage = lazy(
   () => import("./pages/UserSettingsPage/TokensPage/TokensPage"),
 )
+const WorkspaceProxyPage = lazy(
+  () => import("./pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage"),
+)
 const CreateUserPage = lazy(
   () => import("./pages/UsersPage/CreateUserPage/CreateUserPage"),
 )
@@ -259,6 +262,7 @@ export const AppRouter: FC = () => {
                   <Route index element={<TokensPage />} />
                   <Route path="new" element={<CreateTokenPage />} />
                 </Route>
+                <Route path="workspace-proxies" element={<WorkspaceProxyPage />} />
               </Route>
 
               <Route path="/@:username">

diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -897,6 +897,16 @@ export const getFile = async (fileId: string): Promise<ArrayBuffer> => {
   return response.data
 }
 
+
+export const getWorkspaceProxies = async (): Promise<TypesGen.WorkspaceProxy[]> => {
+  const response = await axios.get<TypesGen.WorkspaceProxy[]>(
+    `/api/v2/workspaceproxies`,
+    {},
+  )
+  return response.data
+}
+
+
 export const getAppearance = async (): Promise<TypesGen.AppearanceConfig> => {
   try {
     const response = await axios.get(`/api/v2/appearance`)

diff --git a/site/src/api/typesGenerated.ts b/site/src/api/typesGenerated.ts
@@ -1258,6 +1258,7 @@ export interface WorkspaceOptions {
 export interface WorkspaceProxy {
   readonly id: string
   readonly name: string
+  readonly display_name: string
   readonly icon: string
   readonly url: string
   readonly wildcard_hostname: string
@@ -1479,13 +1480,15 @@ export const ProvisionerTypes: ProvisionerType[] = ["echo", "terraform"]
 
 // From codersdk/workspaceproxy.go
 export type ProxyHealthStatus =
-  | "reachable"
+  | "ok"
   | "unhealthy"
+  | "unknown"
   | "unreachable"
   | "unregistered"
 export const ProxyHealthStatuses: ProxyHealthStatus[] = [
-  "reachable",
+  "ok",
   "unhealthy",
+  "unknown",
   "unreachable",
   "unregistered",
 ]

diff --git a/site/src/components/SettingsLayout/Sidebar.tsx b/site/src/components/SettingsLayout/Sidebar.tsx
@@ -9,6 +9,7 @@ import { NavLink } from "react-router-dom"
 import { combineClasses } from "utils/combineClasses"
 import AccountIcon from "@material-ui/icons/Person"
 import SecurityIcon from "@material-ui/icons/LockOutlined"
+import PublicIcon from '@material-ui/icons/Public';
 
 const SidebarNavItem: FC<
   PropsWithChildren<{ href: string; icon: ReactNode }>
@@ -76,6 +77,13 @@ export const Sidebar: React.FC<{ user: User }> = ({ user }) => {
       >
         Tokens
       </SidebarNavItem>
+      {/* TODO: @emyrk this should only be shown if the 'moons' experiment is enabled */}
+      <SidebarNavItem
+        href="workspace-proxies"
+        icon={<SidebarNavItemIcon icon={PublicIcon} />}
+      >
+        Workspace Proxy
+      </SidebarNavItem>
     </nav>
   )
 }

diff --git a/site/src/i18n/en/proxyPage.json b/site/src/i18n/en/proxyPage.json
@@ -0,0 +1,55 @@
+{
+  "title": "Workspace Proxies",
+  "description": " Workspace proxies are used to reduce the latency of connections to a workspace. To get the best experience, choose the workspace proxy that is closest located to you.",
+  "emptyState": "No workspace proxies found",
+  "tokenActions": {
+    "addToken": "Add token",
+    "deleteToken": {
+      "delete": "Delete Token",
+      "deleteCaption": "Are you sure you want to permanently delete token <strong><4>{{tokenName}}</4></strong>?",
+      "deleteSuccess": "Token has been deleted",
+      "deleteFailure": "Failed to delete token"
+    }
+  },
+  "table": {
+    "icon": "Proxy",
+    "url": "URL",
+    "status": "Status",
+    "expiresAt": "Expires At",
+    "createdAt": "Created At"
+  },
+  "createToken": {
+    "title": "Create Token",
+    "detail": "All tokens are unscoped and therefore have full resource access.",
+    "nameSection": {
+      "title": "Name",
+      "description": "What is this token for?"
+    },
+    "lifetimeSection": {
+      "title": "Expiration",
+      "description": "The token will expire on {{date}}.",
+      "emptyDescription": "Please set a token expiration.",
+      "7": "7 days",
+      "30": "30 days",
+      "60": "60 days",
+      "90": "90 days",
+      "custom": "Custom",
+      "noExpiration": "No expiration",
+      "expiresOn": "Expires on"
+    },
+    "fields": {
+      "name": "Name",
+      "lifetime": "Lifetime"
+    },
+    "footer": {
+      "retry": "Retry",
+      "submit": "Create token"
+    },
+    "createSuccess": "Token has been created",
+    "createError": "Failed to create token",
+    "successModal": {
+      "title": "Creation successful",
+      "description": "Make sure you copy the below token before proceeding:"
+    }
+  }
+}