pascalmartineau/wp-headless
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update to nuxt-graphql 0.5.x

Browse Source
This commit is contained in:
Pascal Martineau
2026-01-20 10:09:44 -05:00
parent 684e2fa1e9
commit e383255e73
14 changed files with 973 additions and 2113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
wp-content/themes/moonshine/app/components/builder/BuilderSections.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import type { BuilderSectionsFragment } from "#graphql/typed-documents"; import type { BuilderSectionsFragment } from "#graphql/fragments";
const props = defineProps<BuilderSectionsFragment>(); const props = defineProps<BuilderSectionsFragment>();
const sections = computed(() => { const sections = computed(() => {

2
wp-content/themes/moonshine/app/components/builder/LayoutContained.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import type { LayoutContainedFragment } from "#graphql/typed-documents"; import type { LayoutContainedFragment } from "#graphql/fragments";
import { tv, type VariantProps } from "tailwind-variants"; import { tv, type VariantProps } from "tailwind-variants";
const props = defineProps<LayoutContainedFragment>(); const props = defineProps<LayoutContainedFragment>();

2
wp-content/themes/moonshine/app/components/nodes/NodePage.global.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import type { NodePageFragment } from "#graphql/typed-documents"; import type { NodePageFragment } from "#graphql/fragments";
defineProps<NodePageFragment>(); defineProps<NodePageFragment>();
</script> </script>

2
wp-content/themes/moonshine/app/components/sections/SectionTextBlock.global.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import type { SectionTextBlockFragment } from "#graphql/typed-documents"; import type { SectionTextBlockFragment } from "#graphql/fragments";
defineProps<SectionTextBlockFragment>(); defineProps<SectionTextBlockFragment>();
</script> </script>

2
wp-content/themes/moonshine/app/components/site/SiteFooterCopyright.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
const { data } = await useGraphQLQuery("GeneralSettings", undefined, { cache: { ttl: 0 } }); const { data } = await useAsyncGraphQLQuery("GeneralSettings", undefined, { cache: { ttl: 0 } });
</script> </script>
<template> <template>

2
wp-content/themes/moonshine/app/composables/useAuthConnexion.ts
View File

@@ -28,7 +28,7 @@ export function useAuthConnexion() {
async function login({ data: variables }: FormSubmitEvent<AuthLoginForm>, redirect?: string) { async function login({ data: variables }: FormSubmitEvent<AuthLoginForm>, redirect?: string) {
try { try {
const { data } = await loginMutate(variables); const { data } = await loginMutate(variables);
if (!data.login) { if (!data?.login) {
throw new Error(`Échec de la connexion par mot de passe.`); throw new Error(`Échec de la connexion par mot de passe.`);
} }
await redirectTo(redirect); await redirectTo(redirect);

2
wp-content/themes/moonshine/app/pages/[...uri].vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
const { path: uri } = useRoute(); const { path: uri } = useRoute();
const { data } = await useGraphQLQuery("NodeByUri", { uri }); const { data } = await useAsyncGraphQLQuery("NodeByUri", { uri });
// Resolve and validate Node component // Resolve and validate Node component
if (!data.value.nodeByUri) { if (!data.value.nodeByUri) {

15
wp-content/themes/moonshine/nuxt.config.ts
View File

@@ -44,15 +44,16 @@ export default defineNuxtConfig({
}, },
graphql: { graphql: {
context: "server/graphql/context.ts", yoga: {
schemas: { context: ["~~/server/graphql/context"],
wp: { schemas: {
type: "remote", wp: {
url: `${process.env.NUXT_WP_URL || "https://wp-headless.ledevsimple.ca"}/graphql`, type: "remote",
middleware: "server/graphql/wp-middleware.ts", url: `${process.env.NUXT_WP_URL || "https://wp-headless.ledevsimple.ca"}/graphql`,
hooks: ["~~/server/graphql/wp-hooks"],
},
}, },
}, },
saveSdl: "server/graphql/schema.graphql",
}, },
sitemap: { sitemap: {

8
wp-content/themes/moonshine/package.json
View File

@@ -16,15 +16,15 @@
"typecheck": "nuxt typecheck" "typecheck": "nuxt typecheck"
}, },
"dependencies": { "dependencies": {
"@iconify-json/lucide": "^1.2.84", "@iconify-json/lucide": "^1.2.86",
"@lewebsimple/nuxt-graphql": "^0.4.0", "@lewebsimple/nuxt-graphql": "^0.5.2",
"@nuxt/ui": "4.3.0", "@nuxt/ui": "4.3.0",
"@nuxtjs/seo": "^3.3.0", "@nuxtjs/seo": "^3.3.0",
"jwt-decode": "^4.0.0", "jwt-decode": "^4.0.0",
"nuxt": "^4.2.2", "nuxt": "^4.2.2",
"nuxt-auth-utils": "^0.5.27", "nuxt-auth-utils": "^0.5.27",
"tailwindcss": "^4.1.18", "tailwindcss": "^4.1.18",
"vue": "^3.5.26", "vue": "^3.5.27",
"vue-router": "^4.6.4", "vue-router": "^4.6.4",
"zod": "^4.3.5" "zod": "^4.3.5"
}, },
@@ -46,4 +46,4 @@
"chore": false "chore": false
} }
} }
} }

3008
wp-content/themes/moonshine/pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

5
wp-content/themes/moonshine/server/graphql/context.ts
View File

@@ -1,11 +1,6 @@
import { defineGraphQLContext } from "@lewebsimple/nuxt-graphql/helpers";
import type { AuthLoginMutation } from "#graphql/typed-documents";
export default defineGraphQLContext(async (event) => { export default defineGraphQLContext(async (event) => {
const authToken = await getAuthToken(event); const authToken = await getAuthToken(event);
return { return {
authToken, authToken,
handleLogin: async (loginData: AuthLoginMutation) => handleLogin(event, loginData),
}; };
}); });

11
wp-content/themes/moonshine/server/graphql/wp-hooks.ts Normal file
View File

@@ -0,0 +1,11 @@
export default defineRemoteExecutorHooks({
onRequest(request) {
if (request.context.authToken) {
request.extensions ??= {};
request.extensions.headers = {
...request.extensions.headers,
Authorization: `Bearer ${request.context.authToken}`,
};
}
},
});

20
wp-content/themes/moonshine/server/graphql/wp-middleware.ts
View File

@@ -1,20 +0,0 @@
import type { AuthLoginMutation } from "#build/graphql/typed-documents";
import { defineRemoteExecMiddleware } from "@lewebsimple/nuxt-graphql/helpers";
export default defineRemoteExecMiddleware({
onRequest({ context, fetchOptions }) {
// Attach auth token from context to request headers
if (context.authToken) {
fetchOptions.headers.set("Authorization", `Bearer ${context.authToken}`);
}
},
async onResponse({ operationName, response, context }) {
// Save auth token in user session
if (operationName === "AuthLogin") {
const { data } = await response.json() as { data?: AuthLoginMutation };
if (data) {
await context.handleLogin(data);
}
}
},
});

5
wp-content/themes/moonshine/server/utils/auth.ts
View File

@@ -2,10 +2,11 @@ import type { H3Event } from "h3";
import { GraphQLClient } from "graphql-request"; import { GraphQLClient } from "graphql-request";
import { jwtDecode } from "jwt-decode"; import { jwtDecode } from "jwt-decode";
import type { User } from "#auth-utils"; import type { User } from "#auth-utils";
import { type AuthUserFragment, type AuthLoginMutation, AuthRefreshTokenDocument } from "#graphql/typed-documents"; import type { AuthUserFragment } from "#graphql/fragments";
import { AuthRefreshTokenDocument, type AuthLoginResult } from "#graphql/operations";
// Handle login result and store user session // Handle login result and store user session
export async function handleLogin(event: H3Event, loginData: AuthLoginMutation) { export async function handleLogin(event: H3Event, loginData: AuthLoginResult) {
if (!loginData?.login) { if (!loginData?.login) {
return; return;
} }