feat: implement deletable option

GluuFederation · Feb 28, 2022 · 4b5b3ab · 4b5b3ab
1 parent 3be621b
commit 4b5b3ab
Show file tree

Hide file tree

Showing 8 changed files with 106 additions and 22 deletions.
diff --git a/admin-ui/app/locales/en/translation.json b/admin-ui/app/locales/en/translation.json
@@ -229,7 +229,8 @@
     "serverTimezone": "Server Timezone",
     "binaryAttributes": "Binary Attributes",
     "certificateAttributes": "Certificate Attributes",
-    "role": "Role"
+    "role": "Role",
+    "deletable": "Deletable"
   },
   "languages": {
     "french": "French",

diff --git a/admin-ui/app/locales/fr/translation.json b/admin-ui/app/locales/fr/translation.json
@@ -220,7 +220,8 @@
     "customerEmail": "Email client",
     "customerName": "Nom du client",
     "licenseDetails": "Détails de la licence",
-    "role": "Role"
+    "role": "Role",
+    "deletable": "Deletable"
   },
   "messages": {
     "action_commit_question": "Journal d'audit : vous souhaitez appliquer les modifications apportées sur cette page ?",

diff --git a/admin-ui/app/locales/pt/translation.json b/admin-ui/app/locales/pt/translation.json
@@ -219,7 +219,8 @@
     "customerEmail": "Email do cliente",
     "customerName": "nome do cliente",
     "licenseDetails": "Detalhes da licença",
-    "role": "Role"
+    "role": "Role",
+    "deletable": "Deletable"
   },
   "messages": {
     "action_commit_question": "Registro de auditoria: deseja aplicar as alterações feitas nesta página?",

diff --git a/admin-ui/plugins/admin/components/Mapping/MappingItem.js b/admin-ui/plugins/admin/components/Mapping/MappingItem.js
@@ -21,12 +21,28 @@ import applicationStyle from '../../../../app/routes/Apps/Gluu/styles/applicatio
 
 import { Formik } from 'formik'
 
-function MappingItem({ candidate }) {
+function MappingItem({ candidate, roles }) {
   const dispatch = useDispatch()
   const autocompleteRef = useRef(null)
   const permissions = useSelector((state) => state.apiPermissionReducer.items)
   const [searchablePermissions, setSearchAblePermissions] = useState([])
   const [serverPermissions, setServerPermissions] = useState(null)
+  const [isDeleteable, setIsDeleteable] = useState(false)
+
+  useEffect(() => {
+    if (roles) {
+      for (let i in roles) {
+        if (roles[i].role == candidate.role) {
+          if (roles[i].deletable) {
+            setIsDeleteable(true)
+          } else {
+            setIsDeleteable(false)
+          }
+        }
+      }
+    }
+  }, [roles])
+
   const getPermissionsForSearch = () => {
     const selectedPermissions = candidate.permissions
     let filteredArr = []
@@ -37,6 +53,9 @@ function MappingItem({ candidate }) {
     }
     setSearchAblePermissions(filteredArr)
   }
+  useEffect(() => {
+    console.log('candidate', candidate)
+  }, [])
 
   const revertLocalChanges = () => {
     dispatch(updatePermissionsServerResponse(JSON.parse(serverPermissions)))
@@ -95,20 +114,21 @@ function MappingItem({ candidate }) {
             <Accordion.Header className="text-info">
               <Accordion.Indicator className="mr-2" />
               {candidate.role}
-
-              <Button
-                type="button"
-                color="danger"
-                onClick={() => handleDeleteRole()}
-                style={{
-                  margin: '1px',
-                  float: 'right',
-                  padding: '0px',
-                }}
-              >
-                <i className="fa fa-trash mr-2"></i>
-                Delete
-              </Button>
+              {isDeleteable && (
+                <Button
+                  type="button"
+                  color="danger"
+                  onClick={() => handleDeleteRole()}
+                  style={{
+                    margin: '1px',
+                    float: 'right',
+                    padding: '0px',
+                  }}
+                >
+                  <i className="fa fa-trash mr-2"></i>
+                  Delete
+                </Button>
+              )}
               <Badge
                 color="info"
                 style={{

diff --git a/admin-ui/plugins/admin/components/Mapping/MappingPage.js b/admin-ui/plugins/admin/components/Mapping/MappingPage.js
@@ -93,7 +93,7 @@ function MappingPage({
               </Col>
             </FormGroup>
             {mapping.map((candidate, idx) => (
-              <MappingItem key={idx} candidate={candidate} />
+              <MappingItem key={idx} candidate={candidate} roles={apiRoles} />
             ))}
           </GluuViewWrapper>
           <FormGroup row />

diff --git a/admin-ui/plugins/admin/components/Roles/RoleAddDialogForm.js b/admin-ui/plugins/admin/components/Roles/RoleAddDialogForm.js
@@ -14,6 +14,7 @@ import applicationStyle from '../../../../app/routes/Apps/Gluu/styles/applicatio
 
 const RoleAddDialogForm = ({ handler, modal, onAccept }) => {
   const [active, setActive] = useState(false)
+  const [deletable, setDeletable] = useState(false)
   const { t } = useTranslation()
 
   function handleStatus() {
@@ -29,6 +30,7 @@ const RoleAddDialogForm = ({ handler, modal, onAccept }) => {
     const roleData = {}
     roleData['role'] = document.getElementById('api_role').value
     roleData['description'] = document.getElementById('api_description').value
+    roleData['deletable'] = deletable
     onAccept(roleData)
   }
   return (
@@ -64,6 +66,21 @@ const RoleAddDialogForm = ({ handler, modal, onAccept }) => {
               />
             </Col>
           </FormGroup>
+          <FormGroup row>
+            <Col sm={12} className="pl-4">
+              <Input
+                id="deletable"
+                type="checkbox"
+                name="deletable"
+                onChange={(e) => {
+                  console.log(e.target.checked)
+                  setDeletable(e.target.checked)
+                }}
+                checked={deletable}
+              />{' '}
+              Deletable ?
+            </Col>
+          </FormGroup>
         </ModalBody>
         <ModalFooter>
           {active && (

diff --git a/admin-ui/plugins/admin/components/Roles/UiRoleListPage.js b/admin-ui/plugins/admin/components/Roles/UiRoleListPage.js
@@ -45,6 +45,10 @@ function UiRoleListPage({ apiRoles, permissions, loading, dispatch }) {
     })
   }
 
+  useEffect(() => {
+    console.log(apiRoles)
+  }, [apiRoles])
+
   function handleAddNewRole() {
     toggle()
   }
@@ -78,6 +82,44 @@ function UiRoleListPage({ apiRoles, permissions, loading, dispatch }) {
                 render: (rowData) => <Badge color="info">{rowData.role}</Badge>,
               },
               { title: `${t('fields.description')}`, field: 'description' },
+              {
+                title: `${t('fields.deletable')}`,
+                field: 'deletable',
+                editComponent: (rowData) => {
+                  console.log(rowData.rowData.deletable)
+                  return (
+                    <select
+                      onChange={(e) => rowData.onChange(e.target.value)}
+                      className="form-control"
+                    >
+                      <option
+                        selected={
+                          String(rowData.rowData.deletable) == 'true'
+                            ? true
+                            : false
+                        }
+                        value={true}
+                      >
+                        true
+                      </option>
+                      <option
+                        selected={
+                          String(rowData.rowData.deletable) == 'false' ||
+                          !rowData.rowData.deletable
+                            ? true
+                            : false
+                        }
+                        value={false}
+                      >
+                        false
+                      </option>
+                    </select>
+                  )
+                },
+                render: (rowData) => {
+                  return <div>{rowData?.deletable ? 'Yes' : 'No'}</div>
+                },
+              },
             ]}
             data={apiRoles}
             isLoading={loading || false}
@@ -100,6 +142,7 @@ function UiRoleListPage({ apiRoles, permissions, loading, dispatch }) {
             editable={{
               onRowUpdate: (newData, oldData) =>
                 new Promise((resolve, reject) => {
+                  console.log(newData)
                   buildPayload(userAction, 'Edit role', newData)
                   dispatch(editRole(userAction))
                   resolve()

diff --git a/admin-ui/plugins/admin/redux/sagas/ApiRoleSaga.js b/admin-ui/plugins/admin/redux/sagas/ApiRoleSaga.js
@@ -1,5 +1,6 @@
 import { call, all, put, fork, takeLatest, select } from 'redux-saga/effects'
 import {
+  getRoles as getRolesAction,
   getRolesResponse,
   addRoleResponse,
   editRoleResponse,
@@ -77,7 +78,7 @@ export function* addRole({ payload }) {
     addAdditionalData(audit, CREATE, API_ROLE, payload)
     const roleApi = yield* newFunction()
     const data = yield call(roleApi.addRole, payload.action.action_data)
-    yield put(addRoleResponse(data))
+    yield put(getRolesAction({}))
     yield call(postUserAction, audit)
   } catch (e) {
     yield put(addRoleResponse(null))
@@ -93,7 +94,7 @@ export function* editRole({ payload }) {
     addAdditionalData(audit, UPDATE, API_ROLE, payload)
     const roleApi = yield* newFunction()
     const data = yield call(roleApi.editRole, payload.action.action_data)
-    yield put(editRoleResponse(data))
+    yield put(getRolesAction({}))
     yield call(postUserAction, audit)
   } catch (e) {
     yield put(editRoleResponse(null))
@@ -110,7 +111,7 @@ export function* deleteRole({ payload }) {
     addAdditionalData(audit, DELETION, API_ROLE, payload)
     const roleApi = yield* newFunction()
     yield call(roleApi.deleteRole, payload.action.action_data)
-    yield put(deleteRoleResponse(payload.action.action_data))
+    yield put(getRolesAction({}))
     yield call(postUserAction, audit)
   } catch (e) {
     yield put(deleteRoleResponse(null))