@zohodesk/library-platform 1.1.10 → 1.1.11

package/es/library/behaviours/clip-wrap/applications/usecases/InitializeUsecase.js

@@ -0,0 +1,15 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class InitializeUsecase extends AbstractUseCase {
+  execute() {
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    const textOverFlow = repository.getClipWrapEntity();
+    presenter.updateClipWrap(textOverFlow.toObject());
+  }
+
+}
+
+export default InitializeUsecase;

package/es/library/behaviours/clip-wrap/domain/entities/ClipWrap.js

@@ -0,0 +1,22 @@
+class ClipWrap {
+  constructor(value) {
+    this.value = value;
+  }
+
+  setValue(value) {
+    this.value = value;
+  }
+
+  getValue() {
+    return this.value;
+  }
+
+  toObject() {
+    return {
+      mode: this.value
+    };
+  }
+
+}
+
+export default ClipWrap;

package/es/library/behaviours/clip-wrap/frameworks/ui/ActionsHandlerFactory.js

@@ -0,0 +1,28 @@
+import { TEXT_OVERFLOW_BEHAVIOUR_UPDATE_REQUESTED } from "../../../../../bc/clip-wrap/Constants";
+import ClipWrapController from "../../adapters/controllers/ClipWrap";
+import Repository from "../../adapters/gateway/Repository";
+import Service from "../../adapters/gateway/Service";
+import Presenter from "../../adapters/presenter/Presenter";
+import LifeCycleAction from "../../../../../cc/architecture/LifeCycleActionEnum";
+import InitializeController from "../../adapters/controllers/InitializeController";
+import DestructController from "../../adapters/controllers/DestructController"; // TODO: Rename as EventHandlersFactory
+
+class ActionsHandlersFactory {
+  static create() {
+    const presenter = new Presenter();
+    const repository = new Repository();
+    const service = new Service({
+      presenter,
+      repository
+    });
+    const controller = new ClipWrapController(service);
+    return {
+      [LifeCycleAction.MOUNT]: new InitializeController(service).handle,
+      [LifeCycleAction.UN_MOUNT]: new DestructController(service).handle,
+      [TEXT_OVERFLOW_BEHAVIOUR_UPDATE_REQUESTED]: controller.handle
+    };
+  }
+
+}
+
+export default ActionsHandlersFactory;

package/es/library/behaviours/clip-wrap/frameworks/ui/ClipWrapBehaviourFactory.js

@@ -0,0 +1,26 @@
+import properties from "../../../../../bc/clip-wrap/Properties";
+import ActionsHandlerFactory from "./ActionsHandlerFactory";
+
+class ClipWrapBehaviourFactory {
+  static create() {
+    return {
+      name: 'textOverflow',
+      setInitialState: _ref => {
+        let {
+          properties
+        } = _ref;
+        const {
+          textOverflowConfig
+        } = properties;
+        return {
+          mode: textOverflowConfig.mode || 'clip'
+        };
+      },
+      properties,
+      eventHandlers: ActionsHandlerFactory.create()
+    };
+  }
+
+}
+
+export default ClipWrapBehaviourFactory;

package/es/library/custom-component/adapters/controllers/Controller.js

@@ -38,6 +38,15 @@ class Controller {
     updateStateUseCase.execute(newState);
   }
 
+  setElement(ref) {
+    const {
+      setRefUseCase
+    } = this.service;
+    setRefUseCase.execute({
+      ref
+    });
+  }
+
   dispatch(action) {
     const {
       dispatchUseCase

package/es/library/custom-component/adapters/gateways/event-manager/EventManager.js

@@ -29,6 +29,10 @@ class EventManager {
     return this._element;
   }
 
+  isDifferentElement(element) {
+    return this._element !== element;
+  }
+
   subscribe(events) {
     events.forEach((eventHandlers, key) => {
       this._element && eventHandlers.map(eventHandler => {
@@ -51,10 +55,10 @@ class EventManager {
       metaData,
       type
     } = event;
-    this.log(type, payload, metaData);
+    __DEVELOPMENT__ && this.log(type, payload, metaData);
 
     if (!this._element) {
-      console.error('Error: Element `ref` not found!', this._element, type, {
+      __DEVELOPMENT__ && console.error('Error: Element `ref` not found!', this._element, type, {
         payload,
         metaData
       });
@@ -106,25 +110,28 @@ class EventManager {
 
   printEventPayloadSchemaInvalidError(eventName, error) {
     let dataName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '(root)';
-    const {
-      msg,
-      styles: nameStyles
-    } = this.eventNameConsoleStyle(eventName);
-    console.group(`${msg}%c's ${dataName} Validation Errors:`, ...nameStyles, 'color: initial; font-weight: initial');
-
-    if (error.code === ErrorCode.InvalidSchema) {
-      console.error(`%cInvalid Schema:`, 'color: #FF6F61; font-weight: bold;', error.error);
-    } else if (error.code === ErrorCode.InvalidData) {
-      error.errors.forEach((_ref, i) => {
-        let {
-          dataPath,
-          message
-        } = _ref;
-        console.error(`%c${i + 1}. %c${dataName + dataPath}%c → ${message}`, 'color: initial;', 'color: #FF6F61; font-weight: bold;', 'color: #FFA500;');
-      });
-    }
 
-    console.groupEnd(); // }
+    if (__DEVELOPMENT__) {
+      const {
+        msg,
+        styles: nameStyles
+      } = this.eventNameConsoleStyle(eventName);
+      console.group(`${msg}%c's ${dataName} Validation Errors:`, ...nameStyles, 'color: initial; font-weight: initial');
+
+      if (error.code === ErrorCode.InvalidSchema) {
+        console.error(`%cInvalid Schema:`, 'color: #FF6F61; font-weight: bold;', error.error);
+      } else if (error.code === ErrorCode.InvalidData) {
+        error.errors.forEach((_ref, i) => {
+          let {
+            dataPath,
+            message
+          } = _ref;
+          console.error(`%c${i + 1}. %c${dataName + dataPath}%c → ${message}`, 'color: initial;', 'color: #FF6F61; font-weight: bold;', 'color: #FFA500;');
+        });
+      }
+
+      console.groupEnd();
+    }
   }
 
   verifyEventPayload(event) {

package/es/library/custom-component/adapters/gateways/service/Service.js

@@ -4,12 +4,14 @@ import MountUsecase from "../../../applications/usecases/MountUseCase";
 import UnmountUsecase from "../../../applications/usecases/UnmountUseCase";
 import UpdatePropertyUseCase from "../../../applications/usecases/UpdatePropertyUseCase";
 import UpdateStateUseCase from "../../../applications/usecases/UpdateStateUseCase";
+import SetRefUseCase from "../../../applications/usecases/SetRefUseCase";
 
 class Service {
   constructor(dependencies) {
     this.initializeUseCase = new InitializeUseCase(dependencies);
     this.mountUseCase = new MountUsecase(dependencies);
     this.unmountUseCase = new UnmountUsecase(dependencies);
+    this.setRefUseCase = new SetRefUseCase(dependencies);
     this.updatePropertiesUseCase = new UpdatePropertyUseCase(dependencies);
     this.updateStateUseCase = new UpdateStateUseCase(dependencies);
     this.dispatchUseCase = new DispatchUseCase(dependencies);

package/es/library/custom-component/applications/entities-factory/ComponentFactory.js

@@ -4,21 +4,24 @@ import State from "../../domain/entities/State";
 import EventHandlersFactory from "./EventHandlersFactory";
 import BehavioursFactory from "./BehavioursFactory";
 import PropertiesFactory from "./PropertiesFactory";
-/* eslint-disable-next-line @zohodesk/architecturerules/no-returnStatement-rule */
+import ComponentProperties from "../../domain/entities/ComponentProperties";
+import Logger from "../../domain/entities/Logger";
 
 let defaultTransformState = state => state;
-/* eslint-disable-next-line @zohodesk/architecturerules/no-returnStatement-rule */
-
 
 function initializeComponent(input) {
-  let component = new Component();
-  component.setName(input.name);
-  component.setLifeCycleAction(new LifeCycleAction(input.name));
-  component.setBehaviours(BehavioursFactory.create(input));
-  component.setProperties(PropertiesFactory({
+  const properties = PropertiesFactory({
     properties: input.properties,
     componentName: input.name
-  }));
+  });
+  const logger = new Logger(input.name);
+  const behaviours = BehavioursFactory.create(input);
+  const componentProperties = new ComponentProperties(input.name, properties, behaviours);
+  const component = new Component(componentProperties);
+  component.setName(input.name);
+  component.setLogger(logger);
+  component.setLifeCycleAction(new LifeCycleAction(input.name));
+  component.setBehaviours(behaviours);
   return component;
 }
 

package/es/library/custom-component/applications/usecases/DispatchUseCase.js

@@ -1,19 +1,42 @@
+/* eslint-disable max-lines-per-function */
+
+/* eslint-disable complexity */
+import { ACA_ERROR_OCCURRED } from "../../../../cc/component/ErrorStructure";
 import AbstractUseCase from "./AbstractUseCase";
 
 class DispatchUseCase extends AbstractUseCase {
   execute(input) {
-    let {
+    const {
       repository,
       presenter,
       eventManager
     } = this.dependencies;
-    let component = repository.getComponent();
+    const component = repository.getComponent();
+
+    if (component.canSkipDispatchingEvent(input.type)) {
+      return;
+    }
 
     try {
-      let action = component.constructAction(input);
-      eventManager.dispatch(action);
+      if (input.type === ACA_ERROR_OCCURRED) {
+        const {
+          payload
+        } = input;
+
+        if (payload.errorDetails?.isBreaking) {
+          component.setError(payload);
+          presenter.setError(payload);
+        }
+
+        const action = component.getPublicErrorEvent(payload);
+        eventManager.dispatch(action);
+      } else {
+        const action = component.constructAction(input);
+        eventManager.dispatch(action);
+      }
     } catch (e) {
-      presenter.setError([e]);
+      component.setError(e);
+      presenter.setError(e);
     }
   }
 

package/es/library/custom-component/applications/usecases/InitializeUseCase.js

@@ -6,17 +6,18 @@ class InitializeUseCase extends AbstractUseCase {
     let {
       presenter,
       jsonValidator,
-      repository,
-      schemaValidator
+      repository
     } = this.dependencies;
     let component = createComponent(input, input.helpers);
 
     try {
-      component.init(jsonValidator, input.newProps, schemaValidator);
+      component.init(jsonValidator, input.newProps);
       let state = component.getState();
       presenter.render(state);
     } catch (e) {
-      presenter.setError(e);
+      const error = component.getClassifiedErrorStructure(e);
+      component.setError(error);
+      presenter.setError(error);
     } finally {
       repository.save(component);
     }

package/es/library/custom-component/applications/usecases/MountUseCase.js

@@ -2,20 +2,24 @@ import AbstractUseCase from "./AbstractUseCase";
 
 class MountUsecase extends AbstractUseCase {
   execute() {
-    let {
+    const {
       repository,
       presenter,
       eventManager
     } = this.dependencies;
-    let component = repository.getComponent();
-    let mountAction = component.getMountAction();
-    let eventHandlers = component.getEventHandlersWrapper();
+    const component = repository.getComponent();
+    const mountAction = component.getMountAction();
+    const eventHandlers = component.getEventHandlersWrapper();
 
     try {
       eventManager.subscribe(eventHandlers);
-      eventManager.dispatch(mountAction);
+
+      if (!component.hasBreakingError()) {
+        eventManager.dispatch(mountAction);
+      }
     } catch (e) {
-      presenter.setError([e]);
+      component.setError(e);
+      presenter.setError(e);
     }
   }
 

package/es/library/custom-component/applications/usecases/SetRefUseCase.js

@@ -0,0 +1,31 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class SetRefUseCase extends AbstractUseCase {
+  execute(_ref) {
+    let {
+      ref
+    } = _ref;
+    const {
+      repository,
+      presenter,
+      eventManager
+    } = this.dependencies;
+    const component = repository.getComponent();
+    const eventHandlers = component.getEventHandlersWrapper();
+
+    try {
+      if (eventManager.isDifferentElement(ref)) {
+        eventManager.unSubscribe(eventHandlers);
+        eventManager.setElement(ref);
+        eventManager.subscribe(eventHandlers);
+      }
+    } catch (e) {
+      const error = component.getClassifiedErrorStructure(e);
+      component.setError(error);
+      presenter.setError(error);
+    }
+  }
+
+}
+
+export default SetRefUseCase;

package/es/library/custom-component/applications/usecases/UnmountUseCase.js

@@ -2,21 +2,22 @@ import AbstractUseCase from "./AbstractUseCase";
 
 class UnmountUsecase extends AbstractUseCase {
   execute() {
-    let {
+    const {
       repository,
       presenter,
       eventManager
     } = this.dependencies;
-    let component = repository.getComponent();
-    let eventHanlders = component.getEventHandlers();
-    let unmountAction = component.getUnmountAction();
+    const component = repository.getComponent();
+    const eventHanlders = component.getEventHandlers();
+    const unmountAction = component.getUnmountAction();
 
     try {
       eventManager.dispatch(unmountAction);
       eventManager.unSubscribe(eventHanlders);
       repository.clear();
     } catch (e) {
-      presenter.setError([]);
+      component.setError(null);
+      presenter.setError(null);
     }
   }
 

package/es/library/custom-component/applications/usecases/UpdatePropertyUseCase.js

@@ -2,29 +2,34 @@ import AbstractUseCase from "./AbstractUseCase";
 
 class UpdatePropertyUseCase extends AbstractUseCase {
   execute(newProps) {
-    let {
+    const {
       repository,
       jsonValidator,
       eventManager,
-      presenter,
-      schemaValidator
+      presenter
     } = this.dependencies;
-    let component = repository.getComponent();
-    let properties = component.getProperties();
-    let isUpdated = component.updateProperties(jsonValidator, newProps, schemaValidator);
+    const component = repository.getComponent();
 
-    if (isUpdated) {
-      let updatedProperties = component.getProperties();
-      let state = component.getState();
-      presenter.render(state);
-      let updatePropertyAction = component.getPropertyUpdateAction({
-        currentProperties: updatedProperties,
-        previousProperties: properties
-      });
-      eventManager.dispatch(updatePropertyAction);
-      eventManager.dispatch(component.getStateUpdatedAction({
-        state
-      }));
+    try {
+      const properties = component.getProperties();
+      const isUpdated = component.updateProperties(jsonValidator, newProps);
+
+      if (isUpdated) {
+        const updatedProperties = component.getProperties();
+        const state = component.getState();
+        presenter.render(state);
+        const updatePropertyAction = component.getPropertyUpdateAction({
+          currentProperties: updatedProperties,
+          previousProperties: properties
+        });
+        eventManager.dispatch(updatePropertyAction);
+        eventManager.dispatch(component.getStateUpdatedAction({
+          state
+        }));
+      }
+    } catch (error) {
+      component.setError(error);
+      presenter.setError(error);
     }
   }
 

package/es/library/custom-component/applications/usecases/UpdateStateUseCase.js

@@ -7,15 +7,14 @@ class UpdateStateUseCase extends AbstractUseCase {
       presenter,
       eventManager
     } = this.dependencies;
-    let component = repository.getComponent(); // let preState=component.getState();
-    // console.log(`preState ${component.getName()}`,preState)
-
+    let component = repository.getComponent();
+    let preState = component.getState();
     component.updateState(newState);
-    let state = component.getState(); // console.log(`newState ${component.getName()}`,state)
-
+    let state = component.getState();
     presenter.render(state);
     eventManager.dispatch(component.getStateUpdatedAction({
-      state
+      state,
+      preState
     }));
   }
 

package/es/library/custom-component/domain/entities/Behaviour.js

@@ -20,6 +20,10 @@ class Behaviour {
     return this.properties;
   }
 
+  getPropertiesClone() {
+    return this.properties.getPropertiesClone();
+  }
+
   getEventHandlers() {
     return this.eventHandlers;
   }