Implement Add agama projects

GluuFederation · Jan 7, 2025 · 80f8b46 · 80f8b46
1 parent 7909d81
commit 80f8b46
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 26 deletions.
diff --git a/admin-ui/plugins/auth-server/components/Agama/AgamaListPage.js b/admin-ui/plugins/auth-server/components/Agama/AgamaListPage.js
@@ -80,6 +80,10 @@ function AgamaListPage() {
     (state) => state.jsonConfigReducer.loading
   );
 
+  const agamaFileResponse = useSelector(
+    (state) => state.agamaReducer.agamaFileResponse
+  );
+
   const theme = useContext(ThemeContext);
   const selectedTheme = theme.state.theme;
   const themeColors = getThemeColor(selectedTheme);
@@ -113,6 +117,18 @@ function AgamaListPage() {
     }
   }, []);
 
+  useEffect(() => {
+    if (agamaFileResponse) {
+      const byteArray = new Uint8Array(agamaFileResponse);
+      let object = {
+        name: projectName,
+        file: byteArray,
+      };
+      // dispatch(addAgama(object));
+      console.log("agamaFileResponse", byteArray);
+    }
+  }, [agamaFileResponse]);
+
   const submitData = async () => {
     let file = await convertFileToByteArray(selectedFile);
     let object = {
@@ -124,6 +140,7 @@ function AgamaListPage() {
     setProjectName("");
     setShowAddModal(false);
   };
+
   const onDrop = useCallback((acceptedFiles) => {
     setProjectName("");
     // Do something with the files
@@ -149,12 +166,14 @@ function AgamaListPage() {
         setGetProjectName(true);
       });
   }, []);
+
   const onDrop2 = useCallback((acceptedFiles) => {
     // Do something with the files
     const file = acceptedFiles[0];
     setShaFileName(file.name);
     setSHAfile(file);
   }, []);
+
   const {
     getRootProps: getRootProps1,
     getInputProps: getInputProps1,
@@ -178,9 +197,8 @@ function AgamaListPage() {
     },
   });
 
-  const { totalItems, loading, agamaRepostoriesList } = useSelector(
-    (state) => state.agamaReducer
-  );
+  const { totalItems, loading, fileLoading, agamaRepostoriesList } =
+    useSelector((state) => state.agamaReducer);
 
   const agamaList = useSelector((state) => state.agamaReducer.agamaList);
   const permissions = useSelector((state) => state.authReducer.permissions);
@@ -379,13 +397,14 @@ function AgamaListPage() {
       const repo = agamaRepostoriesList.projects.find(
         (item) => item["repository-name"] === repoName
       );
-      dispatch(getAgamaRepositoryFile());
-      // dispatch(addAgama(object));
+      setProjectName(repo["repository-name"]);
+      dispatch(getAgamaRepositoryFile({ downloadurl: repo["download-link"] }));
     } catch (error) {
+      console.log("error", error);
       toast.error("File not found");
     } finally {
-      setShowAddModal(false);
-      setRepoName(null);
+      //setShowAddModal(false);
+      //setRepoName(null);
     }
   };
 
@@ -474,7 +493,7 @@ function AgamaListPage() {
       case t("menus.add_community_project"):
         return (
           <>
-            <ModalBody style={{ maxHeight: "" }}>
+            <ModalBody style={{ maxHeight: "500px", height: "500px" }}>
               <FormGroup>
                 <FormLabel
                   style={{
@@ -496,9 +515,9 @@ function AgamaListPage() {
                     overflowX: "hidden",
                   }}
                 >
-                  {loading ? (
+                  {fileLoading ? (
                     <CircularProgress />
-                  ) : agamaRepostoriesList?.projects.length ? (
+                  ) : agamaRepostoriesList?.projects?.length ? (
                     agamaRepostoriesList.projects.map((item, index) => (
                       <FormControlLabel
                         key={index}
@@ -520,8 +539,14 @@ function AgamaListPage() {
                         }
                         label={
                           <div>
-                            <div>{item.name}</div>
-                            <div style={{ fontSize: "12px", color: "gray" }}>
+                            <div style={{ marginTop: 6 }}>{item.name}</div>
+                            <div
+                              style={{
+                                fontSize: "12px",
+                                color: "gray",
+                                marginTop: 6,
+                              }}
+                            >
                               {item.description}
                             </div>
                           </div>
@@ -552,7 +577,7 @@ function AgamaListPage() {
                 disabled={repoName === null}
                 onClick={() => handleDeploy()}
               >
-                {loading || isConfigLoading ? (
+                {fileLoading || isConfigLoading ? (
                   <>
                     <CircularProgress size={12} /> &nbsp;
                   </>

diff --git a/admin-ui/plugins/auth-server/redux/api/AgamaApi.js b/admin-ui/plugins/auth-server/redux/api/AgamaApi.js
@@ -58,7 +58,7 @@ export default class AgamaApi {
 
 
   getAgamaRepositoryFile = (payload) => {
-    const { downloadurl } = payload
+    const { downloadurl, token } = payload
     return new Promise((resolve, reject) => {
       axios.get(`/api/v1/agama-repo/download/?downloadLink=${decodeURIComponent(downloadurl)}`, {
         headers: {

diff --git a/admin-ui/plugins/auth-server/redux/features/agamaSlice.js b/admin-ui/plugins/auth-server/redux/features/agamaSlice.js
@@ -4,6 +4,7 @@ import { createSlice } from '@reduxjs/toolkit'
 const initialState = {
   agamaList: [],
   loading: false,
+  fileLoading:false,
   totalItems: 0,
   entriesCount: 0,
   agamaRepostoriesList:[],
@@ -35,21 +36,19 @@ const agamaSlice = createSlice({
       state.loading = false
     },
     getAgamaRepository: (state) => {
-     state.loading = true
+     state.fileLoading = true
     },
-    getAgamaRepositoryFile: (state) => {
-      console.log('action.payload', action)
-      state.loading = true
+    getAgamaRepositoryFile: (state,action) => {
+      state.fileLoading = true
      },
     getAgamaRepositoriesResponse: (state, action) => {
-
-      state.loading = false
+      state.fileLoading = false
       if (action.payload) {
         state.agamaRepostoriesList = action.payload || []
       }
     },
     getAgamaRepositoryFileResponse: (state, action) => {
-      state.loading = false
+      state.fileLoading = false
       if (action.payload) {
         state.agamaFileResponse = action.payload || []
       }

diff --git a/admin-ui/plugins/auth-server/redux/sagas/AgamaSaga.js b/admin-ui/plugins/auth-server/redux/sagas/AgamaSaga.js
@@ -8,6 +8,7 @@ import {
   getAddAgamaResponse,
   getAgama,
   getAgamaRepositoriesResponse,
+  getAgamaRepositoryFileResponse,
 } from "../features/agamaSlice";
 const JansConfigApi = require("jans_config_api");
 
@@ -84,16 +85,16 @@ export function* getAgamaRepository() {
   }
 }
 
-export function* getAgamaRepositoryFile(payload) {
+export function* getAgamaRepositoryFile(body) {
   try {
-
+    const { payload } = body;
     const token = yield select((state) => state.authReducer.token.access_token);
-    console.log(payload)
-    const payload = { token };
+
+    payload.token = token;
     const api = yield* newFunction();
     const data = yield call(api.getAgamaRepositoryFile, payload);
 
-    yield put(getAgamaRepositoriesResponse(data.data));
+    yield put(getAgamaRepositoryFileResponse(data.data));
     return data;
   } catch (e) {
     if (isFourZeroOneError(e)) {