@capillarytech/creatives-library 9.0.38 → 9.0.40-alpha.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "9.0.38",
+  "version": "9.0.40-alpha.0",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/translations/en.json

@@ -63,8 +63,8 @@
   "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
   "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
   "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-  "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-  "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+  "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+  "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
   "creatives.components.CapTagList.Cancel": "Cancel",
   "creatives.components.CapTagList.Ok": "Ok",

package/utils/permissions.js

@@ -0,0 +1,59 @@
+import {
+  CREATIVE_VIEW,
+  CREATIVE_CREATE,
+  CREATIVE_EDIT,
+  CREATIVE_DELETE,
+  CREATIVES_UI_VIEW,
+} from '../v2Containers/App/constants';
+
+export const PERMISSIONS = {
+  CREATIVE_VIEW,
+  CREATIVE_CREATE,
+  CREATIVE_EDIT,
+  CREATIVE_DELETE,
+};
+
+export const PERMISSION_IDS = {
+  [CREATIVE_VIEW]: 1508,
+  [CREATIVE_CREATE]: 1509,
+  [CREATIVE_EDIT]: 1510,
+  [CREATIVE_DELETE]: 1511,
+};
+
+/**
+ * Mode-aware access resolver for the tri-modal Creatives app.
+ * Standalone: the `cap` slice is passed as a prop by the connected container.
+ * Library / MFE: the host passes a `cap` (or legacy `Global`) prop.
+ * Reads the prop first, then falls back — mirrors TemplatesV2's existing
+ * `cap.user || Global.user` resolution.
+ */
+export const getUserAccess = (props = {}) => {
+  const { cap = {}, Global = {} } = props;
+  const user = (cap && cap.user) || (Global && Global.user) || {};
+  const isLoaded = !!(
+    user &&
+    typeof user === 'object' &&
+    Object.keys(user).length > 0
+  );
+  return {
+    accessiblePermissions: (isLoaded && user.accessiblePermissions) || [],
+    isLoaded,
+  };
+};
+
+export const hasPermission = (userAccess, code) => {
+  if (!userAccess) return false;
+  const granted = userAccess.accessiblePermissions || [];
+  const id = PERMISSION_IDS[code];
+  return (
+    granted.includes(code) ||
+    granted.includes(id) ||
+    granted.includes(String(id))
+  );
+};
+
+// Zero-impact view gate: honour the new CREATIVE_VIEW OR the legacy CREATIVES_UI_VIEW.
+export const canViewCreatives = userAccess =>
+  hasPermission(userAccess, CREATIVE_VIEW) ||
+  (userAccess &&
+    (userAccess.accessiblePermissions || []).includes(CREATIVES_UI_VIEW));

package/utils/tests/permissions.test.js

@@ -0,0 +1,116 @@
+/**
+ * Test suite for RBAC permission helpers (app/utils/permissions.js).
+ * Covers getUserAccess (loaded/unloaded, cap vs Global, missing perms),
+ * hasPermission (null guard, code/id/string-id match, empty), and
+ * canViewCreatives (new perm, legacy perm, null guard).
+ */
+import {
+  PERMISSIONS,
+  PERMISSION_IDS,
+  getUserAccess,
+  hasPermission,
+  canViewCreatives,
+} from '../permissions';
+import {
+  CREATIVE_VIEW,
+  CREATIVE_CREATE,
+  CREATIVE_EDIT,
+  CREATIVE_DELETE,
+  CREATIVES_UI_VIEW,
+} from '../../v2Containers/App/constants';
+
+describe('permissions - exported maps', () => {
+  it('exposes the four creative permission codes', () => {
+    expect(PERMISSIONS).toEqual({
+      CREATIVE_VIEW,
+      CREATIVE_CREATE,
+      CREATIVE_EDIT,
+      CREATIVE_DELETE,
+    });
+  });
+
+  it('maps each permission code to its id', () => {
+    expect(PERMISSION_IDS[CREATIVE_VIEW]).toBe(1508);
+    expect(PERMISSION_IDS[CREATIVE_CREATE]).toBe(1509);
+    expect(PERMISSION_IDS[CREATIVE_EDIT]).toBe(1510);
+    expect(PERMISSION_IDS[CREATIVE_DELETE]).toBe(1511);
+  });
+});
+
+describe('getUserAccess', () => {
+  it('returns unloaded access with empty perms when no props are passed', () => {
+    expect(getUserAccess()).toEqual({ accessiblePermissions: [], isLoaded: false });
+  });
+
+  it('returns unloaded access for an empty props object', () => {
+    expect(getUserAccess({})).toEqual({ accessiblePermissions: [], isLoaded: false });
+  });
+
+  it('reads accessiblePermissions from cap.user when loaded', () => {
+    const result = getUserAccess({ cap: { user: { accessiblePermissions: [1508, 1509] } } });
+    expect(result).toEqual({ accessiblePermissions: [1508, 1509], isLoaded: true });
+  });
+
+  it('falls back to Global.user when cap.user is absent', () => {
+    const result = getUserAccess({ Global: { user: { accessiblePermissions: ['CREATIVE_VIEW'] } } });
+    expect(result).toEqual({ accessiblePermissions: ['CREATIVE_VIEW'], isLoaded: true });
+  });
+
+  it('is not loaded when the user object is empty', () => {
+    expect(getUserAccess({ cap: { user: {} } })).toEqual({ accessiblePermissions: [], isLoaded: false });
+  });
+
+  it('defaults accessiblePermissions to [] when a loaded user has none', () => {
+    const result = getUserAccess({ cap: { user: { id: 42 } } });
+    expect(result).toEqual({ accessiblePermissions: [], isLoaded: true });
+  });
+});
+
+describe('hasPermission', () => {
+  it('returns false when userAccess is null or undefined', () => {
+    expect(hasPermission(null, CREATIVE_VIEW)).toBe(false);
+    expect(hasPermission(undefined, CREATIVE_VIEW)).toBe(false);
+  });
+
+  it('returns false when accessiblePermissions is missing', () => {
+    expect(hasPermission({}, CREATIVE_VIEW)).toBe(false);
+  });
+
+  it('matches by permission code', () => {
+    expect(hasPermission({ accessiblePermissions: [CREATIVE_CREATE] }, CREATIVE_CREATE)).toBe(true);
+  });
+
+  it('matches by numeric permission id', () => {
+    expect(hasPermission({ accessiblePermissions: [1509] }, CREATIVE_CREATE)).toBe(true);
+  });
+
+  it('matches by string permission id', () => {
+    expect(hasPermission({ accessiblePermissions: ['1509'] }, CREATIVE_CREATE)).toBe(true);
+  });
+
+  it('returns false when the permission is not granted', () => {
+    expect(hasPermission({ accessiblePermissions: [CREATIVE_VIEW] }, CREATIVE_DELETE)).toBe(false);
+    expect(hasPermission({ accessiblePermissions: [] }, CREATIVE_VIEW)).toBe(false);
+  });
+});
+
+describe('canViewCreatives', () => {
+  it('allows when the new CREATIVE_VIEW permission is present', () => {
+    expect(canViewCreatives({ accessiblePermissions: [CREATIVE_VIEW] })).toBe(true);
+    expect(canViewCreatives({ accessiblePermissions: [1508] })).toBe(true);
+  });
+
+  it('allows via the legacy CREATIVES_UI_VIEW permission', () => {
+    expect(canViewCreatives({ accessiblePermissions: [CREATIVES_UI_VIEW] })).toBe(true);
+  });
+
+  it('returns a falsy value when userAccess is null', () => {
+    // short-circuits on `userAccess &&`, so returns null (falsy) rather than false
+    expect(canViewCreatives(null)).toBeFalsy();
+  });
+
+  it('returns false when neither view permission is present', () => {
+    expect(canViewCreatives({ accessiblePermissions: [CREATIVE_CREATE] })).toBe(false);
+    expect(canViewCreatives({})).toBe(false);
+  });
+});

package/v2Components/AccessForbidden/_accessForbidden.scss

@@ -0,0 +1,14 @@
+// Access-denied screen: rbac-lock icon + heading + subtext (matches the shared
+// "no access" screen used across Loyalty+ / Org Settings).
+.no-access-icon {
+  font-size: 48px;
+  color: #8c8c8c;
+}
+.no-access-title {
+  margin-top: 16px;
+}
+.no-access-text {
+  margin-top: 8px;
+  color: #6b778c;
+  max-width: 420px;
+}

package/v2Components/AccessForbidden/index.js

@@ -1,14 +1,16 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
-import { CapRow, CapHeading } from '@capillarytech/cap-ui-library';
+import { CapRow, CapHeading, CapIcon } from '@capillarytech/cap-ui-library';
 import messages from './messages';
+import './_accessForbidden.scss';
 
 const AccessForbidden = () => (
   <CapRow type='flex' vertical justify='center' align='middle' className="margin-t-32 text-align-center">
-    <CapHeading type="h2">
+    <CapIcon type="rbac-lock" className="no-access-icon" />
+    <CapHeading type="h3" className="no-access-title">
       <FormattedMessage {...messages.forbiddenHeader} />
     </CapHeading>
-    <CapHeading type="h3" className="margin-t-24">
+    <CapHeading type="h6" className="no-access-text">
       <FormattedMessage {...messages.forbiddenDesc} />
     </CapHeading>
   </CapRow>

package/v2Components/AccessForbidden/messages.js

@@ -5,10 +5,11 @@ const prefix = 'creatives.components.AccessForbidden';
 export default defineMessages({
   forbiddenHeader: {
     id: `${prefix}.forbiddenHeader`,
-    defaultMessage: 'Access Forbidden',
+    defaultMessage: "You don't have permission to view this page.",
   },
   forbiddenDesc: {
     id: `${prefix}.forbiddenDesc`,
-    defaultMessage: 'This page access has not been provided to you.',
+    defaultMessage:
+      'Please contact your organisation administrator to request access.',
   },
 });

package/v2Components/NoPermissionWrapper/_noPermissionWrapper.scss

@@ -0,0 +1,12 @@
+// Dim + block interaction for a control the user lacks permission for.
+// The wrapper keeps pointer events (so the CapTooltip still shows on hover) while the
+// inner control is dimmed and non-interactive.
+.rbac-no-permission {
+  display: inline-block;
+  cursor: not-allowed;
+
+  > * {
+    opacity: 0.4;
+    pointer-events: none;
+  }
+}

package/v2Components/NoPermissionWrapper/index.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import CapTooltip from '@capillarytech/cap-ui-library/CapTooltip';
+import globalMessages from '../../v2Containers/Cap/messages';
+import './_noPermissionWrapper.scss';
+
+// Wraps a single control and, when the user is not `allowed`, dims it + blocks
+// interaction (via CSS) and shows a permission tooltip on hover. Uses CapTooltip
+// instead of hand-rolled positioning/portals.
+const NoPermissionWrapper = ({ allowed, children, message }) => {
+  const child = React.Children.only(children);
+
+  if (allowed || child.props.disabled) {
+    return child;
+  }
+
+  return (
+    <CapTooltip
+      title={message || <FormattedMessage {...globalMessages.noPermissionAction} />}
+    >
+      <span className="rbac-no-permission">{child}</span>
+    </CapTooltip>
+  );
+};
+
+export default NoPermissionWrapper;

package/v2Containers/App/constants.js

@@ -97,6 +97,11 @@ export const BEE_PLUGIN = 'BEE_PLUGIN';
 export const NO_COMMUNICATION = 'NO_COMMUNICATION';
 export const FTP = 'FTP';
 export const CREATIVES_UI_VIEW = 'CREATIVES_UI_VIEW';
+// VAPT RBAC granular Creatives permissions (module creatives/ui)
+export const CREATIVE_VIEW = 'CREATIVE_VIEW';
+export const CREATIVE_CREATE = 'CREATIVE_CREATE';
+export const CREATIVE_EDIT = 'CREATIVE_EDIT';
+export const CREATIVE_DELETE = 'CREATIVE_DELETE';
 
 export const APPLY_NOW = <FormattedMessage {...globalMessages.applyNow} />;
 export const NO_CALL_TO_ACTION = <FormattedMessage {...globalMessages.noCallToAction} />;

package/v2Containers/Assets/Gallery/_gallery.scss

@@ -5,3 +5,9 @@
     margin-bottom: -$CAP_SPACE_16;
   }
 }
+
+// RBAC: dim + block a control the user lacks permission for (used with CapTooltip).
+.rbac-disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}

package/v2Containers/Assets/Gallery/index.js

@@ -13,10 +13,12 @@ import { FormattedMessage, injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
 import moment from "moment";
 import _ from "lodash";
-import { CapHeading, CapHeader, CapInput, CapButton, CapIcon, CapDropdown, CapMenu, CapCustomCard, CapSlideBox, CapLabel, CapIllustration, CapNotification,} from '@capillarytech/cap-ui-library';
+import { CapHeading, CapHeader, CapInput, CapButton, CapIcon, CapDropdown, CapMenu, CapCustomCard, CapSlideBox, CapLabel, CapIllustration, CapNotification, CapTooltip,} from '@capillarytech/cap-ui-library';
+import NoPermissionWrapper from '../../../v2Components/NoPermissionWrapper';
 import { Popover } from 'antd';
 import makeSelectGallery from './selectors';
 import messages from './messages';
+import globalMessages from '../../Cap/messages';
 import * as actions from './actions';
 import { UserIsAuthenticated } from '../../../utils/authWrapper';
 import * as globalActions from '../../Cap/actions';
@@ -307,9 +309,18 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
             <div className="more-icon-wrapper">
               <Popover
                 placement="leftTop"
-                content={<div style={{ cursor: 'pointer'}}><p onClick={() => this.deleteAsset(asset)}>
-                  <FormattedMessage {...messages.delete} />
-                </p></div>} trigger="click">
+                content={<div>
+                  <p
+                    className={this.props.canDelete === false ? 'rbac-disabled' : ''}
+                    onClick={() => { if (this.props.canDelete !== false) this.deleteAsset(asset); }}
+                  >
+                    {this.props.canDelete === false ? (
+                      <CapTooltip title={<FormattedMessage {...globalMessages.noPermissionAction} />}><span><FormattedMessage {...messages.delete} /></span></CapTooltip>
+                    ) : (
+                      <FormattedMessage {...messages.delete} />
+                    )}
+                  </p>
+                </div>} trigger="click">
                 <i className="material-icons creative-icons">more_vert</i>
               </Popover>
             </div>
@@ -345,8 +356,15 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
           <CapDropdown
             overlay={
               <CapMenu>
-                <CapMenu.Item className="delete-gallery" onClick={() => this.deleteAsset(template)}>
-                  <FormattedMessage {...messages.delete} />
+                <CapMenu.Item
+                  className={`delete-gallery ${this.props.canDelete === false ? 'rbac-disabled' : ''}`.trim()}
+                  onClick={() => { if (this.props.canDelete !== false) this.deleteAsset(template); }}
+                >
+                  {this.props.canDelete === false ? (
+                    <CapTooltip title={<FormattedMessage {...globalMessages.noPermissionAction} />}><span><FormattedMessage {...messages.delete} /></span></CapTooltip>
+                  ) : (
+                    <FormattedMessage {...messages.delete} />
+                  )}
                 </CapMenu.Item>
               </CapMenu>
         }
@@ -382,7 +400,11 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
             _.isEmpty(templates) &&
             _.isEmpty(searchText) &&
             !searchLoader &&
-            <CapIllustration {...this.getIllustrationProps} />
+            <CapIllustration
+              {...this.getIllustrationProps}
+              disabled={this.props.canCreate === false}
+              buttonTooltip={this.props.canCreate === false ? this.props.intl.formatMessage(globalMessages.noPermissionAction) : undefined}
+            />
           )}
         </div>
         }
@@ -458,9 +480,11 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
             <div style={{ textAlign: 'right', marginTop: '16px', width: '50%'}}>
               <form encType="multipart/form-data" id="myForm">
                 <input style={{ display: 'none'}} id="fileName" type="file" onClick={(e) => {e.target.value=null}} onChange={(e) => this.uploadImages(e, {files: e.target.files})} accept="image/*" multiple/>
-                <CapButton className="upload-image-gallery" type={this.props.location.query.type !== 'embedded' ? 'primary' : 'secondary'} onClick={(e) => this.openFileDialog(e)} style={{float: 'right'}}>
-                  <FormattedMessage {...messages.upload} />
-                </CapButton>
+                <NoPermissionWrapper allowed={this.props.canCreate !== false}>
+                  <CapButton className="upload-image-gallery" type={this.props.location.query.type !== 'embedded' ? 'primary' : 'secondary'} onClick={(e) => this.openFileDialog(e)} style={{float: 'right'}}>
+                    <FormattedMessage {...messages.upload} />
+                  </CapButton>
+                </NoPermissionWrapper>
               </form>
             </div>
           )

package/v2Containers/Cap/index.js

@@ -19,7 +19,7 @@ import * as appActions from '../App/actions';
 import config from '../../config/app';
 import NavigationBar from '../../v2Components/NavigationBar';
 import { engagePlusPublicPath, publicPath } from '../../config/path';
-import { GTM_TRACKING_ID, CREATIVES_UI_VIEW, FAILURE } from '../App/constants';
+import { GTM_TRACKING_ID, CREATIVES_UI_VIEW, CREATIVE_VIEW, FAILURE } from '../App/constants';
 import { makeSelectLocale } from '../../v2Containers/LanguageProvider/selectors';
 import CapSupportVideosWrapper from '@capillarytech/cap-ui-library/CapSupportVideosWrapper';
 import { replaceDynamicAndCompare } from '@capillarytech/cap-ui-library/CapSupportVideosWrapper/utils';
@@ -115,7 +115,10 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
     const parentModule = pathname.substring(pathname.lastIndexOf('/') + 1);
     this.props.actions.getUserData((userData, currentOrgDetails = {}) => { //taking currentOrgDetails as we are not getting this data in this.props.Global props.
       const { accessibleFeatures = [] } = currentOrgDetails;
-      if (!userData.accessiblePermissions.includes(CREATIVES_UI_VIEW)) {
+      if (
+        !userData.accessiblePermissions.includes(CREATIVES_UI_VIEW) &&
+        !userData.accessiblePermissions.includes(CREATIVE_VIEW)
+      ) {
         this.setState({ isCreativesAccessible: false });
       }
       const userGtmData = this.getUserGtmData();

package/v2Containers/Cap/messages.js

@@ -209,5 +209,9 @@ export default defineMessages({
     id: 'creatives.componentsV2.autofill',
     defaultMessage: 'Autofill',
   },
+  noPermissionAction: {
+    id: 'creatives.componentsV2.noPermissionAction',
+    defaultMessage: "You don't have permission to perform this action.",
+  },
 });
 

package/v2Containers/Cap/tests/__snapshots__/index.test.js.snap

@@ -141,8 +141,8 @@ exports[`<Cap /> should render correct component 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",

package/v2Containers/Line/Container/ImageCarousel/tests/__snapshots__/content.test.js.snap

@@ -87,8 +87,8 @@ exports[`Creatives line image carousel test/> should render 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -4228,8 +4228,8 @@ exports[`Creatives line image carousel test/> should render 2`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -8508,8 +8508,8 @@ exports[`Creatives line image carousel test/> should render 3`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",

package/v2Containers/Line/Container/ImageCarousel/tests/__snapshots__/index.test.js.snap

@@ -87,8 +87,8 @@ exports[`line wrapper test/> should render line component new 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",
@@ -15138,8 +15138,8 @@ exports[`line wrapper test/> should render line component old 1`] = `
         "app.v2containers.SmsTrai.Edit.traiEditTitle": "Message",
         "app.v2containers.SmsTrai.Edit.unicodeLabel": "Allow unicode characters",
         "app.v2containers.SmsTrai.Edit.unsupportedTagsValidationError": "Unsupported tags: {unsupportedTags}. Please remove them from this message.",
-        "creatives.components.AccessForbidden.forbiddenDesc": "This page access has not been provided to you.",
-        "creatives.components.AccessForbidden.forbiddenHeader": "Access Forbidden",
+        "creatives.components.AccessForbidden.forbiddenDesc": "Please contact your organisation administrator to request access.",
+        "creatives.components.AccessForbidden.forbiddenHeader": "You don't have permission to view this page.",
         "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
         "creatives.components.CapTagList.Cancel": "Cancel",
         "creatives.components.CapTagList.Ok": "Ok",