feat: withSiteContext

packages/next/src/data/server/__tests__/addHookData.ts

@@ -65,6 +65,7 @@ describe('addHookData', () => {
 					pageInfo: { ...samplePageInfo },
 				},
 				isMainQuery: true,
+				hostOrSlug: 'mainsite',
 			},
 			{
 				key: 'second-key',
@@ -74,10 +75,12 @@ describe('addHookData', () => {
 					pageInfo: { ...samplePageInfo },
 				},
 				isMainQuery: false,
+				hostOrSlug: 'site2',
 			},
 		];
 		expect(addHookData(hookStates, {})).toStrictEqual({
 			props: {
+				__headstartwp_site: 'mainsite',
 				fallback: {
 					'first-key': {
 						result: {
@@ -120,6 +123,7 @@ describe('addHookData', () => {
 					pageInfo: samplePageInfo,
 				},
 				isMainQuery: false,
+				hostOrSlug: 'site2',
 			},
 		];
 
@@ -135,6 +139,7 @@ describe('addHookData', () => {
 
 		expect(addHookData(hookStates, {})).toStrictEqual({
 			props: {
+				__headstartwp_site: 'site2',
 				fallback: {
 					'first-key': {
 						queriedObject: {},

packages/next/src/data/server/__tests__/getSiteFromContext.ts

@@ -0,0 +1,26 @@
+import { setHeadstartWPConfig } from '@headstartwp/core';
+import { getSiteFromContext } from '../getSiteFromContext';
+
+describe('getSiteFromContext', () => {
+	it('returns settings if no site is provided', () => {
+		const ctx = { params: { site: 'site2' } };
+		setHeadstartWPConfig({
+			useWordPressPlugin: true,
+			sites: [
+				{
+					slug: 'site1',
+					hostUrl: 'http://site1.localhost:3001',
+					sourceUrl: 'http://sourceUrl1.com',
+					redirectStrategy: '404',
+				},
+				{
+					slug: 'site2',
+					hostUrl: 'http://site2.localhost:3001',
+					sourceUrl: 'http://sourceUrl2.com',
+					redirectStrategy: '404',
+				},
+			],
+		});
+		expect(getSiteFromContext(ctx).slug).toBe('site2');
+	});
+});

packages/next/src/data/server/__tests__/withSiteContext.ts

@@ -0,0 +1,12 @@
+import { withSiteContext } from '../withSiteContext';
+
+describe('withSiteContext', () => {
+	it('adds site to params', () => {
+		expect(withSiteContext({ params: { id: 1 } }, 'site1')).toEqual({
+			params: { id: 1, site: 'site1' },
+		});
+		expect(withSiteContext({ params: { id: 1, site: 'site2' } }, 'site1')).toEqual({
+			params: { id: 1, site: 'site1' },
+		});
+	});
+});

packages/next/src/data/server/getSiteFromContext.ts

@@ -1,4 +1,4 @@
-import { getHeadlessConfig, getSite, getSiteByHost } from '@headstartwp/core';
+import { getHeadstartWPConfig, getSite, getSiteByHost } from '@headstartwp/core';
 import { GetServerSidePropsContext, GetStaticPropsContext } from 'next';
 
 /**
@@ -9,7 +9,7 @@ import { GetServerSidePropsContext, GetStaticPropsContext } from 'next';
  */
 export function getSiteFromContext(ctx: GetServerSidePropsContext | GetStaticPropsContext) {
 	const currentSite = ctx?.params?.site;
-	const settings = getHeadlessConfig();
+	const settings = getHeadstartWPConfig();
 
 	if (currentSite && typeof currentSite === 'string') {
 		const site = getSiteByHost(currentSite);

packages/next/src/data/server/index.ts

@@ -3,3 +3,4 @@ export * from '../convertToPath';
 export * from './fetchHookData';
 export * from './getSiteFromContext';
 export * from './handleError';
+export * from './withSiteContext';

packages/next/src/data/server/withSiteContext.ts

@@ -0,0 +1,15 @@
+import { GetServerSidePropsContext, GetStaticPropsContext } from 'next';
+import { PreviewData } from '../../handlers/types';
+
+export function withSiteContext(
+	ctx: GetServerSidePropsContext<any, PreviewData> | GetStaticPropsContext<any, PreviewData>,
+	site: string,
+) {
+	return {
+		...ctx,
+		params: {
+			...(ctx.params ?? {}),
+			site,
+		},
+	};
+}

projects/wp-multisite-nextjs/src/pages/_sites/site1/index.js

@@ -4,18 +4,20 @@ import {
 	handleError,
 	useAppSettings,
 	usePost,
+	withSiteContext,
 } from '@headstartwp/next';
+import { useSettings } from '@headstartwp/core/react';
 import { indexParams } from '../../../params';
 
 const Site1Homepage = () => {
-	return <div>Site 1 Homepage</div>;
+	const settings = useSettings();
+	return <div>{settings.slug} Homepage</div>;
 };
 
 export default Site1Homepage;
 
-export async function getStaticProps(context) {
-	// TODO: create a utlity function to decorate context for a specific site
-	context.params = { site: 'site1' };
+export async function getStaticProps(_context) {
+	const context = withSiteContext(_context, 'site1');
 
 	let appSettings;
 	let slug;