getClient
getClient is a function that returns the ApolloClient making it available for use. It is part of the @faustwp/experimental-app-router package.
Usage
Here is an example layout that imports getClient and uses query to query WPGraphQL:
import { gql } from '@apollo/client';
import { getClient } from '@faustwp/experimental-app-router';
import Link from 'next/link';
import '../faust.config.js';
export const metadata = {
title: 'Create Next App',
description: 'Generated by create next app',
};
export default async function RootLayout({ children }) {
const client = await getClient();
const { data } = await client.query({
query: gql`
query GetLayout {
generalSettings {
title
description
}
primaryMenuItems: menuItems(where: { location: PRIMARY }) {
nodes {
id
label
uri
}
}
footerMenuItems: menuItems(where: { location: FOOTER }) {
nodes {
id
label
uri
}
}
}
`,
});
return (
<html lang="en">
<body>
<header>
<div>
<h1>
<Link href="/">{data.generalSettings.title}</Link>
</h1>
<h5>{data.generalSettings.description}</h5>
</div>
<ul>
{data.primaryMenuItems.nodes.map((node) => (
<li>
<Link href={node.uri}>{node.label}</Link>
</li>
))}
</ul>
</header>
{children}
</body>
</html>
);
}
Code language: JavaScript (javascript)Technical Reference
getClient(): ApolloClient | null
The getClient function returns the ApolloClient making it available for use.
You can use the ApolloClient to perform queries for data using the query function.