feat: manage to get all the nested levels

CrystallizeAPI · Jul 18, 2024 · 30af995 · 30af995
1 parent e5df64e
commit 30af995
Show file tree

Hide file tree

Showing 9 changed files with 352 additions and 83 deletions.
diff --git a/src/domain/contracts/allowed-component-types.ts b/src/domain/contracts/allowed-component-types.ts
@@ -1 +1,2 @@
 export const allowedComponentTypes = ['singleLine', 'numeric', 'boolean', 'richText'];
+export const nestedComponentSeparator = '|<>|';
diff --git a/src/domain/contracts/components.ts b/src/domain/contracts/components.ts
@@ -2,7 +2,7 @@ type BaseComponent = {
     componentId: string;
 };
 
-export type Component =
+export type NonStructuaralComponent =
     | ({
           type: 'richText';
           content: {
@@ -19,7 +19,7 @@ export type Component =
           };
       } & BaseComponent)
     | ({
-          type: 'numerical';
+          type: 'numeric';
           content: {
               number: number;
           };
@@ -30,3 +30,25 @@ export type Component =
               value: boolean;
           };
       } & BaseComponent);
+
+export type StructuralComponent =
+    | ({
+          type: 'contentChunk';
+          content: {
+              chunks: Component[][];
+          };
+      } & BaseComponent)
+    | ({
+          type: 'piece';
+          content: {
+              components: Component[];
+          };
+      } & BaseComponent)
+    | ({
+          type: 'componentChoice';
+          content: {
+              selectedComponent: Component;
+          };
+      } & BaseComponent);
+
+export type Component = NonStructuaralComponent | StructuralComponent;
diff --git a/src/domain/use-cases/retrieve-filter-list-for-frontend.server.ts b/src/domain/use-cases/retrieve-filter-list-for-frontend.server.ts
@@ -1,6 +1,6 @@
 import { CrystallizeAPI } from '~/infrastructure/crystallize/create-crystallize-api.server';
 import { SelectOption } from '../contracts/select-option';
-import { allowedComponentTypes } from '../contracts/allowed-component-types';
+import { allowedComponentTypes, nestedComponentSeparator } from '../contracts/allowed-component-types';
 import { ShapeComponent } from '@crystallize/schema';
 
 type Deps = {
@@ -91,6 +91,9 @@ const reduceComponents = (
         if (!extendedAllowedComponentTypes.includes(component.type)) {
             return;
         }
+        const componentPathValue = `${applyPrefix(component.id, nestedComponentSeparator, prefix?.identifier)}`;
+        const componentPathLabel = `${applyPrefix(component.id, ' > ', prefix?.name)}`;
+
         if (component.type === 'contentChunk') {
             // we don't manage repeatable chunk
             const config = component.config;
@@ -99,8 +102,8 @@ const reduceComponents = (
             }
             if (config && 'components' in config) {
                 const chunkComponents = reduceComponents(config.components ?? [], {
-                    identifier: component.id,
-                    name: component.name,
+                    identifier: componentPathValue,
+                    name: componentPathLabel,
                 });
                 memo.push(...chunkComponents);
             }
@@ -110,8 +113,8 @@ const reduceComponents = (
             const config = component.config;
             if (config && 'choices' in config) {
                 const choicesComponents = reduceComponents(config.choices ?? [], {
-                    identifier: component.id,
-                    name: component.name,
+                    identifier: componentPathValue,
+                    name: componentPathLabel,
                 });
                 memo.push(...choicesComponents);
             }
@@ -122,16 +125,16 @@ const reduceComponents = (
             const config = component.config;
             if (config && 'components' in config) {
                 const pieceComponents = reduceComponents(config.components ?? [], {
-                    identifier: component.id,
-                    name: component.name,
+                    identifier: componentPathValue,
+                    name: componentPathLabel,
                 });
                 memo.push(...pieceComponents);
             }
             return;
         }
         memo.push({
-            value: `${applyPrefix(component.id, '|<>|', prefix?.identifier)}`,
-            label: `${applyPrefix(component.name, ' > ', prefix?.name)}`,
+            value: componentPathValue,
+            label: componentPathLabel,
         });
     });
     return memo;

diff --git a/src/infrastructure/actions/index-page-action.server.ts b/src/infrastructure/actions/index-page-action.server.ts
@@ -5,6 +5,7 @@ import { fetchItemsAndComponents } from '~/domain/use-cases/fetch-items-and-comp
 import { FetchItemsInputSchema } from '~/domain/contracts/input/fetch-items-input';
 import { z } from 'zod';
 import { saveItems } from '~/domain/use-cases/save-items.server';
+import { nestedComponentSeparator } from '~/domain/contracts/allowed-component-types';
 
 type Deps = {
     api: CrystallizeAPI;
@@ -22,7 +23,7 @@ export const indexPageAction = async (formData: FormData, { api, emitter }: Deps
             components: formData
                 .getAll('components')
                 .filter(Boolean)
-                .map((c) => `${c}`.split('|<>|')),
+                .map((c) => `${c}`.split(nestedComponentSeparator)),
         };
         return await executeForm(
             async (values) => {

diff --git a/src/infrastructure/core/auth.server.ts b/src/infrastructure/core/auth.server.ts
@@ -1,4 +1,4 @@
-import { ClientInterface, CrystallizeSignature, createClient } from '@crystallize/js-api-client';
+import { ClientInterface, CreateClientOptions, CrystallizeSignature, createClient } from '@crystallize/js-api-client';
 import { createCookieSessionStorage, redirect } from '@remix-run/node';
 import crypto from 'crypto';
 import { decodeJwt, jwtVerify } from 'jose';
@@ -81,10 +81,30 @@ export const requirePimAwareApiClient = async (request: Request): Promise<Client
             sessionId: getCookieValue(request, 'connect.sid'),
         });
     }
-    return createClient({
-        tenantId: signatureChecked.tenantId,
-        tenantIdentifier: signatureChecked.tenantIdentifier,
-        accessTokenId: `${process.env.CRYSTALLIZE_ACCESS_TOKEN_ID}`,
-        accessTokenSecret: `${process.env.CRYSTALLIZE_ACCESS_TOKEN_SECRET}`,
-    });
+    const debugOptions: CreateClientOptions = {
+        profiling: {
+            // onRequest(query, variables) {
+            //     logger.debug("profiling", {
+            //         query,
+            //         variables,
+            //     });
+            // },
+            onRequestResolved: (timings, query, variables) => {
+                console.debug('profiling', {
+                    timings,
+                    query,
+                    variables,
+                });
+            },
+        },
+    };
+    return createClient(
+        {
+            tenantId: signatureChecked.tenantId,
+            tenantIdentifier: signatureChecked.tenantIdentifier,
+            accessTokenId: `${process.env.CRYSTALLIZE_ACCESS_TOKEN_ID}`,
+            accessTokenSecret: `${process.env.CRYSTALLIZE_ACCESS_TOKEN_SECRET}`,
+        },
+        debugOptions,
+    );
 };
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		export const allowedComponentTypes = ['singleLine', 'numeric', 'boolean', 'richText'];
		export const nestedComponentSeparator = '\|<>\|';