So far it compiles

eea · Nov 1, 2022 · 4564772 · 4564772
1 parent 43800b5
commit 4564772
Show file tree

Hide file tree

Showing 9 changed files with 44 additions and 208 deletions.
diff --git a/src/blocks/Item/index.js b/src/blocks/Item/index.js
@@ -1,7 +1,7 @@
 import codeSVG from '@plone/volto/icons/code.svg';
 import ItemEdit from './Edit';
 import ItemView from './View';
-import { stylingSchema } from './schema';
+import { setItemStyling } from './schema';
 
 export default (config) => {
   config.blocks.blocksConfig.item = {
@@ -12,15 +12,14 @@ export default (config) => {
     edit: ItemEdit,
     view: ItemView,
     blockHasOwnFocusManagement: true,
-    stylesSchema: stylingSchema,
-    enableStyling: true,
     restricted: false,
     mostUsed: false,
     sidebarTab: 1,
     security: {
       addPermission: [],
       view: [],
     },
+    schemaEnhancer: setItemStyling,
   };
 
   config.settings.blocksWithFootnotesSupport = {

diff --git a/src/blocks/Item/schema.js b/src/blocks/Item/schema.js
@@ -78,33 +78,36 @@ export default ({ data }) => {
   };
 };
 
-export const stylingSchema = ({ intl }) => ({
-  title: 'Item style',
-  block: 'item',
-  fieldsets: [
-    {
-      id: 'default',
-      title: 'Default',
-      fields: ['theme', 'verticalAlign'],
-    },
-  ],
-  properties: {
-    theme: {
-      title: 'Theme',
-      choices: [
-        ['primary', 'Primary'],
-        ['secondary', 'Secondary'],
-        ['tertiary', 'Tertiary'],
-      ],
-    },
-    verticalAlign: {
-      title: 'Vertical align',
-      choices: [
-        ['top', 'Top'],
-        ['middle', 'Middle'],
-        ['bottom', 'Bottom'],
-      ],
+export const setItemStyling = ({ intl, schema }) => {
+  // TODO: this should be an enhancer, don't overwrite the schema
+  schema.properties.styles.schema = {
+    title: 'Item style',
+    block: 'item',
+    fieldsets: [
+      {
+        id: 'default',
+        title: 'Default',
+        fields: ['theme', 'verticalAlign'],
+      },
+    ],
+    properties: {
+      theme: {
+        title: 'Theme',
+        choices: [
+          ['primary', 'Primary'],
+          ['secondary', 'Secondary'],
+          ['tertiary', 'Tertiary'],
+        ],
+      },
+      verticalAlign: {
+        title: 'Vertical align',
+        choices: [
+          ['top', 'Top'],
+          ['middle', 'Middle'],
+          ['bottom', 'Bottom'],
+        ],
+      },
     },
-  },
-  required: [],
-});
+    required: [],
+  };
+};
diff --git a/src/blocks/Listing/index.js b/src/blocks/Listing/index.js
@@ -19,7 +19,7 @@ import {
 import { DefaultItemLayout } from './item-templates/ItemTemplates';
 import { SearchItemLayout } from './item-templates/SearchItemTemplate';
 
-import universalCardSchemaEnhancer from '@eeacms/volto-listing-block/components/UniversalCard/schema';
+// import universalCardSchemaEnhancer from '@eeacms/volto-listing-block/components/UniversalCard/schema';
 
 const applyConfig = (config) => {
   // moment date locale. See https://momentjs.com/ - Multiple Locale Support
@@ -44,33 +44,21 @@ const applyConfig = (config) => {
       isDefault: false,
       title: 'Listing',
       template: Listing,
-      schemaEnhancer: compose(
-        setBasicStylingSchema,
-        Listing.schemaEnhancer, // layout schema
-        universalCardSchemaEnhancer,
-      ),
+      schemaEnhancer: compose(setBasicStylingSchema, Listing.schemaEnhancer),
     },
     {
       id: 'cardsCarousel',
       isDefault: false,
       title: 'Carousel',
       template: Carousel,
-      schemaEnhancer: compose(
-        setBasicStylingSchema,
-        Carousel.schemaEnhancer,
-        universalCardSchemaEnhancer,
-      ),
+      schemaEnhancer: compose(setBasicStylingSchema, Carousel.schemaEnhancer),
     },
     {
       id: 'cardsGallery', //  'customCardsGalleryVariationId'
       isDefault: false,
       title: 'Gallery',
       template: Gallery,
-      schemaEnhancer: compose(
-        setBasicStylingSchema,
-        Gallery.schemaEnhancer,
-        universalCardSchemaEnhancer,
-      ),
+      schemaEnhancer: compose(setBasicStylingSchema, Gallery.schemaEnhancer),
     },
   ];
 

diff --git a/src/blocks/Listing/layout-templates/Listing.jsx b/src/blocks/Listing/layout-templates/Listing.jsx
@@ -48,6 +48,6 @@ Listing.propTypes = {
   isEditMode: PropTypes.bool,
 };
 
-Listing.schemaEnhancer = ({ schema }) => schema;
+Listing.schemaEnhancer = UniversalCard.schemaEnhancer;
 
 export default Listing;
diff --git a/src/blocks/Teaser/Card.jsx b/src/blocks/Teaser/Card.jsx
@@ -7,7 +7,6 @@ import { defineMessages, useIntl } from 'react-intl';
 import UniversalCard from '@eeacms/volto-listing-block/components/UniversalCard/UniversalCard';
 
 import imageBlockSVG from '@plone/volto/components/manage/Blocks/Image/block-image.svg';
-import { CardStylingSchemaEnhancer } from '../Listing/schema';
 
 const messages = defineMessages({
   PleaseChooseContent: {
@@ -45,55 +44,4 @@ TeaserCardTemplate.propTypes = {
   isEditMode: PropTypes.bool,
 };
 
-TeaserCardTemplate.styleSchemaEnhancer = (schema) => {
-  return CardStylingSchemaEnhancer({ schema });
-};
-
 export default TeaserCardTemplate;
-
-// const CardImage = (props) => {
-//   const { data } = props;
-//   const href = data.href?.[0];
-//   const image = data.preview_image?.[0];
-//   return href.hasPreviewImage || href.image_field || image ? (
-//     <div className="image">
-//       <img src={flattenToAppURL(getTeaserImageURL(href, image))} alt="a" />
-//     </div>
-//   ) : null;
-// };
-//
-// const CardHeadTitle = ({ data }) =>
-//   data?.head_title ? <div className="meta">{data?.head_title}</div> : null;
-//
-// const CardDescription = ({ data }) =>
-//   !data.hide_description ? (
-//     <p className="description">{data?.description}</p>
-//   ) : null;
-//
-// const CardTitle = ({ data }) => <div className="header">{data?.title}</div>;
-//<MaybeWrap
-//  condition={!isEditMode}
-//  as={UniversalLink}
-//  href={href['@id']}
-//  target={data.openLinkInNewTab ? '_blank' : null}
-//>
-//  <div
-//    className={cx(
-//      'ui fluid card',
-//      data?.styles?.theme,
-//      data?.styles?.rounded ? 'rounded big' : '',
-//    )}
-//  >
-//    <CardImage {...props} />
-//    <div className="content">
-//      <CardHeadTitle {...props} />
-//      <CardTitle {...props} />
-//      <CardDescription {...props} />
-//    </div>
-//  </div>
-//</MaybeWrap>
-// import { flattenToAppURL } from '@plone/volto/helpers';
-// import { getTeaserImageURL } from './utils';
-// import { MaybeWrap } from '@plone/volto/components';
-// import { UniversalLink } from '@plone/volto/components';
-// import cx from 'classnames';
diff --git a/src/blocks/Teaser/index.js b/src/blocks/Teaser/index.js
@@ -1,28 +1,25 @@
 import { compose } from 'redux';
+
 import TeaserCardTemplate from './Card';
-import { BasicListingBlockStylesSchema } from '../Listing/schema';
 import { adjustTeaserSchema } from './schema';
-import UniversalCard from '@eeacms/volto-listing-block/components/UniversalCard/UniversalCard';
+import { setCardStylingSchema, setCardModelSchema } from '../Listing/schema';
 
 export default (config) => {
-  // Teaser
   if (config.blocks.blocksConfig.teaser) {
     config.blocks.blocksConfig.teaser.variations = [
-      // ...(config.blocks.blocksConfig.teaser.variations || []),
       {
         id: 'card',
         isDefault: true,
         title: 'Card (top image)',
         template: TeaserCardTemplate,
         schemaEnhancer: compose(
           adjustTeaserSchema,
-          TeaserCardTemplate.styleSchemaEnhancer,
-          UniversalCard.schemaEnhancer,
+          setCardModelSchema,
+          setCardStylingSchema,
         ),
       },
+      // ...(config.blocks.blocksConfig.teaser.variations || []),
     ];
-    // config.blocks.blocksConfig.teaser.enableStyling = true;
-    config.blocks.blocksConfig.teaser.stylesSchema = BasicListingBlockStylesSchema;
   }
 
   // Teaser Grid

diff --git a/src/components/UniversalCard/UniversalCard.jsx b/src/components/UniversalCard/UniversalCard.jsx
@@ -14,7 +14,6 @@ function UniversalCard(props) {
     config.blocks.blocksConfig.listing.extensions.cardTemplates,
     itemModel,
   );
-  // const CardTemplate = BasicCard;
   const CardTemplate = extension.template;
   const classNames = getVoltoStyles(styles);
 

diff --git a/src/components/UniversalCard/schema.js b/src/components/UniversalCard/schema.js
@@ -49,13 +49,3 @@ export default function universalCardSchemaEnhancer(args) {
 
   return enhancedSchema;
 }
-
-// enhanceStylingSchema,
-
-// const styledSchema = enhanceStylingSchema({
-//   ...props,
-//   schema: baseSchema,
-//   // schema: baseSchema.properties.styles.schema,
-//   formData: props.formData,
-// });
-// return styledSchema;
diff --git a/src/schema-utils.js b/src/schema-utils.js
@@ -1,8 +1,6 @@
 import { cloneDeep } from 'lodash';
 import config from '@plone/volto/registry';
 
-// import { defineMessages } from 'react-intl';
-
 const addTypeSelect = ({ intl, schema, extensionName, messages }) => {
   const field = '@type';
   const extensions = config.blocks.blocksConfig.listing.extensions;
@@ -59,92 +57,6 @@ export const DefaultCardModelSchema = {
   required: [],
 };
 
-// const messages = defineMessages({
-//   variation: {
-//     id: 'Variation',
-//     defaultMessage: 'Variation',
-//   },
-//   styling: {
-//     id: 'Styling',
-//     defaultMessage: 'Styling',
-//   },
-// });
-
-// const addStylesField = ({ schema, intl, formData }) => {
-//   // Add the default style schema as the first step in the "ladder".
-//   // The order is as follows:
-//   //
-//   // - default volto style schema
-//   // - listing block -> default style schema enhancer
-//   // - listing block variation -> style schema enhancer
-//   // - listing block card/item extension -> style schema enhancer
-//   //
-//   // We omit the first step in ladder because of bugs in Volto < 16.0.0-alpha.36
-//   // In later versions we won't have to redefine the styles field
-//
-//   if (schema.properties.styles) return schema;
-//
-//   const defaultStyleSchema = config.blocks.blocksConfig.listing.stylesSchema;
-//
-//   schema.fieldsets.push({
-//     id: 'styling',
-//     title: intl.formatMessage(messages.styling),
-//     fields: ['styles'],
-//   });
-//
-//   schema.properties.styles = {
-//     widget: 'object',
-//     title: intl.formatMessage(messages.styling),
-//     schema: defaultStyleSchema({ formData, intl, schema }),
-//   };
-//
-//   return schema;
-// };
-
-// export const enhanceStylingSchema = ({
-//   formData,
-//   schema,
-//   blockType = 'listing',
-//   extensionName = 'itemTemplates',
-//   intl,
-// }) => {
-//   // Adds (to the limited styles schema) the new styling schema enhancements
-//   schema = addStylesField({ formData, schema, intl });
-//
-//   // first, enhance styling schema based on the variation
-//   // then, enhance it based on the `${extensionName}`
-//
-//   const blockConfig = config.blocks.blocksConfig[blockType];
-//   const activeVariationId =
-//     formData['variation'] ||
-//     blockConfig.variations?.find(({ isDefault }) => isDefault)?.id;
-//   // TODO: use resolveExtensions() from Volto
-//   const activeVariation = activeVariationId
-//     ? blockConfig.variations.find(({ id }) => id === activeVariationId)
-//     : {};
-//
-//   // TODO: not needed when we will use latest Volto
-//   const variationStyleSchema = activeVariation?.stylesSchema;
-//   schema = variationStyleSchema
-//     ? variationStyleSchema({ schema: cloneDeep(schema), formData, intl })
-//     : schema;
-//   // end TODO
-//
-//   const extensionType = '@type'; // the attribute name that's stored in the block data
-//   const extensionTemplates = blockConfig.extensions?.[extensionName];
-//   const activeItemName = formData?.itemModel?.[extensionType];
-//   let activeItem = extensionTemplates?.find(
-//     (item) => item.id === activeItemName,
-//   );
-//
-//   const stylingSchema = activeItem?.['stylesSchema'];
-//   schema = stylingSchema
-//     ? stylingSchema({ schema: cloneDeep(schema), formData, intl })
-//     : schema;
-//
-//   return schema;
-// };
-
 export const getVoltoStyles = (props) => {
   const styles = props ? props : {};
   const output = {};