Introduced new callback I/O types AppInput, AppOutput, and State

Author: forman

dashi/src/lib/actions/handleComponentChange.ts

@@ -17,7 +17,7 @@ export function handleComponentChange(
       contribIndex,
       stateChanges: [
         {
-          kind: "Component",
+          type: "Output",
           id: changeEvent.componentId,
           property: changeEvent.propertyName,
           value: changeEvent.propertyValue,
@@ -57,7 +57,7 @@ function getCallbackRequests(
       const inputs = callback.inputs;
       const inputIndex = inputs.findIndex(
         (input) =>
-          (!input.kind || input.kind === "Component") &&
+          (!input.type || input.type === "Input") &&
           input.id === changeEvent.componentId &&
           input.property === changeEvent.propertyName,
       );

dashi/src/lib/actions/handleHostStoreChange.ts

@@ -68,7 +68,7 @@ function _getHostStorePropertyRefs(): PropertyRef[] {
       (contribution.callbacks || []).forEach(
         (callback, callbackIndex) =>
           (callback.inputs || []).forEach((input, inputIndex) => {
-            if (input.kind === "AppState") {
+            if (input.type === "AppInput") {
               propertyRefs.push({
                 contribPoint,
                 contribIndex,

dashi/src/lib/actions/helpers/applyStateChangeRequests.test.ts

@@ -46,7 +46,7 @@ describe("Test that applyContributionChangeRequests()", () => {
     contribIndex: 0,
     stateChanges: [
       {
-        kind: "Component",
+        type: "Output",
         id: "dd1",
         property: "value",
         value: 14,
@@ -59,7 +59,7 @@ describe("Test that applyContributionChangeRequests()", () => {
     contribIndex: 0,
     stateChanges: [
       {
-        kind: "Component",
+        type: "Output",
         id: "dd1",
         property: "value",
         value: 13,
@@ -88,7 +88,7 @@ describe("Test that applyContributionChangeRequests()", () => {
 describe("Test that applyComponentStateChange()", () => {
   it("changes state if values are different", () => {
     const newState = applyComponentStateChange(componentTree, {
-      kind: "Component",
+      type: "Output",
       id: "cb1",
       property: "value",
       value: false,
@@ -99,7 +99,7 @@ describe("Test that applyComponentStateChange()", () => {
 
   it("doesn't change the state if value stays the same", () => {
     const newState = applyComponentStateChange(componentTree, {
-      kind: "Component",
+      type: "Output",
       id: "cb1",
       property: "value",
       value: true,

dashi/src/lib/actions/helpers/applyStateChangeRequests.ts

@@ -37,8 +37,9 @@ function applyHostStateChanges(stateChangeRequests: StateChangeRequest[]) {
     stateChangeRequests.forEach((stateChangeRequest) => {
       hostState = applyStateChanges(
         hostState,
-        stateChangeRequest.stateChanges,
-        "AppState",
+        stateChangeRequest.stateChanges.filter(
+          (stateChange) => stateChange.type === "AppOutput",
+        ),
       );
     });
     if (hostState !== hostStateOld) {
@@ -53,13 +54,9 @@ function applyComponentStateChanges(
 ) {
   let component = componentOld;
   if (component) {
-    stateChanges
-      .filter(
-        (stateChange) => !stateChange.kind || stateChange.kind === "Component",
-      )
-      .forEach((stateChange) => {
-        component = applyComponentStateChange(component!, stateChange);
-      });
+    stateChanges.forEach((stateChange) => {
+      component = applyComponentStateChange(component!, stateChange);
+    });
   }
   return component;
 }
@@ -74,12 +71,19 @@ export function applyContributionChangeRequests(
       const contribution = contributionsRecord[contribPoint][contribIndex];
       const state = applyStateChanges(
         contribution.state,
-        stateChanges,
-        "State",
+        stateChanges.filter(
+          (stateChange) =>
+            (!stateChange.type || stateChange.type === "Output") &&
+            !stateChange.id,
+        ),
       );
       const component = applyComponentStateChanges(
         contribution.component,
-        stateChanges,
+        stateChanges.filter(
+          (stateChange) =>
+            (!stateChange.type || stateChange.type === "Output") &&
+            stateChange.id,
+        ),
       );
       if (
         state !== contribution.state ||
@@ -139,14 +143,12 @@ export function applyComponentStateChange(
 export function applyStateChanges<S extends object>(
   state: S | undefined,
   stateChanges: StateChange[],
-  kind: "State" | "AppState",
 ): S | undefined {
   stateChanges.forEach((stateChange) => {
     if (
-      stateChange.kind === kind &&
-      (!state ||
-        (state as unknown as Record<string, unknown>)[stateChange.property] !==
-          stateChange.value)
+      !state ||
+      (state as unknown as Record<string, unknown>)[stateChange.property] !==
+        stateChange.value
     ) {
       state = { ...state, [stateChange.property]: stateChange.value } as S;
     }

dashi/src/lib/actions/helpers/getInputValues.test.ts

@@ -27,7 +27,7 @@ describe("Test that getComponentStateValue()", () => {
   it("works on 1st level", () => {
     expect(
       getComponentStateValue(componentState, {
-        kind: "Component",
+        type: "Input",
         id: "b1",
         property: "value",
       }),
@@ -37,7 +37,7 @@ describe("Test that getComponentStateValue()", () => {
   it("works on 2nd level", () => {
     expect(
       getComponentStateValue(componentState, {
-        kind: "Component",
+        type: "Input",
         id: "p1",
         property: "chart",
       }),
@@ -47,15 +47,15 @@ describe("Test that getComponentStateValue()", () => {
   it("works on 3rd level", () => {
     expect(
       getComponentStateValue(componentState, {
-        kind: "Component",
+        type: "Input",
         id: "cb1",
         property: "value",
       }),
     ).toEqual(true);
 
     expect(
       getComponentStateValue(componentState, {
-        kind: "Component",
+        type: "Input",
         id: "dd1",
         property: "value",
       }),
@@ -67,21 +67,21 @@ describe("Test that getInputValueFromState()", () => {
   it("works with input.id and input.property", () => {
     const state = { x: { y: 26 } };
     expect(
-      getInputValueFromState({ kind: "State", id: "x", property: "y" }, state),
+      getInputValueFromState({ type: "State", id: "x", property: "y" }, state),
     ).toEqual(26);
   });
 
   it("works with arrays indexes", () => {
     const state = { x: [4, 5, 6] };
     expect(
-      getInputValueFromState({ kind: "State", id: "x", property: "1" }, state),
+      getInputValueFromState({ type: "State", id: "x", property: "1" }, state),
     ).toEqual(5);
   });
 
   it("works without input.id", () => {
     const state = { x: [4, 5, 6] };
     expect(
-      getInputValueFromState({ kind: "State", property: "x" }, state),
+      getInputValueFromState({ type: "State", property: "x" }, state),
     ).toEqual([4, 5, 6]);
   });
 });

dashi/src/lib/actions/helpers/getInputValues.ts

@@ -22,13 +22,14 @@ export function getInputValue<S extends object = object>(
   hostState?: S | undefined,
 ): unknown {
   let inputValue: unknown = undefined;
-  const inputKind = input.kind || "Component";
-  if (inputKind === "Component" && contributionState.component) {
+  const inputKind = input.type || "Input";
+  if (
+    (inputKind === "Input" || inputKind === "State") &&
+    contributionState.component
+  ) {
     // Return value of a property of some component in the tree
     inputValue = getComponentStateValue(contributionState.component, input);
-  } else if (inputKind === "State" && contributionState.state) {
-    inputValue = getInputValueFromState(input, contributionState.state);
-  } else if (inputKind === "AppState" && hostState) {
+  } else if (inputKind === "AppInput" && hostState) {
     inputValue = getInputValueFromState(input, hostState);
   } else {
     console.warn(`input of unknown kind:`, input);

dashi/src/lib/types/model/callback.ts

@@ -30,14 +30,21 @@ export interface CbParameter {
   default?: unknown;
 }
 
-export type InputOutputKind = "AppState" | "State" | "Component";
+export type InputType = "AppInput" | "Input" | "State";
+
+export type OutputType = "AppOutput" | "Output";
+
+export type InputOutputType = InputType | OutputType;
 
 export interface InputOutput {
-  /** The kind of input or output. */
-  kind: InputOutputKind;
+  /**
+   * The type of input or output.
+   */
+  type: InputOutputType;
+
   /**
    * The identifier of a subcomponent.
-   * `id` is not needed if kind == "AppState" | "State".
+   * `id` is not needed if type == "AppInput" | "AppOutput".
    */
   id?: string;
 
@@ -52,9 +59,13 @@ export interface InputOutput {
   property: string;
 }
 
-export interface Input extends InputOutput {}
+export interface Input extends InputOutput {
+  type: InputType;
+}
 
-export interface Output extends InputOutput {}
+export interface Output extends InputOutput {
+  type: OutputType;
+}
 
 /**
  * A reference to a specific contribution.