Add hot key to reload content layer (#11626)

* Add hot key to reload content layer * Fix filename * Remove cli message * Update example * Change key to "s"
withastro · Aug 7, 2024 · bd2684e · bd2684e
1 parent e265805
commit bd2684e
Show file tree

Hide file tree

Showing 7 changed files with 23 additions and 8 deletions.
diff --git a/packages/astro/src/content/sync.ts → packages/astro/src/content/content-layer.ts b/packages/astro/src/content/sync.ts → packages/astro/src/content/content-layer.ts
@@ -56,7 +56,6 @@ export class ContentLayer {
 				ctx.status === 'loaded' &&
 				ctx.config.digest !== this.#lastConfigDigest
 			) {
-				this.#lastConfigDigest = ctx.config.digest;
 				this.sync();
 			}
 		});
@@ -128,9 +127,10 @@ export class ContentLayer {
 			logger.debug('Content config not loaded, skipping sync');
 			return;
 		}
+		const { digest: currentConfigDigest } = contentConfig.config;
+		this.#lastConfigDigest = currentConfigDigest;
 
 		const previousConfigDigest = await this.#store.metaStore().get('config-digest');
-		const { digest: currentConfigDigest } = contentConfig.config;
 		if (currentConfigDigest && previousConfigDigest !== currentConfigDigest) {
 			logger.info('Content config changed, clearing cache');
 			this.#store.clearAll();

diff --git a/packages/astro/src/core/dev/dev.ts b/packages/astro/src/core/dev/dev.ts
@@ -7,9 +7,9 @@ import { gt, major, minor, patch } from 'semver';
 import type * as vite from 'vite';
 import type { AstroInlineConfig } from '../../@types/astro.js';
 import { DATA_STORE_FILE } from '../../content/consts.js';
+import { globalContentLayer } from '../../content/content-layer.js';
 import { DataStore, globalDataStore } from '../../content/data-store.js';
 import { attachContentServerListeners } from '../../content/index.js';
-import { globalContentLayer } from '../../content/sync.js';
 import { globalContentConfigObserver } from '../../content/utils.js';
 import { telemetry } from '../../events/index.js';
 import * as msg from '../messages.js';

diff --git a/packages/astro/src/core/dev/restart.ts b/packages/astro/src/core/dev/restart.ts
@@ -2,6 +2,7 @@ import type nodeFs from 'node:fs';
 import { fileURLToPath } from 'node:url';
 import * as vite from 'vite';
 import type { AstroInlineConfig, AstroSettings } from '../../@types/astro.js';
+import { globalContentLayer } from '../../content/content-layer.js';
 import { eventCliSession, telemetry } from '../../events/index.js';
 import { createNodeLogger, createSettings, resolveConfig } from '../config/index.js';
 import { collectErrorMetadata } from '../errors/dev/utils.js';
@@ -169,10 +170,19 @@ export async function createContainerWithAutomaticRestart({
 		// Ignore the `forceOptimize` parameter for now.
 		restart.container.viteServer.restart = () => handleServerRestart();
 
-		// Set up shortcuts, overriding Vite's default shortcuts so it works for Astro
+		// Set up shortcuts
 		restart.container.viteServer.bindCLIShortcuts({
 			customShortcuts: [
-				// Disable Vite's builtin "r" (restart server), "u" (print server urls) and "c" (clear console) shortcuts
+				{
+					key: 's',
+					description: 'sync content layer',
+					action: () => {
+						if (globalContentLayer.initialized()) {
+							globalContentLayer.get().sync();
+						}
+					},
+				},
+				// Disable default Vite shortcuts that don't work well with Astro
 				{ key: 'r', description: '' },
 				{ key: 'u', description: '' },
 				{ key: 'c', description: '' },

diff --git a/packages/astro/src/core/sync/index.ts b/packages/astro/src/core/sync/index.ts
@@ -6,9 +6,9 @@ import { type HMRPayload, createServer } from 'vite';
 import type { AstroConfig, AstroInlineConfig, AstroSettings } from '../../@types/astro.js';
 import { getPackage } from '../../cli/install-package.js';
 import { DATA_STORE_FILE } from '../../content/consts.js';
+import { globalContentLayer } from '../../content/content-layer.js';
 import { DataStore, globalDataStore } from '../../content/data-store.js';
 import { createContentTypesGenerator } from '../../content/index.js';
-import { globalContentLayer } from '../../content/sync.js';
 import { globalContentConfigObserver } from '../../content/utils.js';
 import { syncAstroEnv } from '../../env/sync.js';
 import { telemetry } from '../../events/index.js';

diff --git a/packages/astro/test/fixtures/content-layer/src/content/config.ts b/packages/astro/test/fixtures/content-layer/src/content/config.ts
@@ -96,18 +96,20 @@ const increment = defineCollection({
 	loader: {
 		name: 'increment-loader',
 		load: async ({ store }) => {
-			const entry = store.get<{ lastValue: number }>('value');
+			const entry = store.get('value');
 			const lastValue: number = entry?.data.lastValue ?? 0;
 			store.set({
 				id: 'value',
 				data: {
 					lastValue: lastValue + 1,
+					lastUpdated: new Date(),
 				},
 			});
 		},
 	},
 	schema: z.object({
 		lastValue: z.number(),
+		lastUpdated: z.date(),
 	}),
 });
 

diff --git a/packages/astro/test/fixtures/content-layer/src/pages/index.astro b/packages/astro/test/fixtures/content-layer/src/pages/index.astro
@@ -4,12 +4,14 @@ import { getCollection, getEntry } from 'astro:content';
 const blog = await getCollection('blog');
 const first = await getEntry('blog', 1);
 const dogs = await getCollection('dogs');
+const increment = await getEntry('increment', 'value');
 ---
 <html>
 <head>
 	<title>Index</title>
 </head>
 <body>
+	<p>Last updated: {increment.data.lastUpdated.toLocaleTimeString()}</p>
 
 	<h1>Dogs</h1>
 	<ul>
@@ -25,6 +27,7 @@ const dogs = await getCollection('dogs');
 			<li><a href={`/blog/${post.id}`}>{ post.data?.title }</a></li>
 		))}
 	</ul>
+
 
 </body>
 </html>
diff --git a/packages/astro/test/test-utils.js b/packages/astro/test/test-utils.js
@@ -7,7 +7,7 @@ import fastGlob from 'fast-glob';
 import stripAnsi from 'strip-ansi';
 import { Agent } from 'undici';
 import { check } from '../dist/cli/check/index.js';
-import { globalContentLayer } from '../dist/content/sync.js';
+import { globalContentLayer } from '../dist/content/content-layer.js';
 import build from '../dist/core/build/index.js';
 import { RESOLVED_SPLIT_MODULE_ID } from '../dist/core/build/plugins/plugin-ssr.js';
 import { getVirtualModulePageName } from '../dist/core/build/plugins/util.js';