Allow to pass array of units for spread operator

src/spread/index.ts

@@ -1,21 +1,34 @@
-import {
-  createEvent,
-  EventCallable,
-  is,
-  sample,
-  Unit,
-  UnitTargetable,
-} from 'effector';
+import { createEvent, EventCallable, sample, Unit, UnitTargetable } from 'effector';
 
 const hasPropBase = {}.hasOwnProperty;
 const hasOwnProp = <O extends { [k: string]: unknown }>(object: O, key: string) =>
   hasPropBase.call(object, key);
 
 type NoInfer<T> = [T][T extends any ? 0 : never];
 
+/**
+ * @example
+ * spread({
+ *   source: dataObject,
+ *   targets: { first: targetA, second: [target1, target2] },
+ * })
+ *
+ * sample({
+ *   source: dataObject,
+ *   target: spread({ targets: { first: targetA, second: [target1, target2] } })
+ * })
+ *
+ * sample({
+ *   source: dataObject,
+ *   target: spread({ first: targetA, second: [target1, target2] })
+ * })
+ */
+
 export function spread<Payload>(config: {
   targets: {
-    [Key in keyof Payload]?: UnitTargetable<Payload[Key]>;
+    [Key in keyof Payload]?:
+      | UnitTargetable<Payload[Key]>
+      | Array<UnitTargetable<Payload[Key]>>;
   };
 }): EventCallable<Partial<Payload>>;
 
@@ -27,31 +40,28 @@ export function spread<
   targets: {
     [Key in keyof Payload]?:
       | EventCallable<Partial<Payload[Key]>>
-      | UnitTargetable<NoInfer<Payload[Key]>>;
+      | Array<EventCallable<Partial<Payload[Key]>>>
+      | UnitTargetable<NoInfer<Payload[Key]>>
+      | Array<UnitTargetable<NoInfer<Payload[Key]>>>;
   };
 }): Source;
 
 export function spread<Payload>(targets: {
-  [Key in keyof Payload]?: UnitTargetable<Payload[Key]>;
+  [Key in keyof Payload]?:
+    | UnitTargetable<Payload[Key]>
+    | Array<UnitTargetable<Payload[Key]>>;
 }): EventCallable<Partial<Payload>>;
 
-/**
- * @example
- * spread({ source: dataObject, targets: { first: targetA, second: targetB } })
- * sample({
- *   target: spread({targets: { first: targetA, second: targetB } })
- * })
- */
 export function spread<P>(
   args:
     | {
         targets: {
-          [Key in keyof P]?: Unit<P[Key]>;
+          [Key in keyof P]?: Unit<P[Key]> | Array<Unit<P[Key]>>;
         };
         source?: Unit<P>;
       }
     | {
-        [Key in keyof P]?: Unit<P[Key]>;
+        [Key in keyof P]?: Unit<P[Key]> | Array<Unit<P[Key]>>;
       },
 ): EventCallable<P> {
   const argsShape = isTargets(args) ? { targets: args } : args;
@@ -60,18 +70,14 @@ export function spread<P>(
     if (hasOwnProp(targets, targetKey)) {
       const currentTarget = targets[targetKey];
 
-      const hasTargetKey = sample({
-        source,
-        batch: false,
-        filter: (object): object is any =>
-          typeof object === 'object' && object !== null && targetKey in object,
-      });
-
       sample({
-        batch: false,
-        clock: hasTargetKey,
+        source,
+        filter: (object): object is any => {
+          return typeof object === 'object' && object !== null && targetKey in object;
+        },
         fn: (object: P) => object[targetKey],
         target: currentTarget as UnitTargetable<any>,
+        batch: false,
       });
     }
   }
@@ -83,18 +89,15 @@ function isTargets<P>(
   args:
     | {
         targets: {
-          [Key in keyof P]?: Unit<P[Key]>;
+          [Key in keyof P]?: Unit<P[Key]> | Array<Unit<P[Key]>>;
         };
         source?: Unit<P>;
       }
     | {
-        [Key in keyof P]?: Unit<P[Key]>;
+        [Key in keyof P]?: Unit<P[Key]> | Array<Unit<P[Key]>>;
       },
 ): args is {
-  [Key in keyof P]?: Unit<P[Key]>;
+  [Key in keyof P]?: Unit<P[Key]> | Array<Unit<P[Key]>>;
 } {
-  return Object.keys(args).some(
-    (key) =>
-      !['targets', 'source'].includes(key) && is.unit(args[key as keyof typeof args]),
-  );
+  return !Object.keys(args).some((key) => ['targets', 'source'].includes(key));
 }

src/spread/readme.md

@@ -211,3 +211,61 @@ source = spread({ targets: { field: target, ... } })
 ### Returns
 
 - `source` `(Event<T>)` — Source event, data passed to it should be an object with fields from `targets`
+
+## `source = spread({ targets: { field: Unit[] } })`
+
+### Motivation
+
+Multiple units can be passed for each target field
+
+### Formulae
+
+```ts
+source = spread({ field: [target1, target2], ... })
+
+source = spread({ targets: { field: [target1, target2], ... } })
+
+spread({ source, targets: { field: [target1, target2], ... } })
+```
+
+- When `source` is triggered with **object**, extract `field` from data, and trigger all targets of `target`
+- `targets` can have multiple properties with multiple units
+- If the `source` was triggered with non-object, nothing would be happening
+- If `source` is triggered with object but without property `field`, no unit of the target for this `field` will be triggered
+
+### Example
+
+#### Trigger multiple units for each field of payload
+
+```ts
+const roomEntered = createEvent<{
+  roomId: string;
+  userId: string;
+  message: string;
+}>();
+const userIdChanged = createEvent<string>();
+
+const $roomMessage = createStore('');
+const $currentRoomId = createStore<string | null>(null);
+
+const getRoomFx = createEffect((roomId: string) => roomId);
+const setUserIdFx = createEffect((userId: string) => userId);
+
+sample({
+  clock: roomEntered,
+  target: spread({
+    roomId: [getRoomFx, $currentRoomId],
+    userId: [setUserIdFx, userIdChanged],
+    message: $roomMessage,
+  }),
+});
+
+roomEntered({
+  roomId: 'roomId',
+  userId: 'userId',
+  message: 'message',
+});
+// => getRoomFx('roomId'), update $currentRoomId with 'roomId'
+// => setUserIdFx('userId'), userIdChanged('userId')
+// => update $roomMessage with 'message'
+```

src/spread/spread.fork.test.ts

@@ -4,64 +4,84 @@ import { spread } from './index';
 
 test('works in forked scope', async () => {
   const app = createDomain();
-  const source = app.createEvent<{ first: string; second: number }>();
+  const source = app.createEvent<{ first: string; second: number; third: string }>();
   const first = app.createEvent<string>();
   const second = app.createEvent<number>();
 
-  const _$first = app.createStore('').on(first, (_, p) => p);
-  const _$second = restore(second, 0);
+  const $thirdA = app.createStore('');
+  const $thirdB = app.createStore('');
+
+  const $first = app.createStore('').on(first, (_, p) => p);
+  const $second = restore(second, 0);
 
   spread({
     source,
-    targets: { first, second },
+    targets: { first, second, third: [$thirdA, $thirdB] },
   });
 
   const scope = fork();
 
-  await allSettled(source, { scope, params: { first: 'sergey', second: 26 } });
-  expect(serialize(scope)).toMatchInlineSnapshot(`
-    {
-      "-xihhjw": 26,
-      "nln5hw": "sergey",
-    }
-  `);
+  await allSettled(source, {
+    scope,
+    params: { first: 'sergey', second: 26, third: '30' },
+  });
+
+  expect(scope.getState($first)).toBe('sergey');
+  expect(scope.getState($second)).toBe(26);
+  expect(scope.getState($thirdA)).toBe('30');
+  expect(scope.getState($thirdB)).toBe('30');
 });
 
 test('do not affects original store state', async () => {
   const app = createDomain();
-  const source = app.createEvent<{ first: string; second: number }>();
+  const source = app.createEvent<{ first: string; second: number; third: string }>();
   const first = app.createEvent<string>();
   const second = app.createEvent<number>();
 
+  const $thirdA = app.createStore('');
+  const $thirdB = app.createStore('');
+
   const $first = app.createStore('').on(first, (_, p) => p);
   const $second = restore(second, 0);
 
   spread({
     source,
-    targets: { first, second },
+    targets: { first, second, third: [$thirdA, $thirdB] },
   });
 
   const scope = fork();
 
-  await allSettled(source, { scope, params: { first: 'sergey', second: 26 } });
+  await allSettled(source, {
+    scope,
+    params: { first: 'sergey', second: 26, third: '30' },
+  });
+
   expect(scope.getState($first)).toBe('sergey');
   expect(scope.getState($second)).toBe(26);
+  expect(scope.getState($thirdA)).toBe('30');
+  expect(scope.getState($thirdB)).toBe('30');
+
   expect($first.getState()).toBe('');
   expect($second.getState()).toBe(0);
+  expect($thirdA.getState()).toBe('');
+  expect($thirdB.getState()).toBe('');
 });
 
 test('do not affects another scope', async () => {
   const app = createDomain();
-  const source = app.createEvent<{ first: string; second: number }>();
+  const source = app.createEvent<{ first: string; second: number; third: string }>();
   const first = app.createEvent<string>();
   const second = app.createEvent<number>();
 
-  const _$first = app.createStore('').on(first, (_, p) => p);
-  const _$second = restore(second, 0);
+  const $thirdA = app.createStore('');
+  const $thirdB = app.createStore('');
+
+  const $first = app.createStore('').on(first, (_, p) => p);
+  const $second = restore(second, 0);
 
   spread({
     source,
-    targets: { first, second },
+    targets: { first, second, third: [$thirdA, $thirdB] },
   });
 
   const scope1 = fork();
@@ -70,23 +90,21 @@ test('do not affects another scope', async () => {
   await Promise.all([
     allSettled(source, {
       scope: scope1,
-      params: { first: 'sergey', second: 26 },
+      params: { first: 'sergey', second: 26, third: '30' },
     }),
     allSettled(source, {
       scope: scope2,
-      params: { first: 'Anon', second: 90 },
+      params: { first: 'Anon', second: 90, third: '154' },
     }),
   ]);
-  expect(serialize(scope1)).toMatchInlineSnapshot(`
-    {
-      "-w3pd79": 26,
-      "f2h7kg": "sergey",
-    }
-  `);
-  expect(serialize(scope2)).toMatchInlineSnapshot(`
-    {
-      "-w3pd79": 90,
-      "f2h7kg": "Anon",
-    }
-  `);
+
+  expect(scope1.getState($first)).toBe('sergey');
+  expect(scope1.getState($second)).toBe(26);
+  expect(scope1.getState($thirdA)).toBe('30');
+  expect(scope1.getState($thirdB)).toBe('30');
+
+  expect(scope2.getState($first)).toBe('Anon');
+  expect(scope2.getState($second)).toBe(90);
+  expect(scope2.getState($thirdA)).toBe('154');
+  expect(scope2.getState($thirdB)).toBe('154');
 });