Merge pull request #35 from AmosChenZixuan/fix-cors

Fix cors
AmosChenZixuan · May 5, 2024 · 25a50ff · 25a50ff
2 parents 4f78000 + cbf59a5
commit 25a50ff
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 7 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -94,11 +94,17 @@ export default function RootLayout({ children }: { children: React.ReactNode })
         <meta name="theme-color" media="(prefers-color-scheme: light)" content="#fff" />
         <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#000" />
         <link rel="alternate" type="application/rss+xml" href="/feed.xml" />
+        <script
+          defer
+          src="https://eu.umami.is/script.js"
+          data-website-id={
+            (siteMetadata.analytics as AnalyticsConfig).umamiAnalytics?.umamiWebsiteId
+          }
+        ></script>
       </head>
       <body className="bg-white text-black antialiased dark:bg-gray-950 dark:text-white">
         <ThemeProviders>
           <LanguageProvider>
-            <Analytics analyticsConfig={siteMetadata.analytics as AnalyticsConfig} />
             <SectionContainer>
               <div className="flex h-screen flex-col justify-between font-sans">
                 <SearchProvider searchConfig={siteMetadata.search as SearchConfig}>

diff --git a/components/home/SpotifyPlayerBox.tsx b/components/home/SpotifyPlayerBox.tsx
@@ -19,6 +19,10 @@ export default function SpotifyPlayerBox() {
   const fetcher = (url) => fetch(url).then((r) => r.json())
   const { data }: { data: SongData } = useSWR('/api/spotify', fetcher)
 
+  const imageLoader = ({ src }) => {
+    return `/api/imageProxy?url=${encodeURIComponent(src)}`
+  }
+
   return (
     <div
       className={`card bg-pink-blue-animated animation-delay-1 flex-center flex-grow overflow-hidden p-2`}
@@ -33,7 +37,8 @@ export default function SpotifyPlayerBox() {
           </section>
           <section className="relative mx-auto h-24 w-24">
             <Image
-              src={`/api/imageProxy?url=${encodeURIComponent(data.albumImageUrl)}`}
+              loader={imageLoader}
+              src={data.albumImageUrl}
               alt={data.album}
               width={375}
               height={375}
@@ -42,10 +47,12 @@ export default function SpotifyPlayerBox() {
               <FaSpotify size={21} />
             </div>
           </section>
-          <h2 className="text-xl text-white">{data.title}</h2>
-          <section className="flex items-center space-x-1 text-white">
-            <RiUserHeartFill size={16} />
-            <h5 className="text-sm ">{data.artist}</h5>
+          <section className="-space-y-1">
+            <h2 className="text-xl text-white">{data.title}</h2>
+            <div className="flex items-center space-x-1 text-white">
+              <RiUserHeartFill size={16} />
+              <h5 className="text-sm ">{data.artist}</h5>
+            </div>
           </section>
         </Link>
       )}

diff --git a/next.config.js b/next.config.js
@@ -7,7 +7,7 @@ const withBundleAnalyzer = require('@next/bundle-analyzer')({
 // You might need to insert additional domains in script-src if you are using external services
 const ContentSecurityPolicy = `
   default-src 'self';
-  script-src 'self' 'unsafe-eval' 'unsafe-inline' giscus.app analytics.umami.is;
+  script-src 'self' 'unsafe-eval' 'unsafe-inline' giscus.app *.umami.is;
   style-src 'self' 'unsafe-inline';
   img-src * blob: data:;
   media-src *.s3.amazonaws.com;