@exdst-sitecore-content-sdk/astro 0.0.16 → 0.0.19

package/src/enhancers/WithEmptyFieldEditingComponent.astro.test.ts

@@ -0,0 +1,380 @@
+import { describe, test, expect } from 'vitest';
+import { renderAstroComponent } from '../tests/astro-helpers';
+import WithEmptyFieldEditingComponent from './WithEmptyFieldEditingComponent.astro';
+import DefaultEmptyFieldEditingComponentText from '../components/DefaultEmptyFieldEditingComponentText.astro';
+import { EMPTY_DATE_FIELD_VALUE } from '@sitecore-content-sdk/content/layout';
+import TestComponent from '../tests/test-components/TestComponent.astro';
+import EmptyFieldEditingComponent from '../tests/test-components/EmptyFieldEditingComponent.astro';
+
+describe('WithEmptyFieldEditingComponent', () => {
+  describe('Metadata', () => {
+    const testMetadata = {
+      contextItem: {
+        id: '{09A07660-6834-476C-B93B-584248D3003B}',
+        language: 'en',
+        revision: 'a0b36ce0a7db49418edf90eb9621e145',
+        version: 1,
+      },
+      fieldId: '{414061F4-FBB1-4591-BC37-BFFA67F745EB}',
+      fieldType: 'single-line',
+      rawValue: 'Test1',
+    };
+
+    test('Should render provided default empty value component component if field value is not provided', async () => {
+      const props = {
+        tag: 'h1',
+        field: {
+          value: '',
+          metadata: testMetadata,
+        },
+        defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+      };
+
+      const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+      const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+        props: props,
+        slots: {
+          default: testComponent,
+        },
+      });
+
+      expect(rendered.innerHTML).to.equal('<h1 tag="h1">[No text in field]</h1>');
+    });
+
+    test('Should render custom empty value component if provided via props if field value is not provided', async () => {
+      const props = {
+        field: {
+          value: '',
+          metadata: testMetadata,
+        },
+        emptyFieldEditingComponent: EmptyFieldEditingComponent,
+        defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+      };
+
+      const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+      const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+        props: props,
+        slots: {
+          default: testComponent,
+        },
+      });
+
+      const expected = await renderAstroComponent(EmptyFieldEditingComponent);
+
+      expect(rendered.innerHTML).to.equal(expected.innerHTML);
+    });
+
+    test('Should render component if field value is provided', async () => {
+      const props = {
+        field: {
+          value: 'field value',
+          metadata: testMetadata,
+        },
+        defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+      };
+
+      const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+      const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+        props: props,
+        slots: {
+          default: testComponent,
+        },
+      });
+
+      expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+    });
+
+    test('Should render component if component is explicitly not editable if value is empty', async () => {
+      const props = {
+        field: {
+          value: '',
+          metadata: testMetadata,
+        },
+        editable: false,
+        defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+      };
+
+      const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+      const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+        props: props,
+        slots: {
+          default: testComponent,
+        },
+      });
+
+      expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+    });
+
+    test('Should render component if metadata is not provided', async () => {
+      const props = {
+        field: {
+          value: '',
+        },
+        defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+      };
+
+      const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+      const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+        props: props,
+        slots: {
+          default: testComponent,
+        },
+      });
+
+      expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+    });
+
+    describe('Date', () => {
+      test('Should render component if field value is provided', async () => {
+        const props = {
+          field: {
+            metadata: testMetadata,
+            value: '2024-01-01T00:00:00Z',
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+      });
+
+      test('Should render default empty component if field value is empty', async () => {
+        const props = {
+          field: {
+            value: EMPTY_DATE_FIELD_VALUE,
+            metadata: testMetadata,
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        const expected = await renderAstroComponent(DefaultEmptyFieldEditingComponentText);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+
+      test('Should render custom empty component if field value is empty', async () => {
+        const props = {
+          field: {
+            value: EMPTY_DATE_FIELD_VALUE,
+            metadata: testMetadata,
+          },
+          emptyFieldEditingComponent: EmptyFieldEditingComponent,
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        const expected = await renderAstroComponent(EmptyFieldEditingComponent);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+    });
+
+    describe('Image', () => {
+      test('Should render component if field src is provided', async () => {
+        const props = {
+          field: {
+            metadata: testMetadata,
+            src: 'img src',
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+      });
+
+      test('Should render component if field value src is provided', async () => {
+        const props = {
+          field: {
+            metadata: testMetadata,
+            value: { src: 'img src' },
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+      });
+
+      test('Should render provided default empty value component component if field value src is not provided', async () => {
+        const props = {
+          field: {
+            value: { src: undefined },
+            metadata: testMetadata,
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+        const expected = await renderAstroComponent(DefaultEmptyFieldEditingComponentText);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+
+      test('Should render custom empty value component if provided via props if field src is not provided', async () => {
+        const props = {
+          field: {
+            src: undefined,
+            metadata: testMetadata,
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+          emptyFieldEditingComponent: EmptyFieldEditingComponent,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+        const expected = await renderAstroComponent(EmptyFieldEditingComponent);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+    });
+
+    describe('Link', () => {
+      test('Should render component if field href is provided', async () => {
+        const props = {
+          field: {
+            metadata: testMetadata,
+            href: 'img src',
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+      });
+
+      test('Should render component if field value href is provided', async () => {
+        const props = {
+          field: {
+            metadata: testMetadata,
+            value: { href: 'img src' },
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+
+        expect(rendered.innerHTML).to.equal('<div><h1>hi</h1><h2>foo</h2><p>bar</p></div>');
+      });
+
+      test('Should render provided default empty value component component if field value href is not provided', async () => {
+        const props = {
+          field: {
+            value: { href: undefined },
+            metadata: testMetadata,
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+        const expected = await renderAstroComponent(DefaultEmptyFieldEditingComponentText);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+
+      test('Should render custom empty value component if provided via props if field href is not provided', async () => {
+        const props = {
+          field: {
+            href: undefined,
+            metadata: testMetadata,
+          },
+          defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponentText,
+          emptyFieldEditingComponent: EmptyFieldEditingComponent,
+        };
+
+        const testComponent = (await renderAstroComponent(TestComponent)).innerHTML;
+
+        const rendered = await renderAstroComponent(WithEmptyFieldEditingComponent, {
+          props: props,
+          slots: {
+            default: testComponent,
+          },
+        });
+        const expected = await renderAstroComponent(EmptyFieldEditingComponent);
+
+        expect(rendered.innerHTML).to.equal(expected.innerHTML);
+      });
+    });
+  });
+});

package/src/enhancers/WithFieldMetadata.astro.test.ts

@@ -0,0 +1,113 @@
+import { describe, test, expect } from 'vitest';
+import { renderAstroComponent } from '../tests/astro-helpers';
+import WithFieldMetadata from './WithFieldMetadata.astro';
+import TestComponentWithField from '../tests/test-components/TestComponentWithField.astro';
+
+describe('WithFieldMetadata', () => {
+  const testMetadata = {
+    contextItem: {
+      id: '{09A07660-6834-476C-B93B-584248D3003B}',
+      language: 'en',
+      revision: 'a0b36ce0a7db49418edf90eb9621e145',
+      version: 1,
+    },
+    fieldId: '{414061F4-FBB1-4591-BC37-BFFA67F745EB}',
+    fieldType: 'single-line',
+    rawValue: 'Test1',
+  };
+
+  test('should return component if field is empty', async () => {
+    const props = {
+      editable: true,
+    };
+
+    const testComponent = (await renderAstroComponent(TestComponentWithField, { props: props }))
+      .innerHTML;
+
+    const rendered = await renderAstroComponent(WithFieldMetadata, {
+      props: props,
+      slots: {
+        default: testComponent,
+      },
+    });
+
+    expect(rendered.innerHTML).to.equal('<div><h1></h1><h2>foo</h2><p>bar</p></div>');
+  });
+
+  test('should render unwrapped component if metadata field is not provided', async () => {
+    const props = {
+      field: {
+        value: 'test',
+      },
+      editable: true,
+    };
+
+    const testComponent = (await renderAstroComponent(TestComponentWithField, { props: props }))
+      .innerHTML;
+
+    const rendered = await renderAstroComponent(WithFieldMetadata, {
+      props: props,
+      slots: {
+        default: testComponent,
+      },
+    });
+
+    expect(rendered.innerHTML).to.equal('<div><h1>test</h1><h2>foo</h2><p>bar</p></div>');
+  });
+
+  test('should render unwrapped component if metadata is provided but field is not editable', async () => {
+    const props = {
+      field: {
+        value: 'test',
+        metadata: testMetadata,
+      },
+      editable: false,
+    };
+
+    const testComponent = (await renderAstroComponent(TestComponentWithField, { props: props }))
+      .innerHTML;
+
+    const rendered = await renderAstroComponent(WithFieldMetadata, {
+      props: props,
+      slots: {
+        default: testComponent,
+      },
+    });
+
+    expect(rendered.innerHTML).to.equal('<div><h1>test</h1><h2>foo</h2><p>bar</p></div>');
+  });
+
+  test('should wrap field with provided metadata', async () => {
+    const props = {
+      field: {
+        value: 'car',
+        metadata: testMetadata,
+      },
+      editable: true,
+    };
+
+    const testComponent = (await renderAstroComponent(TestComponentWithField, { props: props }))
+      .innerHTML;
+
+    const rendered = await renderAstroComponent(WithFieldMetadata, {
+      props: props,
+      slots: {
+        default: testComponent,
+      },
+    });
+
+    expect(rendered.innerHTML).to.equal(
+      [
+        `<code type="text/sitecore" chrometype="field" class="scpm" kind="open">${JSON.stringify(
+          testMetadata
+        )}</code>`,
+        '<div>',
+        '<h1>car</h1>',
+        '<h2>foo</h2>',
+        '<p>bar</p>',
+        '</div>',
+        '<code type="text/sitecore" chrometype="field" class="scpm" kind="close"></code>',
+      ].join('')
+    );
+  });
+});

package/src/index.ts

@@ -1,4 +1,10 @@
-export { HTMLLink } from '@sitecore-content-sdk/core';
+export { default as debug } from './debug';
+
+export { initContentSdk } from '@sitecore-content-sdk/core';
+
+export { PageMode, ErrorPage, Page } from '@sitecore-content-sdk/content/client';
+
+export { HTMLLink, StaticPath } from '@sitecore-content-sdk/content';
 
 export {
   Field,
@@ -6,11 +12,8 @@ export {
   ComponentRendering,
   ComponentFields,
   ComponentParams,
-} from '@sitecore-content-sdk/core/layout';
+} from '@sitecore-content-sdk/content/layout';
 
-export {
-  AstroContentSdkComponent,
-  ComponentMap,
-} from './sharedTypes/component-props';
+export { CdpHelper } from '@sitecore-content-sdk/content/personalize';
 
-export { PageMode, ErrorPage, Page } from '@sitecore-content-sdk/core/client';
+export { AstroContentSdkComponent, ComponentMap } from './sharedTypes/component-props';

package/src/middleware/index.ts

@@ -1,19 +1,11 @@
-export { debug } from '@sitecore-content-sdk/core';
-export {
-  MiddlewareBase,
-  MiddlewareBaseConfig,
-  Middleware,
-} from './middleware';
+export { MiddlewareBase, MiddlewareBaseConfig, Middleware } from './middleware';
 export { RobotsMiddleware } from './robots-middleware';
 export { SitemapMiddleware } from './sitemap-middleware';
 export {
   PersonalizeService,
   PersonalizeServiceConfig,
-} from '@sitecore-content-sdk/core/personalize';
-export {
-  MultisiteMiddleware,
-  MultisiteMiddlewareConfig,
-} from './multisite-middleware';
+} from '@sitecore-content-sdk/content/personalize';
+export { MultisiteMiddleware, MultisiteMiddlewareConfig } from './multisite-middleware';
 export {
   RedirectsService,
   RedirectsServiceConfig,
@@ -21,4 +13,4 @@ export {
   REDIRECT_TYPE_302,
   REDIRECT_TYPE_SERVER_TRANSFER,
   RedirectInfo,
-} from '@sitecore-content-sdk/core/site';
+} from '@sitecore-content-sdk/content/site';

package/src/middleware/middleware.test.ts

@@ -343,6 +343,19 @@ describe('MiddlewareBase', () => {
 
       expect(middleware['getHostHeader'](context)).to.equal('bar.net');
     });
+
+    it('should return x-forwarded-host header when present', () => {
+      const middleware = new SampleMiddleware({ sites: [] });
+
+      const context = createContext({
+        headerValues: {
+          'x-forwarded-host': 'proxy.forwarded.com',
+          host: 'localhost:3000',
+        },
+      });
+
+      expect(middleware['getHostHeader'](context)).to.equal('proxy.forwarded.com');
+    });
   });
 
   describe('getLanguage', () => {

package/src/middleware/middleware.ts

@@ -1,15 +1,19 @@
-import { SITE_KEY, SiteInfo, SiteResolver } from '@sitecore-content-sdk/core/site';
+import { SITE_KEY, SiteInfo, SiteResolver } from '@sitecore-content-sdk/content/site';
 import { GraphQLRequestClientFactory } from '@sitecore-content-sdk/core';
 import {
   createGraphQLClientFactory,
   GraphQLClientOptions,
-} from '@sitecore-content-sdk/core/client';
+} from '@sitecore-content-sdk/content/client';
 import { PreviewCookies } from '../editing';
 import { APIContext, MiddlewareHandler, MiddlewareNext } from 'astro';
 import * as cookie from 'cookie';
 
 export const REWRITE_HEADER_NAME = 'x-sc-rewrite';
 
+/**
+ * The interface for the Middleware configuration.
+ * @public
+ */
 export type MiddlewareBaseConfig = {
   /**
    * function, determines if middleware execution should be skipped, based on cookie, header, or other considerations
@@ -34,6 +38,7 @@ export type MiddlewareBaseConfig = {
 
 /**
  * Middleware class to be extended by all middleware implementations
+ * @public
  */
 export abstract class Middleware {
   /**
@@ -45,6 +50,7 @@ export abstract class Middleware {
 
 /**
  * Base middleware class with common methods
+ * @public
  */
 export abstract class MiddlewareBase extends Middleware {
   protected defaultHostname: string;
@@ -105,7 +111,10 @@ export abstract class MiddlewareBase extends Middleware {
    * @param {APIContext} context Astro context
    */
   protected getHostHeader(context: APIContext) {
-    return context.request.headers.get('host')?.split(':')[0];
+    return (
+      context.request.headers.get('x-forwarded-host') ||
+      context.request.headers.get('host')?.split(':')[0]
+    );
   }
 
   /**