diff --git a/components/FieldTypesList.jsx b/components/FieldTypesList.jsx index 56f2a50..c40e4bb 100644 --- a/components/FieldTypesList.jsx +++ b/components/FieldTypesList.jsx @@ -45,7 +45,8 @@ export function FieldTypesList({ data }) { fieldType?.featuredImage?.node.altText ?? 'screenshot of the field type' } - className="m-auto shrink-0 text-center" + layout="responsive" + className="shrink-0" /> )}
diff --git a/components/Layout.jsx b/components/Layout.jsx index 0a8f0a6..d277681 100644 --- a/components/Layout.jsx +++ b/components/Layout.jsx @@ -1,5 +1,5 @@ import { gql } from '@apollo/client' -import { flatListToHierarchical } from '@faustwp/core' +import { flatListToHierarchical, useFaustQuery } from '@faustwp/core' import clsx from 'clsx' import Link from 'next/link' import { useCallback, useEffect, useState } from 'react' @@ -13,8 +13,8 @@ import { SiteHeader } from '@/components/SiteHeader' import { SitewideNotice } from '@/components/SitewideNotice' import { collectHeadings } from '@/lib/utils' -Layout.fragment = gql` - fragment LayoutFragment on RootQuery { +export const LAYOUT_QUERY = gql` + query LayoutFragment { ...SitewideNoticeFragment ...PrimaryNavigationFragment ...DocsSidebarNavigationFragment @@ -75,10 +75,10 @@ function useTableOfContents(tableOfContents) { return currentSection } -export function Layout({ data, children, toc, title }) { +export function Layout({ node, children, toc, title }) { + const { sitewideNotice, primaryMenuItems, footerMenuItems, docsSidebarMenuItems } = useFaustQuery(LAYOUT_QUERY); let tableOfContents = toc && toc.length ? collectHeadings(toc) : [] - const primaryMenuItems = data?.primaryMenuItems ?? [] const primaryNavigation = primaryMenuItems?.nodes ? flatListToHierarchical(primaryMenuItems.nodes, { idKey: 'id', @@ -86,7 +86,6 @@ export function Layout({ data, children, toc, title }) { parentKey: 'parentId', }) : [] - const footerMenuItems = data?.footerMenuItems ?? [] const footerNavigation = footerMenuItems?.nodes ? flatListToHierarchical(footerMenuItems.nodes, { idKey: 'id', @@ -94,7 +93,6 @@ export function Layout({ data, children, toc, title }) { parentKey: 'parentId', }) : [] - const docsSidebarMenuItems = data?.docsSidebarMenuItems ?? [] const docsSidebarNavigation = docsSidebarMenuItems?.nodes ? flatListToHierarchical(docsSidebarMenuItems.nodes, { idKey: 'id', @@ -105,13 +103,13 @@ export function Layout({ data, children, toc, title }) { let docsSidebarAllLinks = docsSidebarNavigation?.flatMap((section) => section.links) ?? [] let linkIndex = docsSidebarAllLinks.findIndex((link) => { - return link.href === data?.node?.uri + return link.href === node?.uri }) let previousPage = docsSidebarAllLinks[linkIndex - 1] let nextPage = docsSidebarAllLinks[linkIndex + 1] let section = docsSidebarAllLinks.find((section) => - section.links.find((link) => link.href === data?.node?.uri), + section.links.find((link) => link.href === node?.uri), ) let currentSection = useTableOfContents(tableOfContents) @@ -127,8 +125,8 @@ export function Layout({ data, children, toc, title }) { return ( <> - - + +
@@ -138,7 +136,9 @@ export function Layout({ data, children, toc, title }) {
diff --git a/components/LayoutArchive.jsx b/components/LayoutArchive.jsx index 6fdba42..d0704a6 100644 --- a/components/LayoutArchive.jsx +++ b/components/LayoutArchive.jsx @@ -10,8 +10,8 @@ import { SiteFooter } from '@/components/SiteFooter' import { SiteHeader } from '@/components/SiteHeader' import { SitewideNotice } from '@/components/SitewideNotice' -LayoutArchive.fragment = gql` - fragment LayoutArchiveFragment on RootQuery { +export const LAYOUT_ARCHIVE_QUERY = gql` + query LayoutArchive { ...SitewideNoticeFragment ...PrimaryNavigationFragment ...DocsSidebarNavigationFragment diff --git a/components/LayoutFrontPage.jsx b/components/LayoutFrontPage.jsx index eb0d0c8..4e23011 100644 --- a/components/LayoutFrontPage.jsx +++ b/components/LayoutFrontPage.jsx @@ -1,5 +1,5 @@ import { gql } from '@apollo/client' -import { flatListToHierarchical } from '@faustwp/core' +import { flatListToHierarchical, useFaustQuery } from '@faustwp/core' import { FooterNavigation } from './FooterNavigation' import { SiteFooter } from './SiteFooter' @@ -9,8 +9,8 @@ import { SiteHeader } from '@/components/SiteHeader' import { SitewideNotice } from '@/components/SitewideNotice' -LayoutFrontPage.fragment = gql` - fragment LayoutFrontPageFragment on RootQuery { +export const LAYOUT_FRONT_PAGE_QUERY = gql` + query LayoutFrontPageFragment { ...SitewideNoticeFragment ...PrimaryNavigationFragment ...FooterNavigationFragment @@ -20,8 +20,10 @@ LayoutFrontPage.fragment = gql` ${FooterNavigation.fragment} ` -export function LayoutFrontPage({ data, children }) { - const primaryMenuItems = data?.primaryMenuItems ?? [] +export function LayoutFrontPage({ children }) { + + const { sitewideNotice, primaryMenuItems, footerMenuItems } = useFaustQuery(LAYOUT_FRONT_PAGE_QUERY); + const primaryNavigation = primaryMenuItems?.nodes ? flatListToHierarchical(primaryMenuItems.nodes, { idKey: 'id', @@ -29,7 +31,6 @@ export function LayoutFrontPage({ data, children }) { parentKey: 'parentId', }) : [] - const footerMenuItems = data?.footerMenuItems ?? [] const footerNavigation = footerMenuItems?.nodes ? flatListToHierarchical(footerMenuItems.nodes, { idKey: 'id', @@ -39,8 +40,8 @@ export function LayoutFrontPage({ data, children }) { : [] return ( <> - - + +
{children}
diff --git a/package-lock.json b/package-lock.json index 80f87fb..12f7c65 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,8 +11,8 @@ "@docsearch/css": "^3.5.2", "@docsearch/react": "^3.5.2", "@faustwp/blocks": "^2.0.0", - "@faustwp/cli": "^1.1.4", - "@faustwp/core": "^1.1.2", + "@faustwp/cli": "^2.0.0", + "@faustwp/core": "^2.1.1", "@graphiql/react": "^0.20.2", "@graphiql/toolkit": "^0.9.1", "@headlessui/react": "^1.7.13", @@ -2365,20 +2365,18 @@ } }, "node_modules/@faustwp/cli": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@faustwp/cli/-/cli-1.2.0.tgz", - "integrity": "sha512-XRydGltBDwvhzuaYibltzAb80Tm5tRZwTTRhJYEq1cSZDECFNh/WVwDXgBmfzEtA8WoTOuyVyA5Sq0ngsjcLEw==", + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@faustwp/cli/-/cli-2.0.0.tgz", + "integrity": "sha512-L/wKyPElJbkljfsWSy66+VsfOavim5zsA1/BjWufQx/QquxgWDb+0p86OPAkmEfQw2OeIzRb7eVPU7OELlx6ww==", "dependencies": { "archiver": "^6.0.1", "chalk": "^4.1.2", - "configstore": "^6.0.0", "dotenv-flow": "^3.2.0", "form-data": "^4.0.0", "fs-extra": "^11.1.1", "glob-promise": "^6.0.5", "isomorphic-fetch": "^3.0.0", "lodash": "^4.17.21", - "uuid": "8.3.2", "webpack-cli": "5.1.4" }, "bin": { @@ -2454,9 +2452,9 @@ } }, "node_modules/@faustwp/core": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@faustwp/core/-/core-1.2.0.tgz", - "integrity": "sha512-ZVIoG1YZvFI5L53YNgW5IdFxCC+6fTkN+tEv8v3pY6xt7AlSiTLTJ3j9h7fVD78MrtDa49uHhgyKLB1uPEPYCw==", + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@faustwp/core/-/core-2.1.1.tgz", + "integrity": "sha512-JmqEQiUBIxtsqokvWLay+q8HcEes0d0xTLwb45Il3Fd1l+rffIFdPQHQeWMF2ga4b/WLqm+mMbkOKjzaYucTxQ==", "dependencies": { "@wordpress/hooks": "^3.14.0", "chalk": "^4.1.2", @@ -6826,24 +6824,6 @@ "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==" }, - "node_modules/configstore": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/configstore/-/configstore-6.0.0.tgz", - "integrity": "sha512-cD31W1v3GqUlQvbBCGcXmd2Nj9SvLDOP1oQ0YFuLETufzSPaKp11rYBsSOm7rCsW3OnIRAFM3OxRhceaXNYHkA==", - "dependencies": { - "dot-prop": "^6.0.1", - "graceful-fs": "^4.2.6", - "unique-string": "^3.0.0", - "write-file-atomic": "^3.0.3", - "xdg-basedir": "^5.0.1" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/yeoman/configstore?sponsor=1" - } - }, "node_modules/constant-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", @@ -7033,31 +7013,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/crypto-random-string": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-4.0.0.tgz", - "integrity": "sha512-x8dy3RnvYdlUcPOjkEHqozhiwzKNSq7GcPuXFbnyMOCHxX8V3OgIg/pYuabl2sbUPfIJaeAQB7PMOK8DFIdoRA==", - "dependencies": { - "type-fest": "^1.0.1" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, - "node_modules/crypto-random-string/node_modules/type-fest": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", - "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/cssesc": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", @@ -7416,20 +7371,6 @@ "tslib": "^2.0.3" } }, - "node_modules/dot-prop": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-6.0.1.tgz", - "integrity": "sha512-tE7ztYzXHIeyvc7N+hR3oi7FIbf/NIjVP9hmAt3yMXzrQ072/fpjGLx2GxNxGxUl5V73MEqYzioOMoVhGMJ5cA==", - "dependencies": { - "is-obj": "^2.0.0" - }, - "engines": { - "node": ">=10" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/dotenv": { "version": "8.6.0", "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz", @@ -9310,6 +9251,7 @@ "version": "0.1.4", "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz", "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==", + "dev": true, "engines": { "node": ">=0.8.19" } @@ -9633,14 +9575,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/is-obj": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-2.0.0.tgz", - "integrity": "sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==", - "engines": { - "node": ">=8" - } - }, "node_modules/is-path-inside": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz", @@ -9782,11 +9716,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/is-typedarray": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz", - "integrity": "sha512-cyA56iCMHAh5CdzjJIa4aohJyeO1YbwLi3Jc35MmRU6poroFjIGZzUzupGiRPOjgHg9TLu43xbpwXk523fMxKA==" - }, "node_modules/is-weakmap": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz", @@ -14579,7 +14508,8 @@ "node_modules/signal-exit": { "version": "3.0.7", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", - "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==" + "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==", + "dev": true }, "node_modules/simple-functional-loader": { "version": "1.2.1", @@ -15477,14 +15407,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/typedarray-to-buffer": { - "version": "3.1.5", - "resolved": "https://registry.npmjs.org/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz", - "integrity": "sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q==", - "dependencies": { - "is-typedarray": "^1.0.0" - } - }, "node_modules/typescript": { "version": "5.2.2", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz", @@ -15582,20 +15504,6 @@ "url": "https://opencollective.com/unified" } }, - "node_modules/unique-string": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-3.0.0.tgz", - "integrity": "sha512-VGXBUVwxKMBUznyffQweQABPRRW1vHZAbadFZud4pLFAqRGvv/96vafgjWFqzourzr8YonlQiPgH0YCJfawoGQ==", - "dependencies": { - "crypto-random-string": "^4.0.0" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/unist-util-is": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-5.2.1.tgz", @@ -15785,14 +15693,6 @@ "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==" }, - "node_modules/uuid": { - "version": "8.3.2", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz", - "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==", - "bin": { - "uuid": "dist/bin/uuid" - } - }, "node_modules/uvu": { "version": "0.5.6", "resolved": "https://registry.npmjs.org/uvu/-/uvu-0.5.6.tgz", @@ -16182,28 +16082,6 @@ "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==" }, - "node_modules/write-file-atomic": { - "version": "3.0.3", - "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-3.0.3.tgz", - "integrity": "sha512-AvHcyZ5JnSfq3ioSyjrBkH9yW4m7Ayk8/9My/DD9onKeu/94fwrMocemO2QAJFAlnnDN+ZDS+ZjAR5ua1/PV/Q==", - "dependencies": { - "imurmurhash": "^0.1.4", - "is-typedarray": "^1.0.0", - "signal-exit": "^3.0.2", - "typedarray-to-buffer": "^3.1.5" - } - }, - "node_modules/xdg-basedir": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-5.1.0.tgz", - "integrity": "sha512-GCPAHLvrIH13+c0SuacwvRYj2SxJXQ4kaVTT5xgL3kPrz56XxkF21IGhjSE1+W0aw7gpBWRGXLCPnPby6lSpmQ==", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/y18n": { "version": "5.0.8", "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz", diff --git a/package.json b/package.json index b1c9c87..fcea077 100644 --- a/package.json +++ b/package.json @@ -17,8 +17,8 @@ "@docsearch/css": "^3.5.2", "@docsearch/react": "^3.5.2", "@faustwp/blocks": "^2.0.0", - "@faustwp/cli": "^1.1.4", - "@faustwp/core": "^1.1.2", + "@faustwp/cli": "^2.0.0", + "@faustwp/core": "^2.1.1", "@graphiql/react": "^0.20.2", "@graphiql/toolkit": "^0.9.1", "@headlessui/react": "^1.7.13", diff --git a/wp-blocks/AcfFieldTypeConfigurationBlock.js b/wp-blocks/AcfFieldTypeConfigurationBlock.js index be77ab5..be4b9d2 100644 --- a/wp-blocks/AcfFieldTypeConfigurationBlock.js +++ b/wp-blocks/AcfFieldTypeConfigurationBlock.js @@ -61,6 +61,11 @@ function TabContent({ fieldTypeConfigurationBlockFields, uniqueId, format }) { export function AcfFieldTypeConfigurationBlock({ fieldTypeConfigurationBlockFields }) { const { acfFieldType } = fieldTypeConfigurationBlockFields; + const [uniqueId, setUniqueId] = useState(''); + useEffect(() => { + setUniqueId(stringToHash(acfFieldType)); + }, [acfFieldType]); + if ( ! acfFieldType ) { return ( @@ -70,11 +75,6 @@ export function AcfFieldTypeConfigurationBlock({ fieldTypeConfigurationBlockFiel ); }; - const [uniqueId, setUniqueId] = useState(''); - - useEffect(() => { - setUniqueId(stringToHash(acfFieldType)); - }, [acfFieldType]); const tabData = [ { key: 'php', name: 'PHP' }, diff --git a/wp-blocks/AcfFieldTypeSettingsBlock.js b/wp-blocks/AcfFieldTypeSettingsBlock.js index 6246348..640105c 100644 --- a/wp-blocks/AcfFieldTypeSettingsBlock.js +++ b/wp-blocks/AcfFieldTypeSettingsBlock.js @@ -48,7 +48,7 @@ export function AcfFieldTypeSettingsBlock({ fieldTypeSettingsBlockFields }) { }; - if ( ! fieldTypeSettings?.nodes?.length ) { + if ( fieldTypeSettings?.nodes?.length === 0 ) { return ( @@ -59,7 +59,7 @@ export function AcfFieldTypeSettingsBlock({ fieldTypeSettingsBlockFields }) { } // copy the nodes so we can sort them before returning - const settings = [...fieldTypeSettings?.nodes]; + const settings = [...fieldTypeSettings.nodes]; // sort by name settings.sort((a, b) => { diff --git a/wp-blocks/index.js b/wp-blocks/index.js index 9636478..18dc9c1 100644 --- a/wp-blocks/index.js +++ b/wp-blocks/index.js @@ -1,5 +1,4 @@ import { CoreBlocks } from '@faustwp/blocks' - import { AcfFieldTypeConfigurationBlock } from './AcfFieldTypeConfigurationBlock' import { AcfFieldTypeSettingsBlock } from './AcfFieldTypeSettingsBlock' import { AcfGraphqlQuery } from './AcfGraphqlQuery' diff --git a/wp-templates/IndexTemplate.js b/wp-templates/IndexTemplate.js index 1bd0399..bb9d958 100644 --- a/wp-templates/IndexTemplate.js +++ b/wp-templates/IndexTemplate.js @@ -1,13 +1,62 @@ import { gql } from '@apollo/client' import { WordPressBlocksViewer } from '@faustwp/blocks' -import { flatListToHierarchical } from '@faustwp/core' +import { flatListToHierarchical, useFaustQuery } from '@faustwp/core' import Head from 'next/head' -import { Layout } from '@/components/Layout' +import { LAYOUT_QUERY, Layout } from '@/components/Layout' import blocks from '@/wp-blocks' -export const IndexTemplate = ({ data }) => { - const { node } = data +const INDEX_TEMPLATE_QUERY = gql` +query IndexTemplate($uri: String!) { + node: nodeByUri(uri: $uri) { + __typename + uri + ...on NodeWithTitle { + title + } + ...on NodeWithEditorBlocks { + editorBlocks { + __typename + name + renderedHtml + id: clientId + parentId: parentClientId + ...${blocks.CoreParagraph.fragments.key} + ...${blocks.CoreColumns.fragments.key} + ...${blocks.CoreColumn.fragments.key} + ...${blocks.CoreCode.fragments.key} + ...${blocks.CoreButtons.fragments.key} + ...${blocks.CoreButton.fragments.key} + ...${blocks.CoreQuote.fragments.key} + ...${blocks.CoreImage.fragments.key} + ...${blocks.CoreSeparator.fragments.key} + ...${blocks.CoreList.fragments.key} + ...${blocks.CoreHeading.fragments.key} + } + } + ...on ContentNode { + modified + ...on NodeWithContentEditor { + content + } + } + } +} +${blocks.CoreParagraph.fragments.entry} +${blocks.CoreColumns.fragments.entry} +${blocks.CoreColumn.fragments.entry} +${blocks.CoreCode.fragments.entry} +${blocks.CoreButtons.fragments.entry} +${blocks.CoreButton.fragments.entry} +${blocks.CoreQuote.fragments.entry} +${blocks.CoreImage.fragments.entry} +${blocks.CoreSeparator.fragments.entry} +${blocks.CoreList.fragments.entry} +${blocks.CoreHeading.fragments.entry} +` + +export const IndexTemplate = () => { + const { node } = useFaustQuery(INDEX_TEMPLATE_QUERY) if (!node) { return null @@ -54,9 +103,8 @@ export const IndexTemplate = ({ data }) => { {node?.modified && (
@@ -83,55 +131,12 @@ export const IndexTemplate = ({ data }) => { ) } -IndexTemplate.query = gql` -query IndexTemplate($uri: String!) { - node: nodeByUri(uri: $uri) { - __typename - uri - ...on NodeWithTitle { - title - } - ...on NodeWithEditorBlocks { - editorBlocks { - __typename - name - renderedHtml - id: clientId - parentId: parentClientId - ...${blocks.CoreParagraph.fragments.key} - ...${blocks.CoreColumns.fragments.key} - ...${blocks.CoreColumn.fragments.key} - ...${blocks.CoreCode.fragments.key} - ...${blocks.CoreButtons.fragments.key} - ...${blocks.CoreButton.fragments.key} - ...${blocks.CoreQuote.fragments.key} - ...${blocks.CoreImage.fragments.key} - ...${blocks.CoreSeparator.fragments.key} - ...${blocks.CoreList.fragments.key} - ...${blocks.CoreHeading.fragments.key} - } - } - ...on ContentNode { - modified - ...on NodeWithContentEditor { - content - } - } - } - ...LayoutFragment -} -${blocks.CoreParagraph.fragments.entry} -${blocks.CoreColumns.fragments.entry} -${blocks.CoreColumn.fragments.entry} -${blocks.CoreCode.fragments.entry} -${blocks.CoreButtons.fragments.entry} -${blocks.CoreButton.fragments.entry} -${blocks.CoreQuote.fragments.entry} -${blocks.CoreImage.fragments.entry} -${blocks.CoreSeparator.fragments.entry} -${blocks.CoreList.fragments.entry} -${blocks.CoreHeading.fragments.entry} -${Layout.fragment} -` - -IndexTemplate.variables = ({ uri }) => ({ uri }) +IndexTemplate.queries = [ + { + query: LAYOUT_QUERY, + }, + { + query: INDEX_TEMPLATE_QUERY, + variables: ({ uri }) => ({ uri }), + } +]; \ No newline at end of file diff --git a/wp-templates/archive-field_type.js b/wp-templates/archive-field_type.js index 2cf7648..c98cd0f 100644 --- a/wp-templates/archive-field_type.js +++ b/wp-templates/archive-field_type.js @@ -1,39 +1,12 @@ import { gql } from '@apollo/client' +import { useFaustQuery } from "@faustwp/core"; import Head from 'next/head' import { FieldTypesList } from '@/components/FieldTypesList' -import { LayoutArchive } from '@/components/LayoutArchive' +import { LayoutArchive, LAYOUT_ARCHIVE_QUERY } from '@/components/LayoutArchive' -export const ArchiveFieldType = (props) => { - const { data } = props - - const { node } = data - - if (!node) { - return null - } - - let toc = [] - - return ( - <> - - {`${data?.node?.label} - WPGraphQL for ACF`} - - - - - - ) -} - -ArchiveFieldType.query = gql` - query GetArchiveFieldType($uri: String!) { +export const GET_POST_QUERY = gql` + query GetPost($uri: String!) { node: nodeByUri(uri: $uri) { __typename uri @@ -62,9 +35,49 @@ ArchiveFieldType.query = gql` } } } - ...LayoutArchiveFragment } - ${LayoutArchive.fragment} -` +`; -ArchiveFieldType.variables = ({ uri }) => ({ uri }) +export const ArchiveFieldType = () => { + const { node } = useFaustQuery(GET_POST_QUERY); + const { + docsSidebarMenuItems, + footerMenuItems, + primaryMenuItems, + sitewideNotice + } = useFaustQuery(LAYOUT_ARCHIVE_QUERY); + + if (!node) { + return null + } + + return ( + <> + + {`${node?.label} - WPGraphQL for ACF`} + + + + + + ) +} + +ArchiveFieldType.queries = [ + { + query: LAYOUT_ARCHIVE_QUERY, + }, + { + query: GET_POST_QUERY, + variables: ({ uri }) => ({ uri }), + } +]; diff --git a/wp-templates/archive.js b/wp-templates/archive.js index e4db2da..1144c6b 100644 --- a/wp-templates/archive.js +++ b/wp-templates/archive.js @@ -1,29 +1,11 @@ import { gql } from '@apollo/client' +import { useFaustQuery } from "@faustwp/core"; import Head from 'next/head' -import { LayoutArchive } from '@/components/LayoutArchive' +import { LayoutArchive, LAYOUT_ARCHIVE_QUERY } from '@/components/LayoutArchive' -export const Archive = (props) => { - const { data } = props - - return ( - <> - - {`${data?.node?.name} - WPGraphQL for ACF`} - - - {/* 
{JSON.stringify(props, null, 2)}
*/} - - - ) -} - -Archive.query = gql` - query GetArchive($uri: String!) { +const ARCHIVE_QUERY = gql` + query Archive($uri: String!) { node: nodeByUri(uri: $uri) { __typename uri @@ -41,14 +23,50 @@ Archive.query = gql` } } } - ...LayoutArchiveFragment } - ${LayoutArchive.fragment} ` -Archive.variables = (seedNode) => { - console.log({seedNode}); - return { - uri: seedNode.uri - }; +export const Archive = () => { + const { node } = useFaustQuery(ARCHIVE_QUERY); + const { + docsSidebarMenuItems, + footerMenuItems, + primaryMenuItems, + sitewideNotice + } = useFaustQuery(LAYOUT_ARCHIVE_QUERY); + + return ( + <> + + {`${node?.name} - WPGraphQL for ACF`} + + + {/* 
{JSON.stringify(props, null, 2)}
*/} + + + ) } + + +Archive.queries = [ + { + query: LAYOUT_ARCHIVE_QUERY, + }, + { + query: ARCHIVE_QUERY, + variables: (seedNode) => { + return { + uri: seedNode.uri + } + } + } +]; diff --git a/wp-templates/front-page.js b/wp-templates/front-page.js index 2aadb83..fd2c3c4 100644 --- a/wp-templates/front-page.js +++ b/wp-templates/front-page.js @@ -4,32 +4,10 @@ import HomepageLayoutsLayoutsFaqsLayout from '@/components/HomepageLayoutsLayout import HomepageLayoutsLayoutsFeaturesLayout from '@/components/HomepageLayoutsLayoutsFeaturesLayout' import HomepageLayoutsLayoutsHeroLayout from '@/components/HomepageLayoutsLayoutsHeroLayout' import HomepageLayoutsLayoutsSupportedFieldTypesLayout from '@/components/HomepageLayoutsLayoutsSupportedFieldTypesLayout' -import { LayoutFrontPage } from '@/components/LayoutFrontPage' +import { LayoutFrontPage, LAYOUT_FRONT_PAGE_QUERY } from '@/components/LayoutFrontPage' +import { useFaustQuery } from '@faustwp/core' -export const FrontPage = ({ data }) => { - return ( - - {data?.frontPage?.homepageLayouts?.layouts?.map((layout, i) => { - switch (layout.__typename) { - case 'HomepageLayoutsLayoutsHeroLayout': - return - case 'HomepageLayoutsLayoutsFeaturesLayout': - return - case 'HomepageLayoutsLayoutsSupportedFieldTypesLayout': - return ( - - ) - case 'HomepageLayoutsLayoutsFaqsLayout': - return - default: - return 
{JSON.stringify(layout, null, 2)}
- } - })} - - ) -} - -FrontPage.query = gql` +const FRONT_PAGE_QUERY = gql` query GetFrontPage($uri: String!) { frontPage: nodeByUri(uri: $uri) { __typename @@ -53,13 +31,47 @@ FrontPage.query = gql` } } } - ...LayoutFrontPageFragment } ${HomepageLayoutsLayoutsHeroLayout.fragment} ${HomepageLayoutsLayoutsFeaturesLayout.fragment} ${HomepageLayoutsLayoutsSupportedFieldTypesLayout.fragment} ${HomepageLayoutsLayoutsFaqsLayout.fragment} - ${LayoutFrontPage.fragment} -` +`; + +export const FrontPage = () => { + + const { frontPage } = useFaustQuery(FRONT_PAGE_QUERY); + + return ( + + {frontPage?.homepageLayouts?.layouts?.map((layout, i) => { + switch (layout.__typename) { + case 'HomepageLayoutsLayoutsHeroLayout': + return + case 'HomepageLayoutsLayoutsFeaturesLayout': + return + case 'HomepageLayoutsLayoutsSupportedFieldTypesLayout': + return ( + + ) + case 'HomepageLayoutsLayoutsFaqsLayout': + return + default: + return 
{JSON.stringify(layout, null, 2)}
+ } + })} + + ) +} + + +FrontPage.queries = [ + { + query: LAYOUT_FRONT_PAGE_QUERY, + }, + { + query: FRONT_PAGE_QUERY, + variables: ({ uri }) => ({ uri }), + }, +] -FrontPage.variables = ({ uri }) => ({ uri }) diff --git a/wp-templates/single-field_type.js b/wp-templates/single-field_type.js index 55ba9c8..ed867ae 100644 --- a/wp-templates/single-field_type.js +++ b/wp-templates/single-field_type.js @@ -1,18 +1,81 @@ import { gql } from '@apollo/client' import { WordPressBlocksViewer } from '@faustwp/blocks' -import { flatListToHierarchical } from '@faustwp/core' +import { flatListToHierarchical, useFaustQuery } from '@faustwp/core' import { Separator } from '@radix-ui/react-separator' import Head from 'next/head' -import { Layout } from '@/components/Layout' +import { Layout, LAYOUT_QUERY } from '@/components/Layout' import { Badge } from '@/components/ui/badge' import blocks from '@/wp-blocks' import { AcfFieldTypeConfigurationBlock } from '@/wp-blocks/AcfFieldTypeConfigurationBlock' import { AcfFieldTypeSettingsBlock } from '@/wp-blocks/AcfFieldTypeSettingsBlock' import { AcfGraphqlQuery } from '@/wp-blocks/AcfGraphqlQuery' -export const SingleFieldType = ({ data }) => { - const { node } = data +const aCFFieldTypeCategoriesFragment = gql` + fragment aCFFieldTypeCategoriesFragment on FieldType { + aCFFieldTypeCategories { + nodes { + id + name + } + } + } +` + +const SINGLE_ACF_FIELD_TYPE_QUERY = gql` +query SingleAcfFieldType($uri: String!) { + node: nodeByUri(uri: $uri) { + __typename + uri + ...on FieldType { + title + # content + modified + editorBlocks { + __typename + name + renderedHtml + id: clientId + parentId: parentClientId + ...${blocks.CoreParagraph.fragments.key} + ...${blocks.CoreColumns.fragments.key} + ...${blocks.CoreColumn.fragments.key} + ...${blocks.CoreCode.fragments.key} + ...${blocks.CoreButtons.fragments.key} + ...${blocks.CoreButton.fragments.key} + ...${blocks.CoreQuote.fragments.key} + ...${blocks.CoreImage.fragments.key} + ...${blocks.CoreSeparator.fragments.key} + ...${blocks.CoreList.fragments.key} + ...${blocks.CoreHeading.fragments.key} + ...${AcfFieldTypeSettingsBlock.fragments.key} + ...${AcfFieldTypeConfigurationBlock.fragments.key} + ...${AcfGraphqlQuery.fragments.key} + } + } + ...aCFFieldTypeCategoriesFragment + } +} +${aCFFieldTypeCategoriesFragment} +${AcfFieldTypeSettingsBlock.fragments.entry} +${AcfFieldTypeConfigurationBlock.fragments.entry} +${AcfGraphqlQuery.fragments.entry} + +${blocks.CoreParagraph.fragments.entry} +${blocks.CoreColumns.fragments.entry} +${blocks.CoreColumn.fragments.entry} +${blocks.CoreCode.fragments.entry} +${blocks.CoreButtons.fragments.entry} +${blocks.CoreButton.fragments.entry} +${blocks.CoreQuote.fragments.entry} +${blocks.CoreImage.fragments.entry} +${blocks.CoreSeparator.fragments.entry} +${blocks.CoreList.fragments.entry} +${blocks.CoreHeading.fragments.entry} +` + +export const SingleFieldType = () => { + const { node } = useFaustQuery(SINGLE_ACF_FIELD_TYPE_QUERY) if (!node) { return null @@ -50,7 +113,7 @@ export const SingleFieldType = ({ data }) => { {`${title} - WPGraphQL for ACF`} - +

{title}

{node?.aCFFieldTypeCategories && node?.aCFFieldTypeCategories?.nodes && (
@@ -79,69 +142,12 @@ export const SingleFieldType = ({ data }) => { ) } -const aCFFieldTypeCategoriesFragment = gql` - fragment aCFFieldTypeCategoriesFragment on FieldType { - aCFFieldTypeCategories { - nodes { - id - name - } - } - } -` - -SingleFieldType.query = gql` -query SingleAcfFieldType($uri: String!) { - ...LayoutFragment - node: nodeByUri(uri: $uri) { - __typename - uri - ...on FieldType { - title - # content - modified - editorBlocks { - __typename - name - renderedHtml - id: clientId - parentId: parentClientId - ...${blocks.CoreParagraph.fragments.key} - ...${blocks.CoreColumns.fragments.key} - ...${blocks.CoreColumn.fragments.key} - ...${blocks.CoreCode.fragments.key} - ...${blocks.CoreButtons.fragments.key} - ...${blocks.CoreButton.fragments.key} - ...${blocks.CoreQuote.fragments.key} - ...${blocks.CoreImage.fragments.key} - ...${blocks.CoreSeparator.fragments.key} - ...${blocks.CoreList.fragments.key} - ...${blocks.CoreHeading.fragments.key} - ...${AcfFieldTypeSettingsBlock.fragments.key} - ...${AcfFieldTypeConfigurationBlock.fragments.key} - ...${AcfGraphqlQuery.fragments.key} - } - } - ...aCFFieldTypeCategoriesFragment - } -} -${Layout.fragment} -${aCFFieldTypeCategoriesFragment} -${AcfFieldTypeSettingsBlock.fragments.entry} -${AcfFieldTypeConfigurationBlock.fragments.entry} -${AcfGraphqlQuery.fragments.entry} - -${blocks.CoreParagraph.fragments.entry} -${blocks.CoreColumns.fragments.entry} -${blocks.CoreColumn.fragments.entry} -${blocks.CoreCode.fragments.entry} -${blocks.CoreButtons.fragments.entry} -${blocks.CoreButton.fragments.entry} -${blocks.CoreQuote.fragments.entry} -${blocks.CoreImage.fragments.entry} -${blocks.CoreSeparator.fragments.entry} -${blocks.CoreList.fragments.entry} -${blocks.CoreHeading.fragments.entry} -` - -SingleFieldType.variables = ({ uri }) => ({ uri }) +SingleFieldType.queries = [ + { + query: LAYOUT_QUERY, + }, + { + query: SINGLE_ACF_FIELD_TYPE_QUERY, + variables: ({ uri }) => ({ uri }), + }, +]; \ No newline at end of file