From 31150e5a345b0f835cf5e1a6c89c45078cdfd38b Mon Sep 17 00:00:00 2001
From: kimjaehyeon0101 <47347352-kimjaehyeon0101@users.noreply.replit.com>
Date: Wed, 15 Oct 2025 05:22:29 +0000
Subject: [PATCH] Update article page to display related media outlet
 information

Modify article API response to include nested media outlet data and update client-side data fetching in Article.tsx to directly access outlet information from the article data, simplifying the component's data loading logic.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9a264234-c5d7-4dcc-adf3-a954b149b30d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/9a264234-c5d7-4dcc-adf3-a954b149b30d/uCJPlBt
---
 .replit                      |  4 ----
 client/src/pages/Article.tsx | 10 ++++------
 server/routes.ts             |  4 +++-
 3 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/.replit b/.replit
index 1cda342..8826cfc 100644
--- a/.replit
+++ b/.replit
@@ -50,10 +50,6 @@ externalPort = 3000
 localPort = 43777
 externalPort = 4200
 
-[[ports]]
-localPort = 45921
-externalPort = 6800
-
 [env]
 PORT = "5000"
 
diff --git a/client/src/pages/Article.tsx b/client/src/pages/Article.tsx
index 00887b8..7097447 100644
--- a/client/src/pages/Article.tsx
+++ b/client/src/pages/Article.tsx
@@ -19,15 +19,13 @@ export default function Article() {
   const { user } = useAuth();
   const [betAmounts, setBetAmounts] = useState<Record<string, string>>({});
 
-  const { data: article, isLoading: articleLoading } = useQuery<Article>({
+  const { data: articleData, isLoading: articleLoading } = useQuery<Article & { outlet?: MediaOutlet }>({
     queryKey: ["/api/articles", params?.slug],
     enabled: !!params?.slug
   });
 
-  const { data: outlet, isLoading: outletLoading } = useQuery<MediaOutlet>({
-    queryKey: ["/api/media-outlets", article?.mediaOutletId],
-    enabled: !!article?.mediaOutletId
-  });
+  const article = articleData;
+  const outlet = articleData?.outlet;
 
   const { data: markets = [], isLoading: marketsLoading } = useQuery<PredictionMarket[]>({
     queryKey: ["/api/articles", params?.slug, "markets"],
@@ -113,7 +111,7 @@ export default function Article() {
     return parts;
   };
 
-  if (articleLoading || outletLoading) {
+  if (articleLoading) {
     return (
       <div className="min-h-screen bg-gray-50">
         <header className="bg-white border-b border-gray-200 sticky top-0 z-50">
diff --git a/server/routes.ts b/server/routes.ts
index 76c2a1c..a3c74f9 100644
--- a/server/routes.ts
+++ b/server/routes.ts
@@ -100,7 +100,9 @@ export async function registerRoutes(app: Express): Promise<Server> {
       if (!article) {
         return res.status(404).json({ message: "Article not found" });
       }
-      res.json(article);
+      const allOutlets = await storage.getMediaOutlets();
+      const outlet = allOutlets.find(o => o.id === article.mediaOutletId);
+      res.json({ ...article, outlet });
     } catch (error) {
       console.error("Error fetching article:", error);
       res.status(500).json({ message: "Failed to fetch article" });