Assistant checkpoint: Add image proxy to handle CORS issues

Assistant generated file changes:
- server/routes.ts: Add image proxy endpoint
- client/src/lib/newsletter-data.ts: Update image URLs to use proxy
Update image URLs to use proxy
Transform newsletter thumbnails

---

User prompt:

Access to image at 'https://d1a8dioxuajlzs.cloudfront.net/accounts/7810/original/topshadow1023.png?1515171102' from origin 'https://9dda30b6-4149-4bce-89dc-76333005952c-00-20j8kqlx0qtgq.spock.replit.dev' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

client/src/lib/newsletter-data.ts

@@ -1,15 +1,33 @@
 import { useQuery } from "@tanstack/react-query";
 import type { Newsletter } from "@shared/schema";
 
+function getProxiedImageUrl(url: string | null) {
+  if (!url) return null;
+  return `/api/proxy-image?url=${encodeURIComponent(url)}`;
+}
+
+export interface Newsletter {
+  // ... other properties
+  thumbnail: string | null;
+}
+
 export function useNewsletters() {
   return useQuery<Newsletter[]>({ 
-    queryKey: ['/api/newsletters']
+    queryKey: ['/api/newsletters'],
+    select: data => data.map(newsletter => ({
+      ...newsletter,
+      thumbnail: getProxiedImageUrl(newsletter.thumbnail)
+    }))
   });
 }
 
 export function useNewsletterSearch(query: string) {
   return useQuery<Newsletter[]>({ 
     queryKey: ['/api/newsletters/search', query],
-    enabled: query.length > 0
+    enabled: query.length > 0,
+    select: data => data.map(newsletter => ({
+      ...newsletter,
+      thumbnail: getProxiedImageUrl(newsletter.thumbnail)
+    }))
   });
-}
+}

server/routes.ts

@@ -137,7 +137,27 @@ export async function registerRoutes(app: Express): Promise<Server> {
     }
   });
 
-  app.get("/api/rss", async (_req, res) => {
+  app.get("/api/proxy-image", async (req, res) => {
+  try {
+    const imageUrl = req.query.url as string;
+    if (!imageUrl) {
+      return res.status(400).json({ message: "Image URL is required" });
+    }
+
+    const response = await axios.get(imageUrl, {
+      responseType: 'arraybuffer'
+    });
+
+    const contentType = response.headers['content-type'];
+    res.setHeader('Content-Type', contentType);
+    res.send(response.data);
+  } catch (error) {
+    console.error('Error proxying image:', error);
+    res.status(500).json({ message: "Failed to proxy image" });
+  }
+});
+
+app.get("/api/rss", async (_req, res) => {
     try {
       const newsletters = await storage.getNewsletters();