@sitecore-feaas/clientside 0.3.1 → 0.3.2

package/src/ui/FEAASExternal.tsx

@@ -232,6 +232,14 @@ export default class FEAASExternal extends FEAASElement<FEAASExternalProps, Reac
       props?.src || (typeof window !== 'undefined' ? window.location.search.match(/feaasSrc=([^&]+)/)?.[1] : null)
     return src ? <Component src={src} {...props} /> : null
   }
+
+  static linkComponents(components: Promise<any>[]): () => any {
+    return () => components.map((components) => null)
+  }
+
+  static getComponent(id: string) {
+    return FEAASExternal.registered[id]
+  }
 }
 
 declare global {
@@ -251,4 +259,6 @@ FEAASExternal.register('feaas-external')
 FEAASExternal.setRegistrationCallback()
 
 export const registerComponent = FEAASExternal.registerComponent
+export const linkComponents = FEAASExternal.linkComponents
+export const getComponent = FEAASExternal.getComponent
 export { FEAASExternal as External }

package/src/ui/react.tsx

@@ -10,26 +10,31 @@ import { renderHTMLContent } from '../dom/html.js'
 import { DataSettings } from '../utils/settings.js'
 
 export { renderHTMLContent }
-export { External } from './FEAASExternal.js'
+export { External, linkComponents, registerComponent, getComponent } from './FEAASExternal.js'
 export * from './index.js'
 export * from '../headless.js'
 
+export type FEAASReactComponentProps = FEAASComponentProps & {
+  src?: string
+  preload?: boolean
+  lastModified?: Date | string
+}
 export const ServerComponent = async (props: FEAASComponentProps) => {
   const fetchedData = await DataSettings.fetch(props?.data || {})
 
-  const p = { ...props }
+  const p: FEAASReactComponentProps = { ...props }
 
-  if (('src' in p || 'component' in p) && p?.template == null) {
-    const response = await fetchComponent(p)
+  if (('src' in props || 'component' in props) && props?.template == null) {
+    const response = await fetchComponent(props)
 
     p.template = response.template
-    // p.lastModified = response.lastModified
+    p.lastModified = response.lastModified
   }
 
   return FEAASReactComponent({ ...p, data: fetchedData })
 }
 
-export function FEAASReactComponent({ data, ...props }: FEAASComponentProps & { src?: string; preload?: boolean }) {
+export function FEAASReactComponent({ data, ...props }: FEAASReactComponentProps) {
   let html = ''
   let preload = null
 

package/test/ServerComponent.test.tsx

@@ -18,7 +18,7 @@ describe('React Server', () => {
     document.write()
   })
 
-  it('render server component', async () => {
+  it('render with data settings', async () => {
     vi.spyOn(global, 'fetch').mockImplementation(
       async (url: string, options: Parameters<typeof fetch>[1] = {}) => new Response('{"data": "1"}')
     )
@@ -30,4 +30,15 @@ describe('React Server', () => {
       `<feaas-component library="library" component="test" src="library/test" data="{&quot;data&quot;:&quot;1&quot;}">{"data": "1"}</feaas-component>`
     )
   })
+  it('render with object data', async () => {
+    vi.spyOn(global, 'fetch').mockImplementation(
+      async (url: string, options: Parameters<typeof fetch>[1] = {}) => new Response('Test')
+    )
+
+    const Component = await ServerComponent({ src: 'library/test', data: { data: '2' } })
+    await test(
+      <>{Component}</>,
+      `<feaas-component library="library" component="test" src="library/test" data="{&quot;data&quot;:&quot;2&quot;}">Test</feaas-component>`
+    )
+  })
 })