@blaze-cms/react-page-builder 0.125.0-admin-updates.1 → 0.125.0-alpha.13

package/src/components/Button.js

@@ -6,6 +6,7 @@ import BlazeButton from '@blaze-react/button';
 import { handleLogout } from '@blaze-cms/core-auth-ui';
 import { useApolloClient } from '@apollo/client';
 import PropTypes, { bool, string } from 'prop-types';
+import { useStringTemplate } from '@blaze-cms/utils-handlebars';
 import ClickWrapper from './ClickWrapper';
 import BlazeLink from './BlazeLink';
 import { withTitle } from '../HOC';
@@ -30,6 +31,7 @@ const Button = props => {
     clickAction,
     childSeoVisibility,
     afterClickText,
+    parent,
     ...otherProps
   } = props;
   const client = useApolloClient();
@@ -38,6 +40,9 @@ const Button = props => {
   const [cookies] = useCookies();
   const { blaze_auth: blazeCookie } = cookies;
   const [showChildren, setShowChildren] = useState(false);
+  const {
+    data: [textToUse, afterClickTextToUse, urlToUse]
+  } = useStringTemplate(parent, [text, afterClickText, url]);
 
   useEffect(
     () => {
@@ -54,7 +59,7 @@ const Button = props => {
 
   const logout = () => {
     handleLogout(client);
-    url ? router.reload(url) : router.reload();
+    url ? router.reload(urlToUse) : router.reload();
   };
 
   const handleClick = () => {
@@ -66,9 +71,9 @@ const Button = props => {
 
   const buttonType = !text && icon ? 'icon' : type;
   const modifiers = getClassModifiers(buttonType, { icon, style, ...otherProps });
-  const currentProps = url ? { href: url, title: name } : { name };
+  const currentProps = url ? { href: urlToUse, title: name } : { name };
   const DynamicButton = url && !isLogoutButton ? BlazeLink : BlazeButton;
-  updateChildrensParent(children, otherProps.parent.itemId, otherProps.parent.itemEntity);
+  updateChildrensParent(children, parent.itemId, parent.itemEntity);
 
   const renderedChildren = renderChildren(children, { onClose: handleClick });
   const { shouldUseClickWrapper, wrapperProps } = getClickWrapperOptions(children, props);
@@ -84,13 +89,14 @@ const Button = props => {
       {!childSeoVisibility && showChildren && renderedChildren}
       <DynamicButton className={modifiers} onClick={handleClick} {...currentProps}>
         {icon && <i className={icon} />}
-        {showChildren ? afterClickText : text}
+        {showChildren ? afterClickTextToUse : textToUse}
       </DynamicButton>
     </Wrapper>
   );
 };
 
 Button.propTypes = {
+  parent: PropTypes.object,
   clickAction: PropTypes.string,
   text: PropTypes.string,
   afterClickText: string,
@@ -105,6 +111,7 @@ Button.propTypes = {
 };
 
 Button.defaultProps = {
+  parent: {},
   clickAction: '',
   text: '',
   afterClickText: '',

package/tests/unit/src/components/Button.test.js

@@ -12,6 +12,13 @@ jest.mock('next/router', () => ({
   useRouter: jest.fn(() => ({ asPath: '' }))
 }));
 
+jest.mock('@blaze-cms/utils-handlebars', () => ({
+  useStringTemplate: jest.fn((parent, [text, after, url]) => ({
+    loading: false,
+    data: [text, after, url]
+  }))
+}));
+
 const componentProps = {
   type: 'icon',
   text: 'test',