@prezly/theme-kit-nextjs 1.8.0 → 1.9.2-0

package/src/adapter-nextjs/page-props/category.ts

@@ -0,0 +1,74 @@
+import type { ExtraStoryFields, Story } from '@prezly/sdk';
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { DEFAULT_PAGE_SIZE } from '../../data-fetching';
+import type { PaginationProps } from '../../infinite-loading/types';
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export interface CategoryPageProps<StoryType extends Story = Story> {
+    stories: StoryType[];
+    pagination: PaginationProps;
+}
+
+interface Options {
+    storiesIncludeFields?: (keyof ExtraStoryFields)[];
+    pageSize?: number;
+}
+
+export function getCategoryPageServerSideProps<
+    CustomProps extends Record<string, any>,
+    StoryType extends Story = Story,
+>(customProps: CustomProps | PropsFunction<CustomProps>, options?: Options) {
+    const { pageSize = DEFAULT_PAGE_SIZE, storiesIncludeFields } = options || {};
+
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<CategoryPageProps<StoryType> & CustomProps>> {
+        const { api, serverSideProps } = await getNewsroomServerSideProps(context);
+
+        const { slug } = context.params as { slug: string };
+        const category = await api.getCategoryBySlug(slug);
+
+        if (!category) {
+            return {
+                notFound: true,
+            };
+        }
+
+        const { query } = context;
+        const page = query.page && typeof query.page === 'string' ? Number(query.page) : undefined;
+
+        const { localeCode } = serverSideProps.newsroomContextProps;
+
+        const { stories, storiesTotal } = await api.getStoriesFromCategory(category, {
+            page,
+            include: storiesIncludeFields,
+            localeCode,
+        });
+
+        return processRequest(
+            context,
+            {
+                ...serverSideProps,
+                newsroomContextProps: {
+                    ...serverSideProps.newsroomContextProps,
+                    currentCategory: category,
+                },
+                // TODO: This is temporary until return types from API are figured out
+                stories: stories as StoryType[],
+                pagination: {
+                    itemsTotal: storiesTotal,
+                    currentPage: page ?? 1,
+                    pageSize,
+                },
+                ...(typeof customProps === 'function'
+                    ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                    : customProps),
+            },
+            `/category/${slug}`,
+        );
+    };
+}

package/src/adapter-nextjs/page-props/gallery.ts

@@ -0,0 +1,64 @@
+import type { NewsroomGallery } from '@prezly/sdk';
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { DEFAULT_GALLERY_PAGE_SIZE } from '../../data-fetching';
+import type { PaginationProps } from '../../infinite-loading/types';
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export interface GalleryPageProps {
+    galleries: NewsroomGallery[];
+    pagination: PaginationProps;
+}
+
+interface Options {
+    pageSize?: number;
+}
+
+export function getGalleryPageServerSideProps<CustomProps extends Record<string, any>>(
+    customProps: CustomProps | PropsFunction<CustomProps>,
+    options?: Options,
+) {
+    const { pageSize = DEFAULT_GALLERY_PAGE_SIZE } = options || {};
+
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<GalleryPageProps & CustomProps>> {
+        const { api, serverSideProps } = await getNewsroomServerSideProps(context);
+        const { query } = context;
+
+        const page = query.page && typeof query.page === 'string' ? Number(query.page) : undefined;
+        const { galleries, pagination } = await api.getGalleries({ page, pageSize });
+
+        // If there's only one gallery, redirect to it immediately
+        if (galleries.length === 1) {
+            const { uuid } = galleries[0];
+
+            return {
+                redirect: {
+                    destination: `/media/album/${uuid}`,
+                    permanent: false,
+                },
+            };
+        }
+
+        return processRequest(
+            context,
+            {
+                ...serverSideProps,
+                galleries,
+                pagination: {
+                    itemsTotal: pagination.matched_records_number,
+                    currentPage: page ?? 1,
+                    pageSize,
+                },
+                ...(typeof customProps === 'function'
+                    ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                    : customProps),
+            },
+            '/media',
+        );
+    };
+}

package/src/adapter-nextjs/page-props/galleryAlbum.ts

@@ -0,0 +1,40 @@
+import type { NewsroomGallery } from '@prezly/sdk';
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export interface GalleryAlbumPageProps {
+    gallery: NewsroomGallery;
+}
+
+export function getGalleryAlbumPageServerSideProps<CustomProps extends Record<string, any>>(
+    customProps: CustomProps | PropsFunction<CustomProps>,
+) {
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<GalleryAlbumPageProps & CustomProps>> {
+        const { api, serverSideProps } = await getNewsroomServerSideProps(context);
+
+        const { uuid } = context.params as { uuid: string };
+        const gallery = await api.getGallery(uuid);
+
+        if (!gallery || !gallery.images_number) {
+            return { notFound: true };
+        }
+
+        return processRequest(
+            context,
+            {
+                ...serverSideProps,
+                gallery,
+                ...(typeof customProps === 'function'
+                    ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                    : customProps),
+            },
+            `/media/album/${uuid}`,
+        );
+    };
+}

package/src/adapter-nextjs/page-props/home.ts

@@ -0,0 +1,64 @@
+import type { ExtraStoryFields, Story } from '@prezly/sdk';
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { DEFAULT_PAGE_SIZE } from '../../data-fetching';
+import type { PaginationProps } from '../../infinite-loading/types';
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export interface HomePageProps<StoryType extends Story = Story> {
+    stories: StoryType[];
+    pagination: PaginationProps;
+}
+
+interface Options {
+    storiesIncludeFields?: (keyof ExtraStoryFields)[];
+    pageSize?: number;
+}
+
+export function getHomepageServerSideProps<
+    CustomProps extends Record<string, any>,
+    StoryType extends Story = Story,
+>(customProps: CustomProps | PropsFunction<CustomProps>, options?: Options) {
+    const { pageSize = DEFAULT_PAGE_SIZE, storiesIncludeFields } = options || {};
+
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<HomePageProps<StoryType> & CustomProps>> {
+        const { api, serverSideProps } = await getNewsroomServerSideProps(context, {
+            loadHomepageContacts: true,
+        });
+
+        const { query } = context;
+        const page = query.page && typeof query.page === 'string' ? Number(query.page) : undefined;
+
+        const { localeCode } = serverSideProps.newsroomContextProps;
+
+        const storiesPaginated = await api.getStories({
+            page,
+            include: storiesIncludeFields,
+            localeCode,
+        });
+        const { stories, storiesTotal } = storiesPaginated;
+
+        return processRequest(
+            context,
+            {
+                ...serverSideProps,
+                // TODO: This is temporary until return types from API are figured out
+                stories: stories as StoryType[],
+                pagination: {
+                    itemsTotal: storiesTotal,
+                    currentPage: page ?? 1,
+                    pageSize,
+                },
+                ...(typeof customProps === 'function'
+                    ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                    : customProps),
+            },
+            '/',
+        );
+    };
+}

package/src/adapter-nextjs/page-props/index.ts

@@ -0,0 +1,6 @@
+export { getCategoryPageServerSideProps, type CategoryPageProps } from './category';
+export { getGalleryPageServerSideProps, type GalleryPageProps } from './gallery';
+export { getGalleryAlbumPageServerSideProps, type GalleryAlbumPageProps } from './galleryAlbum';
+export { getHomepageServerSideProps, type HomePageProps } from './home';
+export { getStoryPageServerSideProps } from './story';
+export { getStoryPreviewPageServerSideProps } from './storyPreview';

package/src/adapter-nextjs/page-props/lib/types.ts

@@ -0,0 +1,8 @@
+import type { GetServerSidePropsContext } from 'next';
+
+import type { PageProps } from '../../../types';
+
+export type PropsFunction<CustomProps> = (
+    context: GetServerSidePropsContext,
+    props: PageProps,
+) => CustomProps | Promise<CustomProps>;

package/src/adapter-nextjs/page-props/story.ts

@@ -0,0 +1,47 @@
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { getPrezlyApi } from '../../data-fetching';
+import { DUMMY_DEFAULT_LOCALE } from '../../intl';
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export function getStoryPageServerSideProps<CustomProps extends Record<string, any>>(
+    customProps: CustomProps | PropsFunction<CustomProps>,
+) {
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<CustomProps>> {
+        const api = getPrezlyApi(context.req);
+
+        const { slug } = context.params as { slug?: string };
+        const story = slug ? await api.getStoryBySlug(slug) : null;
+        if (!story) {
+            return { notFound: true };
+        }
+
+        const { serverSideProps } = await getNewsroomServerSideProps(context, { story });
+
+        const { locale } = context;
+        if (locale && locale !== DUMMY_DEFAULT_LOCALE) {
+            return {
+                redirect: {
+                    destination: `/${slug}`,
+                    permanent: true,
+                },
+            };
+        }
+
+        return processRequest(context, {
+            ...serverSideProps,
+            newsroomContextProps: {
+                ...serverSideProps.newsroomContextProps,
+                currentStory: story,
+            },
+            ...(typeof customProps === 'function'
+                ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                : customProps),
+        });
+    };
+}

package/src/adapter-nextjs/page-props/storyPreview.ts

@@ -0,0 +1,35 @@
+import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
+
+import { getPrezlyApi } from '../../data-fetching';
+import { getNewsroomServerSideProps } from '../getNewsroomServerSideProps';
+import { processRequest } from '../processRequest';
+
+import type { PropsFunction } from './lib/types';
+
+export function getStoryPreviewPageServerSideProps<CustomProps extends Record<string, any>>(
+    customProps: CustomProps | PropsFunction<CustomProps>,
+) {
+    return async function getServerSideProps(
+        context: GetServerSidePropsContext,
+    ): Promise<GetServerSidePropsResult<CustomProps>> {
+        const api = getPrezlyApi(context.req);
+        const { uuid } = context.params as { uuid: string };
+        const story = await api.getStory(uuid);
+        if (!story) {
+            return { notFound: true };
+        }
+
+        const { serverSideProps } = await getNewsroomServerSideProps(context, { story });
+
+        return processRequest(context, {
+            ...serverSideProps,
+            newsroomContextProps: {
+                ...serverSideProps.newsroomContextProps,
+                currentStory: story,
+            },
+            ...(typeof customProps === 'function'
+                ? await (customProps as PropsFunction<CustomProps>)(context, serverSideProps)
+                : customProps),
+        });
+    };
+}

package/src/data-fetching/api/PrezlyApi.ts

@@ -1,14 +1,11 @@
 import type {
     Category,
-    ExtendedStory,
     ExtraStoryFields,
     Newsroom,
     NewsroomLanguageSettings,
     Story,
 } from '@prezly/sdk';
 import PrezlySDK from '@prezly/sdk';
-import type { StoryBookmarkNode } from '@prezly/slate-types';
-import { isStoryBookmarkNode } from '@prezly/slate-types';
 import type { IncomingMessage } from 'http';
 
 import { LocaleObject } from '../../intl';
@@ -25,7 +22,6 @@ import {
 } from './languages';
 import {
     getContactsQuery,
-    getEmbedStoriesQuery,
     getGalleriesQuery,
     getSlugQuery,
     getSortByPublishedDate,
@@ -232,28 +228,6 @@ export class PrezlyApi {
         return null;
     }
 
-    /**
-     * Returns summaries for stories embed in the current story (like in Bookmark Blocks)
-     * @returns a map of `Story` object with their UUID as keys
-     */
-    async getEmbedStories(story: ExtendedStory) {
-        const nodes = JSON.parse(story.content);
-
-        const embedUuids: Array<string> = await Promise.all(
-            nodes.children.filter(isStoryBookmarkNode).map((c: StoryBookmarkNode) => c.story.uuid),
-        );
-
-        const jsonQuery = JSON.stringify(getEmbedStoriesQuery(this.newsroomUuid, embedUuids));
-        const { stories } = await this.searchStories({
-            jsonQuery,
-        });
-
-        return stories.reduce<Record<Story['uuid'], Story>>(
-            (result, embedStory) => ({ ...result, [embedStory.uuid]: embedStory }),
-            {},
-        );
-    }
-
     async getNewsroomServerSideProps(
         request: IncomingMessage | undefined,
         nextLocaleIsoCode?: string,

package/src/data-fetching/api/languages.ts

@@ -101,7 +101,7 @@ export function getLanguageFromNextLocaleIsoCode(
     const locale = LocaleObject.fromAnyCode(nextLocaleIsoCode);
     let targetLanguage: NewsroomLanguageSettings | undefined;
 
-    if (nextLocaleIsoCode.length === 2) {
+    if (nextLocaleIsoCode.length >= 2 && nextLocaleIsoCode.length <= 4) {
         targetLanguage =
             getLanguageByExactLocaleCode(languages, locale) ||
             getLanguageByNeutralLocaleCode(languages, locale) ||

package/src/data-fetching/api/queries.ts

@@ -18,16 +18,6 @@ export function getSlugQuery(newsroomUuid: string, slug: string) {
     };
 }
 
-export function getEmbedStoriesQuery(newsroomUuid: string, uuids: string[]) {
-    return {
-        $and: [
-            { 'newsroom.uuid': { $in: [newsroomUuid] } },
-            { uuid: { $in: uuids } },
-            ...publishedAndAccessible,
-        ],
-    };
-}
-
 export function getStoriesQuery(newsroomUuid: string, categoryId?: number, localeCode?: string) {
     const query: any = {
         $and: [...publishedAndPublic, { 'newsroom.uuid': { $in: [newsroomUuid] } }],

package/src/data-fetching/constants.ts

@@ -1,2 +1,3 @@
 export const ASSETS_URL = 'https://cdn.uc.assets.prezly.com';
 export const DEFAULT_PAGE_SIZE = 12;
+export const DEFAULT_GALLERY_PAGE_SIZE = 6;

package/src/newsroom-context/context.tsx

@@ -6,7 +6,6 @@ import type {
     NewsroomContact,
     NewsroomLanguageSettings,
     NewsroomThemePreset,
-    Story,
 } from '@prezly/sdk';
 import type { PropsWithChildren } from 'react';
 import { createContext, useMemo } from 'react';
@@ -40,10 +39,6 @@ export interface NewsroomContextType {
      * Optional: Refers to a currently selected story when navigated to `/[slug]` page.
      */
     currentStory?: ExtendedStory;
-    /**
-     * Optional: Embed stories data referenced from the current story content (currently used by Story Bookmark blocks)
-     */
-    embedStories?: Record<Story['uuid'], Story>;
     /**
      * List of currently enabled newsroom languages, as well as company information translated for each language
      */
@@ -80,7 +75,6 @@ export function NewsroomContextProvider({
     newsroom,
     currentCategory,
     currentStory,
-    embedStories,
     companyInformation,
     languages,
     localeCode,
@@ -101,7 +95,6 @@ export function NewsroomContextProvider({
                 newsroom,
                 currentCategory,
                 currentStory,
-                embedStories,
                 companyInformation,
                 languages,
                 locale,

package/src/newsroom-context/hooks/index.ts

@@ -4,7 +4,6 @@ export * from './useCompanyInformation';
 export * from './useCurrentCategory';
 export * from './useCurrentLocale';
 export * from './useCurrentStory';
-export * from './useEmbedStory';
 export * from './useGetLinkLocaleSlug';
 export * from './useGetTranslationUrl';
 export * from './useLanguages';

package/build/newsroom-context/hooks/useEmbedStory.d.ts

@@ -1,2 +0,0 @@
-import type { Story } from '@prezly/sdk';
-export declare function useEmbedStory(uuid: Story['uuid']): Story | undefined;

package/build/newsroom-context/hooks/useEmbedStory.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useEmbedStory = void 0;
-var useNewsroomContext_1 = require("./useNewsroomContext");
-function useEmbedStory(uuid) {
-    var context = (0, useNewsroomContext_1.useNewsroomContext)();
-    if (!context.embedStories) {
-        return undefined;
-    }
-    return context.embedStories[uuid];
-}
-exports.useEmbedStory = useEmbedStory;
-//# sourceMappingURL=useEmbedStory.js.map

package/build/newsroom-context/hooks/useEmbedStory.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEmbedStory.js","sourceRoot":"","sources":["../../../src/newsroom-context/hooks/useEmbedStory.ts"],"names":[],"mappings":";;;AAEA,2DAA0D;AAE1D,SAAgB,aAAa,CAAC,IAAmB;IAC7C,IAAM,OAAO,GAAG,IAAA,uCAAkB,GAAE,CAAC;IAErC,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE;QACvB,OAAO,SAAS,CAAC;KACpB;IAED,OAAO,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;AACtC,CAAC;AARD,sCAQC"}

package/src/newsroom-context/hooks/useEmbedStory.ts

@@ -1,13 +0,0 @@
-import type { Story } from '@prezly/sdk';
-
-import { useNewsroomContext } from './useNewsroomContext';
-
-export function useEmbedStory(uuid: Story['uuid']) {
-    const context = useNewsroomContext();
-
-    if (!context.embedStories) {
-        return undefined;
-    }
-
-    return context.embedStories[uuid];
-}