@legalplace/wizardx-core 0.0.1-alpha.0

package/src/componentsConnectors/connectRootOption.tsx

@@ -0,0 +1,95 @@
+import type { OptionV3 } from '@legalplace/models-v3-types';
+import {
+  componentConnector,
+  ConnectorStateToProps,
+  ConnectorDispatchProps,
+} from './connector/componentConnector';
+
+export type ConnectRootOptionOwnProps = {
+  id: number;
+};
+export type ConnectRootOptionMapProps = {
+  id: number;
+  multiple: boolean;
+  values: boolean[];
+  isMultiple: boolean;
+  hasMany: boolean;
+  lastIndex: number;
+  meta: OptionV3['meta'];
+};
+export type ConnectRootOptionDispatchProps = {
+  addMultipleOccurency: () => void;
+  deleteMultipleOccurency: (index: number) => void;
+};
+
+/**
+ * stateToProps
+ * ------------
+ * State to props function maps state to connected
+ * component's props
+ * @param selectors StateToProps selectors
+ */
+const stateToProps: ConnectorStateToProps<
+  ConnectRootOptionOwnProps,
+  ConnectRootOptionMapProps
+> = (selectors) => (state, ownProps) => {
+  const { selectOptionReference } = selectors;
+
+  const option = selectOptionReference(ownProps.id);
+
+  // Checking wether option can be displayed
+  const multiple = option.meta.multiple?.enabled || false;
+
+  const values = state.inputs.options[ownProps.id];
+
+  return {
+    id: ownProps.id,
+    multiple,
+    meta: option.meta,
+    values,
+    hasMany: values.length > 1,
+    isMultiple: option.meta.multiple?.enabled === true,
+    lastIndex: values.length - 1,
+  };
+};
+
+/**
+ * dispatchToProps
+ * ------------
+ * Dispatch to props function maps dispatch to connected
+ * component's props
+ * @param actions DispatchToProps actions
+ */
+const dispatchToProps: ConnectorDispatchProps<
+  ConnectRootOptionOwnProps,
+  ConnectRootOptionDispatchProps
+> = (actions) => (dispatch, ownProps) => ({
+  addMultipleOccurency: () => {
+    dispatch(actions.addMultipleOccurencyAction(ownProps.id));
+  },
+  deleteMultipleOccurency: (index: number) => {
+    dispatch(actions.deleteMultipleOccurencyAction(ownProps.id, index));
+  },
+});
+
+/**
+ * Creating our component connector
+ */
+export const connectRootOption = componentConnector({
+  componentName: 'RootOption',
+  stateToProps,
+  dispatchToProps,
+  additionnalHooks: (props, hookType) => {
+    const { tags, type } = props.meta;
+    const hooks: string[] = [`${hookType}RootOptionOfType(${type})`];
+    if (props.meta.multiple) {
+      hooks.push(`${hookType}RootOptionMultiple`);
+    }
+    if (Array.isArray(tags)) {
+      tags.forEach((currentTag) => {
+        hooks.push(`${hookType}Tag{${currentTag}}`);
+      });
+    }
+    return hooks;
+  },
+});

package/src/componentsConnectors/connectSection.tsx

@@ -0,0 +1,79 @@
+import {
+  componentConnector,
+  ConnectorStateToProps,
+} from './connector/componentConnector';
+
+export type ConnectSectionOwnProps = {
+  id?: number;
+};
+export type ConnectSectionMapProps = {
+  id: number;
+  title: string;
+  mandatoryValidated: boolean;
+  childOptions: number[];
+  tags?: string[];
+};
+
+/**
+ * stateToProps
+ * ------------
+ * State to props function maps state to connected
+ * component's props
+ * @param selectors StateToProps selectors
+ */
+const childOptionsCache: Record<string, number[]> = {};
+const stateToProps: ConnectorStateToProps<
+  ConnectSectionOwnProps,
+  ConnectSectionMapProps
+> = (selectors) => (state, ownProps) => {
+  const {
+    selectCurrentSectionId,
+    selectSectionReference,
+    selectOptionReference,
+  } = selectors;
+
+  // If we recieve id in props we use it at the section's id
+  const id =
+    typeof ownProps.id !== 'undefined' ? ownProps.id : selectCurrentSectionId();
+
+  const section = selectSectionReference(id);
+  if (section === undefined) throw new Error(`Section ${id} does not exist`);
+
+  if (!(id in childOptionsCache)) {
+    childOptionsCache[id] = section.options.filter((optionId) => {
+      const optionReference = selectOptionReference(optionId);
+      if (optionReference === undefined)
+        throw new Error(`Option ${optionId} does not exist`);
+      return !['hidden', 'repeated'].includes(optionReference.meta.type);
+    });
+  }
+
+  // Getting mandatory validation
+  const mandatoryValidated = selectors.selectMandatorySection(id);
+
+  return {
+    id,
+    mandatoryValidated,
+    childOptions: childOptionsCache[id],
+    title: section.label,
+    tags: section.tags,
+  };
+};
+
+/**
+ * Creating our component connector
+ */
+export const connectSection = componentConnector({
+  componentName: 'Section',
+  stateToProps,
+  additionnalHooks: (props, hookType) => {
+    const { tags } = props;
+    const hooks: string[] = [];
+    if (Array.isArray(tags)) {
+      tags.forEach((currentTag) => {
+        hooks.push(`${hookType}Tag{${currentTag}}`);
+      });
+    }
+    return hooks;
+  },
+});

package/src/componentsConnectors/connectSummary.tsx

@@ -0,0 +1,21 @@
+import {
+  componentConnector,
+  ConnectorStateToProps,
+} from './connector/componentConnector';
+
+export type ConnectSummaryOwnProps = {};
+export type ConnectSummaryMapProps = {
+  sections: Readonly<number[]>;
+};
+
+const stateToProps: ConnectorStateToProps<
+  ConnectSummaryOwnProps,
+  ConnectSummaryMapProps
+> = (selectors) => () => ({
+  sections: selectors.selectAvailableSections(),
+});
+
+export const connectSummary = componentConnector({
+  componentName: 'Summary',
+  stateToProps,
+});

package/src/componentsConnectors/connectSummaryItem.tsx

@@ -0,0 +1,102 @@
+import queryString from 'query-string';
+import {
+  componentConnector,
+  ConnectorStateToProps,
+} from './connector/componentConnector';
+import { PathReader } from '../libs/PathReader';
+import { SectionValidity } from '../libs/SectionValidity';
+
+export type ConnectSummaryItemOwnProps = {
+  id: number;
+};
+export type ConnectSummaryItemMapProps = {
+  link: string;
+  label: string;
+  validity: boolean;
+  preLabel: string;
+  active: boolean;
+  pageNumber: number;
+  disableClick?: boolean;
+};
+
+const stateToProps: ConnectorStateToProps<
+  ConnectSummaryItemOwnProps,
+  ConnectSummaryItemMapProps
+> = (selectors) => (state, ownProps) => {
+  const {
+    selectSectionReference,
+    selectAvailableSections,
+    selectCurrentSectionId,
+    selectMandatorySection,
+    selectMandatoryIgnore,
+  } = selectors;
+
+  const currentSection = selectCurrentSectionId();
+
+  // Getting MandatoryIgnore
+  const mandatoryIgnore = selectMandatoryIgnore();
+
+  const isCurrentSectionMandatoryValidated =
+    selectMandatorySection(currentSection);
+
+  // Getting list of sections
+  const sectionReference = selectSectionReference(ownProps.id);
+  const { label, id } = sectionReference;
+
+  // Initiating PathReader
+  const pathReader = new PathReader(state);
+
+  // Generating section's path
+  const pageNumber = selectAvailableSections().indexOf(ownProps.id) + 1;
+  const link = pathReader.parsePath(pageNumber);
+  // Is section active?
+  const active = id === currentSection;
+
+  let disableClick = false;
+  // disableClick Conditions
+  if (
+    queryString.parse(window.location.search).ignore !== 'true' &&
+    id > currentSection &&
+    mandatoryIgnore === false
+  ) {
+    const mandatoriesSections = selectAvailableSections().map((sectionId) =>
+      selectMandatorySection(sectionId)
+    );
+    // All sections True : enableClick
+    if (mandatoriesSections.every((sectionValue) => sectionValue === true)) {
+      disableClick = false;
+    }
+    // enable click only for nextCurrentSection if isCurrentSectionMandatoryValidated = true
+    else if (
+      id === currentSection + 1 &&
+      isCurrentSectionMandatoryValidated === true
+    ) {
+      disableClick = false;
+    }
+    // disable click for all next sections
+    else {
+      disableClick = true;
+    }
+  }
+
+  // Is section valid
+  const { validity } = new SectionValidity(ownProps.id);
+
+  // Calculating preLabel
+  const preLabel = pageNumber < 10 ? `0${pageNumber}` : pageNumber.toString();
+
+  return {
+    link,
+    validity,
+    preLabel,
+    label,
+    active,
+    pageNumber,
+    disableClick,
+  };
+};
+
+export const connectSummaryItem = componentConnector({
+  componentName: 'SummaryItem',
+  stateToProps,
+});

package/src/componentsConnectors/connectTermsheet.tsx

@@ -0,0 +1,359 @@
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import React from 'react';
+import type { SectionV3 } from '@legalplace/models-v3-types';
+import { StateType } from '../types/State.type';
+import { TermsheetRow } from '../types/Termsheet.type';
+import { TermsheetPropsType } from '../types/Components.type';
+import { PluginLoader, ReplaceComponent } from '../PluginLoader';
+import { selectAvailableSections } from '../redux/selectors/app';
+import {
+  selectSectionReference,
+  selectOptionReference,
+  selectVariableReference,
+} from '../redux/selectors/references';
+import {
+  selectOptionInput,
+  selectVariableInputByIndex,
+  selectOptionInputByIndex,
+} from '../redux/selectors/inputs';
+import {
+  selectOptionConditionValue,
+  selectSectionConditionValue,
+  selectVariableConditionValue,
+  selectOptionValidatorConditionValue,
+  selectVariableValidatorConditionValue,
+} from '../redux/selectors/conditions';
+import { PathReader } from '../libs/PathReader';
+import { isLevelAccessibleForUser } from '../redux/selectors/user';
+import { parseOptionLabel } from '../helpers/outputsParsing';
+
+const pushMultipleLabelForOption = (
+  optionId: number,
+  index: number,
+  termsheet: TermsheetRow[],
+  pageNumber: number
+) => {
+  const optionReference = selectOptionReference(optionId);
+  if (optionReference === undefined)
+    throw new Error(`Option ${optionId} does not exist`);
+
+  if (optionReference.meta.termsheet?.hide === true) return;
+
+  // Defining occurency id
+  let occurencyId = index + 1;
+
+  // Current Multiple label
+  const label =
+    optionReference.meta?.multiple?.label ||
+    optionReference.meta?.multiple?.cta ||
+    ''; // TODO: Should we add default string?
+
+  // Incrementation step
+  if (optionReference.meta.multiple?.incrementationStart) {
+    const { incrementationStart } = optionReference.meta.multiple;
+    occurencyId += incrementationStart - 1;
+  }
+
+  termsheet.push({
+    label: `${label} ${occurencyId}`,
+    type: 'multiplelabel',
+    pageNumber,
+    hash: '',
+    value: '',
+    allowUpdate: false,
+  });
+};
+
+/**
+ * Adds a variable to the termsheet
+ * @param variableId Variable's id
+ * @param index Occurency index
+ * @param termsheet termsheet
+ * @param pageNumber page number
+ */
+const rolldownTermsheetForVariable = (
+  variableId: number,
+  index: number,
+  termsheet: TermsheetRow[],
+  pageNumber: number
+) => {
+  const variableReference = selectVariableReference(variableId);
+  if (variableReference === undefined)
+    throw new Error(`Variable ${variableId} does not exist`);
+
+  // Making sure variable isn't hidden from termsheet
+  if (variableReference.termsheet?.hide === true) return;
+
+  // Getting variable's value
+  let value = selectVariableInputByIndex(variableId, index);
+  value = value || '';
+
+  // Checking variable's condition
+  const variableCondition = selectVariableConditionValue(variableId, index);
+  const variableValidator = selectVariableValidatorConditionValue(
+    variableId,
+    index
+  );
+
+  // Making sure variable is accessible for current user
+  const { grantLevel } = variableReference;
+  if (!isLevelAccessibleForUser(grantLevel || 'GUEST')) return;
+
+  let { label } = variableReference;
+  if (
+    typeof variableReference.termsheet?.label === 'string' &&
+    variableReference.termsheet?.label.trim().length > 0
+  ) {
+    label = variableReference.termsheet?.label;
+  }
+
+  const variableTermsheet: TermsheetRow = {
+    type: 'variable',
+    label,
+    valid: variableValidator !== false,
+    value: typeof value === 'number' ? value.toString() : value,
+    pageNumber,
+    hash: `variable-${variableId}-${index}`,
+    allowUpdate: variableReference.type !== 'eval',
+  };
+
+  if (variableCondition !== false && variableReference.hidden !== false)
+    termsheet.push(variableTermsheet);
+};
+
+/**
+ * Adds an option to the termsheet
+ * @param optionId Option's id
+ * @param index Occurency index
+ * @param termsheet termsheet
+ * @param pageNumber page number
+ */
+const rolldownTermsheetForOption = (
+  optionId: number,
+  index: number,
+  termsheet: TermsheetRow[],
+  pageNumber: number
+) => {
+  const optionReference = selectOptionReference(optionId);
+  if (optionReference === undefined)
+    throw new Error(`Option ${optionId} does not exist`);
+
+  const optionInput = selectOptionInputByIndex(optionId, index);
+  const optionCondition = selectOptionConditionValue(optionId, index);
+  const optionValidator = selectOptionValidatorConditionValue(optionId, index);
+
+  if (
+    (optionReference.meta.type !== 'checkbox' && optionInput === false) ||
+    optionCondition === false ||
+    ['hidden', 'repeated', 'box', 'separator', 'brut-text'].includes(
+      optionReference.meta.type
+    )
+  ) {
+    return;
+  }
+
+  /**
+   * Getting termsheet value
+   */
+  const radioChilds = optionReference.options.filter((childId) => {
+    const childReference = selectOptionReference(childId);
+    if (childReference === undefined)
+      throw new Error(`Option ${childId} does not exist`);
+
+    return childReference.meta.type === 'radio';
+  });
+  const selectedChild = radioChilds.filter((childId) =>
+    selectOptionInputByIndex(childId, index)
+  );
+  let value = selectedChild
+    .map((childId) => {
+      const childReference = selectOptionReference(childId);
+      if (childReference === undefined)
+        throw new Error(`Option ${childId} does not exist`);
+      const label = parseOptionLabel(childId, index);
+      return label;
+    })
+    .join('');
+
+  // Checkbox
+  if (optionReference.meta.type === 'checkbox') {
+    value = optionInput === true ? 'Oui' : 'Non';
+  } else if (
+    optionReference.meta.type === 'static' &&
+    radioChilds.length === 0
+  ) {
+    value = 'null-value';
+  }
+
+  let { label } = optionReference.meta;
+  if (
+    typeof optionReference.meta.termsheet?.label === 'string' &&
+    optionReference.meta.termsheet?.label.trim().length > 0
+  ) {
+    label = optionReference.meta.termsheet?.label;
+  }
+
+  if (/\[var:([0-9]+)\]/gi.test(label))
+    label = parseOptionLabel(optionId, index);
+
+  // If option has radio child or a value oui push it to the termsheet
+  if (optionReference.meta.termsheet?.hide !== true) {
+    termsheet.push({
+      pageNumber,
+      hash: `option-${optionId}-${index}`,
+      valid: optionValidator !== false,
+      label,
+      value,
+      type: 'option',
+      allowUpdate: true,
+    });
+  }
+
+  /**
+   * Getting children options termsheets
+   */
+  if (optionInput === true) {
+    optionReference.options.forEach((childrenId) => {
+      rolldownTermsheetForOption(childrenId, index, termsheet, pageNumber);
+    });
+  }
+
+  /**
+   * Getting variables termsheets
+   */
+  if (optionInput === true) {
+    optionReference.variables.forEach((variableId) => {
+      rolldownTermsheetForVariable(variableId, index, termsheet, pageNumber);
+    });
+  }
+};
+/**
+ * Fills the termsheet array with the section's data & children
+ * @param section Section
+ * @param sectionIndex Section's index
+ * @param termsheet Termsheet array
+ */
+const rolldownTermsheetForSection = (
+  section: SectionV3,
+  sectionIndex = 0,
+  termsheet: TermsheetRow[]
+) => {
+  const pageNumber = sectionIndex + 1;
+  const sectionTermsheetRow: TermsheetRow = {
+    label: section.label,
+    preLabel: pageNumber < 10 ? `0${pageNumber}` : pageNumber.toString(),
+    type: 'section',
+    pageNumber,
+    hash: '',
+    value: '',
+    allowUpdate: false,
+  };
+
+  // Filling current section
+  termsheet.push(sectionTermsheetRow);
+
+  /**
+   * Reading root options
+   */
+  section.options.forEach((optionId) => {
+    const inputs = selectOptionInput(optionId);
+    const optionReference = selectOptionReference(optionId);
+    if (optionReference === undefined)
+      throw new Error(`Option ${optionId} does not exist`);
+
+    const { grantLevel } = optionReference.meta;
+    if (!isLevelAccessibleForUser(grantLevel || 'GUEST')) return;
+
+    // Adding multiples termsheet pointer
+    inputs.forEach((value, index) => {
+      // Multiple label
+      if (inputs.length > 1) {
+        pushMultipleLabelForOption(optionId, index, termsheet, pageNumber);
+      }
+
+      // Rolling down option
+      rolldownTermsheetForOption(optionId, index, termsheet, pageNumber);
+    });
+
+    // Adding an empty multiple label to act as a separator
+    if (inputs.length > 1 && optionReference.meta.termsheet?.hide !== true) {
+      termsheet.push({
+        label: '',
+        type: 'multiplelabel',
+        pageNumber,
+        hash: '',
+        value: '',
+        allowUpdate: false,
+      });
+    }
+  });
+
+  if (termsheet[termsheet.length - 1] === sectionTermsheetRow) {
+    termsheet.splice(termsheet.indexOf(sectionTermsheetRow), 1);
+  }
+};
+
+/**
+ * Termsheet Higher-Order-Component
+ * @param Component UI Component
+ */
+const TermsheetHooc =
+  (
+    Component: React.ComponentType<TermsheetPropsType>
+  ): React.FC<TermsheetPropsType> =>
+  // eslint-disable-next-line react/display-name
+  (props) => {
+    // Before tags anchor
+    const beforeAnchors = ['beforeTermsheet'];
+
+    // After tags anchor
+    const afterAnchors = ['afterTermsheet'];
+
+    // Component replace
+    const replaceAnchors = ['Termsheet'];
+    const FinalComponent = ReplaceComponent(replaceAnchors, Component);
+
+    return (
+      <>
+        <PluginLoader anchor={beforeAnchors} props={props} />
+        <FinalComponent {...props} />
+        <PluginLoader anchor={afterAnchors} props={props} />
+      </>
+    );
+  };
+
+/**
+ * Mapping redux to props
+ * @param state Redux State
+ */
+const mapStateToProps = (state: StateType): TermsheetPropsType => {
+  const pathReader = new PathReader(state);
+
+  // Getting list of sections
+  const sectionsIds = selectAvailableSections();
+  const termsheet: TermsheetRow[] = [];
+
+  // Looping through sections
+  sectionsIds.forEach((sectionId, sectionIndex) => {
+    const sectionReference = selectSectionReference(sectionId);
+    if (sectionReference === undefined)
+      throw new Error(`Section ${sectionId} does not exist`);
+    const sectionCondition = selectSectionConditionValue(sectionId);
+    if (sectionCondition === false) return;
+    rolldownTermsheetForSection(sectionReference, sectionIndex, termsheet);
+  });
+
+  return {
+    termsheet,
+    parseLink: (page: number): string => pathReader.parsePath(page),
+  };
+};
+
+/**
+ * Composing the UI component connector
+ */
+export const connectTermsheet = compose(
+  connect(mapStateToProps),
+  TermsheetHooc
+);