From 923450543a035168ba41283b5ba16c187408f959 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?N=C3=ADcholas=20Oliveira?= Date: Tue, 16 Jul 2024 23:18:27 -0300 Subject: [PATCH] feat: query block poc --- package-lock.json | 105 ++++++++++++++++++ .../next/src/rsc/data/queries/prepareQuery.ts | 3 +- .../next/src/rsc/data/queries/queryPosts.ts | 4 +- packages/next/src/rsc/data/queries/types.ts | 1 + .../src/app/(single)/[...path]/page.tsx | 5 +- .../wp-nextjs-app/src/components/Blocks.tsx | 18 +++ .../src/components/Blocks/PostList.tsx | 40 +++++++ 7 files changed, 171 insertions(+), 5 deletions(-) create mode 100644 projects/wp-nextjs-app/src/components/Blocks.tsx create mode 100644 projects/wp-nextjs-app/src/components/Blocks/PostList.tsx diff --git a/package-lock.json b/package-lock.json index 8e51dda3c..fa4e4eeef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21452,6 +21452,111 @@ "engines": { "node": ">=16.0.0" } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-darwin-arm64": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz", + "integrity": "sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-darwin-x64": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz", + "integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-linux-arm64-gnu": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz", + "integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-linux-arm64-musl": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz", + "integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-win32-arm64-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz", + "integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-win32-ia32-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz", + "integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "projects/wp-nextjs-app/node_modules/@next/swc-win32-x64-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.3.tgz", + "integrity": "sha512-Q1/zm43RWynxrO7lW4ehciQVj+5ePBhOK+/K2P7pLFX3JaJ/IZVC69SHidrmZSOkqz7ECIOhhy7XhAFG4JYyHA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } } } } diff --git a/packages/next/src/rsc/data/queries/prepareQuery.ts b/packages/next/src/rsc/data/queries/prepareQuery.ts index 0c71b12ca..cd6a68b48 100644 --- a/packages/next/src/rsc/data/queries/prepareQuery.ts +++ b/packages/next/src/rsc/data/queries/prepareQuery.ts @@ -15,7 +15,7 @@ export function prepareQuery

( query: NextQueryProps

, _config: HeadlessConfig | undefined = undefined, ) { - const { routeParams, ...rest } = query; + const { routeParams, handleError = true, ...rest } = query; const path = routeParams?.path ?? ''; const siteConfig = routeParams?.site @@ -45,5 +45,6 @@ export function prepareQuery

( options, path: pathname, config: config ?? getHeadstartWPConfig(), + handleError, }; } diff --git a/packages/next/src/rsc/data/queries/queryPosts.ts b/packages/next/src/rsc/data/queries/queryPosts.ts index 690341101..adde7507a 100644 --- a/packages/next/src/rsc/data/queries/queryPosts.ts +++ b/packages/next/src/rsc/data/queries/queryPosts.ts @@ -7,14 +7,14 @@ export async function queryPosts< T extends PostEntity = PostEntity, P extends PostsArchiveParams = PostsArchiveParams, >(q: NextQueryProps

= {}, _config: HeadlessConfig | undefined = undefined) { - const { config, ...query } = prepareQuery

(q, _config); + const { config, handleError, ...query } = prepareQuery

(q, _config); try { const result = await fetchPosts(query, config); return result; } catch (error) { - if (error instanceof Error) { + if (error instanceof Error && handleError) { await handleFetchError(error, config, query.path); } throw error; diff --git a/packages/next/src/rsc/data/queries/types.ts b/packages/next/src/rsc/data/queries/types.ts index 1838f33d7..41452dff8 100644 --- a/packages/next/src/rsc/data/queries/types.ts +++ b/packages/next/src/rsc/data/queries/types.ts @@ -6,4 +6,5 @@ export type NextQueryProps

= { site?: string; [k: string]: unknown; }; + handleError?: boolean; } & Omit, 'path'>; diff --git a/projects/wp-nextjs-app/src/app/(single)/[...path]/page.tsx b/projects/wp-nextjs-app/src/app/(single)/[...path]/page.tsx index 4fd359fe4..979cc343b 100644 --- a/projects/wp-nextjs-app/src/app/(single)/[...path]/page.tsx +++ b/projects/wp-nextjs-app/src/app/(single)/[...path]/page.tsx @@ -1,5 +1,6 @@ -import { BlocksRenderer, HtmlDecoder } from '@headstartwp/core/react'; +import { HtmlDecoder } from '@headstartwp/core/react'; import { HeadstartWPRoute, queryPost } from '@headstartwp/next/app'; +import Blocks from '../../../components/Blocks'; const Single = async ({ params }: HeadstartWPRoute) => { const { data } = await queryPost({ @@ -20,7 +21,7 @@ const Single = async ({ params }: HeadstartWPRoute) => { - + ); }; diff --git a/projects/wp-nextjs-app/src/components/Blocks.tsx b/projects/wp-nextjs-app/src/components/Blocks.tsx new file mode 100644 index 000000000..8c6d23424 --- /dev/null +++ b/projects/wp-nextjs-app/src/components/Blocks.tsx @@ -0,0 +1,18 @@ +import { BlocksRenderer } from '@headstartwp/core/react'; +import React from 'react'; +import { isBlockByName } from '@headstartwp/core'; +import { PostList } from './Blocks/PostList'; + +type BlockProps = { + html: string; +}; + +const Blocks: React.FC = ({ html }) => { + return ( + + isBlockByName(node, 'core/query')} /> + + ); +}; + +export default Blocks; diff --git a/projects/wp-nextjs-app/src/components/Blocks/PostList.tsx b/projects/wp-nextjs-app/src/components/Blocks/PostList.tsx new file mode 100644 index 000000000..250ff5987 --- /dev/null +++ b/projects/wp-nextjs-app/src/components/Blocks/PostList.tsx @@ -0,0 +1,40 @@ +import { BlockProps } from '@headstartwp/core/react'; +import { queryPosts } from '@headstartwp/next/app'; + +interface PostListProps + extends BlockProps<{ queryId: number; query: { perPage: number; postType: string } }> {} + +export const PostList: React.FC = async ({ block }) => { + if (!block) { + return null; + } + + const { query } = block.attributes; + + const { + data: { posts }, + } = await queryPosts({ + // todo: map the rest of the query object + params: { per_page: query.perPage, postType: query.postType }, + // setting handle error to false will disable automatic handling of errors + // i.e you have to handle the error yourself + handleError: false, + }); + + return ( + <> +

Post List

+ 
+				{JSON.stringify({ query }, null, 2)}
+
+ + + + ); +};