[ Fix : Implemented The Option to Add&Remove Editor (1), Admins (2), Reviewers (0) to Organization ]

src/components/Organization/OrgUsers/OrgUsers.jsx

@@ -3,6 +3,7 @@ import { makeStyles } from "@mui/styles";
 import React from "react";
 import AddIcon from "@mui/icons-material/Add";
 import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import OrgUsersCard from "../OrgUsersCard/orgUsersCard";
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -67,8 +68,14 @@ function Orgusers({
   dataTestId
 }) {
   const classes = useStyles();
+  const [show, isShow] = React.useState(false);
+  const showAddUserModal = e => {
+    e.preventDefault();
+    isShow(true);
+  };
   return (
     <React.Fragment>
+      {show && <OrgUsersCard />}
       <Paper elevation={0} className={classes.root} data-testid={dataTestId}>
         <Grid container className={classes.gridPadding}>
           <Grid container direction="row">
@@ -96,6 +103,7 @@ function Orgusers({
                 style={{
                   display: AddUser ? "flex" : "none"
                 }}
+                onClick={showAddUserModal}
               >
                 <AddIcon />
                 Add New

src/components/Organization/OrgUsersCard/addOrgUserModal.jsx

@@ -39,10 +39,16 @@ const AddOrgUserModal = ({ currentOrgHandle }) => {
 
   useEffect(() => {
     setUsers([]);
-    firebase.ref(`cl_user_handle/`).on("value", snapshot => {
-      snapshot.forEach(snap => {
-        setUsers(prev => [...prev, { title: snap.key, value: snap.key }]);
+    const db = firebase.firestore();
+    db.collection("cl_user").onSnapshot(snapshot => {
+      const uniqueHandles = new Set();
+      snapshot.forEach(doc => {
+        const handle = doc.data().handle;
+        const userId = doc.id;
+        uniqueHandles.add({ title: handle, value: userId });
       });
+      const uniqueUsers = Array.from(uniqueHandles);
+      setUsers(uniqueUsers);
     });
   }, [firebase]);
 
@@ -74,10 +80,7 @@ const AddOrgUserModal = ({ currentOrgHandle }) => {
   }, [userProps]);
 
   const onFinish = async () => {
-    const handleExists = await checkUserHandleExists(handle)(
-      firebase,
-      dispatch
-    );
+    const handleExists = await checkUserHandleExists(handle)(firebase);
 
     if (handle.length < 1) {
       setHandleValidateError(true);
@@ -107,7 +110,7 @@ const AddOrgUserModal = ({ currentOrgHandle }) => {
         org_handle: currentOrgHandle,
         permissions: parseInt(selected.split("_")[1]),
         handle: handle
-      })(firestore, dispatch);
+      })(firestore, firebase, dispatch);
     }
   };
 
@@ -122,7 +125,10 @@ const AddOrgUserModal = ({ currentOrgHandle }) => {
         variant="outlined"
         id="Search"
         autoComplete="off"
-        onChange={e => setHandle(e.target.innerHTML)}
+        onChange={(event, value) => {
+          console.log("Value", value);
+          setHandle(value.value);
+        }}
         helperText={handleValidateError ? handleValidateErrorMessage : null}
         options={users}
         getOptionLabel={option => option.title}
@@ -138,7 +144,6 @@ const AddOrgUserModal = ({ currentOrgHandle }) => {
           />
         )}
       />
-      {console.log(users)}
       <Grid container justify="flex-end">
         <div style={{ padding: "10px" }}>
           <span style={{ paddingRight: "10px" }}>Select user role</span>

src/components/Organization/ViewOrganization/index.jsx

@@ -124,6 +124,8 @@ const ViewOrganization = () => {
       });
   }, [db, profileData.uid]);
 
+  const [currentOrgData, setCurrentOrgData] = useState(CurrentOrg);
+
   const handleOrgSubscription = async () => {
     if (!currentOrgData.userSubscription)
       await subscribeOrg(handle)(firebase, firestore, dispatch);
@@ -138,13 +140,13 @@ const ViewOrganization = () => {
     }) => loading
   );
 
-  const currentOrgData = useSelector(
-    ({
-      org: {
-        data: { data }
-      }
-    }) => data
-  );
+  // const currentOrgData = useSelector(
+  //   ({
+  //     org: {
+  //       data: { data }
+  //     }
+  //   }) => data
+  // );
 
   const organizations = useSelector(
     ({

src/store/actions/authActions.js

@@ -178,10 +178,12 @@ export const resendVerifyEmail = email => async dispatch => {
  */
 export const checkUserHandleExists = userHandle => async firebase => {
   try {
-    const handle = await firebase
-      .ref(`/cl_user_handle/${userHandle}`)
-      .once("value");
-    return handle.exists();
+    const userSnapshot = await firebase
+      .firestore()
+      .collection("cl_user")
+      .doc(userHandle)
+      .get();
+    return userSnapshot.exists;
   } catch (e) {
     throw e.message;
   }

src/store/actions/orgActions.js

@@ -46,22 +46,25 @@ export const getOrgUserData = org_handle => async (firestore, dispatch) => {
 // adds a user to organization's users list with a set of permissions
 export const addOrgUser =
   ({ org_handle, handle, permissions }) =>
-  async (firestore, dispatch) => {
+  async (firestore, firebase, dispatch) => {
     try {
       dispatch({ type: actions.ADD_ORG_USER_START });
-      const userDoc = await firestore
+      const userDoc = await firebase
+        .firestore()
         .collection("cl_user")
-        .where("handle", "==", handle)
+        .doc(handle)
         .get();
-      if (userDoc.docs.length === 1) {
-        const uid = userDoc.docs[0].get("uid");
+
+      if (userDoc.exists) {
+        const userData = userDoc.data();
+        const uid = userData.uid;
         await firestore
           .collection("org_users")
           .doc(`${org_handle}_${uid}`)
           .set({
             uid: uid,
             org_handle: org_handle,
-            permissions: permissions
+            permissions: [permissions]
           });
 
         await getOrgUserData(org_handle)(firestore, dispatch);
@@ -73,7 +76,7 @@ export const addOrgUser =
         });
       }
     } catch (e) {
-      console.log(e);
+      console.error("Error adding org user:", e);
       dispatch({ type: actions.ADD_ORG_USER_FAIL, payload: e.message });
     }
   };