Secure header

next.config.js

@@ -5,6 +5,36 @@ const nextConfig = {
   experimental: {
     appDir: true,
     scrollRestoration: true
+  },
+  headers: async () => {
+    return [
+      {
+        source: '/(.*)',
+        headers: [
+          {
+            key: 'X-Frame-Options',
+            value: 'DENY'
+          },
+          {
+            key: 'Content-Security-Policy',
+            value:
+              "default-src 'self'; script-src 'self'; font-src 'self' 'https://fonts.googleapis.com'"
+          },
+          {
+            key: 'X-Content-Type-Options',
+            value: 'nosniff'
+          },
+          {
+            key: 'Permissions-Policy',
+            value: 'camera=(); battery=(); geolocation=(); microphone=()'
+          },
+          {
+            key: 'Referrer-Policy',
+            value: 'origin-when-cross-origin'
+          }
+        ]
+      }
+    ];
   }
 };
 

ui/Puzzle.tsx

@@ -137,7 +137,8 @@ export default function Puzzle({ token, id }: { token: string; id: number }) {
         <div className="flex items-center justify-between">
           <div className="items-center gap-x-2">
             <p>
-              Tentative{puzzle.tries && puzzle.tries > 1 ? "s":""} : <span className="text-brand-accent">{puzzle.tries}</span>
+              Tentative{puzzle.tries && puzzle.tries > 1 ? 's' : ''} :{' '}
+              <span className="text-brand-accent">{puzzle.tries}</span>
             </p>
             <p>
               Score : <span className="text-brand-accent">{puzzle.score}</span>