@prezly/theme-kit-nextjs 1.18.1 → 2.0.0-0

package/src/adapter-nextjs/processRequest.ts

@@ -1,49 +0,0 @@
-import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next';
-
-import { getRedirectToCanonicalLocale, getShortestLocaleCode, LocaleObject } from '../intl';
-import type { PageProps, ServerSidePageProps } from '../types';
-
-/**
- * This function combines the props returned from `getNewsroomServerSideProps` and your optional custom props for the page.
- * It also handles locale redirects, if `canonicalUrl` parameter is provided.
- * See README for usage examples.
- *
- * @param context Next.js context passed to the `getServerSideProps` method of the page
- * @param props Object containing the return of `getNewsroomServerSideProps` and your optional custom props.
- * @param canonicalUrl Optional: a canonical URL for the current page without locale part. If provided, locale redirects will be handled by the function.
- */
-export function processRequest<Props>(
-    context: GetServerSidePropsContext,
-    props: Props & PageProps & ServerSidePageProps,
-    canonicalUrl?: string,
-): GetServerSidePropsResult<Props> {
-    const { locale: nextLocale, query } = context;
-
-    const { localeResolved, ...pageProps } = props;
-
-    // If no locale was provided by Next, it most likely means that the theme is not supporting multi-language.
-    // In that case we won't show 404 page.
-    if (!localeResolved && nextLocale) {
-        return { notFound: true };
-    }
-
-    if (canonicalUrl) {
-        const { languages, localeCode } = pageProps.newsroomContextProps;
-        const currentLocale = LocaleObject.fromAnyCode(localeCode);
-        const shortestLocaleCode = getShortestLocaleCode(languages, currentLocale);
-
-        const redirect = getRedirectToCanonicalLocale(
-            shortestLocaleCode,
-            nextLocale,
-            canonicalUrl,
-            query,
-        );
-        if (redirect) {
-            return { redirect };
-        }
-    }
-
-    return {
-        props: pageProps as Props & PageProps,
-    };
-}

package/src/adapter-nextjs/processStaticRequest.ts

@@ -1,32 +0,0 @@
-import type { GetStaticPropsContext, GetStaticPropsResult } from 'next';
-
-import type { PageProps, ServerSidePageProps } from '../types';
-
-/**
- * This function combines the props returned from `getNewsroomStaticProps` and your optional custom props for the page.
- * See README for usage examples.
- *
- * @param context Next.js context passed to the `getStaticProps` method of the page
- * @param props Object containing the return of `getNewsroomServerSideProps` and your optional custom props.
- * @param revalidateTimeout Optional: timeout in seconds to use with Next ISR.
- */
-export function processStaticRequest<Props>(
-    context: GetStaticPropsContext,
-    props: Props & PageProps & ServerSidePageProps,
-    revalidateTimeout?: number,
-): GetStaticPropsResult<Props> {
-    const { locale: nextLocale } = context;
-
-    const { localeResolved, ...pageProps } = props;
-
-    // If no locale was provided by Next, it most likely means that the theme is not supporting multi-language.
-    // In that case we won't show 404 page.
-    if (!localeResolved && nextLocale) {
-        return { notFound: true };
-    }
-
-    return {
-        props: pageProps as Props & PageProps,
-        revalidate: revalidateTimeout,
-    };
-}

package/src/components-nextjs/PageSeo/PageSeo.tsx

@@ -1,131 +0,0 @@
-import { NextSeo } from 'next-seo';
-import type { NextSeoProps } from 'next-seo';
-import { useRouter } from 'next/router';
-import { useMemo } from 'react';
-
-import { getUsedLanguages, LocaleObject } from '../../intl';
-import {
-    useCompanyInformation,
-    useCurrentLocale,
-    useCurrentStory,
-    useGetLinkLocaleSlug,
-    useGetTranslationUrl,
-    useLanguages,
-    useNewsroom,
-} from '../../newsroom-context';
-import { getNewsroomLogoUrl } from '../../utils';
-
-import { getAbsoluteUrl } from './lib/getAbsoluteUrl';
-import type { AlternateLanguageLink } from './lib/types';
-
-type Props = NextSeoProps & {
-    imageUrl?: string;
-};
-
-/**
- * This component provides base page attributes for every Newsroom page.
- * It depends on information from NewsroomContext, so the component should be placed inside the `NewsroomContextProvider`.
- * You can pass additional props expected by NextSeo component to override any info that is provided by the NewsroomContext.
- */
-export function PageSeo({
-    title,
-    description,
-    imageUrl,
-    canonical,
-    openGraph,
-    twitter,
-    ...nextSeoProps
-}: Props) {
-    const companyInformation = useCompanyInformation();
-    const newsroom = useNewsroom();
-    const currentLocale = useCurrentLocale();
-    const languages = useLanguages();
-    const getTranslationUrl = useGetTranslationUrl();
-    const getLinkLocaleSlug = useGetLinkLocaleSlug();
-    const currentStory = useCurrentStory();
-    const { asPath } = useRouter();
-
-    const pageTitle = title || companyInformation.name;
-    const pageDescription = description || companyInformation.about_plaintext;
-    const canonicalUrl =
-        canonical || getAbsoluteUrl(asPath, newsroom.url, getLinkLocaleSlug(currentLocale));
-    const siteName = companyInformation.name;
-    const logoUrl = imageUrl || getNewsroomLogoUrl(newsroom);
-
-    const alternateLanguageLinks: AlternateLanguageLink[] = useMemo(() => {
-        if (!languages.length) {
-            return [];
-        }
-
-        const alternateLanguages = getUsedLanguages(languages).filter(
-            (language) => language.code !== currentLocale.toUnderscoreCode(),
-        );
-
-        return alternateLanguages
-            .map((language) => {
-                const locale = LocaleObject.fromAnyCode(language.code);
-
-                const translationLink = getTranslationUrl(locale, true);
-
-                if (!translationLink) {
-                    return undefined;
-                }
-
-                return {
-                    hrefLang: locale.toHyphenCode(),
-                    href: getAbsoluteUrl(
-                        translationLink,
-                        newsroom.url,
-                        currentStory && translationLink !== '/' ? false : getLinkLocaleSlug(locale),
-                    ),
-                };
-            })
-            .filter<AlternateLanguageLink>(Boolean as any);
-    }, [
-        currentLocale,
-        getLinkLocaleSlug,
-        getTranslationUrl,
-        languages,
-        newsroom.url,
-        currentStory,
-    ]);
-
-    return (
-        <NextSeo
-            title={pageTitle}
-            description={pageDescription}
-            canonical={canonicalUrl}
-            noindex={nextSeoProps.noindex ?? !newsroom.is_indexable}
-            nofollow={nextSeoProps.nofollow ?? !newsroom.is_indexable}
-            openGraph={{
-                url: canonicalUrl,
-                title: pageTitle,
-                description: pageDescription,
-                locale: currentLocale.toUnderscoreCode(),
-                images: [
-                    {
-                        url: logoUrl,
-                        alt: pageTitle,
-                    },
-                ],
-                site_name: siteName,
-                ...openGraph,
-            }}
-            twitter={{
-                site: siteName,
-                cardType: 'summary',
-                ...twitter,
-            }}
-            additionalMetaTags={[{ name: 'twitter:image', content: logoUrl }]}
-            additionalLinkTags={[
-                {
-                    rel: 'alternate',
-                    type: 'application/rss+xml',
-                    href: `${document.location.origin}/feed`,
-                },
-            ]}
-            languageAlternates={alternateLanguageLinks}
-            {...nextSeoProps}
-        />
-    );
-}

package/src/components-nextjs/PageSeo/index.ts

@@ -1,2 +0,0 @@
-export { PageSeo } from './PageSeo';
-export * from './lib/types';

package/src/components-nextjs/PageSeo/lib/getAbsoluteUrl.ts

@@ -1,7 +0,0 @@
-// Returns absolute URL based on the path and without any query parameters
-export function getAbsoluteUrl(path: string, origin: string, localeCode?: string | false): string {
-    const url = new URL(`${localeCode ? `/${localeCode}` : ''}${path || '/'}`, origin);
-    url.search = '';
-
-    return url.toString();
-}

package/src/components-nextjs/PageSeo/lib/types.ts

@@ -1,4 +0,0 @@
-export type AlternateLanguageLink = {
-    href: string;
-    hrefLang: string;
-};

package/src/components-nextjs/StorySeo/StorySeo.tsx

@@ -1,80 +0,0 @@
-import type { ExtendedStory } from '@prezly/sdk';
-import { StoryVisibility } from '@prezly/sdk';
-import { ArticleJsonLd, NextSeo } from 'next-seo';
-
-type Props = {
-    story: ExtendedStory;
-    noindex?: boolean;
-};
-
-/**
- * This components provides additional page attributes for the Story page.
- * It works in conjunction with `PageSeo` component, overidding some of its attributes.
- */
-export function StorySeo({ story, noindex }: Props) {
-    const { title, subtitle, published_at, updated_at, author, oembed, newsroom, summary } = story;
-
-    const authorName = author?.display_name || author?.email || 'Unknown';
-    const description = subtitle || summary;
-    const indexable = newsroom.is_indexable && story.visibility === StoryVisibility.PUBLIC;
-
-    return (
-        <>
-            <NextSeo
-                title={title}
-                description={description}
-                canonical={oembed.url}
-                noindex={noindex ?? !indexable}
-                nofollow={noindex ?? !indexable}
-                openGraph={{
-                    title,
-                    description,
-                    url: oembed.url,
-                    site_name: newsroom.display_name,
-                    type: 'article',
-                    article: {
-                        publishedTime: published_at || undefined,
-                        modifiedTime: updated_at,
-                        authors: [authorName],
-                    },
-                    ...(oembed.thumbnail_url && {
-                        images: [
-                            {
-                                url: oembed.thumbnail_url,
-                                alt: oembed.title,
-                                width: oembed.thumbnail_width,
-                                height: oembed.thumbnail_height,
-                            },
-                        ],
-                    }),
-                }}
-                additionalMetaTags={
-                    oembed.thumbnail_url
-                        ? [
-                              { name: 'twitter:card', content: 'summary_large_image' },
-                              { name: 'twitter:image', content: oembed.thumbnail_url },
-                          ]
-                        : undefined
-                }
-                additionalLinkTags={[
-                    {
-                        rel: 'alternate',
-                        type: 'application/json',
-                        href: `${document.location.origin}${document.location.pathname}.json`,
-                    },
-                ]}
-            />
-            <ArticleJsonLd
-                url={oembed.url}
-                title={title}
-                images={oembed.thumbnail_url ? [oembed.thumbnail_url] : []}
-                datePublished={published_at || ''}
-                dateModified={updated_at}
-                authorName={[authorName]}
-                publisherName={newsroom.display_name}
-                publisherLogo={newsroom.thumbnail_url}
-                description={description}
-            />
-        </>
-    );
-}

package/src/components-nextjs/StorySeo/index.ts

@@ -1 +0,0 @@
-export { StorySeo } from './StorySeo';

package/src/components-nextjs/document.tsx

@@ -1,38 +0,0 @@
-import Document, { Head, Html, Main, NextScript } from 'next/document';
-
-import { DEFAULT_LOCALE, getLocaleDirection, LocaleObject } from '../intl';
-import type { PageProps } from '../types';
-
-export class PrezlyThemeDocument extends Document {
-    getLocaleCode() {
-        const {
-            newsroomContextProps,
-            // eslint-disable-next-line no-underscore-dangle
-        } = this.props.__NEXT_DATA__.props.pageProps as PageProps;
-
-        // In some cases (like server errors) the newsroom context props will not be loaded.
-        // We need to fall back to default locale to keep the app working.
-        const { localeCode } = newsroomContextProps ?? { localeCode: DEFAULT_LOCALE };
-
-        return localeCode;
-    }
-
-    render() {
-        const locale = LocaleObject.fromAnyCode(this.getLocaleCode());
-        // TODO: The direction can be pulled from the Language object
-        const direction = getLocaleDirection(locale);
-
-        return (
-            <Html lang={locale.toHyphenCode()} dir={direction}>
-                <Head>
-                    <meta name="og:locale" content={locale.toHyphenCode()} />
-                    {/* TODO: Add alternate locales */}
-                </Head>
-                <body>
-                    <Main />
-                    <NextScript />
-                </body>
-            </Html>
-        );
-    }
-}

package/src/components-nextjs/index.ts

@@ -1,3 +0,0 @@
-export { PageSeo } from './PageSeo';
-export { StorySeo } from './StorySeo';
-export { PrezlyThemeDocument } from './document';

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

@@ -1,302 +0,0 @@
-import type {
-    Category,
-    ExtraStoryFields,
-    Newsroom,
-    NewsroomLanguageSettings,
-    Story,
-} from '@prezly/sdk';
-import PrezlySDK from '@prezly/sdk';
-import type { IncomingMessage } from 'http';
-
-import {
-    getCompanyInformation,
-    getDefaultLanguage,
-    getLanguageFromNextLocaleIsoCode,
-    getLanguageFromStory,
-    getNotifications,
-    LocaleObject,
-} from '../../intl';
-import type { PageProps, ServerSidePageProps } from '../../types';
-import { DEFAULT_PAGE_SIZE } from '../../utils';
-import { getAlgoliaSettings, isSdkError, isUuid } from '../lib';
-
-import {
-    getContactsQuery,
-    getGalleriesQuery,
-    getSlugQuery,
-    getSortByPublishedDate,
-    getStoriesQuery,
-} from './queries';
-
-const CATEGORIES_SORT_ORDER = '+order';
-const DEFAULT_SORT_ORDER: SortOrder = 'desc';
-
-const ERROR_CODE_NOT_FOUND = 404;
-const ERROR_CODE_FORBIDDEN = 403;
-const ERROR_CODE_GONE = 410;
-
-type SortOrder = 'desc' | 'asc';
-
-interface GetStoriesOptions {
-    page?: number;
-    pageSize?: number;
-    order?: SortOrder;
-    include?: (keyof ExtraStoryFields)[];
-    localeCode?: string;
-}
-
-interface GetGalleriesOptions {
-    page?: number;
-    pageSize?: number;
-}
-
-export class PrezlyApi {
-    private readonly sdk: PrezlySDK;
-
-    private readonly newsroomUuid: Newsroom['uuid'];
-
-    private readonly themeUuid: string | undefined;
-
-    constructor(accessToken: string, newsroomUuid: Newsroom['uuid'], themeUuid?: string) {
-        const baseUrl = process.env.API_BASE_URL_OVERRIDE ?? undefined;
-        this.sdk = new PrezlySDK({
-            accessToken,
-            baseUrl,
-            // This returns stories created by legacy version of the editor in a format that can be displayed by the Prezly Content Renderer.
-            headers: { 'X-Convert-v1-To-v3': 'true' },
-        });
-        this.newsroomUuid = newsroomUuid;
-        this.themeUuid = themeUuid;
-    }
-
-    async getStory(uuid: string) {
-        if (!isUuid(uuid)) {
-            return undefined;
-        }
-
-        try {
-            return await this.sdk.stories.get(uuid);
-        } catch (error) {
-            if (
-                isSdkError(error) &&
-                (error.status === ERROR_CODE_NOT_FOUND ||
-                    error.status === ERROR_CODE_GONE ||
-                    error.status === ERROR_CODE_FORBIDDEN)
-            ) {
-                return null;
-            }
-            throw error;
-        }
-    }
-
-    async getNewsroom() {
-        return this.sdk.newsrooms.get(this.newsroomUuid);
-    }
-
-    async getNewsroomContacts() {
-        return this.sdk.newsroomContacts.search(this.newsroomUuid, {
-            query: JSON.stringify(getContactsQuery()),
-        });
-    }
-
-    async getNewsroomLanguages(): Promise<NewsroomLanguageSettings[]> {
-        return (await this.sdk.newsroomLanguages.list(this.newsroomUuid)).languages;
-    }
-
-    /**
-     * Note: this method returns ALL stories from the newsroom. It's intended to be used for sitemaps and not to display actual content.
-     */
-    async getAllStories(order: SortOrder = DEFAULT_SORT_ORDER) {
-        const sortOrder = getSortByPublishedDate(order);
-        const newsroom = await this.getNewsroom();
-        const jsonQuery = JSON.stringify(getStoriesQuery(newsroom.uuid));
-        const maxStories = newsroom.stories_number;
-        const chunkSize = 200;
-
-        const pages = Math.ceil(maxStories / chunkSize);
-        const storiesPromises = Array.from({ length: pages }, (_, pageIndex) =>
-            this.searchStories({
-                limit: chunkSize,
-                sortOrder,
-                jsonQuery,
-                offset: pageIndex * chunkSize,
-            }),
-        );
-
-        const stories = (await Promise.all(storiesPromises)).flatMap(
-            (response) => response.stories,
-        );
-
-        return stories;
-    }
-
-    async getStories({
-        page = undefined,
-        pageSize = DEFAULT_PAGE_SIZE,
-        order = DEFAULT_SORT_ORDER,
-        include,
-        localeCode,
-    }: GetStoriesOptions = {}) {
-        const sortOrder = getSortByPublishedDate(order);
-        const jsonQuery = JSON.stringify(getStoriesQuery(this.newsroomUuid, undefined, localeCode));
-
-        const { stories, pagination } = await this.searchStories({
-            limit: pageSize,
-            offset: typeof page === 'undefined' ? undefined : (page - 1) * pageSize,
-            sortOrder,
-            jsonQuery,
-            include,
-        });
-
-        const storiesTotal = pagination.matched_records_number;
-
-        return { stories, storiesTotal };
-    }
-
-    async getStoriesFromCategory(
-        category: Category,
-        {
-            page = undefined,
-            pageSize = DEFAULT_PAGE_SIZE,
-            order = DEFAULT_SORT_ORDER,
-            include,
-            localeCode,
-        }: GetStoriesOptions = {},
-    ) {
-        const sortOrder = getSortByPublishedDate(order);
-        const jsonQuery = JSON.stringify(
-            getStoriesQuery(this.newsroomUuid, category.id, localeCode),
-        );
-
-        const { stories, pagination } = await this.searchStories({
-            limit: pageSize,
-            offset: typeof page === 'undefined' ? undefined : (page - 1) * pageSize,
-            sortOrder,
-            jsonQuery,
-            include,
-        });
-
-        const storiesTotal = pagination.matched_records_number;
-
-        return { stories, storiesTotal };
-    }
-
-    async getStoryBySlug(slug: string) {
-        const jsonQuery = JSON.stringify(getSlugQuery(this.newsroomUuid, slug));
-        const { stories } = await this.searchStories({
-            limit: 1,
-            jsonQuery,
-        });
-
-        if (stories[0]) {
-            return this.getStory(stories[0].uuid);
-        }
-
-        return null;
-    }
-
-    async getCategories(): Promise<Category[]> {
-        const categories = await this.sdk.newsroomCategories.list(this.newsroomUuid, {
-            sortOrder: CATEGORIES_SORT_ORDER,
-        });
-
-        return Array.isArray(categories) ? categories : Object.values(categories);
-    }
-
-    async getCategoryBySlug(slug: string) {
-        const categories = await this.getCategories();
-
-        return categories.find((category) =>
-            Object.values(category.i18n).some((t) => t.slug === slug),
-        );
-    }
-
-    searchStories: typeof PrezlySDK.prototype.stories.search = (options) =>
-        this.sdk.stories.search(options);
-
-    async getGalleries({ page, pageSize }: GetGalleriesOptions) {
-        return this.sdk.newsroomGalleries.list(this.newsroomUuid, {
-            limit: pageSize,
-            offset:
-                typeof page === 'undefined' || typeof pageSize === 'undefined'
-                    ? undefined
-                    : (page - 1) * pageSize,
-            scope: getGalleriesQuery(),
-        });
-    }
-
-    async getGallery(uuid: string) {
-        if (!isUuid(uuid)) {
-            // Check for legacy number ID reference, which is also supported for back-compat.
-            if (Number.isNaN(Number(uuid))) {
-                return undefined;
-            }
-        }
-
-        try {
-            return await this.sdk.newsroomGalleries.get(this.newsroomUuid, uuid);
-        } catch (error) {
-            if (isSdkError(error) && error.status === 404) {
-                return null;
-            }
-            throw error;
-        }
-    }
-
-    /**
-     * In order to prevent issues with theme preview, we only load the theme preset for a specified theme, and not the currently active one.
-     */
-    async getThemePreset() {
-        if (this.themeUuid) {
-            return this.sdk.newsroomThemes.get(this.newsroomUuid, this.themeUuid);
-        }
-
-        return null;
-    }
-
-    async getNewsroomServerSideProps(
-        request?: IncomingMessage,
-        nextLocaleIsoCode?: string,
-        story?: Story,
-    ): Promise<PageProps & ServerSidePageProps> {
-        const [newsroom, languages, categories, themePreset] = await Promise.all([
-            this.getNewsroom(),
-            this.getNewsroomLanguages(),
-            this.getCategories(),
-            this.getThemePreset(),
-        ]);
-
-        const currentLanguage = story
-            ? getLanguageFromStory(languages, story)
-            : getLanguageFromNextLocaleIsoCode(languages, nextLocaleIsoCode);
-        const defaultLanguage = getDefaultLanguage(languages);
-
-        const { code: localeCode } = currentLanguage || defaultLanguage;
-        const locale = LocaleObject.fromAnyCode(localeCode);
-
-        // TODO: if no information given for current language, show boilerplate from default language
-        const companyInformation = getCompanyInformation(languages, locale);
-
-        const notifications = getNotifications(languages, locale);
-        const algoliaSettings = getAlgoliaSettings(request);
-
-        return {
-            newsroomContextProps: {
-                newsroom,
-                companyInformation,
-                categories,
-                languages,
-                localeCode,
-                notifications,
-                themePreset,
-                algoliaSettings,
-            },
-            localeResolved: Boolean(currentLanguage),
-        };
-    }
-
-    async getNewsroomDefaultLanguage() {
-        const languages = await this.getNewsroomLanguages();
-        return getDefaultLanguage(languages);
-    }
-}

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

@@ -1,24 +0,0 @@
-import type { IncomingMessage } from 'http';
-
-import { getEnvVariables } from '../lib/getEnvVariables';
-
-import { PrezlyApi } from './PrezlyApi';
-
-export function getPrezlyApi(req?: IncomingMessage): PrezlyApi {
-    if (typeof window !== 'undefined') {
-        throw new Error('"getPrezlyApi" should only be used on back-end side.');
-    }
-
-    // `getEnvVariables` handles both cases for envs parsing - .env and request headers
-    const { PREZLY_ACCESS_TOKEN, PREZLY_NEWSROOM_UUID, PREZLY_THEME_UUID } = getEnvVariables(req);
-
-    if (!PREZLY_ACCESS_TOKEN) {
-        throw new Error('"PREZLY_ACCESS_TOKEN" is not set in env variables.');
-    }
-
-    if (!PREZLY_NEWSROOM_UUID) {
-        throw new Error('"PREZLY_NEWSROOM_UUID" is not set in env variables.');
-    }
-
-    return new PrezlyApi(PREZLY_ACCESS_TOKEN, PREZLY_NEWSROOM_UUID, PREZLY_THEME_UUID);
-}

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

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