@websolutespa/bom-next 3.0.0

package/src/lib/meta-data.ts

@@ -0,0 +1,60 @@
+import { ILayout, ILocalized, IPage } from '@websolutespa/bom-core';
+import { ContactPoint, Organization, PostalAddress } from 'schema-dts';
+import { OpenGraphType } from './open-graph';
+import { StructuredDataType } from './structured-data';
+import { TwitterCardType } from './twitter-card';
+
+export type IBrand = {
+  name: string;
+  businessName: string;
+  appName: string;
+  logo: string;
+  url: string;
+  // contact
+  email?: string;
+  telephone?: string;
+  // address
+  address?: string;
+  city?: string;
+  zipCode?: string;
+  provinceCode?: string;
+  countryCode?: string;
+  twitterName?: string;
+  social?: Record<string, string>;
+};
+
+export type IAlternate = {
+  id: string;
+  href: string;
+  hrefLang: string;
+};
+
+export type IMeta = {
+  title: string;
+  description?: string;
+  image: string;
+  slug: string;
+  url: string;
+  canonical: string;
+  alternates: IAlternate[];
+  xDefault?: IAlternate;
+  keywords?: string;
+  robots?: string;
+  /*
+  relPrev?: string;
+  relNext?: string;
+  */
+};
+
+export type IMetaData = {
+  layout: ILayout;
+  page: ILocalized<IPage>;
+  brand: IBrand;
+  contactPoint: ContactPoint;
+  meta: IMeta;
+  openGraph: OpenGraphType;
+  organization: Organization;
+  postalAddress: PostalAddress;
+  structuredData: StructuredDataType;
+  twitterCard?: TwitterCardType;
+};

package/src/lib/open-graph.ts

@@ -0,0 +1,165 @@
+// Open Graph Types
+
+export interface OpenGraphBase {
+  type: string;
+  title?: string;
+  image?: string | OpenGraphImage | OpenGraphImage[];
+  url?: string;
+  description?: string;
+  siteName?: string;
+  locale?: string;
+  localeAlternate?: string[];
+}
+
+export interface OpenGraphImage {
+  url: string;
+  secureUrl?: string;
+  type?: string;
+  width?: number;
+  height?: number;
+  alt?: string;
+}
+
+export interface OpenGraphAudio {
+  url: string;
+  secureUrl?: string;
+  type?: string;
+}
+
+export interface OpenGraphWebsite extends OpenGraphBase {
+  type: 'website';
+}
+
+export interface OpenGraphArticle extends OpenGraphBase {
+  type: 'article';
+  publishedTime?: string;
+  modifiedTime?: string;
+  expirationTime?: string;
+  author?: string | string[];
+  section?: string;
+  tag?: string | string[];
+}
+
+export interface OpenGraphBook extends OpenGraphBase {
+  type: 'book';
+  author?: string | string[];
+  isbn?: string;
+  releaseDate?: string;
+  tag?: string | string[];
+}
+
+export interface OpenGraphProfile extends OpenGraphBase {
+  type: 'profile';
+  firstName?: string;
+  lastName?: string;
+  username?: string;
+  gender?: string;
+}
+
+export interface OpenGraphMusic extends OpenGraphBase {
+  type: 'music.song' | 'music.album' | 'music.playlist' | 'music.radio_station';
+  duration?: number;
+  album?: string | string[];
+  musician?: string | string[];
+  song?: string | string[];
+  creator?: string;
+}
+
+export interface OpenGraphVideo extends Omit<OpenGraphBase, 'type'> {
+  type: 'video.movie' | 'video.episode' | 'video.tv_show' | 'video.other';
+  actor?: string | string[];
+  director?: string | string[];
+  writer?: string | string[];
+  duration?: number;
+  releaseDate?: string;
+  tag?: string | string[];
+  series?: string;
+  url: string;
+  secureUrl?: string;
+  width?: number;
+  height?: number;
+}
+
+export interface OpenGraphProduct extends OpenGraphBase {
+  type: 'product';
+  price?: {
+    amount: number;
+    currency: string;
+  };
+  availability?: 'instock' | 'oos' | 'pending';
+  condition?: 'new' | 'refurbished' | 'used';
+  priceAmount?: number;
+  priceCurrency?: string;
+  retailerItemId?: string;
+  brand?: string;
+  category?: string;
+  color?: string;
+  material?: string;
+  pattern?: string;
+  size?: string;
+}
+
+export interface OpenGraphProductGroup extends OpenGraphBase {
+  type: 'product.group';
+}
+
+export interface OpenGraphPlace extends OpenGraphBase {
+  type: 'place';
+  latitude?: number;
+  longitude?: number;
+  streetAddress?: string;
+  locality?: string;
+  region?: string;
+  postalCode?: string;
+  countryName?: string;
+}
+
+export interface OpenGraphRestaurant extends Omit<OpenGraphPlace, 'type'> {
+  type: 'restaurant.restaurant';
+  contactData?: {
+    streetAddress?: string;
+    locality?: string;
+    region?: string;
+    postalCode?: string;
+    countryName?: string;
+    email?: string;
+    phoneNumber?: string;
+    faxNumber?: string;
+  };
+  menu?: string;
+  section?: string;
+  priceRange?: string;
+}
+
+export interface OpenGraphBusiness extends OpenGraphBase {
+  type: 'business.business';
+  contactData?: {
+    streetAddress?: string;
+    locality?: string;
+    region?: string;
+    postalCode?: string;
+    countryName?: string;
+    email?: string;
+    phoneNumber?: string;
+    faxNumber?: string;
+    website?: string;
+  };
+  hours?: {
+    day: string;
+    start: string;
+    end: string;
+  }[];
+}
+
+export type OpenGraphType =
+  | OpenGraphArticle
+  | OpenGraphBook
+  | OpenGraphBusiness
+  | OpenGraphMusic
+  | OpenGraphPlace
+  | OpenGraphProduct
+  | OpenGraphProductGroup
+  | OpenGraphProfile
+  | OpenGraphRestaurant
+  | OpenGraphVideo
+  | OpenGraphWebsite;

package/src/lib/pagination.ts

@@ -0,0 +1,78 @@
+import { isArray, isObject } from '@websolutespa/bom-core';
+
+export type IPaginationItem = any;
+
+export type IPaginationOptions = {
+  mode?: 'pagination' | 'infinite'; // default to pagination
+  page?: number;
+  perPage?: number;
+  delayInMs?: number;
+};
+
+export type IPaginationInfo<T extends IPaginationItem = IPaginationItem> = {
+  items: T[];
+  hasMore: boolean;
+  nextPage: number | undefined;
+  page: number;
+  pages: number;
+  perPage: number;
+  prevPage: number | undefined;
+  total: number;
+};
+
+export function isPaginationInfo(item: unknown): item is IPaginationInfo {
+  return isObject(item) && (
+    typeof item.page === 'number' &&
+    typeof item.pages === 'number' &&
+    typeof item.perPage === 'number' &&
+    typeof item.total === 'number' &&
+    isArray(item.items)
+  );
+}
+
+export function getPagedItems<T extends IPaginationItem = IPaginationItem>(
+  items: T[],
+  page: number,
+  perPage: number
+): T[] {
+  const from = (page - 1) * perPage;
+  const to = Math.min(page * perPage, items.length);
+  return items.slice(from, to);
+}
+
+export function getMoreItems<T extends IPaginationItem = IPaginationItem>(
+  items: T[],
+  page: number,
+  perPage: number
+): T[] {
+  const total = items.length;
+  const position = Math.min(total, perPage * page);
+  return items.slice(0, position);
+}
+
+export function getPaginationInfo<T extends IPaginationItem = IPaginationItem>(
+  items: T[],
+  options?: IPaginationOptions
+): IPaginationInfo<T> {
+  const mode = options?.mode || 'pagination';
+  const page = options?.page || 1;
+  const perPage = options?.perPage || 12;
+  const total = items.length;
+  const pages = Math.ceil(total / perPage);
+  const hasMore = page < pages;
+  const prevPage = page > 1 ? page - 1 : undefined;
+  const nextPage = page < pages ? page + 1 : undefined;
+  const pagedItems = mode === 'pagination' ?
+    getPagedItems(items, page, perPage) :
+    getMoreItems(items, page, perPage);
+  return {
+    items: pagedItems,
+    hasMore,
+    nextPage,
+    page,
+    pages,
+    perPage,
+    prevPage,
+    total,
+  };
+}

package/src/lib/payload.config.ts

@@ -0,0 +1,12 @@
+import { bowl } from '@websolutespa/payload-plugin-bowl';
+import { Config } from 'payload';
+
+export const config: Partial<Config> = {
+  collections: [],
+  globals: [],
+  plugins: [
+    bowl({
+      defaultMarket: 'ww',
+    }),
+  ],
+};

package/src/lib/route.ts

@@ -0,0 +1,83 @@
+import { asCategoryId, findRouteOfCategory, ICategory, IRoute, IRouteLink, localize } from '@websolutespa/bom-core';
+
+export function getRouteLinkCategory(
+  locale: string,
+  routes: IRoute[],
+  categories: ICategory[],
+  rootCategory: ICategory,
+  category: ICategory
+): IRouteLink | IRouteLink[] | undefined {
+  const route = findRouteOfCategory(routes, category.id);
+  const otherCategories = categories.filter(x => x.id !== category.id);
+  const childCategories = otherCategories.filter(x => asCategoryId(x.category) === category.id);
+  // console.log('childCategories', category.id, childCategories.map(x => x.id));
+  const routeLink = newRouteLink(category, route, locale);
+  // console.log('getRouteLinkCategory', href, category.id, route);
+  const items: IRouteLink[] = [];
+  for (const childCategory of childCategories) {
+    const itemOrItems = getRouteLinkCategory(locale, routes, otherCategories, rootCategory, childCategory);
+    if (Array.isArray(itemOrItems)) {
+      items.push(...itemOrItems);
+    } else if (itemOrItems) {
+      items.push(itemOrItems);
+    }
+  }
+  if (
+    !route ||
+    (category.isHidden && category.id !== rootCategory.id)
+  ) {
+    return items;
+  }
+  routeLink.items = items;
+  return routeLink;
+}
+
+export function newRouteLink(category: ICategory, route: IRoute | undefined, locale: string): IRouteLink {
+  const href = (route && route.id) ? route.id.toString() : '/';
+  const id = route?.page || category.id;
+  const media = category.media || route?.media;
+  const schema = route?.template || route?.schema || category?.schema || 'unknown';
+  const title = localize(category.title || route?.title || 'untitled', locale);
+  const routeLink = {
+    category: category.id,
+    href,
+    id,
+    items: [],
+    media,
+    schema,
+    title,
+  };
+  return routeLink;
+}
+
+export function resolveRoute(route: IRoute) {
+  return `/${route.market}/${route.locale}/${route.schema}/${route.page}`;
+}
+
+export function routeToRouteLink(route: IRoute): IRouteLink {
+  const routeLink: IRouteLink = {
+    category: asCategoryId(route.category),
+    href: route.id,
+    id: route.page,
+    items: [],
+    media: route.media,
+    schema: route.schema,
+    title: route.title,
+  };
+  return routeLink;
+}
+
+/**
+ * Converts a route (and optional override title) into an IRouteLink.
+ * route.id is the pathname (href), route.page is the document ID.
+ */
+export function routeToLink(route: IRoute, title?: string): IRouteLink {
+  return {
+    category: route.category,
+    href: route.id,
+    id: route.page,
+    schema: route.schema,
+    title: title ?? route.title,
+    media: route.media,
+  };
+}

package/src/lib/store.ts

@@ -0,0 +1,63 @@
+export enum NextPhase {
+  Export = 'phase-export',
+  ProductionBuild = 'phase-production-build',
+  ProductionServer = 'phase-production-server',
+  DevelopmentServer = 'phase-development-server',
+  Test = 'phase-test',
+}
+
+function getNextPhase(): NextPhase {
+  let nextPhase = NextPhase.Export;
+  if (typeof process !== 'undefined' && process.env.NEXT_PHASE) {
+    nextPhase = process.env.NEXT_PHASE as NextPhase;
+  }
+  return nextPhase;
+}
+
+export const nextPhase: NextPhase = getNextPhase();
+
+// buildStrategy
+export enum BuildStrategy {
+  Static = 'static',
+  Runtime = 'runtime',
+}
+
+function getBuildStrategy(): BuildStrategy {
+  let buildStrategy = BuildStrategy.Static;
+  if (typeof process !== 'undefined' && process.env.BUILD_STRATEGY) {
+    buildStrategy = process.env.BUILD_STRATEGY as BuildStrategy;
+  }
+  return buildStrategy;
+}
+
+export const buildStrategy: BuildStrategy = getBuildStrategy();
+
+// storeStrategy
+export enum StoreStrategy {
+  Local = 'local',
+  Api = 'api',
+  DecoratedApi = 'decoratedApi',
+  Data = 'data',
+  Mock = 'mock',
+}
+
+function getStoreStrategy(): StoreStrategy {
+  let storeStrategy = StoreStrategy.Mock;
+  if (typeof process !== 'undefined' && process.env.STORE_STRATEGY) {
+    storeStrategy = process.env.STORE_STRATEGY as StoreStrategy;
+  }
+  return storeStrategy;
+}
+
+export const storeStrategy: StoreStrategy = getStoreStrategy();
+
+// storeCacheDuration
+function getStoreCacheDuration(): number {
+  let storeCacheDuration = (1 * 60 * 1000);
+  if (typeof process !== 'undefined' && process.env.STORE_CACHE_DURATION) {
+    storeCacheDuration = parseInt(process.env.STORE_CACHE_DURATION);
+  }
+  return storeCacheDuration;
+}
+
+export const storeCacheDuration: number = getStoreCacheDuration();

package/src/lib/structured-data.ts

@@ -0,0 +1,24 @@
+import * as StructuredData from 'schema-dts';
+
+export type StructuredDataType =
+  | StructuredData.Article
+  | StructuredData.AudioObject
+  | StructuredData.BlogPosting
+  | StructuredData.BreadcrumbList
+  | StructuredData.Course
+  | StructuredData.Event
+  | StructuredData.FAQPage
+  | StructuredData.HowTo
+  | StructuredData.ItemList
+  | StructuredData.JobPosting
+  | StructuredData.ListItem
+  | StructuredData.LocalBusiness
+  | StructuredData.NewsArticle
+  | StructuredData.Organization
+  | StructuredData.Person
+  | StructuredData.Place
+  | StructuredData.Product
+  | StructuredData.Recipe
+  | StructuredData.VideoObject
+  | StructuredData.WebPage
+  | StructuredData.WebSite;

package/src/lib/twitter-card.ts

@@ -0,0 +1,49 @@
+// Twitter Card Types
+
+export interface TwitterCardBase {
+  card: 'summary' | 'summary_large_image' | 'app' | 'player';
+  site?: string;
+  siteId?: string;
+  creator?: string;
+  creatorId?: string;
+  title?: string;
+  description?: string;
+  image?: string;
+  imageAlt?: string;
+}
+
+export interface TwitterCardSummary extends TwitterCardBase {
+  card: 'summary';
+}
+
+export interface TwitterCardSummaryLargeImage extends TwitterCardBase {
+  card: 'summary_large_image';
+}
+
+export interface TwitterCardApp extends TwitterCardBase {
+  card: 'app';
+  appNameIphone?: string;
+  appIdIphone?: string;
+  appUrlIphone?: string;
+  appNameIpad?: string;
+  appIdIpad?: string;
+  appUrlIpad?: string;
+  appNameGoogleplay?: string;
+  appIdGoogleplay?: string;
+  appUrlGoogleplay?: string;
+  appCountry?: string;
+}
+
+export interface TwitterCardPlayer extends TwitterCardBase {
+  card: 'player';
+  player: string;
+  playerWidth: number;
+  playerHeight: number;
+  playerStream?: string;
+}
+
+export type TwitterCardType =
+  | TwitterCardApp
+  | TwitterCardPlayer
+  | TwitterCardSummary
+  | TwitterCardSummaryLargeImage;

package/src/lib/utils.ts

@@ -0,0 +1,45 @@
+
+export function getPublicUrl() {
+  const publicUrl = process.env && process.env.NEXT_PUBLIC_URL ? process.env.NEXT_PUBLIC_URL : '';
+  return publicUrl;
+}
+
+export function resolveHref(href: string = '') {
+  return href.startsWith('http') ? href : `${getPublicUrl()}${href}`;
+}
+
+export function trimTerminalSlash(path: string) {
+  return path.replace(/\/+$/, '');
+}
+
+export function sanitizeHref(url: URL, urlBeforeRedirect: URL | null) {
+  if (urlBeforeRedirect) {
+    const sanitizedUrl = new URL(urlBeforeRedirect);
+    sanitizedUrl.protocol = url.protocol;
+    return trimTerminalSlash(sanitizedUrl.href);
+  } else {
+    return trimTerminalSlash(url.href);
+  }
+}
+
+export function sanitizeRedirectFrom(path: string, url: URL, urlBeforeRedirect: URL | null) {
+  path = trimTerminalSlash(path);
+  if (urlBeforeRedirect) {
+    return path.replace(/^(\^?)((https?:\/\/)+)/, `$1${url.protocol}//`);
+  } else {
+    return path.replace(/^(\^?)((https?:\/\/)+(\w|\.|:)+)/, `$1${url.origin}`);
+  }
+}
+
+export function sanitizeRedirectTo(path?: string) {
+  return path ? trimTerminalSlash(path) : undefined;
+}
+
+export function sanitizeRedirectUrl(path: string | undefined, url: URL) {
+  if (path != null) {
+    path = trimTerminalSlash(path);
+    return path.match(/^((https?:\/\/)+)/) ? path : `${url.origin}${path}`;
+  } else {
+    return path;
+  }
+}