Merge branch 'main' into release/all-0.1

exacs · exacs · commit ab68ee8df434 · 2025-11-17T09:47:56.000+01:00
diff --git a/__test__/test-website/src/app/en/layout.tsx b/__test__/test-website/src/app/en/layout.tsx
@@ -26,13 +26,37 @@ import {
   Row,
   RowA,
 } from '@/components/with-display-templates';
+import {
+  ctArray,
+  ctBoolean,
+  ctContentReference,
+  ctInteger,
+  ctLink,
+  ctRich,
+  ctString,
+  ctWithCollision,
+} from '@/components/with-repeated-properties';
 import {
   initContentTypeRegistry,
   initDisplayTemplateRegistry,
 } from '@optimizely/cms-sdk';
 import { initReactComponentRegistry } from '@optimizely/cms-sdk/react/server';
 
-initContentTypeRegistry([ct1, ct2, ct3, ct6, ct7]);
+initContentTypeRegistry([
+  ct1,
+  ct2,
+  ct3,
+  ct6,
+  ct7,
+  ctString,
+  ctBoolean,
+  ctInteger,
+  ctRich,
+  ctContentReference,
+  ctArray,
+  ctWithCollision,
+  ctLink,
+]);
 initDisplayTemplateRegistry([dt1, dt2, dt3, dt4, dt5, dt6]);
 initReactComponentRegistry({
   resolver: {
diff --git a/__test__/test-website/src/app/query/[...slug]/layout.tsx b/__test__/test-website/src/app/query/[...slug]/layout.tsx
@@ -0,0 +1,3 @@
+import RootLayout from '@/app/en/layout';
+
+export default RootLayout;
diff --git a/__test__/test-website/src/app/query/[...slug]/page.tsx b/__test__/test-website/src/app/query/[...slug]/page.tsx
@@ -0,0 +1,39 @@
+import { GraphClient, GraphErrors } from '@optimizely/cms-sdk';
+import React from 'react';
+
+type Props = {
+  params: Promise<{
+    slug: string[];
+  }>;
+};
+
+function handleGraphErrors(err: unknown): never {
+  if (err instanceof GraphErrors.GraphResponseError) {
+    console.log('Error message:', err.message);
+    console.log('Query:', err.request.query);
+    console.log('Variables:', err.request.variables);
+  }
+  if (err instanceof GraphErrors.GraphContentResponseError) {
+    console.log('Detailed errors: ', err.errors);
+  }
+
+  throw err;
+}
+
+export default async function Page({ params }: Props) {
+  const { slug } = await params;
+  const path = `/en/${slug.join('/')}/`;
+
+  const client = new GraphClient(process.env.OPTIMIZELY_GRAPH_SINGLE_KEY!, {
+    graphUrl: process.env.OPTIMIZELY_GRAPH_GATEWAY,
+  });
+
+  const items = await client.getContentByPath(path).catch(handleGraphErrors);
+
+  return (
+    <>
+      <h1>Query result</h1>
+      <pre>{JSON.stringify(items[0], null, 2)}</pre>
+    </>
+  );
+}
diff --git a/__test__/test-website/src/components/with-repeated-properties.tsx b/__test__/test-website/src/components/with-repeated-properties.tsx
@@ -0,0 +1,70 @@
+import { contentType } from '@optimizely/cms-sdk';
+
+export const ctString = contentType({
+  baseType: '_component',
+  key: 'ct_string',
+  properties: { p1: { type: 'string' } },
+});
+export const ctBoolean = contentType({
+  baseType: '_component',
+  key: 'ct_boolean',
+  properties: { p1: { type: 'boolean' } },
+});
+export const ctInteger = contentType({
+  baseType: '_component',
+  key: 'ct_integer',
+  properties: { p1: { type: 'integer' } },
+});
+export const ctRich = contentType({
+  baseType: '_component',
+  key: 'ct_rich',
+  properties: { p1: { type: 'richText' } },
+});
+export const ctLink = contentType({
+  baseType: '_component',
+  key: 'ct_link',
+  properties: { p1: { type: 'link' } },
+});
+export const ctContentReference = contentType({
+  baseType: '_component',
+  key: 'ct_contentreference',
+  properties: { p1: { type: 'contentReference' } },
+});
+export const ctArray = contentType({
+  baseType: '_component',
+  key: 'ct_array',
+  properties: { p1: { type: 'array', items: { type: 'string' } } },
+});
+export const ctWithCollision = contentType({
+  baseType: '_page',
+  key: 'ct_with_collision',
+  properties: {
+    collision: {
+      type: 'content',
+      allowedTypes: [
+        ctString,
+        ctBoolean,
+        ctInteger,
+        ctRich,
+        ctLink,
+        ctContentReference,
+        ctArray,
+      ],
+    },
+    p2: {
+      type: 'array',
+      items: {
+        type: 'content',
+        allowedTypes: [
+          ctString,
+          ctBoolean,
+          ctInteger,
+          ctRich,
+          ctLink,
+          ctContentReference,
+          ctArray,
+        ],
+      },
+    },
+  },
+});
diff --git a/__test__/test-website/with-display-templates.config.mjs b/__test__/test-website/with-display-templates.config.mjs
@@ -1,5 +1,8 @@
 import { buildConfig } from '@optimizely/cms-sdk';
 
 export default buildConfig({
-  components: ['./src/components/with-display-templates.tsx'],
+  components: [
+    './src/components/with-display-templates.tsx',
+    './src/components/with-repeated-properties.tsx',
+  ],
 });
diff --git a/packages/optimizely-cms-sdk/src/graph/__test__/convertProperty.test.ts b/packages/optimizely-cms-sdk/src/graph/__test__/convertProperty.test.ts
@@ -68,7 +68,7 @@ describe('createFragment > Fragment threshold warning', () => {
     expect(result).toBeInstanceOf(Array);
     expect(warnSpy).toHaveBeenCalledOnce();
     expect(warnSpy.mock.calls[0][0]).toMatch(
-      String.raw`generated 105 inner fragments`
+      String.raw`generated 107 inner fragments`
     );
     expect(warnSpy.mock.calls[0][0]).toMatch(
       /Excessive fragment depth may breach GraphQL limits or degrade performance./
diff --git a/packages/optimizely-cms-sdk/src/graph/__test__/createQuery.test.ts b/packages/optimizely-cms-sdk/src/graph/__test__/createQuery.test.ts
diff --git a/packages/optimizely-cms-sdk/src/graph/__test__/createQueryExperiences.test.ts b/packages/optimizely-cms-sdk/src/graph/__test__/createQueryExperiences.test.ts
@@ -16,13 +16,15 @@ describe('createFragment()', () => {
     expect(result).toMatchInlineSnapshot(`
       [
         "fragment MediaMetadata on MediaMetadata { mimeType thumbnail content }",
+        "fragment ItemMetadata on ItemMetadata { changeset displayOption }",
+        "fragment InstanceMetadata on InstanceMetadata { changeset locales expired container owner routeSegment lastModifiedBy path createdBy }",
         "fragment ContentUrl on ContentUrl { type default hierarchical internal graph base }",
-        "fragment IContentMetadata on IContentMetadata { key locale fallbackForLocale version displayName url {...ContentUrl} types published status created lastModified sortOrder variation ...MediaMetadata }",
+        "fragment IContentMetadata on IContentMetadata { key locale fallbackForLocale version displayName url {...ContentUrl} types published status created lastModified sortOrder variation ...MediaMetadata ...ItemMetadata ...InstanceMetadata }",
         "fragment _IContent on _IContent { _id _metadata {...IContentMetadata} }",
         "fragment _IExperience on _IExperience { composition {...ICompositionNode }}",
         "fragment ICompositionNode on ICompositionNode { __typename key type nodeType displayName displayTemplateKey displaySettings {key value} ...on CompositionStructureNode { nodes @recursive } ...on CompositionComponentNode { nodeType component { ..._IComponent } } }",
-        "fragment CallToAction on CallToAction { __typename label link ..._IContent }",
-        "fragment ExpSection on ExpSection { __typename heading ..._IContent }",
+        "fragment CallToAction on CallToAction { __typename CallToAction__label:label CallToAction__link:link ..._IContent }",
+        "fragment ExpSection on ExpSection { __typename ExpSection__heading:heading ..._IContent }",
         "fragment _IComponent on _IComponent { __typename ...CallToAction ...ExpSection }",
         "fragment MyExperience on MyExperience { __typename ..._IContent ..._IExperience }",
       ]
diff --git a/packages/optimizely-cms-sdk/src/graph/__test__/index.test.ts b/packages/optimizely-cms-sdk/src/graph/__test__/index.test.ts
@@ -0,0 +1,78 @@
+import { describe, expect, test } from 'vitest';
+import { removeTypePrefix } from '../index.js';
+
+describe('removeTypePrefix()', () => {
+  test('basic functionality', () => {
+    const input = {
+      __typename: 'T',
+      T__p1: 'p1',
+      T__p2: 42,
+      T__p3: ['p3', 32],
+      T__p4: { nested: 'p4' },
+      T__p5: { nested: ['p5'] },
+      ShouldBeKept__p6: 'p6',
+    };
+    const expected = {
+      __typename: 'T',
+      p1: 'p1',
+      p2: 42,
+      p3: ['p3', 32],
+      p4: { nested: 'p4' },
+      p5: { nested: ['p5'] },
+      ShouldBeKept__p6: 'p6',
+    };
+    expect(removeTypePrefix(input)).toStrictEqual(expected);
+  });
+
+  test('should remove prefixes only in the same level', () => {
+    const input = {
+      __typename: 'T',
+      T__p1: { T_shouldBeKept: 'shouldBeKept' },
+    };
+    const expected = {
+      __typename: 'T',
+      p1: { T_shouldBeKept: 'shouldBeKept' },
+    };
+    expect(removeTypePrefix(input)).toStrictEqual(expected);
+  });
+
+  test('should work for nested objects', () => {
+    const input = {
+      __typename: 'T',
+      T__p1: {
+        __typename: 'U',
+        U__p1: 'p1',
+        U__p2: {
+          __typename: 'V',
+          V__p1: 'p1',
+        },
+      },
+      T__p2: [{ __typename: 'U', U__p1: 'p1' }],
+    };
+    const expected = {
+      __typename: 'T',
+      p1: {
+        __typename: 'U',
+        p1: 'p1',
+        p2: {
+          __typename: 'V',
+          p1: 'p1',
+        },
+      },
+      p2: [{ __typename: 'U', p1: 'p1' }],
+    };
+    expect(removeTypePrefix(input)).toStrictEqual(expected);
+  });
+
+  test('should not do anything if __typename is not found', () => {
+    const input = {
+      T__p1: 'hello',
+      T__p2: 42,
+      T__p3: ['hello', 32],
+      T__p4: { nested: 'nested' },
+      T__p5: { nested: ['hello'] },
+    };
+
+    expect(removeTypePrefix(input)).toStrictEqual(input);
+  });
+});
diff --git a/packages/optimizely-cms-sdk/src/graph/createQuery.ts b/packages/optimizely-cms-sdk/src/graph/createQuery.ts
@@ -69,9 +69,16 @@ function convertProperty(
   name: string,
   property: AnyProperty,
   rootName: string,
+  suffix: string,
   visited: Set<string>
 ): { fields: string[]; extraFragments: string[] } {
-  const result = convertPropertyField(name, property, rootName, visited);
+  const result = convertPropertyField(
+    name,
+    property,
+    rootName,
+    suffix,
+    visited
+  );
 
   // logs warnings if the fragment generation causes potential issues
   const warningMessage = checkTypeConstraintIssues(rootName, property, result);
@@ -95,17 +102,19 @@ function convertPropertyField(
   name: string,
   property: AnyProperty,
   rootName: string,
+  suffix: string,
   visited: Set<string>
 ): { fields: string[]; extraFragments: string[] } {
   const fields: string[] = [];
   const subfields: string[] = [];
   const extraFragments: string[] = [];
+  const nameInFragment = `${rootName}${suffix}__${name}:${name}`;
 
   if (property.type === 'component') {
     const key = property.contentType.key;
     const fragmentName = `${key}Property`;
-    extraFragments.push(...createFragment(key, visited, 'Property'));
-    fields.push(`${name} { ...${fragmentName} }`);
+    extraFragments.push(...createFragment(key, visited, 'Property', false));
+    fields.push(`${nameInFragment} { ...${fragmentName} }`);
   } else if (property.type === 'content') {
     const allowed = resolveAllowedTypes(
       property.allowedTypes,
@@ -132,24 +141,24 @@ function convertPropertyField(
     }
 
     const uniqueSubfields = ['__typename', ...new Set(subfields)].join(' '); // remove duplicates
-    fields.push(`${name} { ${uniqueSubfields} }`);
+    fields.push(`${nameInFragment} { ${uniqueSubfields} }`);
   } else if (property.type === 'richText') {
-    fields.push(`${name} { html, json }`);
+    fields.push(`${nameInFragment} { html, json }`);
   } else if (property.type === 'url') {
     extraFragments.push(CONTENT_URL_FRAGMENT);
-    fields.push(`${name} { ...ContentUrl }`);
+    fields.push(`${nameInFragment} { ...ContentUrl }`);
   } else if (property.type === 'link') {
     extraFragments.push(CONTENT_URL_FRAGMENT);
-    fields.push(`${name} { text title target url { ...ContentUrl }}`);
+    fields.push(`${nameInFragment} { text title target url { ...ContentUrl }}`);
   } else if (property.type === 'contentReference') {
     extraFragments.push(CONTENT_URL_FRAGMENT);
-    fields.push(`${name} { key url { ...ContentUrl }}`);
+    fields.push(`${nameInFragment} { key url { ...ContentUrl }}`);
   } else if (property.type === 'array') {
-    const f = convertProperty(name, property.items, rootName, visited);
+    const f = convertProperty(name, property.items, rootName, suffix, visited);
     fields.push(...f.fields);
     extraFragments.push(...f.extraFragments);
   } else {
-    fields.push(name);
+    fields.push(nameInFragment);
   }
 
   return {
@@ -202,7 +211,8 @@ function createExperienceFragments(visited: Set<string>): string[] {
 export function createFragment(
   contentTypeName: string,
   visited: Set<string> = new Set(), // shared across recursion
-  suffix: string = ''
+  suffix: string = '',
+  includeBaseFragments: boolean = true
 ): string[] {
   const fragmentName = `${contentTypeName}${suffix}`;
   if (visited.has(fragmentName)) return []; // cyclic ref guard
@@ -235,16 +245,19 @@ export function createFragment(
         propKey,
         prop,
         contentTypeName,
+        suffix,
         visited
       );
       fields.push(...f);
       extraFragments.push(...e);
     }
 
     // Add fragments for the base type of the user-defined content type
-    const baseFragments = buildBaseTypeFragments();
-    extraFragments.unshift(...baseFragments.extraFragments); // maintain order
-    fields.push(...baseFragments.fields);
+    if (includeBaseFragments) {
+      const baseFragments = buildBaseTypeFragments();
+      extraFragments.unshift(...baseFragments.extraFragments); // maintain order
+      fields.push(...baseFragments.fields);
+    }
 
     if (ct.baseType === '_experience') {
       fields.push('..._IExperience');
diff --git a/packages/optimizely-cms-sdk/src/graph/index.ts b/packages/optimizely-cms-sdk/src/graph/index.ts
diff --git a/packages/optimizely-cms-sdk/src/infer.ts b/packages/optimizely-cms-sdk/src/infer.ts
diff --git a/packages/optimizely-cms-sdk/src/util/baseTypeUtil.ts b/packages/optimizely-cms-sdk/src/util/baseTypeUtil.ts

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+import RootLayout from '@/app/en/layout';`
	`2`	`+`
	`3`	`+export default RootLayout;`