Merge pull request #687 from searchspring/develop

Release v0.38.1

docs/generateFeed.js

@@ -122,11 +122,17 @@ const OUTPUT_FILE = 'snap-docs.json';
 		const links = paths.map((path) => {
 			const packagePath = path.split('/snap/packages/')[1];
 			// const [libraryDir, _, directory, type, componentName, markdownFile] = packagePath.split('/');
-
 			const [libraryDir, _, grouping, ...remainingPaths] = packagePath.split('/');
-			const [markdownFile, componentName, type] = remainingPaths.reverse();
+			const [markdownFile, componentName, next, extra] = remainingPaths.reverse();
 			// grouping = components / documentation / hooks
 			// type = atom / molecule / organism or About / Theme / Usage
+			let type;
+			//if a component is nested inside an additional directory we need to grab the type from extra
+			if (extra) {
+				type = extra;
+			} else {
+				type = next;
+			}
 
 			const lang = libraryDir.split('-')[1];
 			const route = libraryDir.split('-').reverse().slice(0, 2).join('-'); //.includes('snap-preact-components') ? 'components-preact' : ''; // TODO: refactor once more options

packages/snap-controller/src/Search/SearchController.ts

@@ -272,9 +272,15 @@ export class SearchController extends AbstractController {
 				let previousResults = this.previousResults;
 				const backfills = [];
 
+				let pageSize = params.pagination?.pageSize || this.store.pagination.pageSize || this.store.pagination.defaultPageSize;
 				if (this.config.settings?.infinite.backfill && !previousResults.length) {
 					// figure out how many pages of results to backfill and wait on all responses
-					const pageSize = params.pagination?.pageSize || this.store.pagination.pageSize || this.store.pagination.defaultPageSize;
+					if (!pageSize) {
+						//unfortunatly we need to fetch meta to know the default pagesize before we can continue.
+						const meta = await this.client.meta();
+						pageSize = meta.pagination?.defaultPageSize!;
+					}
+
 					let pagesNeeded1 =
 						params.pagination?.page && params.pagination?.page > this.config.settings?.infinite.backfill
 							? this.config.settings?.infinite.backfill
@@ -327,7 +333,8 @@ export class SearchController extends AbstractController {
 					}
 
 					//we need to overwrite the pagination params so the ui doesnt get confused.
-					response.pagination.pageSize = params.pagination?.pageSize || this.store.pagination.pageSize || this.store.pagination.defaultPageSize;
+					response.pagination.pageSize = pageSize;
+					response.pagination.totalPages = Math.ceil(response.pagination.totalResults / response.pagination.pageSize);
 					response.pagination.page = params.pagination?.page;
 
 					//set the response results after all backfill promises are resolved.
@@ -386,6 +393,7 @@ export class SearchController extends AbstractController {
 			afterSearchProfile.stop();
 			this.log.profile(afterSearchProfile);
 
+			// store previous results for infinite usage
 			if (this.config.settings?.infinite) {
 				this.previousResults = JSON.parse(JSON.stringify(response.results));
 			}

packages/snap-preact-components/src/components/Atoms/Merchandising/Banner.stories.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/Banner/Banner.stories.tsx

@@ -3,9 +3,9 @@ import { h } from 'preact';
 import { ArgsTable, PRIMARY_STORY } from '@storybook/addon-docs/blocks';
 
 import { Banner, BannerProps } from './Banner';
-import { componentArgs } from '../../../utilities';
-import { Snapify } from '../../../utilities/snapify';
-import Readme from '../Merchandising/readme.md';
+import { componentArgs } from '../../../../utilities';
+import { Snapify } from '../../../../utilities/snapify';
+import Readme from './readme.md';
 import { SearchController } from '@searchspring/snap-controller';
 
 export default {

packages/snap-preact-components/src/components/Atoms/Merchandising/Banner.test.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/Banner/Banner.test.tsx

@@ -4,7 +4,7 @@ import { render } from '@testing-library/preact';
 
 import { Banner } from './Banner';
 import { ContentType } from '@searchspring/snap-store-mobx';
-import { ThemeProvider } from '../../../providers';
+import { ThemeProvider } from '../../../../providers';
 
 import { MockData } from '@searchspring/snap-shared';
 import { SearchResponseModel } from '@searchspring/snapi-types';

packages/snap-preact-components/src/components/Atoms/Merchandising/Banner.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/Banner/Banner.tsx

@@ -4,8 +4,8 @@ import { Fragment, h } from 'preact';
 import { jsx, css } from '@emotion/react';
 import classnames from 'classnames';
 
-import { ComponentProps, StylingCSS } from '../../../types';
-import { Theme, useTheme, CacheProvider } from '../../../providers';
+import { ComponentProps, StylingCSS } from '../../../../types';
+import { Theme, useTheme, CacheProvider } from '../../../../providers';
 import { BannerContent, ContentType } from '@searchspring/snap-store-mobx';
 
 const CSS = {

packages/snap-preact-components/src/components/Atoms/Merchandising/Banner/index.ts

@@ -0,0 +1 @@
+export * from './Banner';

packages/snap-preact-components/src/components/Atoms/Merchandising/Banner/readme.md

@@ -0,0 +1,35 @@
+# Banner
+
+Renders a merchandising banner. Banner Types include `header`, `footer`, `left`, and `banner`. 
+
+This `Banner` component does not support inline banners. See `InlineBanner` component below.
+
+## Usage
+
+### content
+The required `content` prop specifies an object of banners returned from the Searchspring API.
+
+```jsx
+<Banner content={controller?.store?.merchandising?.content} type={'header'} />
+```
+
+### type
+The required `type` prop specifies the banner type to render from the `content` object.
+
+Banner Types include `header`, `footer`, `left`, and `banner`. 
+
+```jsx
+<Banner content={controller?.store?.merchandising?.content} type={'header'} />
+```
+
+```jsx
+<Banner content={controller?.store?.merchandising?.content} type={'footer'} />
+```
+
+```jsx
+<Banner content={controller?.store?.merchandising?.content} type={'left'} />
+```
+
+```jsx
+<Banner content={controller?.store?.merchandising?.content} type={'banner'} />
+```

packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner.stories.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner/InlineBanner.stories.tsx

@@ -3,10 +3,10 @@ import { h } from 'preact';
 import { ArgsTable, PRIMARY_STORY } from '@storybook/addon-docs/blocks';
 
 import { InlineBanner, InlineBannerProps } from './InlineBanner';
-import { componentArgs } from '../../../utilities';
-import { Snapify } from '../../../utilities/snapify';
-import Readme from '../Merchandising/readme.md';
-import { Layout } from '../../../types';
+import { componentArgs } from '../../../../utilities';
+import { Snapify } from '../../../../utilities/snapify';
+import Readme from './readme.md';
+import { Layout } from '../../../../types';
 
 import type { Banner } from '@searchspring/snap-store-mobx';
 import type { SearchController } from '@searchspring/snap-controller';

packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner.test.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner/InlineBanner.test.tsx

@@ -4,7 +4,7 @@ import { render } from '@testing-library/preact';
 import userEvent from '@testing-library/user-event';
 
 import { InlineBanner } from './InlineBanner';
-import { ThemeProvider } from '../../../providers';
+import { ThemeProvider } from '../../../../providers';
 import type { Banner } from '@searchspring/snap-store-mobx';
 
 import { MockData } from '@searchspring/snap-shared';

packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner.tsx → packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner/InlineBanner.tsx

@@ -3,8 +3,8 @@ import { Fragment, h } from 'preact';
 
 import { jsx, css } from '@emotion/react';
 import classnames from 'classnames';
-import { Theme, useTheme, CacheProvider } from '../../../providers';
-import { ComponentProps, Layout, LayoutType, StylingCSS } from '../../../types';
+import { Theme, useTheme, CacheProvider } from '../../../../providers';
+import { ComponentProps, Layout, LayoutType, StylingCSS } from '../../../../types';
 
 import type { Banner } from '@searchspring/snap-store-mobx';
 

packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner/index.ts

@@ -0,0 +1 @@
+export * from './InlineBanner';

packages/snap-preact-components/src/components/Atoms/Merchandising/readme.md → packages/snap-preact-components/src/components/Atoms/Merchandising/InlineBanner/readme.md

@@ -1,39 +1,3 @@
-# Banner
-
-Renders a merchandising banner. Banner Types include `header`, `footer`, `left`, and `banner`. 
-
-This `Banner` component does not support inline banners. See `InlineBanner` component below.
-
-## Usage
-
-### content
-The required `content` prop specifies an object of banners returned from the Searchspring API.
-
-```jsx
-<Banner content={controller?.store?.merchandising?.content} type={'header'} />
-```
-
-### type
-The required `type` prop specifies the banner type to render from the `content` object.
-
-Banner Types include `header`, `footer`, `left`, and `banner`. 
-
-```jsx
-<Banner content={controller?.store?.merchandising?.content} type={'header'} />
-```
-
-```jsx
-<Banner content={controller?.store?.merchandising?.content} type={'footer'} />
-```
-
-```jsx
-<Banner content={controller?.store?.merchandising?.content} type={'left'} />
-```
-
-```jsx
-<Banner content={controller?.store?.merchandising?.content} type={'banner'} />
-```
-
 # Inline Banner
 
 ## Usage

packages/snap-preact-demo/tests/cypress/integration/tracking/track.spec.js

@@ -28,7 +28,7 @@ describe('Tracking', () => {
 			const beacon = interception.request.body.filter((event) => event.type === BeaconType.LOGIN)[0];
 			expect(beacon.category).to.equal(BeaconCategory.PERSONALIZATION);
 			expect(beacon.type).to.equal(BeaconType.LOGIN);
-			expect(beacon.event).to.be.an('object');
+			expect(beacon.event).to.be.an('object').include.key('shopperId').include.key('userId');
 			expect(beacon.context).to.be.an('object').include.key('shopperId');
 
 			cy.window().then((window) => {
@@ -44,7 +44,7 @@ describe('Tracking', () => {
 			const beacon = interception.request.body.filter((event) => event.type === BeaconType.LOGIN)[0];
 			expect(beacon.category).to.equal(BeaconCategory.PERSONALIZATION);
 			expect(beacon.type).to.equal(BeaconType.LOGIN);
-			expect(beacon.event).to.be.an('object');
+			expect(beacon.event).to.be.an('object').include.key('shopperId').include.key('userId');
 			expect(beacon.context).to.be.an('object').include.key('shopperId');
 			expect(beacon.context.shopperId).to.equal(shopperId);
 		});

packages/snap-store-mobx/src/Search/Stores/SearchPaginationStore.ts

@@ -34,7 +34,7 @@ export class SearchPaginationStore {
 		this.page = paginationData.page!;
 		this.pageSize = paginationData.pageSize!;
 		this.totalResults = paginationData.totalResults!;
-		this.defaultPageSize = meta?.pagination?.defaultPageSize! || 24;
+		this.defaultPageSize = meta?.pagination?.defaultPageSize!;
 		this.totalPages = paginationData.totalPages!;
 
 		this.pageSizeOptions = [

packages/snap-tracker/src/Tracker.test.ts

@@ -692,18 +692,23 @@ describe('Tracker', () => {
 		const payload = { id: shopperId };
 		await tracker.track.shopper.login(payload, siteId);
 
+		const trackerContext = tracker.getContext();
+
 		expect(trackEvent).toHaveBeenCalledWith({
 			type: BeaconType.LOGIN,
 			category: BeaconCategory.PERSONALIZATION,
-			// @ts-ignore - private property access
-			context: deepmerge(tracker.context, {
+
+			context: deepmerge(trackerContext, {
 				context: {
 					website: {
 						trackingCode: siteId,
 					},
 				},
 			}),
-			event: {},
+			event: {
+				shopperId,
+				userId: trackerContext.userId,
+			},
 		});
 		expect(shopperLogin).toHaveBeenCalledWith(payload, siteId);
 

packages/snap-tracker/src/Tracker.ts

@@ -305,7 +305,10 @@ export class Tracker {
 						type: BeaconType.LOGIN,
 						category: BeaconCategory.PERSONALIZATION,
 						context,
-						event: {},
+						event: {
+							userId: this.context.userId,
+							shopperId: data.id,
+						},
 					};
 					return this.track.event(payload);
 				}