@prezly/theme-kit-nextjs 1.18.3 → 1.18.4-1

package/build/types.d.ts

@@ -1,4 +1,4 @@
-import type { CultureRef, ExtraStoryFields, Story } from '@prezly/sdk';
+import type { CultureRef, Story } from '@prezly/sdk';
 import type { NewsroomContextProps } from './newsroom-context';
 export interface ServerSidePageProps {
     /**
@@ -24,7 +24,7 @@ export interface AlgoliaCategoryRef {
 /**
  * Stories in Algolia index are stored in a simplified format, with only minimal subset of fields.
  */
-export type AlgoliaStory = Pick<Story, 'uuid' | 'slug' | 'title' | 'subtitle'> & Pick<ExtraStoryFields, 'thumbnail_image'> & {
+export type AlgoliaStory = Pick<Story, 'uuid' | 'slug' | 'title' | 'subtitle'> & Pick<Story.ExtraFields, 'thumbnail_image'> & {
     content_text: string;
     updated_at: number;
     published_at: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@prezly/theme-kit-nextjs",
-  "version": "1.18.3",
+  "version": "1.18.4-1",
   "description": "Data layer and utility library for developing Prezly themes with NextJS",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -48,24 +48,24 @@
     "react-dom": "^17.x || ^18.x"
   },
   "dependencies": {
-    "@prezly/sdk": "^7.11.0-0",
+    "@prezly/sdk": "^11.8.1-0",
     "@prezly/uploadcare": "^2.3.4",
     "@react-hookz/web": "^16.0.0",
     "next-seo": "^5.4.0",
     "parse-data-url": "^4.0.1"
   },
   "devDependencies": {
-    "@prezly/eslint-config": "4.2.0",
-    "@sentry/nextjs": "7.20.0",
-    "@types/jest": "29.2.3",
+    "@prezly/eslint-config": "4.3.2",
+    "@sentry/nextjs": "7.23.0",
+    "@types/jest": "29.2.4",
     "@types/node": "17.0.14",
     "@types/parse-data-url": "3.0.0",
-    "@types/react": "18.0.25",
+    "@types/react": "18.0.26",
     "@types/react-dom": "18.0.9",
-    "eslint": "8.27.0",
+    "eslint": "8.29.0",
     "jest": "29.3.1",
     "np": "7.6.2",
-    "prettier": "2.7.1",
+    "prettier": "2.8.0",
     "rimraf": "3.0.2",
     "ts-jest": "29.0.3",
     "typescript": "4.9.3"

package/src/__mocks__/languages.ts

@@ -1,5 +1,4 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-import { type NewsroomLanguageSettings, TextDirection } from '@prezly/sdk';
+import { type NewsroomLanguageSettings, Culture } from '@prezly/sdk';
 
 /**
  * Pulled from The Good Newsroom (with some additions)
@@ -12,7 +11,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'nl_BE',
             name: 'Dutch (Belgium)',
             native_name: 'Nederlands (België)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'nl',
         },
         is_default: false,
@@ -57,7 +56,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'nl_NL',
             name: 'Dutch (Netherlands)',
             native_name: 'Nederlands (Nederland)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'nl',
         },
         is_default: false,
@@ -98,7 +97,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'en',
             name: 'English (Global)',
             native_name: 'English (Global)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'en',
         },
         is_default: true,
@@ -145,7 +144,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'en_US',
             name: 'English (US)',
             native_name: 'English (US)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'en',
         },
         is_default: false,
@@ -192,7 +191,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'en_GB',
             name: 'English (UK)',
             native_name: 'English (UK)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'en',
         },
         is_default: false,
@@ -239,7 +238,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'fr',
             name: 'French (Global)',
             native_name: 'Français (Mondial)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'fr',
         },
         is_default: false,
@@ -286,7 +285,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'fr_BE',
             name: 'French (Belgium)',
             native_name: 'Français (België)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'fr',
         },
         is_default: false,
@@ -333,7 +332,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'es_ES',
             name: 'Spanish (Spain)',
             native_name: 'Español (España)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'es',
         },
         is_default: false,
@@ -377,7 +376,7 @@ export const LANGUAGES: Record<string, NewsroomLanguageSettings> = {
             locale: 'es_419',
             name: 'Spanish (Latin America)',
             native_name: 'Español (Latinoamérica)',
-            direction: TextDirection.LTR,
+            direction: Culture.TextDirection.LTR,
             language_code: 'es',
         },
         is_default: false,

package/src/__mocks__/story.ts

@@ -1,14 +1,19 @@
 import type { ExtendedStory } from '@prezly/sdk';
-import {
-    NewsroomStatus,
-    StoryLifecycleStatus,
-    StoryPublicationStatus,
-    StoryVisibility,
-    TextDirection,
-} from '@prezly/sdk';
+import { Newsroom, Story, Culture, User } from '@prezly/sdk';
 
 export const STORY: ExtendedStory = {
     id: 380023,
+    attached_gallery_content: null,
+    is_pinned: false,
+    is_shared_to_prpro: false,
+    pinned_by: null,
+    seo_settings: {
+        canonical_url: null,
+        default_meta_description: null,
+        default_meta_title: null,
+        meta_description: null,
+        meta_title: null,
+    },
     uuid: '65018f5b-b313-453f-b23b-9e739c6a8591',
     thumbnail_url:
         'https://avatars-cdn.prezly.com/story/6337/380023/c3a3d56ee09ce808dbb1bc2f06d16b68bdaeefbf731d8a080b7e4d5e68fb3e94?t=1640077510&v=1',
@@ -23,15 +28,15 @@ export const STORY: ExtendedStory = {
         locale: 'en',
         name: 'English (Global)',
         native_name: 'English (Global)',
-        direction: TextDirection.LTR,
+        direction: Culture.TextDirection.LTR,
         language_code: 'en',
     },
     slug: 'take-a-breath',
     format_version: 3,
     language: 'EN',
-    lifecycle_status: StoryLifecycleStatus.PUBLISHED,
-    publication_status: StoryPublicationStatus.PUBLISHED,
-    visibility: StoryVisibility.PUBLIC,
+    lifecycle_status: Story.LifecycleStatus.PUBLISHED,
+    publication_status: Story.PublicationStatus.PUBLISHED,
+    visibility: Story.Visibility.PUBLIC,
     is_archived: false,
     is_finalized: true,
     is_published: true,
@@ -54,11 +59,12 @@ export const STORY: ExtendedStory = {
         last_name: 'Anthonis',
         avatar_url:
             'https://avatars-cdn.prezly.com/user/7680/6260be53465a846a511c44edd8f594f38235d782f3fa515ab968ad2f947a236c?v=1&c=cc6e751bdb46638cd948d0d812149ce391e45b7cd2b5d80a94de575ba0ce65d0',
-        use_case_answer: 'unknown',
-        sign_in_flow: 'password',
+        use_case_answer: User.UseCaseAnswer.UNKNOWN,
+        sign_in_flow: User.SignInFlow.PASSWORD,
         created_at: '2019-02-06T09:54:34+00:00',
         is_terms_of_service_accepted: false,
         last_seen_at: '2021-12-03T09:15:39+00:00',
+        locked_until: null,
     },
     newsroom: {
         uuid: '578e78e9-9a5b-44ad-bda2-5214895ee036',
@@ -69,7 +75,7 @@ export const STORY: ExtendedStory = {
         thumbnail_url:
             'https://avatars-cdn.prezly.com/newsroom/12698/e4939974b7781d4c61e282713116690387e9b7b1f6302478b13b68e18e0d3055?t=1648556918&v=1',
         timezone: 'europe/london',
-        status: NewsroomStatus.ACTIVE,
+        status: Newsroom.Status.ACTIVE,
         is_active: true,
         is_archived: false,
         is_online: true,
@@ -145,12 +151,12 @@ export const STORY: ExtendedStory = {
                 locale: 'nl_BE',
                 name: 'Dutch (Belgium)',
                 native_name: 'Nederlands (België)',
-                direction: TextDirection.LTR,
+                direction: Culture.TextDirection.LTR,
                 language_code: 'nl',
             },
-            lifecycle_status: StoryLifecycleStatus.PUBLISHED,
-            publication_status: StoryPublicationStatus.PUBLISHED,
-            visibility: StoryVisibility.PUBLIC,
+            lifecycle_status: Story.LifecycleStatus.PUBLISHED,
+            publication_status: Story.PublicationStatus.PUBLISHED,
+            visibility: Story.Visibility.PUBLIC,
             created_at: '2020-05-05T10:07:11+00:00',
             updated_at: '2021-12-21T09:05:05+00:00',
             published_at: '2020-05-05T10:21:00+00:00',
@@ -164,11 +170,12 @@ export const STORY: ExtendedStory = {
                 last_name: 'Anthonis',
                 avatar_url:
                     'https://avatars-cdn.prezly.com/user/7680/6260be53465a846a511c44edd8f594f38235d782f3fa515ab968ad2f947a236c?v=1&c=cc6e751bdb46638cd948d0d812149ce391e45b7cd2b5d80a94de575ba0ce65d0',
-                use_case_answer: 'unknown',
-                sign_in_flow: 'password',
+                use_case_answer: User.UseCaseAnswer.UNKNOWN,
+                sign_in_flow: User.SignInFlow.PASSWORD,
                 created_at: '2019-02-06T09:54:34+00:00',
                 is_terms_of_service_accepted: false,
                 last_seen_at: '2021-12-03T09:15:39+00:00',
+                locked_until: null,
             },
             newsroom: {
                 uuid: '578e78e9-9a5b-44ad-bda2-5214895ee036',
@@ -179,7 +186,7 @@ export const STORY: ExtendedStory = {
                 thumbnail_url:
                     'https://avatars-cdn.prezly.com/newsroom/12698/e4939974b7781d4c61e282713116690387e9b7b1f6302478b13b68e18e0d3055?t=1648556918&v=1',
                 timezone: 'europe/london',
-                status: NewsroomStatus.ACTIVE,
+                status: Newsroom.Status.ACTIVE,
                 is_active: true,
                 is_archived: false,
                 is_online: true,
@@ -244,12 +251,12 @@ export const STORY: ExtendedStory = {
                 locale: 'nl_NL',
                 name: 'Dutch (Netherlands)',
                 native_name: 'Nederlands (Nederland)',
-                direction: TextDirection.LTR,
+                direction: Culture.TextDirection.LTR,
                 language_code: 'nl',
             },
-            lifecycle_status: StoryLifecycleStatus.PUBLISHED,
-            publication_status: StoryPublicationStatus.PUBLISHED,
-            visibility: StoryVisibility.PUBLIC,
+            lifecycle_status: Story.LifecycleStatus.PUBLISHED,
+            publication_status: Story.PublicationStatus.PUBLISHED,
+            visibility: Story.Visibility.PUBLIC,
             created_at: '2022-06-28T07:29:03+00:00',
             updated_at: '2022-06-28T07:29:09+00:00',
             published_at: '2022-06-28T07:29:09+00:00',
@@ -263,11 +270,12 @@ export const STORY: ExtendedStory = {
                 last_name: 'Semyonov',
                 avatar_url:
                     'https://avatars-cdn.prezly.com/user/10324/85fc2201624703503c24a3a97cc7e1776015e9f6ffe2ad96016650add0b9ab5f?v=1&c=add8f27908ec1f74f1a7c0530a74d88027eea08d05cac4300713d1c07fed0e1b',
-                use_case_answer: 'stories',
-                sign_in_flow: 'google',
+                use_case_answer: User.UseCaseAnswer.UNKNOWN,
+                sign_in_flow: User.SignInFlow.PASSWORD,
                 created_at: '2021-02-25T13:30:04+00:00',
                 is_terms_of_service_accepted: true,
                 last_seen_at: '2022-06-28T09:06:32+00:00',
+                locked_until: null,
             },
             newsroom: {
                 uuid: '578e78e9-9a5b-44ad-bda2-5214895ee036',
@@ -278,7 +286,7 @@ export const STORY: ExtendedStory = {
                 thumbnail_url:
                     'https://avatars-cdn.prezly.com/newsroom/12698/e4939974b7781d4c61e282713116690387e9b7b1f6302478b13b68e18e0d3055?t=1648556918&v=1',
                 timezone: 'europe/london',
-                status: NewsroomStatus.ACTIVE,
+                status: Newsroom.Status.ACTIVE,
                 is_active: true,
                 is_archived: false,
                 is_online: true,

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

@@ -1,4 +1,4 @@
-import type { ExtraStoryFields, Story } from '@prezly/sdk';
+import type { Story } from '@prezly/sdk';
 import type {
     GetServerSidePropsContext,
     GetServerSidePropsResult,
@@ -24,7 +24,7 @@ export interface CategoryPageProps<StoryType extends Story = Story> {
 }
 
 interface Options {
-    extraStoryFields?: (keyof ExtraStoryFields)[];
+    extraStoryFields?: (keyof Story.ExtraFields)[];
     pageSize?: number;
 }
 

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

@@ -1,4 +1,4 @@
-import type { ExtraStoryFields, Story } from '@prezly/sdk';
+import type { Story } from '@prezly/sdk';
 import type {
     GetServerSidePropsContext,
     GetServerSidePropsResult,
@@ -21,7 +21,7 @@ export interface HomePageProps<StoryType extends Story = Story> {
 }
 
 interface Options {
-    extraStoryFields?: (keyof ExtraStoryFields)[];
+    extraStoryFields?: (keyof Story.ExtraFields)[];
     pageSize?: number;
 }
 

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

@@ -1,5 +1,5 @@
 import type { ExtendedStory } from '@prezly/sdk';
-import { StoryVisibility } from '@prezly/sdk';
+import { Story } from '@prezly/sdk';
 import { ArticleJsonLd, NextSeo } from 'next-seo';
 
 type Props = {
@@ -16,7 +16,7 @@ export function StorySeo({ story, noindex }: Props) {
 
     const authorName = author?.display_name || author?.email || 'Unknown';
     const description = subtitle || summary;
-    const indexable = newsroom.is_indexable && story.visibility === StoryVisibility.PUBLIC;
+    const indexable = newsroom.is_indexable && story.visibility === Story.Visibility.PUBLIC;
 
     return (
         <>

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

@@ -1,11 +1,12 @@
+import { createPrezlyClient } from '@prezly/sdk';
 import type {
     Category,
-    ExtraStoryFields,
     Newsroom,
     NewsroomLanguageSettings,
+    PrezlyClient,
+    Stories,
     Story,
 } from '@prezly/sdk';
-import PrezlySDK from '@prezly/sdk';
 import type { IncomingMessage } from 'http';
 
 import {
@@ -41,7 +42,7 @@ interface GetStoriesOptions {
     page?: number;
     pageSize?: number;
     order?: SortOrder;
-    include?: (keyof ExtraStoryFields)[];
+    include?: (keyof Story.ExtraFields)[];
     localeCode?: string;
 }
 
@@ -51,7 +52,7 @@ interface GetGalleriesOptions {
 }
 
 export class PrezlyApi {
-    private readonly sdk: PrezlySDK;
+    private readonly sdk: PrezlyClient;
 
     private readonly newsroomUuid: Newsroom['uuid'];
 
@@ -59,7 +60,7 @@ export class PrezlyApi {
 
     constructor(accessToken: string, newsroomUuid: Newsroom['uuid'], themeUuid?: string) {
         const baseUrl = process.env.API_BASE_URL_OVERRIDE ?? undefined;
-        this.sdk = new PrezlySDK({
+        this.sdk = createPrezlyClient({
             accessToken,
             baseUrl,
             // This returns stories created by legacy version of the editor in a format that can be displayed by the Prezly Content Renderer.
@@ -75,7 +76,8 @@ export class PrezlyApi {
         }
 
         try {
-            return await this.sdk.stories.get(uuid);
+            const story = await this.sdk.stories.get(uuid);
+            return story;
         } catch (error) {
             if (
                 isSdkError(error) &&
@@ -211,11 +213,10 @@ export class PrezlyApi {
         );
     }
 
-    searchStories: typeof PrezlySDK.prototype.stories.search = (options) =>
-        this.sdk.stories.search(options);
+    searchStories: Stories.Client['search'] = (options) => this.sdk.stories.search(options);
 
     async getGalleries({ page, pageSize }: GetGalleriesOptions) {
-        return this.sdk.newsroomGalleries.list(this.newsroomUuid, {
+        return this.sdk.newsroomGalleries.search(this.newsroomUuid, {
             limit: pageSize,
             offset:
                 typeof page === 'undefined' || typeof pageSize === 'undefined'
@@ -234,7 +235,8 @@ export class PrezlyApi {
         }
 
         try {
-            return await this.sdk.newsroomGalleries.get(this.newsroomUuid, uuid);
+            const gallery = await this.sdk.newsroomGalleries.get(this.newsroomUuid, uuid);
+            return gallery;
         } catch (error) {
             if (isSdkError(error) && error.status === 404) {
                 return null;

package/src/infinite-loading/useInfiniteStoriesLoading.ts

@@ -1,4 +1,4 @@
-import type { Category, ExtraStoryFields, Story } from '@prezly/sdk';
+import type { Category, Story } from '@prezly/sdk';
 import { useEffect } from 'react';
 
 import type { LocaleObject } from '../intl';
@@ -12,7 +12,7 @@ async function fetchStories<T extends Story = Story>(
     pageSize: number,
     category?: Category,
     locale?: LocaleObject,
-    include?: (keyof ExtraStoryFields)[],
+    include?: (keyof Story.ExtraFields)[],
 ): Promise<{ stories: T[] }> {
     const result = await fetch('/api/fetch-stories', {
         method: 'POST',
@@ -47,7 +47,7 @@ export function useInfiniteStoriesLoading<T extends Story = Story>(
     initialStories: T[],
     pagination: PaginationProps,
     category?: Category,
-    include?: (keyof ExtraStoryFields)[],
+    include?: (keyof Story.ExtraFields)[],
 ) {
     const currentLocale = useCurrentLocale();
 

package/src/intl/locale.test.ts

@@ -1,3 +1,4 @@
+import { jest } from '@jest/globals';
 import {
     DEFAULT_LOCALE,
     DUMMY_DEFAULT_LOCALE,

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

@@ -9,25 +9,26 @@ import { useCurrentCategory } from './useCurrentCategory';
 import { useCurrentStory } from './useCurrentStory';
 
 // Pulled from SDK types to not leak the `@prezly/sdk` dependency into the client bundle
-enum StoryVisibility {
+// It looks like a hack, but the name of enum must be the same as in SDK
+enum Visibility {
     PUBLIC = 'public',
     EMBARGO = 'embargo',
     PRIVATE = 'private',
     CONFIDENTIAL = 'confidential',
 }
 
-function getAllowedTranslationVisibilityValues(story: ExtendedStory): StoryVisibility[] {
+function getAllowedTranslationVisibilityValues(story: ExtendedStory): Visibility[] {
     const { visibility } = story;
 
     switch (visibility) {
-        case StoryVisibility.EMBARGO:
-            return [StoryVisibility.EMBARGO, StoryVisibility.PUBLIC];
-        case StoryVisibility.PRIVATE:
-            return [StoryVisibility.PRIVATE, StoryVisibility.PUBLIC];
-        case StoryVisibility.CONFIDENTIAL:
-            return [StoryVisibility.CONFIDENTIAL, StoryVisibility.PRIVATE, StoryVisibility.PUBLIC];
+        case Visibility.EMBARGO:
+            return [Visibility.EMBARGO, Visibility.PUBLIC];
+        case Visibility.PRIVATE:
+            return [Visibility.PRIVATE, Visibility.PUBLIC];
+        case Visibility.CONFIDENTIAL:
+            return [Visibility.CONFIDENTIAL, Visibility.PRIVATE, Visibility.PUBLIC];
         default:
-            return [StoryVisibility.PUBLIC];
+            return [Visibility.PUBLIC];
     }
 }
 

package/src/types.ts

@@ -1,4 +1,4 @@
-import type { CultureRef, ExtraStoryFields, Story } from '@prezly/sdk';
+import type { CultureRef, Story } from '@prezly/sdk';
 
 import type { NewsroomContextProps } from './newsroom-context';
 
@@ -30,7 +30,7 @@ export interface AlgoliaCategoryRef {
  * Stories in Algolia index are stored in a simplified format, with only minimal subset of fields.
  */
 export type AlgoliaStory = Pick<Story, 'uuid' | 'slug' | 'title' | 'subtitle'> &
-    Pick<ExtraStoryFields, 'thumbnail_image'> & {
+    Pick<Story.ExtraFields, 'thumbnail_image'> & {
         content_text: string;
         updated_at: number;
         published_at: number;