diff --git a/src/SliceZone.tsx b/src/SliceZone.tsx index a1c91e8..70b7c9f 100644 --- a/src/SliceZone.tsx +++ b/src/SliceZone.tsx @@ -247,9 +247,11 @@ export type SliceZoneProps = { * This is also the default React component rendered when a component mapping * cannot be found in ``. */ -export const TODOSliceComponent = ({ +export const TODOSliceComponent = ({ slice, -}: SliceComponentProps): JSX.Element | null => { +}: { + slice: TSlice; +}): JSX.Element | null => { if ( typeof process !== "undefined" && process.env.NODE_ENV === "development" @@ -291,7 +293,7 @@ export function SliceZone({ slices = [], components = {}, resolver, - defaultComponent = TODOSliceComponent, + defaultComponent, context = {} as TContext, }: SliceZoneProps) { // TODO: Remove in v3 when the `resolver` prop is removed. @@ -326,20 +328,24 @@ export function SliceZone({ ? slice.id : `${index}-${JSON.stringify(slice)}`; - if (slice.__mapped) { - const { __mapped, ...mappedProps } = slice; - - return ; + if (Comp) { + if (slice.__mapped) { + const { __mapped, ...mappedProps } = slice; + + return ; + } else { + return ( + + ); + } } else { - return ( - - ); + return ; } }); diff --git a/test/SliceZone.test.tsx b/test/SliceZone.test.tsx index 52a9628..0a8daea 100644 --- a/test/SliceZone.test.tsx +++ b/test/SliceZone.test.tsx @@ -133,7 +133,9 @@ it("renders TODO component if component mapping is missing", (ctx) => { ctx.mock.value.slice(), // Testing a GraphQL Slice { type: "baz" }, - ]; + // Testing a mapped Slice + { __mapped: true, id: "4", slice_type: "qux", abc: "123" }, + ] as const; (slices[0] as Slice).slice_type = "foo"; (slices[1] as Slice).slice_type = "bar"; @@ -156,18 +158,9 @@ it("renders TODO component if component mapping is missing", (ctx) => { slices={slices} context={{}} /> - - + + + , ); @@ -180,6 +173,10 @@ it("renders TODO component if component mapping is missing", (ctx) => { expect.stringMatching(/could not find a component/i), slices[2], ); + expect(consoleWarnSpy).toHaveBeenCalledWith( + expect.stringMatching(/could not find a component/i), + slices[3], + ); consoleWarnSpy.mockRestore(); process.env.NODE_ENV = originalNodeEnv;