@treely/strapi-slices 7.15.2 → 7.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@treely/strapi-slices",
-  "version": "7.15.2",
+  "version": "7.16.0",
   "license": "MIT",
   "author": "Tree.ly FlexCo",
   "description": "@treely/strapi-slices is a open source library maintained by Tree.ly.",

package/src/components/SliceRenderer/SliceRenderer.tsx

@@ -42,6 +42,7 @@ import Locale from '../../models/Locale';
 import { ContextProvider } from '../ContextProvider';
 import Timeline from '../../slices/Timeline';
 import Events from '../../slices/Events';
+import Redirect from '../../slices/Redirect';
 import { AnalyticsFunction } from '../ContextProvider/ContextProvider';
 
 export interface CustomSliceProps {
@@ -316,6 +317,10 @@ export const SliceRenderer = ({
           return (
             <Events key={`${slice.__component}-${slice.id}`} slice={slice} />
           );
+        case 'sections.redirect':
+          return (
+            <Redirect key={`${slice.__component}-${slice.id}`} slice={slice} />
+          );
         default:
           if (CustomSlice) {
             return (

package/src/slices/Redirect/Rediect.test.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { render } from '../../test/testUtils';
+import { mergeDeep } from '../../utils/mergeDeep';
+import { redirectSpy } from '../../../__mocks__/next/navigation';
+import Redirect from '.';
+import { RedirectProps } from './Redirect';
+import { RedirectType } from 'next/navigation';
+
+const defaultProps: RedirectProps = {
+  slice: {
+    url: 'https://redirect.com',
+  },
+};
+
+const setup = (props = {}) => {
+  const combinedProps = mergeDeep(defaultProps, props);
+  render(<Redirect {...combinedProps} />);
+};
+
+describe('The Redirect component', () => {
+  afterEach(() => {
+    redirectSpy.mockRestore();
+  });
+
+  it('calls the redirect URL when rendering', () => {
+    setup();
+
+    expect(redirectSpy).toHaveBeenCalledWith(
+      'https://redirect.com',
+      RedirectType.replace
+    );
+  });
+});

package/src/slices/Redirect/Redirect.tsx

@@ -0,0 +1,17 @@
+import React, { useEffect } from 'react';
+import { RedirectType, redirect } from 'next/navigation';
+
+export interface RedirectProps {
+  slice: {
+    url: string;
+  };
+}
+
+export const Redirect = ({ slice }: RedirectProps): JSX.Element => {
+  useEffect(() => {
+    // When using `replace`, the current browser history entry will be replaced
+    redirect(slice.url, RedirectType.replace);
+  }, [slice.url]);
+
+  return <></>;
+};

package/src/slices/Redirect/index.ts

@@ -0,0 +1,3 @@
+import { Redirect } from './Redirect';
+
+export default Redirect;