From 2d198f35fe10b8d18007bc5724747105cb1d87ea Mon Sep 17 00:00:00 2001
From: Diogo Soares <32431609+DiogoSoaress@users.noreply.github.com>
Date: Wed, 28 Aug 2024 11:40:01 +0200
Subject: [PATCH] feat: add CSP header to all the pages (#445)

* feat: initial CSP

* feat: add missing directives to load the content and scripts in the remaining pages

* fix: add Hotjar script

* docs: add comment describing the allowed lists

* fix: enhance `connect-src` directive with another Hotjar domain
---
 src/components/common/MetaTags/index.tsx |  4 ++++
 src/config/securityHeaders.ts            | 24 ++++++++++++++++++++++++
 2 files changed, 28 insertions(+)
 create mode 100644 src/config/securityHeaders.ts

diff --git a/src/components/common/MetaTags/index.tsx b/src/components/common/MetaTags/index.tsx
index 31072b43..8acbb5d0 100644
--- a/src/components/common/MetaTags/index.tsx
+++ b/src/components/common/MetaTags/index.tsx
@@ -1,4 +1,5 @@
 import { IS_PRODUCTION } from '@/config/constants'
+import { ContentSecurityPolicy } from '@/config/securityHeaders'
 import Head from 'next/head'
 
 const defaultMetaTags = {
@@ -31,6 +32,9 @@ const MetaTags = (props: Partial<typeof defaultMetaTags>) => {
 
       {!IS_PRODUCTION && <meta name="robots" content="noindex" />}
 
+      {/* CSP */}
+      <meta httpEquiv="Content-Security-Policy" content={ContentSecurityPolicy} />
+
       {/* Mobile tags */}
       <meta name="apple-mobile-web-app-capable" content="yes" />
       <meta name="apple-mobile-web-app-title" content="safe" />
diff --git a/src/config/securityHeaders.ts b/src/config/securityHeaders.ts
new file mode 100644
index 00000000..23a5aae5
--- /dev/null
+++ b/src/config/securityHeaders.ts
@@ -0,0 +1,24 @@
+import { IS_PRODUCTION } from '@/config/constants'
+
+/**
+ * Notes:
+ * connect-src: Allows calls to Ashby's job board, Ecosystem DB API, Snapshot, Contentful and Hotjar.
+ * script-src: Allows scripts from Hotjar, and Google Tag Manager. In development, 'unsafe-eval' is allowed for inline scripts to facilitate debugging.
+ * img-src: Allows images from Contentful, Ecosystem DB for the project logos, Safe Claiming App for guardians images, and data URIs.
+ * frame-src: Allows iframes from Mirror, Youtube and JWPlayer.
+ */
+export const ContentSecurityPolicy = `
+ default-src 'self';
+ connect-src 'self' https://api.ashbyhq.com/posting-api/job-board/safe.global/ https://ecosystem-database.staging.5afe.dev/data.json https://hub.snapshot.org/graphql https://cdn.contentful.com/spaces/1i5gc724wjeu/ https://metrics.hotjar.io/ https://content.hotjar.io/ wss://ws.hotjar.com;
+ script-src 'self' ${
+   IS_PRODUCTION ? '' : "'unsafe-eval'"
+ } 'unsafe-inline' https://script.hotjar.com https://static.hotjar.com https://www.googletagmanager.com;
+ style-src 'self' 'unsafe-inline';
+ font-src 'self';
+ object-src 'none';
+ base-uri 'none';
+ img-src 'self' http://images.ctfassets.net/ https://ecosystem-database.staging.5afe.dev/logos/ https://safe-claiming-app-data.safe.global/guardians/images/ data:;
+ frame-src https://safe.mirror.xyz/ https://www.youtube-nocookie.com/ https://cdn.jwplayer.com/;
+`
+  .replace(/\s{2,}/g, ' ')
+  .trim()