Added buildFlat to @ballerine/blocks

apps/backoffice-v2/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @ballerine/backoffice-v2
 
+## 0.7.8
+
+### Patch Changes
+
+- Updated dependencies
+  - @ballerine/blocks@0.2.3
+
 ## 0.7.7
 
 ### Patch Changes

apps/backoffice-v2/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ballerine/backoffice-v2",
-  "version": "0.7.7",
+  "version": "0.7.8",
   "description": "Ballerine - Backoffice",
   "homepage": "https://github.com/ballerine-io/ballerine",
   "repository": {
@@ -50,7 +50,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@ballerine/blocks": "0.2.2",
+    "@ballerine/blocks": "0.2.3",
     "@ballerine/common": "0.9.5",
     "@ballerine/ui": "^0.5.1",
     "@ballerine/workflow-browser-sdk": "0.6.8",

apps/kyb-app/CHANGELOG.md

@@ -1,5 +1,12 @@
 # kyb-app
 
+## 0.3.9
+
+### Patch Changes
+
+- Updated dependencies
+  - @ballerine/blocks@0.2.3
+
 ## 0.3.8
 
 ### Patch Changes

apps/kyb-app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ballerine/kyb-app",
   "private": true,
-  "version": "0.3.8",
+  "version": "0.3.9",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -14,7 +14,7 @@
     "test:dev": "vitest"
   },
   "dependencies": {
-    "@ballerine/blocks": "0.2.2",
+    "@ballerine/blocks": "0.2.3",
     "@ballerine/common": "^0.9.5",
     "@ballerine/ui": "0.5.2",
     "@ballerine/workflow-browser-sdk": "0.6.8",

packages/blocks/.eslintrc.cjs

@@ -4,4 +4,7 @@ module.exports = {
     browser: true,
   },
   extends: ['@ballerine/eslint-config'],
+  parserOptions: {
+    project: './tsconfig.eslint.json',
+  },
 };

packages/blocks/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @ballerine/blocks
 
+## 0.2.3
+
+### Patch Changes
+
+- Added buildFlat to the blocks packages to reduce the need for .build().flat(1)
+
 ## 0.2.2
 
 ### Patch Changes

packages/blocks/package.json

@@ -2,7 +2,7 @@
   "private": false,
   "name": "@ballerine/blocks",
   "author": "Ballerine <dev@ballerine.com>",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "blocks",
   "module": "./dist/esm/index.js",
   "main": "./dist/cjs/index.js",

packages/blocks/src/blocks.spec-d.ts

@@ -8,12 +8,12 @@ type TCell =
     }
   | {
       type: 'headings';
-      value: Array<string>;
+      value: string[];
     };
 
 const createTestBlocks = () =>
   createBlocks<TCell>({
-    debug: true,
+    debug: !process.env.CI,
     verbose: true,
   });
 
@@ -314,4 +314,50 @@ describe('blocks #types', () => {
       }>();
     });
   });
+
+  describe('when calling `buildFlat`', () => {
+    it('should infer an array of blocks with a depth of `1`', () => {
+      // Arrange
+      const blockOneCellOne = generateCellValue({
+        block: 1,
+        cell: 1,
+      });
+      const blockOneCellTwo = [
+        generateCellValue({
+          block: 1,
+          cell: 2,
+        }),
+      ];
+      const blockTwoCellOne = [
+        generateCellValue({
+          block: 2,
+          cell: 1,
+        }),
+      ];
+      const blockTwoCellTwo = generateCellValue({
+        block: 2,
+        cell: 2,
+      });
+      const blocks = createTestBlocks()
+        .addBlock()
+        .addCell({ type: 'heading', value: blockOneCellOne })
+        .addCell({ type: 'headings', value: blockOneCellTwo })
+        .addBlock()
+        .addCell({ type: 'headings', value: blockTwoCellOne })
+        .addCell({ type: 'heading', value: blockTwoCellTwo });
+
+      // Act
+      const builtBlocks = blocks.buildFlat();
+
+      // Assert
+      expectTypeOf<typeof builtBlocks>().toEqualTypeOf<
+        [
+          { type: 'heading'; value: typeof blockOneCellOne },
+          { type: 'headings'; value: typeof blockOneCellTwo },
+          { type: 'headings'; value: typeof blockTwoCellOne },
+          { type: 'heading'; value: typeof blockTwoCellTwo },
+        ]
+      >();
+    });
+  });
 });

packages/blocks/src/blocks.spec.ts

@@ -8,12 +8,12 @@ type TCell =
     }
   | {
       type: 'headings';
-      value: Array<string>;
+      value: string[];
     };
 
 const createTestBlocks = () =>
   createBlocks<TCell>({
-    debug: true,
+    debug: !process.env.CI,
     verbose: true,
   });
 
@@ -341,4 +341,30 @@ describe('blocks #integration', () => {
       expect(secondCell).toEqual({ type: 'headings', value: blockTwoCellOne });
     });
   });
+
+  describe('when calling `buildFlat`', () => {
+    it('should return an array of blocks with a depth of `1`', () => {
+      // Arrange
+      const blockOneCellOne = generateCellValue({ block: 1, cell: 1 });
+      const blockOneCellTwo = [generateCellValue({ block: 1, cell: 2 })];
+      const blockTwoCellOne = [generateCellValue({ block: 2, cell: 1 })];
+      const blockTwoCellTwo = generateCellValue({ block: 2, cell: 2 });
+      const blocks = createTestBlocks()
+        .addBlock()
+        .addCell({ type: 'heading', value: blockOneCellOne })
+        .addCell({ type: 'headings', value: blockOneCellTwo })
+        .addBlock()
+        .addCell({ type: 'headings', value: blockTwoCellOne })
+        .addCell({ type: 'heading', value: blockTwoCellTwo })
+        .buildFlat();
+
+      // Assert
+      expect(blocks).toEqual([
+        { type: 'heading', value: blockOneCellOne },
+        { type: 'headings', value: blockOneCellTwo },
+        { type: 'headings', value: blockTwoCellOne },
+        { type: 'heading', value: blockTwoCellTwo },
+      ]);
+    });
+  });
 });

packages/blocks/src/blocks.ts

@@ -8,9 +8,18 @@ export type Cell = { type: string } & {
   [key: string]: unknown;
 };
 
-export type Block = Array<Cell>;
+export type Block = Cell[];
 
-export type Blocks = Array<Block>;
+export type Blocks = Block[];
+
+/**
+ * Takes an array of arrays and flattens it once. [[1,2], [3,4]] => [1,2,3,4]
+ */
+export type FlattenOnce<T extends any[]> = T extends [infer U, ...infer V]
+  ? U extends any[]
+    ? [...U, ...FlattenOnce<V extends any[] ? V : []>]
+    : [U, ...FlattenOnce<V extends any[] ? V : []>]
+  : [];
 
 /**
  * Allow the consumer of `@ballerine/blocks` to register their own cell types.
@@ -70,13 +79,11 @@ export type CellsMap = {
   [TType in CellType]: FunctionComponent<ExtractCellProps<TType>>;
 };
 
-export type InferAllButLastArrayElements<T extends Array<any>> = T extends [...infer U, any]
-  ? U
-  : [];
+export type InferAllButLastArrayElements<T extends any[]> = T extends [...infer U, any] ? U : [];
 
-export type InferLastArrayElement<T extends Array<any>> = T extends [...any, infer U] ? U : never;
+export type InferLastArrayElement<T extends any[]> = T extends [...any, infer U] ? U : never;
 
-export type InferArrayElement<T extends Array<any>> = T extends Array<infer U> ? U : never;
+export type InferArrayElement<T extends any[]> = T extends Array<infer U> ? U : never;
 
 export interface BlocksProps<TCell extends Cells> {
   /**
@@ -92,13 +99,13 @@ export interface BlocksProps<TCell extends Cells> {
    * @description Output of `createBlocks.build()`
    * @see {@link BlockBuilder.build}
    */
-  blocks: Array<Array<TCell>>;
+  blocks: TCell[][];
   /**
    * The `block` prop is only passed when the `Block` property component is passed.
    */
   Block?: FunctionComponent<{
-    children: ReactNode | Array<ReactNode>;
-    block: Array<TCell>;
+    children: ReactNode | ReactNode[];
+    block: TCell[];
   }>;
   /**
    * @description children as a function - provides access to the current block and cell
@@ -109,8 +116,8 @@ export interface BlocksProps<TCell extends Cells> {
   children: (
     Cell: CellsMap[keyof CellsMap],
     cell: ComponentProps<CellsMap[keyof CellsMap]>,
-    block: Array<TCell>,
-  ) => ReactNode | Array<ReactNode>;
+    block: TCell[],
+  ) => ReactNode | ReactNode[];
 }
 
 export type InvalidCellMessage =
@@ -228,6 +235,10 @@ export class BlocksBuilder<
     return this.#__blocks;
   }
 
+  buildFlat() {
+    return this.#__blocks.flat(1) as FlattenOnce<TBlocks>;
+  }
+
   #__logger(message: string) {
     try {
       log(!!this.#__options?.debug, {