@kitconcept/core 1.0.0-alpha.3 → 1.0.0-alpha.30

package/src/helpers/BlocksConfigMerger.ts

@@ -0,0 +1,42 @@
+import type { BlocksConfig } from '@plone/types';
+import cloneDeep from 'lodash/cloneDeep';
+import type { MutatorDSL } from '../types';
+
+// Utility type for deep recursive Partial
+type DeepPartial<T> = {
+  [P in keyof T]?: T[P] extends object
+    ? T[P] extends Array<infer U>
+      ? Array<DeepPartial<U>>
+      : DeepPartial<T[P]>
+    : T[P];
+};
+
+export function BlocksConfigMerger(
+  blocksConfig: DeepPartial<BlocksConfig['blocksConfig']>,
+  merger: MutatorDSL,
+): BlocksConfig['blocksConfig'] {
+  const mergedConfig = cloneDeep(blocksConfig);
+
+  Object.entries(merger).forEach(([blockId, dsl]) => {
+    if (!mergedConfig[blockId]) return;
+
+    // 1. Disable block
+    if (dsl.disable) {
+      mergedConfig[blockId]!.restricted = true;
+    }
+
+    // 2. Filter variations
+    if (Array.isArray(dsl.variations) && mergedConfig[blockId]!.variations) {
+      mergedConfig[blockId]!.variations = mergedConfig[
+        blockId
+      ]!.variations!.filter((v) => dsl.variations!.includes(v.id));
+    }
+
+    // 3. Assign themes
+    if (Array.isArray(dsl.themes)) {
+      mergedConfig[blockId]!.themes = dsl.themes;
+    }
+  });
+
+  return mergedConfig as BlocksConfig['blocksConfig'];
+}

package/src/index.ts

@@ -1,9 +1,23 @@
 import type { ConfigType } from '@plone/registry';
-
+import type { CustomInheritBehavior, BlocksConfigSettings } from './types';
 import installSettings from './config/settings';
+import installSlots from './config/slots';
+
+declare module '@plone/types' {
+  export interface GetSiteResponse {
+    'kitconcept.intranet.custom_css': string;
+  }
+
+  export interface Expanders {
+    inherit: {
+      'kitconcept.blocks.config': CustomInheritBehavior<BlocksConfigSettings>;
+    };
+  }
+}
 
 const applyConfig = (config: ConfigType) => {
   installSettings(config);
+  installSlots(config);
   return config;
 };
 

package/src/slots/ConfigInjector/ConfigInjector.tsx

@@ -0,0 +1,32 @@
+import config from '@plone/volto/registry';
+import { useSelector } from 'react-redux';
+import { BlocksConfigMerger } from '../../helpers/BlocksConfigMerger';
+import type { Content } from '@plone/types';
+import type { MutatorDSL } from '../../types';
+
+type FormState = {
+  content: {
+    data: Content;
+  };
+};
+
+const ConfigInjector = () => {
+  const blockConfigData = useSelector<FormState, MutatorDSL>(
+    (state) =>
+      state.content.data?.['@components']?.inherit?.['kitconcept.blocks.config']
+        ?.data?.blocks_config_mutator,
+  );
+
+  if (blockConfigData) {
+    config.blocks.blocksConfig = BlocksConfigMerger(
+      config.blocks.blocksConfig,
+      blockConfigData,
+    );
+  }
+
+  // This component does not render anything, it just injects config from the Redux
+  // store in the global config
+  return null;
+};
+
+export default ConfigInjector;

package/src/slots/TTWCustomCSS/TTWCustomCSS.tsx

@@ -0,0 +1,28 @@
+import Helmet from '@plone/volto/helpers/Helmet/Helmet';
+import { useSelector } from 'react-redux';
+import type { GetSiteResponse } from '@plone/types';
+
+type FormState = {
+  site: { data: GetSiteResponse };
+};
+
+const TTWCustomCSS = () => {
+  const site = useSelector<FormState, GetSiteResponse>(
+    (state) => state.site.data,
+  );
+  const customCSS = site['kitconcept.custom_css'];
+
+  return (
+    <>
+      {customCSS ? (
+        <>
+          <Helmet>
+            <style>{customCSS}</style>
+          </Helmet>
+        </>
+      ) : null}
+    </>
+  );
+};
+
+export default TTWCustomCSS;

package/src/types.d.ts

@@ -0,0 +1,22 @@
+import type { StyleDefinition } from '@plone/types';
+
+export type MutatorDSL = Record<
+  string,
+  {
+    disable?: boolean;
+    variations?: string[];
+    themes?: StyleDefinition[];
+  }
+>;
+
+export type BlocksConfigSettings = {
+  blocks_config_mutator: MutatorDSL;
+};
+
+export type CustomInheritBehavior<T> = {
+  data: T;
+  from: {
+    '@id': string;
+    title: string;
+  };
+};