From d9b6d99625f6956bf3c4adfc92fc69dbec4ea59c Mon Sep 17 00:00:00 2001
From: Tom Marshall <tommarshall7@gmail.com>
Date: Wed, 25 May 2022 16:36:40 +0100
Subject: [PATCH] Update `cms-kontent` example SDK package to v11 (#37187)

* Updates the Kontent Delivery SDK from v9 to v11.
* Updates the `lib/api.js` code that utilises the SDK accordingly.
* Removes `rxjs` as this is no longer a dependency of the Kontent
  Delivery SDK in v11.
* Updates other packages to the latest versions, including `react`.

Ref:
* https://kontent.ai/blog/news-in-javascript-sdks/

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`
---
 examples/cms-kontent/lib/api.js   | 39 ++++++++++++++-----------------
 examples/cms-kontent/package.json | 13 +++++------
 2 files changed, 24 insertions(+), 28 deletions(-)

diff --git a/examples/cms-kontent/lib/api.js b/examples/cms-kontent/lib/api.js
index e764e982e9f43..42f75367e6e5d 100644
--- a/examples/cms-kontent/lib/api.js
+++ b/examples/cms-kontent/lib/api.js
@@ -16,31 +16,32 @@ const client = new DeliveryClient({
 
 function parseAuthor(author) {
   return {
-    name: author.name.value,
-    picture: author.picture.value[0].url,
+    name: author.elements.name.value,
+    picture: author.elements.picture.value[0].url,
   }
 }
 
 function parsePost(post) {
   return {
-    title: post.title.value,
-    slug: post.slug.value,
-    date: post.date.value.toISOString(),
-    content: post.content.value,
-    excerpt: post.excerpt.value,
-    coverImage: post.cover_image.value[0].url,
-    author: parseAuthor(post.author.value[0]),
+    title: post.elements.title.value,
+    slug: post.elements.slug.value,
+    date: post.elements.date.value,
+    content: post.elements.content.value,
+    excerpt: post.elements.excerpt.value,
+    coverImage: post.elements.cover_image.value[0].url,
+    author: parseAuthor(post.elements.author.linkedItems[0]),
   }
 }
 
 export async function getAllPostSlugs() {
-  const postsResponse = await client
+  return await client
     .items()
     .type('post')
     .elementsParameter(['slug'])
     .toPromise()
-
-  return postsResponse.items.map((post) => post.slug.value)
+    .then((response) =>
+      response.data.items.map((post) => post.elements.slug.value)
+    )
 }
 
 export async function getMorePostsForSlug(slug, preview) {
@@ -51,16 +52,14 @@ export async function getMorePostsForSlug(slug, preview) {
     })
     .type('post')
     .orderByDescending('elements.date')
-    .withParameter('elements.slug[neq]', slug)
+    .notEqualsFilter('elements.slug', slug)
     .limitParameter(2)
     .toPromise()
-    .then((res) => {
-      return res.items.map((post) => parsePost(post))
-    })
+    .then((response) => response.data.items.map((post) => parsePost(post)))
 }
 
 export async function getPostBySlug(slug, preview) {
-  const post = await client
+  return await client
     .items()
     .queryConfig({
       usePreviewMode: !!preview,
@@ -68,9 +67,7 @@ export async function getPostBySlug(slug, preview) {
     .type('post')
     .equalsFilter('elements.slug', slug)
     .toPromise()
-    .then((result) => result.getFirstItem())
-    .then((post) => parsePost(post))
-  return post
+    .then((response) => parsePost(response.data.items[0]))
 }
 
 export async function getAllPosts(preview) {
@@ -82,5 +79,5 @@ export async function getAllPosts(preview) {
     .type('post')
     .orderByDescending('elements.date')
     .toPromise()
-    .then((postsResponse) => postsResponse.items.map((post) => parsePost(post)))
+    .then((response) => response.data.items.map((post) => parsePost(post)))
 }
diff --git a/examples/cms-kontent/package.json b/examples/cms-kontent/package.json
index 26e8bde64b13c..81ccbfbfb88d3 100644
--- a/examples/cms-kontent/package.json
+++ b/examples/cms-kontent/package.json
@@ -6,20 +6,19 @@
     "start": "next start"
   },
   "dependencies": {
-    "@kentico/kontent-delivery": "^9.2.0",
+    "@kentico/kontent-delivery": "^11.13.0",
     "classnames": "2.3.1",
     "date-fns": "2.28.0",
     "gray-matter": "4.0.3",
     "next": "latest",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
     "remark": "14.0.2",
-    "remark-html": "15.0.1",
-    "rxjs": "^6.6.2"
+    "remark-html": "15.0.1"
   },
   "devDependencies": {
-    "autoprefixer": "10.4.2",
-    "postcss": "8.4.5",
+    "autoprefixer": "10.4.7",
+    "postcss": "8.4.14",
     "tailwindcss": "^3.0.15"
   }
 }