feat: use get workspace profile in frontend

api/v2/acl_config.go

@@ -3,7 +3,7 @@ package v2
 import "strings"
 
 var allowedMethodsWhenUnauthorized = map[string]bool{
-	"/slash.api.v2.WorkspaceSettingService/GetWorkspaceSetting": true,
+	"/slash.api.v2.WorkspaceService/GetWorkspaceProfile": true,
 }
 
 // isUnauthorizeAllowedMethod returns true if the method is allowed to be called when the user is not authorized.
@@ -15,9 +15,9 @@ func isUnauthorizeAllowedMethod(methodName string) bool {
 }
 
 var allowedMethodsOnlyForAdmin = map[string]bool{
-	"/slash.api.v2.UserService/CreateUser":                         true,
-	"/slash.api.v2.UserService/DeleteUser":                         true,
-	"/slash.api.v2.WorkspaceSettingService/UpdateWorkspaceSetting": true,
+	"/slash.api.v2.UserService/CreateUser":                  true,
+	"/slash.api.v2.UserService/DeleteUser":                  true,
+	"/slash.api.v2.WorkspaceService/UpdateWorkspaceSetting": true,
 }
 
 // isOnlyForAdminAllowedMethod returns true if the method is allowed to be called only by admin.

frontend/web/src/App.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { Outlet } from "react-router-dom";
 import DemoBanner from "./components/DemoBanner";
 import { workspaceServiceClient } from "./grpcweb";
-import { globalService } from "./services";
+import { workspaceService } from "./services";
 import useUserStore from "./stores/v1/user";
 import { WorkspaceSetting } from "./types/proto/api/v2/workspace_service";
 
@@ -14,7 +14,7 @@ function App() {
   useEffect(() => {
     const initialState = async () => {
       try {
-        await globalService.initialState();
+        await workspaceService.initialState();
       } catch (error) {
         // do nothing
       }

frontend/web/src/components/DemoBanner.tsx

@@ -1,12 +1,10 @@
-import { globalService } from "../services";
+import { workspaceService } from "../services";
 import Icon from "./Icon";
 
 const DemoBanner: React.FC = () => {
   const {
-    workspaceProfile: {
-      profile: { mode },
-    },
-  } = globalService.getState();
+    workspaceProfile: { mode },
+  } = workspaceService.getState();
   const shouldShow = mode === "demo";
 
   if (!shouldShow) return null;

frontend/web/src/helpers/api.ts

@@ -1,10 +1,6 @@
 import axios from "axios";
 import { userServiceClient } from "@/grpcweb";
 
-export function getWorkspaceProfile() {
-  return axios.get<WorkspaceProfile>("/api/v1/workspace/profile");
-}
-
 export function signin(email: string, password: string) {
   return axios.post<User>("/api/v1/auth/signin", {
     email,

frontend/web/src/pages/SignIn.tsx

@@ -13,10 +13,7 @@ const SignIn: React.FC = () => {
   const navigate = useNavigate();
   const userStore = useUserStore();
   const {
-    workspaceProfile: {
-      disallowSignUp,
-      profile: { mode },
-    },
+    workspaceProfile: { enableSignup, mode },
   } = useAppSelector((state) => state.global);
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
@@ -108,7 +105,7 @@ const SignIn: React.FC = () => {
               </Button>
             </div>
           </form>
-          {!disallowSignUp && (
+          {enableSignup && (
             <p className="w-full mt-4 text-sm">
               <span>{"Don't have an account yet?"}</span>
               <Link to="/auth/signup" className="cursor-pointer ml-2 text-blue-600 hover:underline">

frontend/web/src/pages/SignUp.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next";
 import { Link, useNavigate } from "react-router-dom";
 import * as api from "../helpers/api";
 import useLoading from "../hooks/useLoading";
-import { globalService } from "../services";
+import { workspaceService } from "../services";
 import useUserStore from "../stores/v1/user";
 
 const SignUp: React.FC = () => {
@@ -13,8 +13,8 @@ const SignUp: React.FC = () => {
   const navigate = useNavigate();
   const userStore = useUserStore();
   const {
-    workspaceProfile: { disallowSignUp },
-  } = globalService.getState();
+    workspaceProfile: { enableSignup },
+  } = workspaceService.getState();
   const [email, setEmail] = useState("");
   const [nickname, setNickname] = useState("");
   const [password, setPassword] = useState("");
@@ -28,7 +28,7 @@ const SignUp: React.FC = () => {
       });
     }
 
-    if (disallowSignUp) {
+    if (!enableSignup) {
       return navigate("/auth", {
         replace: true,
       });

frontend/web/src/services/globalService.ts

@@ -1,20 +0,0 @@
-import * as api from "../helpers/api";
-import store from "../stores";
-import { setGlobalState } from "../stores/modules/global";
-
-const globalService = {
-  getState: () => {
-    return store.getState().global;
-  },
-
-  initialState: async () => {
-    try {
-      const workspaceProfile = (await api.getWorkspaceProfile()).data;
-      store.dispatch(setGlobalState({ workspaceProfile }));
-    } catch (error) {
-      // do nth
-    }
-  },
-};
-
-export default globalService;

frontend/web/src/services/index.ts

@@ -1,4 +1,4 @@
-import globalService from "./globalService";
 import shortcutService from "./shortcutService";
+import workspaceService from "./workspaceService";
 
-export { globalService, shortcutService };
+export { workspaceService, shortcutService };

frontend/web/src/services/workspaceService.ts

@@ -0,0 +1,21 @@
+import { workspaceServiceClient } from "@/grpcweb";
+import { WorkspaceProfile } from "@/types/proto/api/v2/workspace_service";
+import store from "../stores";
+import { setWorkspaceState } from "../stores/modules/workspace";
+
+const workspaceService = {
+  getState: () => {
+    return store.getState().global;
+  },
+
+  initialState: async () => {
+    try {
+      const workspaceProfile = (await workspaceServiceClient.getWorkspaceProfile({})).profile as WorkspaceProfile;
+      store.dispatch(setWorkspaceState({ workspaceProfile }));
+    } catch (error) {
+      // do nth
+    }
+  },
+};
+
+export default workspaceService;

frontend/web/src/stores/index.ts

@@ -1,7 +1,7 @@
 import { configureStore } from "@reduxjs/toolkit";
 import { TypedUseSelectorHook, useSelector } from "react-redux";
-import globalReducer from "./modules/global";
 import shortcutReducer from "./modules/shortcut";
+import globalReducer from "./modules/workspace";
 
 const store = configureStore({
   reducer: {

frontend/web/src/stores/modules/global.ts

@@ -1,19 +0,0 @@
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-
-type State = {
-  workspaceProfile: WorkspaceProfile;
-};
-
-const globalSlice = createSlice({
-  name: "global",
-  initialState: {} as State,
-  reducers: {
-    setGlobalState: (_, action: PayloadAction<State>) => {
-      return action.payload;
-    },
-  },
-});
-
-export const { setGlobalState } = globalSlice.actions;
-
-export default globalSlice.reducer;

frontend/web/src/stores/modules/workspace.ts

@@ -0,0 +1,20 @@
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import { WorkspaceProfile } from "@/types/proto/api/v2/workspace_service";
+
+type State = {
+  workspaceProfile: WorkspaceProfile;
+};
+
+const workspaceSlice = createSlice({
+  name: "workspace",
+  initialState: {} as State,
+  reducers: {
+    setWorkspaceState: (_, action: PayloadAction<State>) => {
+      return action.payload;
+    },
+  },
+});
+
+export const { setWorkspaceState } = workspaceSlice.actions;
+
+export default workspaceSlice.reducer;

frontend/web/src/types/modules/system.d.ts

@@ -1,9 +0,0 @@
-interface Profile {
-  mode: string;
-  version: string;
-}
-
-interface WorkspaceProfile {
-  profile: Profile;
-  disallowSignUp: boolean;
-}