IO-1056 IO-1062 Kanban & phonebook updates.

client/src/pages/phonebook/phonebook.page.component.jsx

@@ -10,15 +10,20 @@ import { useHistory, useLocation } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import AlertComponent from "../../components/alert/alert.component";
 import { QUERY_PHONEBOOK_PAGINATED } from "../../graphql/phonebook.queries";
-import { selectBodyshop } from "../../redux/user/user.selectors";
+import {
+  selectAuthLevel,
+  selectBodyshop,
+} from "../../redux/user/user.selectors";
 import ChatOpenButton from "../../components/chat-open-button/chat-open-button.component";
 import { alphaSort } from "../../utils/sorters";
+import { HasRbacAccess } from "../../components/rbac-wrapper/rbac-wrapper.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
+  authLevel: selectAuthLevel,
 });
 
-export function PhonebookPageComponent({ bodyshop }) {
+export function PhonebookPageComponent({ bodyshop, authLevel }) {
   const searchParams = queryString.parse(useLocation().search);
   const { page, sortcolumn, sortorder, search, phonebookentry } = searchParams;
   const history = useHistory();
@@ -133,6 +138,11 @@ export function PhonebookPageComponent({ bodyshop }) {
       history.push({ search: queryString.stringify(searchParams) });
     }
   };
+  const hasNoAccess = !HasRbacAccess({
+    bodyshop,
+    authLevel,
+    action: "phonebook:edit",
+  });
 
   return (
     <Card
@@ -155,7 +165,7 @@ export function PhonebookPageComponent({ bodyshop }) {
               </Button>
             </>
           )}
-          <Button onClick={handleNewPhonebook}>
+          <Button disabled={hasNoAccess} onClick={handleNewPhonebook}>
             {t("phonebook.actions.new")}
           </Button>
           <Button onClick={() => refetch()}>