Merge latest changes

Client/src/Components/Fallback/index.jsx

@@ -19,7 +19,7 @@ import "./index.css";
  * @returns {JSX.Element} The rendered fallback UI.
  */
 
-const Fallback = ({ title, checks, link = "/" }) => {
+const Fallback = ({ title, checks, link = "/", isAdmin }) => {
   const theme = useTheme();
   const navigate = useNavigate();
 
@@ -40,7 +40,7 @@ const Fallback = ({ title, checks, link = "/" }) => {
           marginY={theme.spacing(6)}
           color={theme.palette.text.secondary}
         >
-          A {title} is used to:
+          A {title} monitor is used to:
         </Typography>
         {checks.map((check, index) => (
           <Check
@@ -50,12 +50,14 @@ const Fallback = ({ title, checks, link = "/" }) => {
           />
         ))}
       </Stack>
-      <Button
-        level="primary"
-        label={`Let's create your ${title}`}
-        sx={{ alignSelf: "center" }}
-        onClick={() => navigate(link)}
-      />
+      {isAdmin && (
+        <Button
+          level="primary"
+          label={`Let's create your ${title}`}
+          sx={{ alignSelf: "center" }}
+          onClick={() => navigate(link)}
+        />
+      )}
     </Stack>
   );
 };
@@ -64,6 +66,7 @@ Fallback.propTypes = {
   title: PropTypes.string.isRequired,
   checks: PropTypes.arrayOf(PropTypes.string).isRequired,
   link: PropTypes.string,
+  isAdmin: PropTypes.bool,
 };
 
 export default Fallback;

Client/src/Components/Inputs/Field/index.jsx

@@ -199,7 +199,14 @@ const Field = forwardRef(
 Field.displayName = "Field";
 
 Field.propTypes = {
-  type: PropTypes.oneOf(["text", "password", "url", "email", "description"]),
+  type: PropTypes.oneOf([
+    "text",
+    "password",
+    "url",
+    "email",
+    "description",
+    "number",
+  ]),
   id: PropTypes.string.isRequired,
   label: PropTypes.string,
   https: PropTypes.bool,

Client/src/Components/Sidebar/index.jsx

@@ -339,7 +339,7 @@ function Sidebar() {
                   if (
                     child.name === "Team" &&
                     authState.user?.role &&
-                    !authState.user.role.includes("admin")
+                    !authState.user.role.includes("superadmin")
                   ) {
                     return null;
                   }
@@ -399,7 +399,7 @@ function Sidebar() {
                     if (
                       child.name === "Team" &&
                       authState.user?.role &&
-                      !authState.user.role.includes("admin")
+                      !authState.user.role.includes("superadmin")
                     ) {
                       return null;
                     }

Client/src/Components/TabPanels/Account/TeamPanel.jsx

@@ -32,6 +32,12 @@ import Select from "../../Inputs/Select";
  */
 
 const TeamPanel = () => {
+  const roleMap = {
+    superadmin: "Super admin",
+    admin: "Admin",
+    user: "Team member",
+  };
+
   const theme = useTheme();
 
   const { authToken, user } = useSelector((state) => state.auth);
@@ -78,6 +84,7 @@ const TeamPanel = () => {
         // { id: 4, name: "ACTION" },
       ],
       rows: team?.map((member, idx) => {
+        const roles = member.role.map((role) => roleMap[role]).join(",");
         return {
           id: member._id,
           data: [
@@ -100,7 +107,7 @@ const TeamPanel = () => {
             {
               // TODO - Add select dropdown
               id: idx + 2,
-              data: member.role.includes("admin") ? "Administrator" : "Member",
+              data: roles,
             },
             // FEATURE STILL TO BE IMPLEMENTED
             // {