Merge pull request #105 from devtron-labs/user-access

Issue #410 and #411. User Access Behaviour Fixed

Author: nishant-d

src/components/userGroups/Group.tsx

@@ -96,12 +96,12 @@ export default function GroupForm({ id = null, index = null, groupData = null, u
             const { result } = await saveGroup(payload)
             if (id) {
                 updateCallback(index, result)
+                toast.success('Group updated')
             }
             else {
                 createCallback(result)
+                toast.success('Group createed')
             }
-
-            toast.success('Create successfully')
         }
         catch (err) {
             showError(err)
@@ -237,7 +237,7 @@ export default function GroupForm({ id = null, index = null, groupData = null, u
         setSubmitting(true)
         try {
             await deleteGroup(id)
-            toast.success('Deleted group successfully.')
+            toast.success('Group deleted')
             deleteCallback(index)
         }
         catch (err) {

src/components/userGroups/User.tsx

@@ -1,18 +1,15 @@
 
 import React, { useState, useEffect, useMemo, useCallback, useRef } from 'react'
-import { showError, Progressing, ConfirmationDialog, mapByKey, removeItemsFromArray, validateEmail, Option, ClearIndicator, MultiValueRemove, multiSelectStyles, DeleteDialog } from '../common'
-
+import { showError, Progressing, mapByKey, removeItemsFromArray, validateEmail, Option, ClearIndicator, MultiValueRemove, multiSelectStyles, DeleteDialog } from '../common'
 import { saveUser, deleteUser } from './userGroup.service';
 import Creatable from 'react-select/creatable'
 import Select, { components } from 'react-select';
-
 import { DirectPermissionsRoleFilter, ChartGroupPermissionsFilter, EntityTypes, ActionTypes, CreateUser, OptionType, APIRoleFilter } from './userGroups.types'
-import './UserGroup.scss';
 import { toast } from 'react-toastify'
 import { useUserGroupContext, DirectPermission, ChartPermission, GroupRow } from './UserGroup'
-import deleteIcon from '../../assets/img/warning-medium.svg'
 import { ReactComponent as AddIcon } from '../../assets/icons/ic-add.svg';
 import { ReactComponent as RedWarning } from '../../assets/icons/ic-error-medium.svg';
+import './UserGroup.scss';
 
 const MultiValueContainer = ({ validator, ...props }) => {
     const { children, data, innerProps, selectProps } = props
@@ -151,17 +148,16 @@ export default function UserForm({ id = null, userData = null, index, updateCall
             ],
             superAdmin: localSuperAdmin
         }
-
         try {
             const { result } = await saveUser(payload)
             if (id) {
                 updateCallback(index, result)
+                toast.success('User updated');
             }
             else {
                 createCallback(result)
+                toast.success('User created');
             }
-
-            toast.success('Created user successfully')
         }
         catch (err) {
             showError(err)
@@ -335,7 +331,7 @@ export default function UserForm({ id = null, userData = null, index, updateCall
         try {
             await deleteUser(id)
             deleteCallback(index)
-            toast.success('Deleted user successfully.')
+            toast.success('User deleted')
         }
         catch (err) {
             showError(err)

src/components/userGroups/UserGroup.tsx

@@ -4,23 +4,22 @@ import { useRouteMatch } from 'react-router'
 import { useAsync, NavigationArrow, getRandomColor, not, useKeyDown, noop, ConditionalWrap, Progressing, showError, removeItemsFromArray, getRandomString, Option, MultiValueContainer, MultiValueRemove, multiSelectStyles, sortBySelected, mapByKey, useEffectAfterMount } from '../common'
 import { getUserList, getGroupList, getUserId, getGroupId, getUserRole } from './userGroup.service';
 import { ReactComponent as AddIcon } from '../../assets/icons/ic-add.svg';
-import Select, { components } from 'react-select';
 import { get } from '../../services/api'
 import { getEnvironmentListMin, getProjectFilteredApps } from '../../services/service'
 import { getChartGroups } from '../charts/charts.service'
 import { ChartGroup } from '../charts/charts.types'
 import { DirectPermissionsRoleFilter, ChartGroupPermissionsFilter, ActionTypes, OptionType } from './userGroups.types'
 import UserForm from './User'
 import GroupForm from './Group';
-import './UserGroup.scss';
+import Select, { components } from 'react-select';
 import { DOCUMENTATION, Routes } from '../../config'
-
 import { ReactComponent as CloseIcon } from '../../assets/icons/ic-close.svg'
 import Tippy from '@tippyjs/react';
 import EmptyState from '../EmptyState/EmptyState';
 import EmptyImage from '../../assets/img/[email protected]';
 import EmptySearch from '../../assets/img/[email protected]';
 import { ReactComponent as Lock } from '../../assets/icons/ic-locked.svg'
+import './UserGroup.scss';
 
 interface UserGroup {
     appsList: Map<number, { loading: boolean, result: { id: number, name: string }[], error: any }>;
@@ -248,10 +247,10 @@ const UserGroupList: React.FC<{ type: 'user' | 'group', reloadLists: () => void
     if (loading) return <div className="w-100 flex" style={{ minHeight: '600px' }}><Progressing pageLoader /></div>
     if (!addHash) return type === "user" ? <NoUsers onClick={addNewEntry} /> : <NoGroups onClick={addNewEntry} />
     const filteredAndSorted = result
-        .filter(userOrGroup => (userOrGroup.email_id?.includes(searchString) || userOrGroup.name?.includes(searchString) || userOrGroup.description?.includes(searchString)))
+        .filter(userOrGroup => (userOrGroup.email_id?.includes(searchString?.toLowerCase()) || userOrGroup.name?.includes(searchString?.toLowerCase()) || userOrGroup.description?.includes(searchString)))
     return (
         <div id="auth-page__body" className="auth-page__body-users__list-container">
-            {result.length > 0 && <input value={searchString} autoComplete="off" ref={searchRef} type="search" placeholder={`search ${type}`} className="auth-search" onChange={e => setSearchString(e.target.value)} />}
+            {result.length > 0 && <input value={searchString} autoComplete="off" ref={searchRef} type="search" placeholder={`Search ${type}`} className="auth-search" onChange={e => setSearchString(e.target.value)} />}
             {!(filteredAndSorted.length === 0 && result.length > 0) && <AddUser cancelCallback={cancelCallback} key={addHash} text={`Add ${type}`} type={type} open={!(result) || result?.length === 0} {...{ createCallback, updateCallback, deleteCallback }} />}
             {filteredAndSorted
                 .map((data, index) =>