@blaze-cms/plugin-data-ui 0.135.0 → 0.136.0-alpha.0

package/lib-es/components/EntityManager/Entity/SideBarRelations/index.js

@@ -4,9 +4,9 @@ import uuidv1 from 'uuid/v1';
 import { useApolloClient } from '@apollo/client';
 import { getQuery } from '@blaze-cms/admin-ui-utils';
 import { formFieldTypes } from '@blaze-cms/react-form-builder';
-import Badge from '@blaze-react/badge';
+import classnames from 'classnames';
 import { VersionsList } from '@blaze-cms/versioning-ui';
-import { PUBLISHED } from '../../../../constants';
+import { PUBLISHED, UNPUBLISHED } from '../../../../constants';
 const SideBarRelations = ({
   schema,
   onChange,
@@ -20,7 +20,8 @@ const SideBarRelations = ({
     formattedStatus,
     formattedUpdated,
     formattedCreated,
-    formattedPublished
+    formattedPublished,
+    status
   } = formData;
   const client = useApolloClient();
   const [relationsComponents, setRelationsComponents] = useState(null);
@@ -62,6 +63,10 @@ const SideBarRelations = ({
     identifier: itemEntity,
     interfaces
   } = schema;
+  const statusClassName = classnames('sidebar__status__badge', {
+    'sidebar__status__badge--published': status === PUBLISHED,
+    'sidebar__status__badge--unpublished': status === UNPUBLISHED
+  });
   return /*#__PURE__*/React.createElement("div", {
     className: "sidebar",
     "data-testid": "sideBarRelations-main-div"
@@ -69,10 +74,11 @@ const SideBarRelations = ({
     className: "sidebar__content"
   }, formattedCreated && /*#__PURE__*/React.createElement("div", {
     className: "sidebar__status"
-  }, formattedStatus && /*#__PURE__*/React.createElement(Badge, {
-    type: "status",
-    modifiers: formattedStatus
-  }, formattedStatus, formattedStatus === PUBLISHED && `: ${formattedPublished}`), /*#__PURE__*/React.createElement("p", null, "Created: ", /*#__PURE__*/React.createElement("span", null, formattedCreated)), /*#__PURE__*/React.createElement("p", null, "Updated: ", /*#__PURE__*/React.createElement("span", null, formattedUpdated))), /*#__PURE__*/React.createElement(VersionsList, {
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "sidebar__status__wrapper"
+  }, /*#__PURE__*/React.createElement("b", null, "Status"), /*#__PURE__*/React.createElement("span", {
+    className: statusClassName
+  }, formattedStatus)), formattedStatus === PUBLISHED && /*#__PURE__*/React.createElement("p", null, formattedStatus, " on: ", /*#__PURE__*/React.createElement("span", null, " ", formattedPublished)), /*#__PURE__*/React.createElement("p", null, "Created: ", /*#__PURE__*/React.createElement("span", null, formattedCreated)), /*#__PURE__*/React.createElement("p", null, "Updated: ", /*#__PURE__*/React.createElement("span", null, formattedUpdated))), /*#__PURE__*/React.createElement(VersionsList, {
     itemEntity: itemEntity,
     itemId: itemId,
     interfaces: interfaces

package/lib-es/components/EntityManager/Entity/SideBarRelations/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","useEffect","PropTypes","uuidv1","useApolloClient","getQuery","formFieldTypes","Badge","VersionsList","PUBLISHED","SideBarRelations","schema","onChange","formData","entity","relation","RelationComponent","formattedStatus","formattedUpdated","formattedCreated","formattedPublished","client","relationsComponents","setRelationsComponents","fetchRelationSchema","entityIdentifier","data","getEntitySchemas","relationSchema","query","variables","identifier","allRelationComponents","Promise","all","relations","filter","showInForm","foreignKey","properties","map","id","staticData","itemId","itemEntity","interfaces","createElement","className","type","modifiers","entitySchema","key","onSelect","propTypes","object","isRequired","func","defaultProps"],"sources":["../../../../../src/components/EntityManager/Entity/SideBarRelations/index.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport uuidv1 from 'uuid/v1';\nimport { useApolloClient } from '@apollo/client';\nimport { getQuery } from '@blaze-cms/admin-ui-utils';\nimport { formFieldTypes } from '@blaze-cms/react-form-builder';\nimport Badge from '@blaze-react/badge';\nimport { VersionsList } from '@blaze-cms/versioning-ui';\nimport { PUBLISHED } from '../../../../constants';\n\nconst SideBarRelations = ({ schema, onChange, formData, entity }) => {\n  const { relation: RelationComponent } = formFieldTypes;\n  const { formattedStatus, formattedUpdated, formattedCreated, formattedPublished } = formData;\n  const client = useApolloClient();\n  const [relationsComponents, setRelationsComponents] = useState(null);\n\n  useEffect(\n    () => {\n      (async () => {\n        const fetchRelationSchema = async ({ entityIdentifier }) => {\n          if (!entityIdentifier) return null;\n\n          const {\n            data: {\n              getEntitySchemas: [relationSchema]\n            }\n          } = await client.query({\n            query: getQuery('GET_ENTITY_SCHEMA'),\n            variables: { identifier: entityIdentifier }\n          });\n          return relationSchema;\n        };\n\n        if (!relationsComponents && schema) {\n          const allRelationComponents = await Promise.all(\n            schema.relations\n              .filter(({ showInForm, foreignKey }) => showInForm && schema.properties[foreignKey])\n              .map(async relation => ({\n                id: uuidv1(),\n                staticData: relation,\n                schema: await fetchRelationSchema(relation)\n              }))\n          );\n\n          setRelationsComponents(allRelationComponents);\n        }\n      })();\n    },\n    [client, relationsComponents, schema, schema.relations]\n  );\n  const { id: itemId } = entity;\n  const { identifier: itemEntity, interfaces } = schema;\n\n  return (\n    <div className=\"sidebar\" data-testid=\"sideBarRelations-main-div\">\n      <div className=\"sidebar__content\">\n        {formattedCreated && (\n          <div className=\"sidebar__status\">\n            {formattedStatus && (\n              <Badge type=\"status\" modifiers={formattedStatus}>\n                {formattedStatus}\n                {formattedStatus === PUBLISHED && `: ${formattedPublished}`}\n              </Badge>\n            )}\n            <p>\n              Created: <span>{formattedCreated}</span>\n            </p>\n            <p>\n              Updated: <span>{formattedUpdated}</span>\n            </p>\n          </div>\n        )}\n\n        <VersionsList itemEntity={itemEntity} itemId={itemId} interfaces={interfaces} />\n        {relationsComponents &&\n          relationsComponents.map(({ id, staticData, schema: entitySchema }) => (\n            <RelationComponent\n              formData={formData}\n              schema={entitySchema}\n              key={id}\n              staticData={staticData}\n              onSelect={onChange}\n            />\n          ))}\n      </div>\n    </div>\n  );\n};\n\nSideBarRelations.propTypes = {\n  schema: PropTypes.object.isRequired,\n  onChange: PropTypes.func.isRequired,\n  formData: PropTypes.object.isRequired,\n  entity: PropTypes.object\n};\n\nSideBarRelations.defaultProps = {\n  entity: {}\n};\n\nexport default SideBarRelations;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAClD,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,MAAM,MAAM,SAAS;AAC5B,SAASC,eAAe,QAAQ,gBAAgB;AAChD,SAASC,QAAQ,QAAQ,2BAA2B;AACpD,SAASC,cAAc,QAAQ,+BAA+B;AAC9D,OAAOC,KAAK,MAAM,oBAAoB;AACtC,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,SAAS,QAAQ,uBAAuB;AAEjD,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,MAAM;EAAEC,QAAQ;EAAEC,QAAQ;EAAEC;AAAO,CAAC,KAAK;EACnE,MAAM;IAAEC,QAAQ,EAAEC;EAAkB,CAAC,GAAGV,cAAc;EACtD,MAAM;IAAEW,eAAe;IAAEC,gBAAgB;IAAEC,gBAAgB;IAAEC;EAAmB,CAAC,GAAGP,QAAQ;EAC5F,MAAMQ,MAAM,GAAGjB,eAAe,CAAC,CAAC;EAChC,MAAM,CAACkB,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGvB,QAAQ,CAAC,IAAI,CAAC;EAEpEC,SAAS,CACP,MAAM;IACJ,CAAC,YAAY;MACX,MAAMuB,mBAAmB,GAAG,MAAAA,CAAO;QAAEC;MAAiB,CAAC,KAAK;QAC1D,IAAI,CAACA,gBAAgB,EAAE,OAAO,IAAI;QAElC,MAAM;UACJC,IAAI,EAAE;YACJC,gBAAgB,EAAE,CAACC,cAAc;UACnC;QACF,CAAC,GAAG,MAAMP,MAAM,CAACQ,KAAK,CAAC;UACrBA,KAAK,EAAExB,QAAQ,CAAC,mBAAmB,CAAC;UACpCyB,SAAS,EAAE;YAAEC,UAAU,EAAEN;UAAiB;QAC5C,CAAC,CAAC;QACF,OAAOG,cAAc;MACvB,CAAC;MAED,IAAI,CAACN,mBAAmB,IAAIX,MAAM,EAAE;QAClC,MAAMqB,qBAAqB,GAAG,MAAMC,OAAO,CAACC,GAAG,CAC7CvB,MAAM,CAACwB,SAAS,CACbC,MAAM,CAAC,CAAC;UAAEC,UAAU;UAAEC;QAAW,CAAC,KAAKD,UAAU,IAAI1B,MAAM,CAAC4B,UAAU,CAACD,UAAU,CAAC,CAAC,CACnFE,GAAG,CAAC,MAAMzB,QAAQ,KAAK;UACtB0B,EAAE,EAAEtC,MAAM,CAAC,CAAC;UACZuC,UAAU,EAAE3B,QAAQ;UACpBJ,MAAM,EAAE,MAAMa,mBAAmB,CAACT,QAAQ;QAC5C,CAAC,CAAC,CACN,CAAC;QAEDQ,sBAAsB,CAACS,qBAAqB,CAAC;MAC/C;IACF,CAAC,EAAE,CAAC;EACN,CAAC,EACD,CAACX,MAAM,EAAEC,mBAAmB,EAAEX,MAAM,EAAEA,MAAM,CAACwB,SAAS,CACxD,CAAC;EACD,MAAM;IAAEM,EAAE,EAAEE;EAAO,CAAC,GAAG7B,MAAM;EAC7B,MAAM;IAAEiB,UAAU,EAAEa,UAAU;IAAEC;EAAW,CAAC,GAAGlC,MAAM;EAErD,oBACEZ,KAAA,CAAA+C,aAAA;IAAKC,SAAS,EAAC,SAAS;IAAC,eAAY;EAA2B,gBAC9DhD,KAAA,CAAA+C,aAAA;IAAKC,SAAS,EAAC;EAAkB,GAC9B5B,gBAAgB,iBACfpB,KAAA,CAAA+C,aAAA;IAAKC,SAAS,EAAC;EAAiB,GAC7B9B,eAAe,iBACdlB,KAAA,CAAA+C,aAAA,CAACvC,KAAK;IAACyC,IAAI,EAAC,QAAQ;IAACC,SAAS,EAAEhC;EAAgB,GAC7CA,eAAe,EACfA,eAAe,KAAKR,SAAS,IAAK,KAAIW,kBAAmB,EACrD,CACR,eACDrB,KAAA,CAAA+C,aAAA,YAAG,WACQ,eAAA/C,KAAA,CAAA+C,aAAA,eAAO3B,gBAAuB,CACtC,CAAC,eACJpB,KAAA,CAAA+C,aAAA,YAAG,WACQ,eAAA/C,KAAA,CAAA+C,aAAA,eAAO5B,gBAAuB,CACtC,CACA,CACN,eAEDnB,KAAA,CAAA+C,aAAA,CAACtC,YAAY;IAACoC,UAAU,EAAEA,UAAW;IAACD,MAAM,EAAEA,MAAO;IAACE,UAAU,EAAEA;EAAW,CAAE,CAAC,EAC/EvB,mBAAmB,IAClBA,mBAAmB,CAACkB,GAAG,CAAC,CAAC;IAAEC,EAAE;IAAEC,UAAU;IAAE/B,MAAM,EAAEuC;EAAa,CAAC,kBAC/DnD,KAAA,CAAA+C,aAAA,CAAC9B,iBAAiB;IAChBH,QAAQ,EAAEA,QAAS;IACnBF,MAAM,EAAEuC,YAAa;IACrBC,GAAG,EAAEV,EAAG;IACRC,UAAU,EAAEA,UAAW;IACvBU,QAAQ,EAAExC;EAAS,CACpB,CACF,CACA,CACF,CAAC;AAEV,CAAC;AAEDF,gBAAgB,CAAC2C,SAAS,GAAG;EAC3B1C,MAAM,EAAET,SAAS,CAACoD,MAAM,CAACC,UAAU;EACnC3C,QAAQ,EAAEV,SAAS,CAACsD,IAAI,CAACD,UAAU;EACnC1C,QAAQ,EAAEX,SAAS,CAACoD,MAAM,CAACC,UAAU;EACrCzC,MAAM,EAAEZ,SAAS,CAACoD;AACpB,CAAC;AAED5C,gBAAgB,CAAC+C,YAAY,GAAG;EAC9B3C,MAAM,EAAE,CAAC;AACX,CAAC;AAED,eAAeJ,gBAAgB"}
+{"version":3,"file":"index.js","names":["React","useState","useEffect","PropTypes","uuidv1","useApolloClient","getQuery","formFieldTypes","classnames","VersionsList","PUBLISHED","UNPUBLISHED","SideBarRelations","schema","onChange","formData","entity","relation","RelationComponent","formattedStatus","formattedUpdated","formattedCreated","formattedPublished","status","client","relationsComponents","setRelationsComponents","fetchRelationSchema","entityIdentifier","data","getEntitySchemas","relationSchema","query","variables","identifier","allRelationComponents","Promise","all","relations","filter","showInForm","foreignKey","properties","map","id","staticData","itemId","itemEntity","interfaces","statusClassName","createElement","className","entitySchema","key","onSelect","propTypes","object","isRequired","func","defaultProps"],"sources":["../../../../../src/components/EntityManager/Entity/SideBarRelations/index.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport uuidv1 from 'uuid/v1';\nimport { useApolloClient } from '@apollo/client';\nimport { getQuery } from '@blaze-cms/admin-ui-utils';\nimport { formFieldTypes } from '@blaze-cms/react-form-builder';\nimport classnames from 'classnames';\nimport { VersionsList } from '@blaze-cms/versioning-ui';\nimport { PUBLISHED, UNPUBLISHED } from '../../../../constants';\n\nconst SideBarRelations = ({ schema, onChange, formData, entity }) => {\n  const { relation: RelationComponent } = formFieldTypes;\n  const {\n    formattedStatus,\n    formattedUpdated,\n    formattedCreated,\n    formattedPublished,\n    status\n  } = formData;\n  const client = useApolloClient();\n  const [relationsComponents, setRelationsComponents] = useState(null);\n  useEffect(\n    () => {\n      (async () => {\n        const fetchRelationSchema = async ({ entityIdentifier }) => {\n          if (!entityIdentifier) return null;\n\n          const {\n            data: {\n              getEntitySchemas: [relationSchema]\n            }\n          } = await client.query({\n            query: getQuery('GET_ENTITY_SCHEMA'),\n            variables: { identifier: entityIdentifier }\n          });\n          return relationSchema;\n        };\n\n        if (!relationsComponents && schema) {\n          const allRelationComponents = await Promise.all(\n            schema.relations\n              .filter(({ showInForm, foreignKey }) => showInForm && schema.properties[foreignKey])\n              .map(async relation => ({\n                id: uuidv1(),\n                staticData: relation,\n                schema: await fetchRelationSchema(relation)\n              }))\n          );\n\n          setRelationsComponents(allRelationComponents);\n        }\n      })();\n    },\n    [client, relationsComponents, schema, schema.relations]\n  );\n  const { id: itemId } = entity;\n  const { identifier: itemEntity, interfaces } = schema;\n\n  const statusClassName = classnames('sidebar__status__badge', {\n    'sidebar__status__badge--published': status === PUBLISHED,\n    'sidebar__status__badge--unpublished': status === UNPUBLISHED\n  });\n\n  return (\n    <div className=\"sidebar\" data-testid=\"sideBarRelations-main-div\">\n      <div className=\"sidebar__content\">\n        {formattedCreated && (\n          <div className=\"sidebar__status\">\n            <div className=\"sidebar__status__wrapper\">\n              <b>Status</b>\n              <span className={statusClassName}>{formattedStatus}</span>\n            </div>\n            {formattedStatus === PUBLISHED && (\n              <p>\n                {formattedStatus} on: <span> {formattedPublished}</span>\n              </p>\n            )}\n\n            <p>\n              Created: <span>{formattedCreated}</span>\n            </p>\n            <p>\n              Updated: <span>{formattedUpdated}</span>\n            </p>\n          </div>\n        )}\n\n        <VersionsList itemEntity={itemEntity} itemId={itemId} interfaces={interfaces} />\n        {relationsComponents &&\n          relationsComponents.map(({ id, staticData, schema: entitySchema }) => (\n            <RelationComponent\n              formData={formData}\n              schema={entitySchema}\n              key={id}\n              staticData={staticData}\n              onSelect={onChange}\n            />\n          ))}\n      </div>\n    </div>\n  );\n};\n\nSideBarRelations.propTypes = {\n  schema: PropTypes.object.isRequired,\n  onChange: PropTypes.func.isRequired,\n  formData: PropTypes.object.isRequired,\n  entity: PropTypes.object\n};\n\nSideBarRelations.defaultProps = {\n  entity: {}\n};\n\nexport default SideBarRelations;\n"],"mappings":"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"}

package/lib-es/components/EntityManager/Entity/actions-handlers/update/submit.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import buildUpdateDataQuery from '../../../../../utils/build-update-data-query';
 import { ERROR, SUCCESS, SAVE_BUTTON_TEXTS } from '../../../../../constants';
 const submit = async ({

package/lib-es/components/EntityManager/EntityManager.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useEffect, useState } from 'react';
 import { withRouter } from 'react-router-dom';
 import { useApolloClient } from '@apollo/client';

package/lib-es/components/EntityManager/utils/data-mappers.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { BlazeError } from '@blaze-cms/core-errors';
 const getPageName = (displayProperties = {}, entity = {}) => {
   if (!displayProperties || !displayProperties.adminHeader) {

package/lib-es/components/EntityManager/utils/entity.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import has from 'lodash.has';
 import { ENTITY_PUBLISHED, KEY_TO_CHECK, SELECT_DEFAULT_VALUE } from '../../../constants';
 function canViewPage(formData, entity, schema, entityIsPublished) {

package/lib-es/components/ListingTable/ListingTable.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { useApolloClient } from '@apollo/client';
 import React, { useEffect, useState, Fragment } from 'react';
 import PropTypes from 'prop-types';

package/lib-es/components/ListingTable/mappers/populate-rows.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
 import { Link } from 'react-router-dom';
 import TableActions from '../TableActions';

package/lib-es/components/Tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","PropTypes","Tab","TabItem","useReadFromCache","GET_CURRENT_TAB_ID","TabsContextProvider","PAGE_BUILDER_TAB","PAGE_BUILDER_TAB_INDEX","EDITOR_VIEW_TAB","EDITOR_VIEW_TAB_INDEX","Tabs","children","onTabChange","enabled","currentTabId","query","activeAccordions","setActiveAccordions","createElement","Fragment","value","selected","title","action","propTypes","oneOfType","object","arrayOf","isRequired","func","bool"],"sources":["../../../src/components/Tabs/index.js"],"sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { Tab, TabItem } from '@blaze-react/tab';\nimport {\n  useReadFromCache,\n  GET_CURRENT_TAB_ID,\n  TabsContextProvider\n} from '@blaze-cms/admin-ui-utils';\nimport {\n  PAGE_BUILDER_TAB,\n  PAGE_BUILDER_TAB_INDEX,\n  EDITOR_VIEW_TAB,\n  EDITOR_VIEW_TAB_INDEX\n} from '../../constants';\n\nconst Tabs = ({ children, onTabChange, enabled }) => {\n  const { currentTabId } = useReadFromCache({ query: GET_CURRENT_TAB_ID }) || EDITOR_VIEW_TAB_INDEX;\n  const [activeAccordions, setActiveAccordions] = useState([]);\n\n  return enabled ? (\n    <>\n      <TabsContextProvider value={{ currentTabId, activeAccordions, setActiveAccordions }}>\n        <Tab selected={currentTabId}>\n          <TabItem title={EDITOR_VIEW_TAB} action={() => onTabChange(EDITOR_VIEW_TAB_INDEX)}>\n            {children}\n          </TabItem>\n          <TabItem title={PAGE_BUILDER_TAB} action={() => onTabChange(PAGE_BUILDER_TAB_INDEX)}>\n            {children}\n          </TabItem>\n        </Tab>\n      </TabsContextProvider>\n    </>\n  ) : (\n    <>{children}</>\n  );\n};\n\nTabs.propTypes = {\n  children: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]).isRequired,\n  onTabChange: PropTypes.func.isRequired,\n  enabled: PropTypes.bool.isRequired\n};\n\nexport default Tabs;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,GAAG,EAAEC,OAAO,QAAQ,kBAAkB;AAC/C,SACEC,gBAAgB,EAChBC,kBAAkB,EAClBC,mBAAmB,QACd,2BAA2B;AAClC,SACEC,gBAAgB,EAChBC,sBAAsB,EACtBC,eAAe,EACfC,qBAAqB,QAChB,iBAAiB;AAExB,MAAMC,IAAI,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,WAAW;EAAEC;AAAQ,CAAC,KAAK;EACnD,MAAM;IAAEC;EAAa,CAAC,GAAGX,gBAAgB,CAAC;IAAEY,KAAK,EAAEX;EAAmB,CAAC,CAAC,IAAIK,qBAAqB;EACjG,MAAM,CAACO,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGlB,QAAQ,CAAC,EAAE,CAAC;EAE5D,OAAOc,OAAO,gBACZf,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,mBAAmB;IAACe,KAAK,EAAE;MAAEN,YAAY;MAAEE,gBAAgB;MAAEC;IAAoB;EAAE,gBAClFnB,KAAA,CAAAoB,aAAA,CAACjB,GAAG;IAACoB,QAAQ,EAAEP;EAAa,gBAC1BhB,KAAA,CAAAoB,aAAA,CAAChB,OAAO;IAACoB,KAAK,EAAEd,eAAgB;IAACe,MAAM,EAAEA,CAAA,KAAMX,WAAW,CAACH,qBAAqB;EAAE,GAC/EE,QACM,CAAC,eACVb,KAAA,CAAAoB,aAAA,CAAChB,OAAO;IAACoB,KAAK,EAAEhB,gBAAiB;IAACiB,MAAM,EAAEA,CAAA,KAAMX,WAAW,CAACL,sBAAsB;EAAE,GACjFI,QACM,CACN,CACc,CACrB,CAAC,gBAEHb,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,QAAGR,QAAW,CACf;AACH,CAAC;AAEDD,IAAI,CAACc,SAAS,GAAG;EACfb,QAAQ,EAAEX,SAAS,CAACyB,SAAS,CAAC,CAACzB,SAAS,CAAC0B,MAAM,EAAE1B,SAAS,CAAC2B,OAAO,CAAC3B,SAAS,CAAC0B,MAAM,CAAC,CAAC,CAAC,CAACE,UAAU;EACjGhB,WAAW,EAAEZ,SAAS,CAAC6B,IAAI,CAACD,UAAU;EACtCf,OAAO,EAAEb,SAAS,CAAC8B,IAAI,CAACF;AAC1B,CAAC;AAED,eAAelB,IAAI"}
+{"version":3,"file":"index.js","names":["React","useState","PropTypes","Tab","TabItem","useReadFromCache","GET_CURRENT_TAB_ID","TabsContextProvider","PAGE_BUILDER_TAB","PAGE_BUILDER_TAB_INDEX","EDITOR_VIEW_TAB","EDITOR_VIEW_TAB_INDEX","Tabs","children","onTabChange","enabled","currentTabId","query","activeAccordions","setActiveAccordions","createElement","Fragment","value","selected","title","action","propTypes","oneOfType","object","arrayOf","isRequired","func","bool"],"sources":["../../../src/components/Tabs/index.js"],"sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { Tab, TabItem } from '@blaze-react/tab';\nimport {\n  useReadFromCache,\n  GET_CURRENT_TAB_ID,\n  TabsContextProvider\n} from '@blaze-cms/admin-ui-utils';\nimport {\n  PAGE_BUILDER_TAB,\n  PAGE_BUILDER_TAB_INDEX,\n  EDITOR_VIEW_TAB,\n  EDITOR_VIEW_TAB_INDEX\n} from '../../constants';\n\nconst Tabs = ({ children, onTabChange, enabled }) => {\n  const { currentTabId } = useReadFromCache({ query: GET_CURRENT_TAB_ID }) || EDITOR_VIEW_TAB_INDEX;\n  const [activeAccordions, setActiveAccordions] = useState([]);\n  return enabled ? (\n    <>\n      <TabsContextProvider value={{ currentTabId, activeAccordions, setActiveAccordions }}>\n        <Tab selected={currentTabId}>\n          <TabItem title={EDITOR_VIEW_TAB} action={() => onTabChange(EDITOR_VIEW_TAB_INDEX)}>\n            {children}\n          </TabItem>\n          <TabItem title={PAGE_BUILDER_TAB} action={() => onTabChange(PAGE_BUILDER_TAB_INDEX)}>\n            {children}\n          </TabItem>\n        </Tab>\n      </TabsContextProvider>\n    </>\n  ) : (\n    <>{children}</>\n  );\n};\nTabs.propTypes = {\n  children: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]).isRequired,\n  onTabChange: PropTypes.func.isRequired,\n  enabled: PropTypes.bool.isRequired\n};\n\nexport default Tabs;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,GAAG,EAAEC,OAAO,QAAQ,kBAAkB;AAC/C,SACEC,gBAAgB,EAChBC,kBAAkB,EAClBC,mBAAmB,QACd,2BAA2B;AAClC,SACEC,gBAAgB,EAChBC,sBAAsB,EACtBC,eAAe,EACfC,qBAAqB,QAChB,iBAAiB;AAExB,MAAMC,IAAI,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,WAAW;EAAEC;AAAQ,CAAC,KAAK;EACnD,MAAM;IAAEC;EAAa,CAAC,GAAGX,gBAAgB,CAAC;IAAEY,KAAK,EAAEX;EAAmB,CAAC,CAAC,IAAIK,qBAAqB;EACjG,MAAM,CAACO,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGlB,QAAQ,CAAC,EAAE,CAAC;EAC5D,OAAOc,OAAO,gBACZf,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,qBACErB,KAAA,CAAAoB,aAAA,CAACb,mBAAmB;IAACe,KAAK,EAAE;MAAEN,YAAY;MAAEE,gBAAgB;MAAEC;IAAoB;EAAE,gBAClFnB,KAAA,CAAAoB,aAAA,CAACjB,GAAG;IAACoB,QAAQ,EAAEP;EAAa,gBAC1BhB,KAAA,CAAAoB,aAAA,CAAChB,OAAO;IAACoB,KAAK,EAAEd,eAAgB;IAACe,MAAM,EAAEA,CAAA,KAAMX,WAAW,CAACH,qBAAqB;EAAE,GAC/EE,QACM,CAAC,eACVb,KAAA,CAAAoB,aAAA,CAAChB,OAAO;IAACoB,KAAK,EAAEhB,gBAAiB;IAACiB,MAAM,EAAEA,CAAA,KAAMX,WAAW,CAACL,sBAAsB;EAAE,GACjFI,QACM,CACN,CACc,CACrB,CAAC,gBAEHb,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,QAAGR,QAAW,CACf;AACH,CAAC;AACDD,IAAI,CAACc,SAAS,GAAG;EACfb,QAAQ,EAAEX,SAAS,CAACyB,SAAS,CAAC,CAACzB,SAAS,CAAC0B,MAAM,EAAE1B,SAAS,CAAC2B,OAAO,CAAC3B,SAAS,CAAC0B,MAAM,CAAC,CAAC,CAAC,CAACE,UAAU;EACjGhB,WAAW,EAAEZ,SAAS,CAAC6B,IAAI,CAACD,UAAU;EACtCf,OAAO,EAAEb,SAAS,CAAC8B,IAAI,CAACF;AAC1B,CAAC;AAED,eAAelB,IAAI"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blaze-cms/plugin-data-ui",
-  "version": "0.135.0",
+  "version": "0.136.0-alpha.0",
   "description": "Blaze plugin data ui",
   "main": "lib/index.js",
   "module": "lib-es/index.js",
@@ -27,12 +27,12 @@
   },
   "license": "GPL-3.0",
   "dependencies": {
-    "@blaze-cms/admin-ui-utils": "^0.132.0",
+    "@blaze-cms/admin-ui-utils": "0.136.0-alpha.0",
     "@blaze-cms/core-errors": "^0.131.0",
-    "@blaze-cms/react-form-builder": "^0.134.0",
-    "@blaze-cms/react-page-builder": "^0.135.0",
+    "@blaze-cms/react-form-builder": "0.136.0-alpha.0",
+    "@blaze-cms/react-page-builder": "0.136.0-alpha.0",
     "@blaze-cms/setup-ui": "^0.131.0",
-    "@blaze-cms/versioning-ui": "^0.134.0",
+    "@blaze-cms/versioning-ui": "0.136.0-alpha.0",
     "@blaze-react/button": "0.5.19",
     "@blaze-react/more": "0.5.19",
     "@blaze-react/multiselect": "0.6.6",
@@ -65,5 +65,5 @@
     "lib/*",
     "lib-es/*"
   ],
-  "gitHead": "37423f2681b9ec2a1b949f2f3e09094c9920a6c8"
+  "gitHead": "1097c61e5ff2f2e0bc67772fb489efdd80e10d90"
 }

package/src/components/EntityManager/Entity/Entity.js

@@ -403,68 +403,70 @@ const Entity = ({
 
   return (
     <div className="page">
-      <Prompt when={hasToDisplayPrompt} message={LEAVE_PAGE_MESSAGE} />
-      {showModal && (
-        <DeleteAction
-          onClose={setModalStatus}
-          deleteAction={onDelete}
-          itemName={formData.values.name}
-        />
-      )}
-      {copyModalStatus && (
-        <CopyDataFromAction
-          onClose={handleCopyDataFromClose}
-          copyAction={onCopy}
-          getFormData={getFormData}
-        />
-      )}
-
-      <div className="row row--display-row">
-        <div className="column column--three-quarters">
-          <EntityHeader
-            entityData={entityData}
-            entityIdentifier={entityIdentifier}
-            pageTitle={pageTitle}
-            pageName={pageName}
-            onSubmit={onSubmit}
-            handlePublishAndUnpublish={handlePublishAndUnpublish}
-            isSaveButtonAvailable={isSaveButtonAvailable}
-            isEnablePublishButton={isEnablePublishButton}
-            isEnablePreviewButton={isEnablePreviewButton}
-            toggleCopyModal={setCopyModalStatus}
-            toggleModal={setModalStatus}
-            formData={formData}
-            onViewUrl={onViewUrlHandler}
-            saveButtonText={saveButtonText}
-          />
-
-          <div className="page__content">
-            <div className="content">
-              <Tabs
-                enabled={showPageBuilderTabs}
-                onTabChange={tabId => {
-                  client.writeQuery({
-                    query: GET_CURRENT_TAB_ID,
-                    data: { currentTabId: tabId }
-                  });
-                  setCurrentTabId(tabId);
-                }}>
-                <FormBuilder
-                  getIsFormValid={setIsFormValid}
-                  getFormValues={getFormValues}
-                  schema={schema}
-                  data={clonedFormData}
-                  onChange={onChangeFormValues}
-                  shouldCopyData={shouldCopyData}
-                  updateCopyData={updateCopyData}
-                  formValues={formValues}
-                  isNewEntity={isNewEntity}
-                />
-              </Tabs>
+      <EntityHeader
+        entityData={entityData}
+        entityIdentifier={entityIdentifier}
+        pageTitle={pageTitle}
+        pageName={pageName}
+        onSubmit={onSubmit}
+        handlePublishAndUnpublish={handlePublishAndUnpublish}
+        isSaveButtonAvailable={isSaveButtonAvailable}
+        isEnablePublishButton={isEnablePublishButton}
+        isEnablePreviewButton={isEnablePreviewButton}
+        toggleCopyModal={setCopyModalStatus}
+        toggleModal={setModalStatus}
+        formData={formData}
+        onViewUrl={onViewUrlHandler}
+        saveButtonText={saveButtonText}
+      />
+      <div className="page-wrapper__content">
+        <div className="tabs-wrapper tabs-wrapper__tab">
+          <Prompt when={hasToDisplayPrompt} message={LEAVE_PAGE_MESSAGE} />
+          {showModal && (
+            <DeleteAction
+              onClose={setModalStatus}
+              deleteAction={onDelete}
+              itemName={formData.values.name}
+            />
+          )}
+          {copyModalStatus && (
+            <CopyDataFromAction
+              onClose={handleCopyDataFromClose}
+              copyAction={onCopy}
+              getFormData={getFormData}
+            />
+          )}
+
+          <div className="page__content--fixed">
+            <div className="page__content">
+              <div className="content">
+                <Tabs
+                  enabled={showPageBuilderTabs}
+                  onTabChange={tabId => {
+                    client.writeQuery({
+                      query: GET_CURRENT_TAB_ID,
+                      data: { currentTabId: tabId }
+                    });
+                    setCurrentTabId(tabId);
+                  }}>
+                  <FormBuilder
+                    getIsFormValid={setIsFormValid}
+                    getFormValues={getFormValues}
+                    schema={schema}
+                    data={clonedFormData}
+                    onChange={onChangeFormValues}
+                    shouldCopyData={shouldCopyData}
+                    updateCopyData={updateCopyData}
+                    formValues={formValues}
+                    isNewEntity={isNewEntity}
+                  />
+                </Tabs>
+              </div>
             </div>
           </div>
         </div>
-        <div className="column column--one-third">
+
+        <div className="column column--one-third page-sidebar">
           {showSideBarRelations && (
             <SideBarRelations
               entity={entity}

package/src/components/EntityManager/Entity/SideBarRelations/index.js

@@ -4,16 +4,21 @@ import uuidv1 from 'uuid/v1';
 import { useApolloClient } from '@apollo/client';
 import { getQuery } from '@blaze-cms/admin-ui-utils';
 import { formFieldTypes } from '@blaze-cms/react-form-builder';
-import Badge from '@blaze-react/badge';
+import classnames from 'classnames';
 import { VersionsList } from '@blaze-cms/versioning-ui';
-import { PUBLISHED } from '../../../../constants';
+import { PUBLISHED, UNPUBLISHED } from '../../../../constants';
 
 const SideBarRelations = ({ schema, onChange, formData, entity }) => {
   const { relation: RelationComponent } = formFieldTypes;
-  const { formattedStatus, formattedUpdated, formattedCreated, formattedPublished } = formData;
+  const {
+    formattedStatus,
+    formattedUpdated,
+    formattedCreated,
+    formattedPublished,
+    status
+  } = formData;
   const client = useApolloClient();
   const [relationsComponents, setRelationsComponents] = useState(null);
-
   useEffect(
     () => {
       (async () => {
@@ -51,17 +56,26 @@ const SideBarRelations = ({ schema, onChange, formData, entity }) => {
   const { id: itemId } = entity;
   const { identifier: itemEntity, interfaces } = schema;
 
+  const statusClassName = classnames('sidebar__status__badge', {
+    'sidebar__status__badge--published': status === PUBLISHED,
+    'sidebar__status__badge--unpublished': status === UNPUBLISHED
+  });
+
   return (
     <div className="sidebar" data-testid="sideBarRelations-main-div">
       <div className="sidebar__content">
         {formattedCreated && (
           <div className="sidebar__status">
-            {formattedStatus && (
-              <Badge type="status" modifiers={formattedStatus}>
-                {formattedStatus}
-                {formattedStatus === PUBLISHED && `: ${formattedPublished}`}
-              </Badge>
+            <div className="sidebar__status__wrapper">
+              <b>Status</b>
+              <span className={statusClassName}>{formattedStatus}</span>
+            </div>
+            {formattedStatus === PUBLISHED && (
+              <p>
+                {formattedStatus} on: <span> {formattedPublished}</span>
+              </p>
             )}
+
             <p>
               Created: <span>{formattedCreated}</span>
             </p>

package/src/components/Tabs/index.js

@@ -16,7 +16,6 @@ import {
 const Tabs = ({ children, onTabChange, enabled }) => {
   const { currentTabId } = useReadFromCache({ query: GET_CURRENT_TAB_ID }) || EDITOR_VIEW_TAB_INDEX;
   const [activeAccordions, setActiveAccordions] = useState([]);
-
   return enabled ? (
     <>
       <TabsContextProvider value={{ currentTabId, activeAccordions, setActiveAccordions }}>
@@ -34,7 +33,6 @@ const Tabs = ({ children, onTabChange, enabled }) => {
     <>{children}</>
   );
 };
-
 Tabs.propTypes = {
   children: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]).isRequired,
   onTabChange: PropTypes.func.isRequired,