[serve] rename http spcific classes and files to be generic

dashboard/client/src/App.tsx

@@ -35,7 +35,7 @@ import { ServeReplicaDetailLayout } from "./pages/serve/ServeReplicaDetailLayout
 import { ServeReplicaDetailPage } from "./pages/serve/ServeReplicaDetailPage";
 import {
  ServeControllerDetailPage,
- ServeHttpProxyDetailPage,
+ ServeProxyDetailPage,
 } from "./pages/serve/ServeSystemActorDetailPage";
 import {
  ServeSystemDetailLayout,
@@ -266,8 +266,8 @@ const App = () => {
  path="controller"
  />
  <Route
- element={<ServeHttpProxyDetailPage />}
- path="httpProxies/:httpProxyId"
+ element={<ServeProxyDetailPage />}
+ path="proxies/:proxyId"
  />
  </Route>
  <Route

dashboard/client/src/components/StatusChip.tsx

@@ -75,7 +75,7 @@ const colorMap = {
  [ServeReplicaState.RUNNING]: green,
  [ServeReplicaState.STOPPING]: red,
  },
- serveHttpProxy: {
+ serveProxy: {
  [ServeSystemActorStatus.HEALTHY]: green,
  [ServeSystemActorStatus.UNHEALTHY]: red,
  [ServeSystemActorStatus.STARTING]: orange,

dashboard/client/src/pages/serve/ServeApplicationsListPage.tsx

@@ -73,7 +73,7 @@ export const ServeApplicationsListPage = () => {
  allServeApplications,
  page,
  setPage,
- httpProxies,
+ proxies,
  changeFilter,
  } = useServeApplications();
 
@@ -95,7 +95,7 @@ export const ServeApplicationsListPage = () => {
  <React.Fragment>
  <ServeSystemPreview
  allApplications={allServeApplications}
- httpProxies={httpProxies}
+ proxies={proxies}
  serveDetails={serveDetails}
  />
  <CollapsibleSection

dashboard/client/src/pages/serve/ServeSystemActorDetailPage.tsx

@@ -13,15 +13,15 @@ import { MetadataSection } from "../../components/MetadataSection";
 import { StatusChip } from "../../components/StatusChip";
 import { ActorDetail, ActorEnum } from "../../type/actor";
 import {
- ServeHttpProxy,
+ ServeProxy,
  ServeSystemActor,
  ServeSystemActorStatus,
 } from "../../type/serve";
 import { useFetchActor } from "../actor/hook/useActorDetail";
 import { MainNavPageInfo } from "../layout/mainNavContext";
 import {
  useServeControllerDetails,
- useServeHTTPProxyDetails,
+ useServeProxyDetails,
 } from "./hook/useServeApplications";
 
 const useStyles = makeStyles((theme) =>
@@ -32,20 +32,20 @@ const useStyles = makeStyles((theme) =>
  }),
 );
 
-export const ServeHttpProxyDetailPage = () => {
+export const ServeProxyDetailPage = () => {
  const classes = useStyles();
- const { httpProxyId } = useParams();
+ const { proxyId } = useParams();
 
- const { httpProxy, loading } = useServeHTTPProxyDetails(httpProxyId);
+ const { proxy, loading } = useServeProxyDetails(proxyId);
 
  if (loading) {
  return <Loading loading />;
  }
 
- if (!httpProxy) {
+ if (!proxy) {
  return (
  <Typography color="error">
- HTTPProxyActor with id "{httpProxyId}" not found.
+ ProxyActor with id "{proxyId}" not found.
  </Typography>
  );
  }
@@ -54,25 +54,21 @@ export const ServeHttpProxyDetailPage = () => {
  <div className={classes.root}>
  <MainNavPageInfo
  pageInfo={
- httpProxy.node_id
+ proxy.node_id
  ? {
- id: "serveHttpProxy",
- title: `HTTPProxyActor:${httpProxy.node_id}`,
- pageTitle: `${httpProxy.node_id} | Serve HTTPProxyActor`,
- path: `/serve/httpProxies/${encodeURIComponent(
- httpProxy.node_id,
- )}`,
+ id: "serveProxy",
+ title: `ProxyActor:${proxy.node_id}`,
+ pageTitle: `${proxy.node_id} | Serve ProxyActor`,
+ path: `/serve/proxies/${encodeURIComponent(proxy.node_id)}`,
  }
  : {
- id: "serveHttpProxy",
- title: "HTTPProxyActor",
+ id: "serveProxy",
+ title: "ProxyActor",
  path: undefined,
  }
  }
  />
- <ServeSystemActorDetail
- actor={{ type: "httpProxy", detail: httpProxy }}
- />
+ <ServeSystemActorDetail actor={{ type: "proxy", detail: proxy }} />
  </div>
  );
 };
@@ -107,8 +103,8 @@ export const ServeControllerDetailPage = () => {
 
 type ActorInfo =
  | {
- type: "httpProxy";
- detail: ServeHttpProxy;
+ type: "proxy";
+ detail: ServeProxy;
  }
  | {
  type: "controller";
@@ -135,8 +131,8 @@ export const ServeSystemActorDetail = ({
  actor,
 }: ServeSystemActorDetailProps) => {
  const name =
- actor.type === "httpProxy"
- ? `HTTPProxyActor:${actor.detail.actor_id}`
+ actor.type === "proxy"
+ ? `ProxyActor:${actor.detail.actor_id}`
  : "Serve Controller";
 
  const { data: fetchedActor } = useFetchActor(actor.detail.actor_id);
@@ -154,11 +150,8 @@ export const ServeSystemActorDetail = ({
  {
  label: "Status",
  content:
- actor.type === "httpProxy" ? (
- <StatusChip
- type="serveHttpProxy"
- status={actor.detail.status}
- />
+ actor.type === "proxy" ? (
+ <StatusChip type="serveProxy" status={actor.detail.status} />
  ) : fetchedActor ? (
  <StatusChip
  type="serveController"
@@ -241,7 +234,7 @@ export const ServeSystemActorDetail = ({
 };
 
 type ServeSystemActorLogsProps = {
- type: "controller" | "httpProxy";
+ type: "controller" | "proxy";
  actor: Pick<ActorDetail, "address" | "actorId" | "pid">;
  systemLogFilePath: string;
 };

dashboard/client/src/pages/serve/ServeSystemDetailPage.component.test.tsx

@@ -87,7 +87,7 @@ describe("ServeSystemDetailPage", () => {
  expect(screen.getByText("8000")).toBeVisible();
 
  // Proxy row
- expect(screen.getByText("HTTPProxyActor:node:12345")).toBeVisible();
+ expect(screen.getByText("ProxyActor:node:12345")).toBeVisible();
  expect(screen.getByText("STARTING")).toBeVisible();
 
  // Serve Controller row

dashboard/client/src/pages/serve/ServeSystemDetailPage.tsx

@@ -21,13 +21,8 @@ const useStyles = makeStyles((theme) =>
 export const ServeSystemDetailPage = () => {
  const classes = useStyles();
 
- const {
- serveDetails,
- httpProxies,
- httpProxiesPage,
- setHttpProxiesPage,
- error,
- } = useServeApplications();
+ const { serveDetails, proxies, proxiesPage, setProxiesPage, error } =
+ useServeApplications();
 
  if (error) {
  return <Typography color="error">{error.toString()}</Typography>;
@@ -53,9 +48,9 @@ export const ServeSystemDetailPage = () => {
  ) : (
  <ServeSystemDetails
  serveDetails={serveDetails}
- httpProxies={httpProxies}
- page={httpProxiesPage}
- setPage={setHttpProxiesPage}
+ proxies={proxies}
+ page={proxiesPage}
+ setPage={setProxiesPage}
  />
  )}
  </div>

dashboard/client/src/pages/serve/ServeSystemDetailRows.tsx

@@ -9,7 +9,7 @@ import {
 import React from "react";
 import { Link as RouterLink } from "react-router-dom";
 import { StatusChip } from "../../components/StatusChip";
-import { ServeHttpProxy, ServeSystemActor } from "../../type/serve";
+import { ServeProxy, ServeSystemActor } from "../../type/serve";
 import { useFetchActor } from "../actor/hook/useActorDetail";
 import { convertActorStateForServeController } from "./ServeSystemActorDetailPage";
 
@@ -26,18 +26,18 @@ const useStyles = makeStyles((theme) =>
  }),
 );
 
-export type ServeHttpProxyRowProps = {
- httpProxy: ServeHttpProxy;
+export type ServeProxyRowProps = {
+ proxy: ServeProxy;
 };
 
-export const ServeHttpProxyRow = ({ httpProxy }: ServeHttpProxyRowProps) => {
- const { status } = httpProxy;
+export const ServeProxyRow = ({ proxy }: ServeProxyRowProps) => {
+ const { status } = proxy;
 
  return (
  <ServeSystemActorRow
- actor={httpProxy}
- type="httpProxy"
- status={<StatusChip type="serveHttpProxy" status={status} />}
+ actor={proxy}
+ type="proxy"
+ status={<StatusChip type="serveProxy" status={status} />}
  />
  );
 };
@@ -71,7 +71,7 @@ export const ServeControllerRow = ({ controller }: ServeControllerRowProps) => {
 
 type ServeSystemActorRowProps = {
  actor: ServeSystemActor;
- type: "controller" | "httpProxy";
+ type: "controller" | "proxy";
  status: React.ReactNode;
 };
 
@@ -86,9 +86,9 @@ const ServeSystemActorRow = ({
  return (
  <TableRow>
  <TableCell align="center">
- {type === "httpProxy" ? (
- <Link component={RouterLink} to={`httpProxies/${node_id}`}>
- HTTPProxyActor:{node_id}
+ {type === "proxy" ? (
+ <Link component={RouterLink} to={`proxies/${node_id}`}>
+ ProxyActor:{node_id}
  </Link>
  ) : (
  <Link component={RouterLink} to="controller">
@@ -98,8 +98,8 @@ const ServeSystemActorRow = ({
  </TableCell>
  <TableCell align="center">{status}</TableCell>
  <TableCell align="center">
- {type === "httpProxy" ? (
- <Link component={RouterLink} to={`httpProxies/${node_id}`}>
+ {type === "proxy" ? (
+ <Link component={RouterLink} to={`proxies/${node_id}`}>
  Log
  </Link>
  ) : (

dashboard/client/src/pages/serve/ServeSystemDetails.component.test.tsx

@@ -37,7 +37,7 @@ describe("ServeSystemDetails", () => {
  },
  ] as any
  }
- httpProxies={
+ proxies={
  [
  {
  status: ServeSystemActorStatus.HEALTHY,

dashboard/client/src/pages/serve/ServeSystemDetails.tsx

@@ -20,12 +20,12 @@ import { HelpInfo } from "../../components/Tooltip";
 import {
  ServeApplication,
  ServeApplicationsRsp,
- ServeHttpProxy,
+ ServeProxy,
 } from "../../type/serve";
 import { useFetchActor } from "../actor/hook/useActorDetail";
 import { LinkWithArrow } from "../overview/cards/OverviewCard";
 import { convertActorStateForServeController } from "./ServeSystemActorDetailPage";
-import { ServeControllerRow, ServeHttpProxyRow } from "./ServeSystemDetailRows";
+import { ServeControllerRow, ServeProxyRow } from "./ServeSystemDetailRows";
 
 const useStyles = makeStyles((theme) =>
  createStyles({
@@ -46,7 +46,7 @@ export type ServeDetails = Pick<
 
 type ServeSystemDetailsProps = {
  serveDetails: ServeDetails;
- httpProxies: ServeHttpProxy[];
+ proxies: ServeProxy[];
  page: { pageSize: number; pageNo: number };
  setPage: (key: string, value: number) => void;
 };
@@ -61,7 +61,7 @@ const columns: { label: string; helpInfo?: ReactElement; width?: string }[] = [
 
 export const ServeSystemDetails = ({
  serveDetails,
- httpProxies,
+ proxies,
  page,
  setPage,
 }: ServeSystemDetailsProps) => {
@@ -108,7 +108,7 @@ export const ServeSystemDetails = ({
  <TableContainer>
  <div style={{ display: "flex", alignItems: "center" }}>
  <Pagination
- count={Math.ceil(httpProxies.length / page.pageSize)}
+ count={Math.ceil(proxies.length / page.pageSize)}
  page={page.pageNo}
  onChange={(e, pageNo) => setPage("pageNo", pageNo)}
  />
@@ -140,16 +140,13 @@ export const ServeSystemDetails = ({
  </TableHead>
  <TableBody>
  <ServeControllerRow controller={serveDetails.controller_info} />
- {httpProxies
+ {proxies
  .slice(
  (page.pageNo - 1) * page.pageSize,
  page.pageNo * page.pageSize,
  )
- .map((httpProxy) => (
- <ServeHttpProxyRow
- key={httpProxy.actor_id}
- httpProxy={httpProxy}
- />
+ .map((proxy) => (
+ <ServeProxyRow key={proxy.actor_id} proxy={proxy} />
  ))}
  </TableBody>
  </Table>
@@ -160,13 +157,13 @@ export const ServeSystemDetails = ({
 
 type ServeSystemPreviewProps = {
  serveDetails: ServeDetails;
- httpProxies: ServeHttpProxy[];
+ proxies: ServeProxy[];
  allApplications: ServeApplication[];
 };
 
 export const ServeSystemPreview = ({
  serveDetails,
- httpProxies,
+ proxies,
  allApplications,
 }: ServeSystemPreviewProps) => {
  const { data: controllerActor } = useFetchActor(
@@ -196,9 +193,9 @@ export const ServeSystemPreview = ({
  label: "Proxy status",
  content: (
  <StatusCountChips
- elements={httpProxies}
+ elements={proxies}
  statusKey="status"
- type="serveHttpProxy"
+ type="serveProxy"
  />
  ),
  },