From 3a9baab5b2458062daed21e7b7d3f579e19a5b50 Mon Sep 17 00:00:00 2001
From: Ryan Christian <rchristian@ryanchristian.dev>
Date: Tue, 7 May 2024 10:24:19 -0500
Subject: [PATCH] refactor: Use variable DEPLOY_URL for Netlify PR previews

---
 index.html          |  6 +++---
 plugins/netlify.js  |  2 +-
 plugins/rss-feed.js | 18 +++++++++---------
 src/index.jsx       |  2 +-
 vite.config.js      | 10 +++++++++-
 5 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/index.html b/index.html
index 3b5cc8df3..e97ccfdce 100644
--- a/index.html
+++ b/index.html
@@ -7,10 +7,10 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimal-ui">
 		<meta name="color-scheme" content="dark light">
 		<meta name="theme-color" content="#673AB8">
-		<link rel="alternate" type="application/rss+xml" href="https://preactjs.com/feed.xml">
-		<link rel="alternate" type="application/atom+xml" href="https://preactjs.com/feed.atom">
+		<link rel="alternate" type="application/rss+xml" href="%NETLIFY_DEPLOY_URL%/feed.xml">
+		<link rel="alternate" type="application/atom+xml" href="%NETLIFY_DEPLOY_URL%/feed.atom">
 		<meta property="og:type" content="website">
-		<meta property="og:image" content="https://preactjs.com/og-image.png">
+		<meta property="og:image" content="%NETLIFY_DEPLOY_URL%/og-image.png">
 		<meta name="twitter:card" content="summary_large_image">
 		<meta name="twitter:site" content="@preactjs">
 		<link href="https://cdn.jsdelivr.net" rel="preconnect" crossorigin="anonymous">
diff --git a/plugins/netlify.js b/plugins/netlify.js
index 9d8df2373..a5129b3c2 100644
--- a/plugins/netlify.js
+++ b/plugins/netlify.js
@@ -1,5 +1,5 @@
 import path from 'node:path';
-import { pathToFileURL } from 'node:url'
+import { pathToFileURL } from 'node:url';
 import { Readable } from 'stream';
 
 /**
diff --git a/plugins/rss-feed.js b/plugins/rss-feed.js
index 894b5f6ac..0f6bbd6be 100644
--- a/plugins/rss-feed.js
+++ b/plugins/rss-feed.js
@@ -4,7 +4,7 @@ import config from '../src/config.json';
 /**
  * @returns {import('vite').Plugin}
  */
-export function rssFeedPlugin() {
+export function rssFeedPlugin(deployURL) {
 	return {
 		name: 'rss-feed',
 		apply: 'build',
@@ -12,23 +12,23 @@ export function rssFeedPlugin() {
 			const feed = new Feed({
 				title: 'Preact Blog',
 				description: 'Preact news and articles',
-				id: 'https://preactjs.com',
-				link: 'https://preactjs.com',
+				id: deployURL,
+				link: deployURL,
 				language: 'en',
-				image: 'https://preactjs.com/assets/branding/symbol.png',
-				favicon: 'https://preactjs.com/favicon.ico',
+				image: `${deployURL}/assets/branding/symbol.png`,
+				favicon: `${deployURL}/favicon.ico`,
 				copyright: 'All rights reserved 2022, the Preact team',
 				feedLinks: {
-					json: 'https://preactjs.com/json',
-					atom: 'https://preactjs.com/atom'
+					json: `${deployURL}/json`,
+					atom: `${deployURL}/atom`
 				}
 			});
 
 			config.blog.forEach(post => {
 				feed.addItem({
 					title: post.name.en,
-					id: `https://preactjs.com${post.path}`,
-					link: `https://preactjs.com${post.path}`,
+					id: `${deployURL}${post.path}`,
+					link: `${deployURL}${post.path}`,
 					description: post.excerpt.en,
 					date: new Date(post.date)
 				});
diff --git a/src/index.jsx b/src/index.jsx
index 376a99086..1329090ee 100755
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -46,7 +46,7 @@ export async function prerender() {
 
 	const elements = new Set([
 		{ type: 'meta', props: { name: 'description', content: globalThis.description } },
-		{ type: 'meta', props: { property: 'og:url', content: `https://preactjs.com${location.pathname}` } },
+		{ type: 'meta', props: { property: 'og:url', content: `${import.meta.env.NETLIFY_DEPLOY_URL}${location.pathname}` } },
 		{ type: 'meta', props: { property: 'og:title', content: globalThis.title } },
 		{ type: 'meta', props: { property: 'og:description', content: globalThis.description } },
 		location.pathname.includes('/v8/') && { type: 'meta', props: { name: 'robots', content: 'noindex' } },
diff --git a/vite.config.js b/vite.config.js
index 896296c47..81683805a 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -10,6 +10,10 @@ import { spaFallbackMiddlewarePlugin } from './plugins/spa-fallback-middleware.j
 import { htmlRoutingMiddlewarePlugin } from './plugins/html-routing-middleware.js';
 import { rssFeedPlugin } from './plugins/rss-feed.js';
 
+const NETLIFY_DEPLOY_URL = process.env.CONTEXT === 'deploy-preview'
+	? process.env.DEPLOY_PRIME_URL
+	: 'https://preactjs.com';
+
 export default defineConfig({
 	publicDir: 'src/assets',
 	optimizeDeps: {
@@ -19,7 +23,11 @@ export default defineConfig({
 		target: ['chrome88', 'edge88', 'es2020', 'firefox78', 'safari14'],
 		outDir: 'build'
 	},
+	define: {
+		'import.meta.env.NETLIFY_DEPLOY_URL': JSON.stringify(NETLIFY_DEPLOY_URL)
+	},
 	plugins: [
+		// @ts-ignore
 		replace({
 			'process.env.BRANCH': JSON.stringify(process.env.BRANCH),
 			preventAssignment: true
@@ -53,6 +61,6 @@ export default defineConfig({
 		netlifyPlugin(),
 		spaFallbackMiddlewarePlugin(),
 		htmlRoutingMiddlewarePlugin(),
-		rssFeedPlugin()
+		rssFeedPlugin(NETLIFY_DEPLOY_URL)
 	]
 });