track time of fetch

sanity-io · Nov 21, 2024 · 3f1a80b · 3f1a80b
1 parent 996b946
commit 3f1a80b
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 16 deletions.
diff --git a/next-canary/next.config.ts b/next-canary/next.config.ts
@@ -1,6 +1,11 @@
 import type {NextConfig} from 'next'
 
 const nextConfig: NextConfig = {
+  logging: {
+    fetches: {
+      fullUrl: true,
+    },
+  },
   experimental: {
     dynamicIO: true,
     cacheLife: {

diff --git a/next-enterprise/next.config.ts b/next-enterprise/next.config.ts
@@ -1,5 +1,11 @@
 import type {NextConfig} from 'next'
 
-const nextConfig: NextConfig = {}
+const nextConfig: NextConfig = {
+  logging: {
+    fetches: {
+      fullUrl: true,
+    },
+  },
+}
 
 export default nextConfig
diff --git a/next-enterprise/src/app/layout.tsx b/next-enterprise/src/app/layout.tsx
@@ -6,18 +6,16 @@ import {SanityLive} from './SanityLive'
 import {ThemeButton} from './ThemeButton'
 import {TimeSince} from './TimeSince'
 
-const THEME_QUERY = defineQuery(`*[_id == "theme"][0]{background,text,"fetchedAt": now()}`)
+const THEME_QUERY = defineQuery(
+  `*[_id == "theme"][0]{background,text,"fetchedAt": dateTime(now())}`,
+)
 
 export default async function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode
 }>) {
-  const {
-    data,
-    // This timestamp is inaccurate without 'use cache'
-    // fetchedAt,
-  } = await sanityFetch({query: THEME_QUERY})
+  const {data} = await sanityFetch({query: THEME_QUERY})
 
   return (
     <html

diff --git a/next-enterprise/src/app/page.tsx b/next-enterprise/src/app/page.tsx
@@ -5,27 +5,31 @@ import type {Metadata} from 'next'
 import {Suspense} from 'react'
 import {TimeSince} from './TimeSince'
 
-const DEMO_QUERY = defineQuery(`*[_type == "demo" && slug.current == $slug][0].title`)
+const DEMO_QUERY = defineQuery(
+  `*[_type == "demo" && slug.current == $slug][0]{title,"fetchedAt": dateTime(now())}`,
+)
 const slug = 'next-enterprise'
 
 export async function generateMetadata(): Promise<Metadata> {
   const {data} = await sanityFetch({query: DEMO_QUERY, params: {slug}})
   return {
-    title: data || 'Next Enterprise',
+    title: data?.title || 'Next Enterprise',
   }
 }
 
 export default async function Home() {
-  const {data, fetchedAt} = await sanityFetch({query: DEMO_QUERY, params: {slug}})
+  const {data} = await sanityFetch({query: DEMO_QUERY, params: {slug}})
 
   return (
     <div className="ring-theme relative mx-2 rounded-lg px-2 pb-1 pt-8 ring-1">
       <h1 className="min-w-64 text-balance text-4xl font-bold leading-tight tracking-tighter md:text-6xl lg:pr-8 lg:text-8xl">
-        {data || 'Next Enterprise'}
+        {data?.title || 'Next Enterprise'}
       </h1>
-      <Suspense>
-        <TimeSince label="page.tsx" since={fetchedAt} />
-      </Suspense>
+      {data?.fetchedAt && (
+        <Suspense>
+          <TimeSince label="page.tsx" since={data.fetchedAt} />
+        </Suspense>
+      )}
     </div>
   )
 }
diff --git a/next-enterprise/src/sanity/fetch.ts b/next-enterprise/src/sanity/fetch.ts
@@ -13,6 +13,6 @@ export async function sanityFetch<const QueryString extends string>({
     filterResponse: false,
     tag: 'fetch-sync-tags', // The request tag makes the fetch unique, avoids deduping with the cached query that has tags
   })
-  const data = await client.fetch(query, params, {next: {tags}})
-  return {data, tags, fetchedAt: new Date().toJSON()}
+  const data = await client.fetch(query, params, {next: {revalidate: false, tags}})
+  return {data, tags}
 }