R2 storage, media preconnect, filename normalization, graph email

src/exports/rsc.ts

@@ -12,3 +12,4 @@ export type {
   EnhanceProps,
   RenderBlocksProps,
 } from '../modules/blocks/index.js'
+export { MediaPreconnect } from '../modules/storage/MediaPreconnect.js'

src/modules/storage/MediaPreconnect.tsx

@@ -0,0 +1,38 @@
+/**
+ * Emits <link rel="preconnect"> + <link rel="dns-prefetch"> for the media CDN
+ * domain (R2_PUBLIC_URL), so the browser opens the TLS/DNS connection to the
+ * media host early — before it hits the first <img>. Saves ~150–300ms on the
+ * first image load.
+ *
+ * Reads the domain from R2_PUBLIC_URL (the same env var buildR2Storage uses),
+ * so there's ONE source of truth — no per-project hardcoded domain. Renders
+ * nothing when R2_PUBLIC_URL isn't set (local disk / no CDN → nothing to
+ * preconnect).
+ *
+ * Server Component — drop it in the <head> of your locale layout:
+ *
+ *   import { MediaPreconnect } from '@intecion/ipal-kit/rsc'
+ *   // in <head> (or top of <body> — Next hoists link tags):
+ *   <MediaPreconnect />
+ */
+export function MediaPreconnect() {
+  const publicUrl = process.env.R2_PUBLIC_URL?.replace(/\/$/, '')
+  if (!publicUrl) {return null}
+
+  // Origin only (scheme + host) — preconnect targets an origin, not a path.
+  let origin: string
+  try {
+    origin = new URL(publicUrl).origin
+  } catch {
+    return null // malformed URL → skip rather than emit a broken tag
+  }
+
+  return (
+    <>
+      <link crossOrigin="anonymous" href={origin} rel="preconnect" />
+      <link href={origin} rel="dns-prefetch" />
+    </>
+  )
+}
+
+export default MediaPreconnect