From 81cb84c95f70d5488e2777c543e9b859be83f07d Mon Sep 17 00:00:00 2001
From: Paul <phanminh65@gmail.com>
Date: Mon, 2 Oct 2023 11:38:26 +0700
Subject: [PATCH] chore: fix csp

---
 app/entry.server.tsx                   |  7 +++++--
 app/weaverse/create-weaverse.server.ts | 27 ++++++++++++++++++++++++++
 remix.config.js                        |  8 +++++++-
 3 files changed, 39 insertions(+), 3 deletions(-)

diff --git a/app/entry.server.tsx b/app/entry.server.tsx
index 5f73984..31ebc3a 100644
--- a/app/entry.server.tsx
+++ b/app/entry.server.tsx
@@ -2,7 +2,8 @@ import {RemixServer} from '@remix-run/react';
 import type {EntryContext} from '@shopify/remix-oxygen';
 import isbot from 'isbot';
 import {renderToReadableStream} from 'react-dom/server';
-import {createContentSecurityPolicy} from '@weaverse/hydrogen';
+import {createContentSecurityPolicy} from '@shopify/hydrogen';
+import {getWeaverseCsp} from '~/weaverse/create-weaverse.server';
 
 export default async function handleRequest(
   request: Request,
@@ -10,7 +11,9 @@ export default async function handleRequest(
   responseHeaders: Headers,
   remixContext: EntryContext,
 ) {
-  const {nonce, header, NonceProvider} = createContentSecurityPolicy(request);
+  const {nonce, header, NonceProvider} = createContentSecurityPolicy(
+    getWeaverseCsp(request),
+  );
   const body = await renderToReadableStream(
     <NonceProvider>
       <RemixServer context={remixContext} url={request.url} />
diff --git a/app/weaverse/create-weaverse.server.ts b/app/weaverse/create-weaverse.server.ts
index 882293e..e6db328 100644
--- a/app/weaverse/create-weaverse.server.ts
+++ b/app/weaverse/create-weaverse.server.ts
@@ -32,3 +32,30 @@ export function createWeaverseClient({
     withCache: createWithCache({cache, waitUntil}),
   });
 }
+
+export function getWeaverseCsp(request: Request) {
+  let url = new URL(request.url);
+  // Get weaverse host from query params
+  let weaverseHost = url.searchParams.get('weaverseHost');
+  let weaverseHosts = ['https://*.weaverse.io'];
+  if (weaverseHost) {
+    weaverseHosts.push(weaverseHost);
+  }
+  return {
+    frameAncestors: weaverseHosts,
+    defaultSrc: [
+      "'self'",
+      'https://cdn.shopify.com',
+      'https://shopify.com',
+      'https://*.youtube.com',
+      'https://fonts.gstatic.com',
+      ...weaverseHosts,
+    ],
+    styleSrc: [
+      "'self'",
+      "'unsafe-inline'",
+      'https://cdn.shopify.com',
+      ...weaverseHosts,
+    ],
+  };
+}
diff --git a/remix.config.js b/remix.config.js
index 5fe68db..9a25707 100644
--- a/remix.config.js
+++ b/remix.config.js
@@ -2,7 +2,13 @@
 module.exports = {
   appDirectory: 'app',
   ignoredRouteFiles: ['**/.*'],
-  watchPaths: ['./public', './.env'],
+  watchPaths: [
+    './public',
+    './.env',
+    '../../packages/core/dist/index.js',
+    '../../packages/react/dist/index.js',
+    '../../packages/hydrogen/dist/index.js',
+  ],
   server: './server.ts',
   /**
    * The following settings are required to deploy Hydrogen apps to Oxygen: