From f84a3e751feb0debeba5acfc030dc12f0af42f23 Mon Sep 17 00:00:00 2001 From: John Goodliff Date: Sun, 30 Jun 2024 20:32:21 -0600 Subject: [PATCH] Configure client-side redirects in Gatsby Node --- gatsby-node.ts | 34 ++++++++++++++++++++++++++++++++-- src/common/constants.ts | 13 ++++++++----- src/common/gatsby-types.d.ts | 5 +++++ 3 files changed, 45 insertions(+), 7 deletions(-) diff --git a/gatsby-node.ts b/gatsby-node.ts index 367c410..c432674 100644 --- a/gatsby-node.ts +++ b/gatsby-node.ts @@ -8,6 +8,8 @@ import { } from './src/common/config-manager'; import { PAGE_TEMPLATES_DIR, + PROJECTS_DIR, + PROJECTS_DIR_SHORT, SOCIAL_IMAGES_DIR as SOCIAL_IMAGE_PAGES_DIR, SOCIAL_IMAGE_TEMPLATES_DIR, } from './src/common/constants'; @@ -42,6 +44,7 @@ const OTHER_OG_IMAGE_TEMPLATE = resolve( let gatsbyCreatePage: Actions['createPage'] | undefined = undefined; let gatsbyDeletePage: Actions['deletePage'] | undefined = undefined; +let gatsbyCreateRedirect: Actions['createRedirect'] | undefined = undefined; let gatsbyReporter: Reporter | undefined = undefined; // Types @@ -191,13 +194,25 @@ function createPage({ }); } +// Create a client-side redirect +function createRedirect(fromPath: string, toPath: string) { + assert(gatsbyCreateRedirect !== undefined); + + gatsbyCreateRedirect({ + fromPath: fromPath, + toPath: toPath, + isPermanent: true, + }); +} + // Save Gatsby Node API Helpers for later use export const onPluginInit: GatsbyNode['onPluginInit'] = ({ reporter, - actions: { createPage, deletePage }, + actions: { createPage, deletePage, createRedirect }, }) => { gatsbyCreatePage = createPage; gatsbyDeletePage = deletePage; + gatsbyCreateRedirect = createRedirect; gatsbyReporter = reporter; }; @@ -244,11 +259,19 @@ export const createPages: GatsbyNode['createPages'] = async ({ graphql }) => { const projectInfo = mapResponse( parseResponse(responseData as PinnedReposResponse), ); + const path: AbsolutePathString = join( + PROJECTS_DIR, + projectInfo.slug, + ) as AbsolutePathString; + const shortPath: AbsolutePathString = join( + PROJECTS_DIR_SHORT, + projectInfo.slug, + ) as AbsolutePathString; // TODO: Renable this when project pages are implemented // Create project pages // createPage({ - // path: join(PROJECTS_DIR, projectInfo.slug) as Path, + // path: path, // component: PROJECT_PAGE_TEMPLATE, // socialImageComponent: PROJECT_OG_IMAGE_TEMPLATE, // context: { @@ -256,6 +279,8 @@ export const createPages: GatsbyNode['createPages'] = async ({ graphql }) => { // }, // }); + createRedirect(shortPath, path); + return projectInfo; }); @@ -268,4 +293,9 @@ export const createPages: GatsbyNode['createPages'] = async ({ graphql }) => { pinnedRepos: pinnedRepos, }, }); + + createRedirect('/about', '/#about'); + createRedirect('/projects', '/#projects'); + createRedirect('/experience', '/#experience'); + createRedirect('/contact', '/#contact'); }; diff --git a/src/common/constants.ts b/src/common/constants.ts index 2d1e281..edc14a3 100644 --- a/src/common/constants.ts +++ b/src/common/constants.ts @@ -3,6 +3,8 @@ -------------------------------------------------- */ +import type { AbsolutePathString, WorkingPathString } from './types'; + // Constants const FADE_TRANSITION_VARIANTS = { @@ -17,11 +19,12 @@ const FADE_TRANSITION_VARIANTS = { } as const; // Directories -export const PAGE_TEMPLATES_DIR = './src/templates/page' as const; -export const SOCIAL_IMAGE_TEMPLATES_DIR = - './src/templates/social-image' as const; -export const PROJECTS_DIR = '/projects' as const; -export const SOCIAL_IMAGES_DIR = '/__generatedSocialImages' as const; +export const PAGE_TEMPLATES_DIR: WorkingPathString = './src/templates/page'; +export const SOCIAL_IMAGE_TEMPLATES_DIR: WorkingPathString = + './src/templates/social-image'; +export const PROJECTS_DIR: AbsolutePathString = '/projects'; +export const PROJECTS_DIR_SHORT: AbsolutePathString = '/p'; +export const SOCIAL_IMAGES_DIR: AbsolutePathString = '/__generatedSocialImages'; // ID used to group together elements for the title animation export const TITLE_LAYOUT_ID = 'title-layout' as const; diff --git a/src/common/gatsby-types.d.ts b/src/common/gatsby-types.d.ts index 117d664..756611c 100644 --- a/src/common/gatsby-types.d.ts +++ b/src/common/gatsby-types.d.ts @@ -30066,6 +30066,11 @@ type PrivacyPolicyPageQueryVariables = Exact<{ [key: string]: never; }>; type PrivacyPolicyPageQuery = { readonly file: { readonly childMarkdownRemark: { readonly html: string | null } | null } | null }; +type ResumePageQueryVariables = Exact<{ [key: string]: never; }>; + + +type ResumePageQuery = { readonly file: { readonly childMarkdownRemark: { readonly html: string | null } | null } | null }; + type PinnedReposQueryVariables = Exact<{ [key: string]: never; }>;