feat: ajouter les en-têtes de sécurité pour atteindre 100/100 sur MDN Observatory

app/emotion-cache-provider.js

@@ -7,10 +7,10 @@ import {useServerInsertedHTML} from 'next/navigation'
 import {CacheProvider as DefaultCacheProvider} from '@emotion/react'
 
 export default function NextAppDirEmotionCacheProvider(props) {
-  const {options, CacheProvider = DefaultCacheProvider, children} = props
+  const {options, CacheProvider = DefaultCacheProvider, children, nonce} = props
 
   const [registry] = React.useState(() => {
-    const cache = createCache(options)
+    const cache = createCache({...options, nonce})
     cache.compat = true
     const prevInsert = cache.insert
     let inserted = []
@@ -65,12 +65,14 @@ export default function NextAppDirEmotionCacheProvider(props) {
           <style
             key={name}
             dangerouslySetInnerHTML={{__html: style}}
+            nonce={nonce}
             data-emotion={`${registry.cache.key}-global ${name}`}
           />
         ))}
         {styles !== '' && (
           <style
             dangerouslySetInnerHTML={{__html: styles}}
+            nonce={nonce}
             data-emotion={dataEmotionAttribute}
           />
         )}
@@ -84,5 +86,6 @@ export default function NextAppDirEmotionCacheProvider(props) {
 NextAppDirEmotionCacheProvider.propTypes = {
   options: PropTypes.object.isRequired,
   CacheProvider: PropTypes.func,
-  children: PropTypes.node.isRequired
+  children: PropTypes.node.isRequired,
+  nonce: PropTypes.string
 }