Split API client into hub and service client

plasmabio · Mar 8, 2024 · 5516a6e · 5516a6e
1 parent 8a9de41
commit 5516a6e
Show file tree

Hide file tree

Showing 11 changed files with 49 additions and 18 deletions.
diff --git a/frontend/src/common/AxiosContext.tsx b/frontend/src/common/AxiosContext.tsx
@@ -1,7 +1,10 @@
 import { createContext, useContext } from 'react';
 import { AxiosClient } from './axiosclient';
 
-export const AxiosContext = createContext<AxiosClient>(new AxiosClient({}));
+export const AxiosContext = createContext<{
+  hubClient: AxiosClient;
+  serviceClient: AxiosClient;
+}>({ hubClient: new AxiosClient({}), serviceClient: new AxiosClient({}) });
 
 export const useAxios = () => {
   return useContext(AxiosContext);

diff --git a/frontend/src/common/JupyterhubContext.ts b/frontend/src/common/JupyterhubContext.ts
@@ -2,14 +2,16 @@ import { createContext, useContext } from 'react';
 
 export interface IJupyterhubData {
   baseUrl: string;
-  prefix: string;
+  servicePrefix: string;
+  hubPrefix: string;
   user: string;
   adminAccess: boolean;
   xsrfToken: string;
 }
 export const JupyterhubContext = createContext<IJupyterhubData>({
   baseUrl: '',
-  prefix: '',
+  servicePrefix: '',
+  hubPrefix: '',
   user: '',
   adminAccess: false,
   xsrfToken: ''

diff --git a/frontend/src/environments/App.tsx b/frontend/src/environments/App.tsx
@@ -19,14 +19,19 @@ export interface IAppProps {
 }
 export default function App(props: IAppProps) {
   const jhData = useJupyterhub();
-  const axios = useMemo(() => {
-    const baseUrl = jhData.baseUrl;
+  const hubClient = useMemo(() => {
+    const baseUrl = jhData.hubPrefix;
+    const xsrfToken = jhData.xsrfToken;
+    return new AxiosClient({ baseUrl, xsrfToken });
+  }, [jhData]);
+  const serviceClient = useMemo(() => {
+    const baseUrl = jhData.servicePrefix;
     const xsrfToken = jhData.xsrfToken;
     return new AxiosClient({ baseUrl, xsrfToken });
   }, [jhData]);
   return (
     <ThemeProvider theme={customTheme}>
-      <AxiosContext.Provider value={axios}>
+      <AxiosContext.Provider value={{ hubClient, serviceClient }}>
         <ScopedCssBaseline>
           <Stack sx={{ padding: 1 }} spacing={1}>
             <NewEnvironmentDialog

diff --git a/frontend/src/environments/NewEnvironmentDialog.tsx b/frontend/src/environments/NewEnvironmentDialog.tsx
@@ -172,7 +172,7 @@ function _NewEnvironmentDialog(props: INewEnvironmentDialogProps) {
             data.memory = data.memory ?? '2';
             data.username = data.username ?? '';
             data.password = data.password ?? '';
-            const response = await axios.request({
+            const response = await axios.serviceClient.request({
               method: 'post',
               prefix: API_PREFIX,
               path: ENV_PREFIX,

diff --git a/frontend/src/environments/RemoveEnvironmentButton.tsx b/frontend/src/environments/RemoveEnvironmentButton.tsx
@@ -16,7 +16,7 @@ function _RemoveEnvironmentButton(props: IRemoveEnvironmentButton) {
   const axios = useAxios();
 
   const removeEnv = useCallback(async () => {
-    const response = await axios.request({
+    const response = await axios.serviceClient.request({
       method: 'delete',
       prefix: API_PREFIX,
       path: ENV_PREFIX,

diff --git a/frontend/src/environments/main.tsx b/frontend/src/environments/main.tsx
@@ -22,15 +22,23 @@ if (rootElement) {
     configData = JSON.parse(dataElement.textContent || '') as IAppProps;
   }
   const jhData = (window as any).jhdata;
-  const { base_url, xsrf_token, user, prefix, admin_access } = jhData;
+  const {
+    base_url,
+    xsrf_token,
+    user,
+    hub_prefix,
+    service_prefix,
+    admin_access
+  } = jhData;
 
   root.render(
     <JupyterhubContext.Provider
       value={{
         baseUrl: base_url,
         xsrfToken: xsrf_token,
         user,
-        prefix,
+        hubPrefix: hub_prefix ?? base_url,
+        servicePrefix: service_prefix ?? base_url,
         adminAccess: admin_access
       }}
     >

diff --git a/frontend/src/servers/App.tsx b/frontend/src/servers/App.tsx
@@ -21,15 +21,20 @@ export interface IAppProps {
 }
 export default function App(props: IAppProps) {
   const jhData = useJupyterhub();
-  const axios = useMemo(() => {
-    const baseUrl = jhData.baseUrl;
+  const hubClient = useMemo(() => {
+    const baseUrl = jhData.hubPrefix;
+    const xsrfToken = jhData.xsrfToken;
+    return new AxiosClient({ baseUrl, xsrfToken });
+  }, [jhData]);
+  const serviceClient = useMemo(() => {
+    const baseUrl = jhData.servicePrefix;
     const xsrfToken = jhData.xsrfToken;
     return new AxiosClient({ baseUrl, xsrfToken });
   }, [jhData]);
 
   return (
     <ThemeProvider theme={customTheme}>
-      <AxiosContext.Provider value={axios}>
+      <AxiosContext.Provider value={{ hubClient, serviceClient }}>
         <ScopedCssBaseline>
           <Stack sx={{ padding: 1 }} spacing={1}>
             <NewServerDialog

diff --git a/frontend/src/servers/NewServerDialog.tsx b/frontend/src/servers/NewServerDialog.tsx
@@ -74,7 +74,7 @@ function _NewServerDialog(props: INewServerDialogProps) {
       path = jhData.user;
     }
     try {
-      await axios.request({
+      await axios.hubClient.request({
         method: 'post',
         prefix: SPAWN_PREFIX,
         path,

diff --git a/frontend/src/servers/OpenServerButton.tsx b/frontend/src/servers/OpenServerButton.tsx
@@ -54,7 +54,7 @@ function _OpenServerButton(props: IOpenServerButton) {
     const data = new FormData();
     data.append('image', imageName);
     try {
-      await axios.request({
+      await axios.hubClient.request({
         method: 'post',
         prefix: SPAWN_PREFIX,
         path: `${jhData.user}/${props.serverName}`,

diff --git a/frontend/src/servers/RemoveServerButton.tsx b/frontend/src/servers/RemoveServerButton.tsx
@@ -22,7 +22,7 @@ function _RemoveServerButton(props: IRemoveServerButton) {
       path = `users/${jhData.user}/server`;
     }
     try {
-      await axios.request({
+      await axios.hubClient.request({
         method: 'delete',
         prefix: API_PREFIX,
         path,

diff --git a/frontend/src/servers/main.tsx b/frontend/src/servers/main.tsx
@@ -31,14 +31,22 @@ if (rootElement) {
     configData = JSON.parse(dataElement.textContent || '') as IAppProps;
   }
   const jhData = (window as any).jhdata;
-  const { base_url, xsrf_token, user, prefix, admin_access } = jhData;
+  const {
+    base_url,
+    xsrf_token,
+    user,
+    hub_prefix,
+    service_prefix,
+    admin_access
+  } = jhData;
   root.render(
     <JupyterhubContext.Provider
       value={{
         baseUrl: base_url,
         xsrfToken: xsrf_token,
         user,
-        prefix,
+        hubPrefix: hub_prefix ?? base_url,
+        servicePrefix: service_prefix ?? base_url,
         adminAccess: admin_access
       }}
     >