Modify FE for No access role

- fix user settings modal - CurrentUserModal
- TODO: refactor UserModal and CurrentUserModal - it's same thing

src/components/Header/components/CurrentUserModal/CurrentUserModal.tsx

@@ -83,6 +83,7 @@ export const CurrentUserModal = ({ open, onClose, user }: UserModalProps) => {
                           name={`app_roles.${index}.role`}
                           label="Role"
                           options={[
+                            { value: UserRole.NoAccess, name: 'No access' },
                             { value: UserRole.Admin, name: 'Admin' },
                             { value: UserRole.User, name: 'User' },
                           ]}
@@ -121,9 +122,12 @@ export const CurrentUserModal = ({ open, onClose, user }: UserModalProps) => {
               <div>
                 <div className="flow-root mt-6">
                   <ul className="-my-5 divide-y divide-gray-200 ">
-                    {fields
+                    {fields.map((item, index) => {
-                      .filter((field) => field.name !== 'dashboard')
+                      if (item.name === 'dashboard') {
-                      .map((item, index) => (
+                        return null;
+                      }
+
+                      return (
                         <li className="py-4" key={item.name}>
                           <div className="flex items-center space-x-4">
                             <div className="flex-shrink-0 flex-1 flex items-center">
@@ -142,6 +146,7 @@ export const CurrentUserModal = ({ open, onClose, user }: UserModalProps) => {
                                 control={control}
                                 name={`app_roles.${index}.role`}
                                 options={[
+                                  { value: UserRole.NoAccess, name: 'No access' },
                                   { value: UserRole.Admin, name: 'Admin' },
                                   { value: UserRole.User, name: 'User' },
                                 ]}
@@ -149,7 +154,8 @@ export const CurrentUserModal = ({ open, onClose, user }: UserModalProps) => {
                             </div>
                           </div>
                         </li>
-                      ))}
+                      );
+                    })}
                   </ul>
                 </div>
               </div>

src/components/Header/components/CurrentUserModal/consts.ts

@@ -12,7 +12,7 @@ export const appAccessList = [
     label: 'Wordpress',
   },
   {
-    name: 'next-cloud',
+    name: 'nextcloud',
     image: '/assets/nextcloud.svg',
     label: 'NextCloud',
   },
@@ -30,19 +30,19 @@ const initialAppRoles = [
   },
   {
     name: 'wekan',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
     name: 'wordpress',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
-    name: 'next-cloud',
+    name: 'nextcloud',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
     name: 'zulip',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
 ];
 

src/modules/users/components/UserModal/UserModal.tsx

@@ -133,6 +133,7 @@ export const UserModal = ({ open, onClose, userId, setUserId }: UserModalProps)
                         name={`app_roles.${index}.role`}
                         label="Role"
                         options={[
+                          { value: UserRole.NoAccess, name: 'No access' },
                           { value: UserRole.User, name: 'User' },
                           { value: UserRole.Admin, name: 'Admin' },
                         ]}
@@ -194,6 +195,7 @@ export const UserModal = ({ open, onClose, userId, setUserId }: UserModalProps)
                                   control={control}
                                   name={`app_roles.${index}.role`}
                                   options={[
+                                    { value: UserRole.NoAccess, name: 'No Access' },
                                     { value: UserRole.User, name: 'User' },
                                     { value: UserRole.Admin, name: 'Admin' },
                                   ]}

src/modules/users/components/UserModal/consts.ts

@@ -30,19 +30,19 @@ const initialAppRoles = [
   },
   {
     name: 'wekan',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
     name: 'wordpress',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
     name: 'nextcloud',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
   {
     name: 'zulip',
-    role: UserRole.User,
+    role: UserRole.NoAccess,
   },
 ];
 

src/services/users/transformations.ts

@@ -1,16 +1,38 @@
 import { AppRoles, User, UserRole } from './types';
 
+const transformRoleById = (roleId: any): UserRole => {
+  switch (roleId) {
+    case 1:
+      return UserRole.Admin;
+    case 2:
+      return UserRole.User;
+    default:
+      return UserRole.NoAccess;
+  }
+};
+
+const transformRoleIdByRole = (role: UserRole | null): number | null => {
+  switch (role) {
+    case UserRole.Admin:
+      return 1;
+    case UserRole.User:
+      return 2;
+    default:
+      return null;
+  }
+};
+
 export const transformAppRoles = (data: any): AppRoles => {
-  const resolvedAdminRole = data.role_id === 1 ? UserRole.Admin : UserRole.User;
+  const userRole = transformRoleById(data.role_id);
 
   return {
     name: data.name ?? '',
-    role: resolvedAdminRole ?? UserRole.User,
+    role: userRole,
   };
 };
 
 export const transformRequestAppRoles = (data: AppRoles): any => {
-  const resolvedRequestRole = data.role === UserRole.Admin ? 1 : null;
+  const resolvedRequestRole = transformRoleIdByRole(data.role) ?? null;
 
   return {
     name: data.name ?? '',

src/services/users/types.ts

@@ -13,6 +13,7 @@ export interface FormUser extends User {
 }
 
 export enum UserRole {
+  NoAccess = 'no_access',
   Admin = 'admin',
   User = 'user',
 }