Fixups

app/(public)/layout.tsx

@@ -3,17 +3,21 @@ import GlobalFooter from "@/components/layout/global-footer";
 import Header from "@/components/layout/header";
 import {ReactNode} from "react";
 import Script from "next/script";
-import GoogleAnalytics from "@/components/utils/google-analytics";
+import {GoogleAnalytics} from "@next/third-parties/google";
 import {isDraftMode} from "@/lib/drupal/is-draft-mode";
 
+// https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config
+export const revalidate = false;
+export const dynamic = 'force-static';
+
 const Layout = ({children}: { children: ReactNode }) => {
   const draftMode = isDraftMode()
   return (
     <>
       {(!draftMode && process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID) &&
         <>
           <Script async src="//siteimproveanalytics.com/js/siteanalyze_80352.js"/>
-          <GoogleAnalytics/>
+          <GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID}/>
         </>
       }
       <div className="grid grid-rows-1 min-h-screen">

app/(public)/page.tsx

@@ -6,7 +6,9 @@ import {notFound} from "next/navigation";
 import {getEntityFromPath} from "@/lib/gql/fetcher";
 import {NodeStanfordPage} from "@/lib/gql/__generated__/drupal.d";
 
+// https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config
 export const revalidate = false;
+export const dynamic = 'force-static';
 
 export const generateMetadata = async (): Promise<Metadata> => {
   const {entity} = await getEntityFromPath<NodeStanfordPage>('/');

app/sitemap.tsx

@@ -1,42 +1,34 @@
 import {MetadataRoute} from "next";
+import {graphqlClient} from "@/lib/gql/fetcher";
+import {headers} from "next/headers";
+import {NodeUnion} from "@/lib/gql/__generated__/drupal.d";
 
-const xml2js = require('xml2js');
+// https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config
+export const revalidate = false;
+export const dynamic = 'force-static';
 
 const Sitemap = async (): Promise<MetadataRoute.Sitemap> => {
-  const xmlParser = new xml2js.Parser();
-
-  const urls: MetadataRoute.Sitemap = [];
-
-  interface DrupalSitemapItem {
-    loc: string[];
-    lastmod?: string[];
-  }
-
-  interface DrupalSitemap {
-    urlset: {
-      url: DrupalSitemapItem[];
-    }
-  }
-
-  try {
-    const drupalSitemap: DrupalSitemapItem[] = await fetch(process.env.NEXT_PUBLIC_DRUPAL_BASE_URL + '/sitemap.xml')
-      .then(response => response.text())
-      .then<Promise<DrupalSitemap>>(result => xmlParser.parseStringPromise(result))
-      // Allow the promise to resolve.
-      .then(result => result)
-      .then(sitemap => sitemap.urlset.url);
-
-    const publicDomain = process.env.NEXT_PUBLIC_DOMAIN ?? '';
-    drupalSitemap?.map(item => {
-      urls.push({
-        url: item.loc[0].replace(/http[s]?:\/\/.*?\//g, publicDomain + `/`),
-        lastModified: item.lastmod?.[0],
-      })
-    })
-  } catch (e) {
-    console.log(e)
-  }
-
-  return urls
+  const nodeQuery = await graphqlClient({next: {tags: ['paths']}}).Nodes();
+  const nodes: NodeUnion[] = [];
+
+  nodeQuery.nodeStanfordCourses.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordEventSeriesItems.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordEvents.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordNewsItems.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordPages.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordPeople.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeStanfordPolicies.nodes.map(node => nodes.push(node as NodeUnion));
+  nodeQuery.nodeSulLibraries.nodes.map(node => nodes.push(node as NodeUnion));
+
+  const sitemap: MetadataRoute.Sitemap = [];
+
+  nodes.map(node => sitemap.push({
+    url: `https://library.stanford.edu${node.path}`,
+    lastModified: new Date(node.changed.time),
+    priority: node.__typename === "NodeStanfordPage" ? 1 : .8,
+    changeFrequency: node.__typename === "NodeStanfordPage" ? "weekly" : "monthly"
+  }));
+
+  return sitemap;
 }
 export default Sitemap;

package.json

@@ -15,51 +15,44 @@
     "@formkit/auto-animate": "^0.8.1",
     "@heroicons/react": "^2.1.1",
     "@mui/base": "^5.0.0-beta.37",
+    "@next/third-parties": "^14.1.1",
     "@tailwindcss/container-queries": "^0.1.1",
     "@tailwindcss/typography": "^0.5.10",
-    "@tanstack/react-query": "^5.24.1",
+    "@tanstack/react-query": "^5.24.6",
     "@types/node": "^20.11.24",
     "@types/react": "^18.2.61",
-    "@uidotdev/usehooks": "^2.4.1",
-    "autoprefixer": "^10.4.17",
+    "autoprefixer": "^10.4.18",
     "axios": "^1.6.7",
     "critters": "^0.0.21",
-    "debug": "^4.3.4",
     "decanter": "^7.2.0",
-    "drupal-jsonapi-params": "^2.3.1",
     "graphql": "^16.8.1",
     "graphql-request": "^6.1.0",
     "graphql-tag": "^2.12.6",
     "html-react-parser": "^5.1.8",
     "jsona": "^1.12.1",
-    "next": "^14.1.0",
+    "next": "^14.1.1",
     "next-drupal": "^1.6.0",
-    "nextjs-google-analytics": "^2.3.3",
     "postcss": "^8.4.35",
     "react": "^18.2.0",
     "react-aria": "^3.32.1",
     "react-dom": "^18.2.0",
     "react-error-boundary": "^4.0.13",
     "react-focus-lock": "^2.11.2",
-    "react-intersection-observer": "^9.8.1",
     "react-obfuscate": "^3.6.9",
     "react-obfuscate-email": "^1.1.2",
     "react-stately": "^3.30.1",
     "react-tiny-oembed": "^1.1.0",
-    "server-only": "^0.0.1",
     "sharp": "^0.33.2",
     "tailwind-merge": "^2.2.1",
     "tailwindcss": "^3.4.1",
     "typescript": "^5.3.3",
-    "usehooks-ts": "^2.15.1",
-    "xml2js": "^0.6.2"
+    "usehooks-ts": "^2.15.1"
   },
   "devDependencies": {
     "@graphql-codegen/cli": "5.0.2",
     "@graphql-codegen/import-types-preset": "^3.0.0",
     "@graphql-codegen/typescript-graphql-request": "^6.2.0",
     "@graphql-codegen/typescript-operations": "4.2.0",
-    "@types/debug": "^4.1.12",
     "@types/qs": "^6.9.12",
     "eslint": "^8.57.0",
     "eslint-config-next": "^14.1.1",

src/components/patterns/elements/oembed.tsx

@@ -1,19 +1,19 @@
 "use client";
 
 import {ArrowPathIcon} from "@heroicons/react/20/solid";
-import {useInView} from "react-intersection-observer";
 import Embed from "react-tiny-oembed";
 import {PropsWithoutRef} from "react";
+import {useIntersectionObserver} from "usehooks-ts";
 
 interface Props extends PropsWithoutRef<any> {
   url: string
 }
 
 const Oembed = ({url, ...props}: Props) => {
-  const {ref, inView} = useInView({triggerOnce: true})
+  const {isIntersecting, ref} = useIntersectionObserver({freezeOnceVisible: true})
   return (
     <div ref={ref} {...props}>
-      {inView && <Embed url={url} LoadingFallbackElement={<Loading/>}/>}
+      {isIntersecting && <Embed url={url} LoadingFallbackElement={<Loading/>}/>}
     </div>
   )
 }

src/lib/gql/fetcher.tsx

@@ -1,5 +1,3 @@
-"use server";
-
 import {getSdk} from "@/lib/gql/__generated__/queries";
 import {
   ConfigPagesQuery,
@@ -34,6 +32,8 @@ export const getEntityFromPath = cache(async <T extends NodeUnion | TermUnion, >
   redirect?: RouteRedirect
   error?: string
 }> => {
+  "use server";
+
   const headers = await buildHeaders({draftMode})
   let entity: T | undefined;
   let query: RouteQuery;
@@ -51,6 +51,8 @@ export const getEntityFromPath = cache(async <T extends NodeUnion | TermUnion, >
 })
 
 export const getConfigPage = async <T extends ConfigPagesUnion, >(configPageType: ConfigPagesUnion['__typename']): Promise<T | undefined> => {
+  "use server";
+
   let query: ConfigPagesQuery;
   try {
     query = await getConfigPagesData();
@@ -79,6 +81,8 @@ const getConfigPagesData = cache(async (): Promise<ConfigPagesQuery> => {
 })
 
 export const getMenu = cache(async (name?: MenuAvailable, draftMode?: boolean): Promise<MenuItem[]> => {
+  "use server";
+
   const headers = await buildHeaders({draftMode});
 
   const menu = await graphqlClient({headers, next: {tags: ['menus', `menu:${name || "main"}`]}}).Menu({name});
@@ -93,6 +97,8 @@ export const getMenu = cache(async (name?: MenuAvailable, draftMode?: boolean):
 })
 
 export const getAllNodePaths = cache(async () => {
+  "use server";
+
   const nodeQuery = await graphqlClient({next: {tags: ['paths']}}).Nodes();
   const nodePaths: string[] = [];
   nodeQuery.nodeStanfordCourses.nodes.map(node => nodePaths.push(node.path));