From c722f4e075bd5cc42a07ab4b4f9e6aa10b4ad4b6 Mon Sep 17 00:00:00 2001
From: kimjaehyeon0101 <47347352-kimjaehyeon0101@users.noreply.replit.com>
Date: Tue, 30 Sep 2025 07:46:39 +0000
Subject: [PATCH] Update outlet information icons to navigate to report pages

Modify MediaOutlet and Report components to change the functionality of the info icon button. Previously, clicking the icon displayed a tooltip with outlet information. Now, it navigates the user to the report page associated with that outlet, utilizing the setLocation function to update the browser's URL based on the outlet's slug.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0fb68265-c270-4198-9584-3d9be9bddb41
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/0fb68265-c270-4198-9584-3d9be9bddb41/g8mUCzT
---
 .replit                          |  4 ----
 client/src/pages/MediaOutlet.tsx | 34 +++++++++++++-------------------
 client/src/pages/Report.tsx      | 34 +++++++++++++-------------------
 3 files changed, 28 insertions(+), 44 deletions(-)

diff --git a/.replit b/.replit
index 3bbf98a..e53b196 100644
--- a/.replit
+++ b/.replit
@@ -22,10 +22,6 @@ externalPort = 3002
 localPort = 37531
 externalPort = 3001
 
-[[ports]]
-localPort = 37709
-externalPort = 4200
-
 [[ports]]
 localPort = 38387
 externalPort = 3003
diff --git a/client/src/pages/MediaOutlet.tsx b/client/src/pages/MediaOutlet.tsx
index dd6c3b6..4399363 100644
--- a/client/src/pages/MediaOutlet.tsx
+++ b/client/src/pages/MediaOutlet.tsx
@@ -216,26 +216,20 @@ export default function MediaOutlet() {
                   <span className="text-lg font-bold text-gray-900" data-testid="text-outlet-name-header">
                     {outlet.name}
                   </span>
-                  <TooltipProvider>
-                    <Tooltip>
-                      <TooltipTrigger asChild>
-                        <button
-                          type="button"
-                          onClick={(e) => e.stopPropagation()}
-                          className="inline-flex items-center"
-                          aria-label="View outlet information"
-                        >
-                          <Info 
-                            className="h-4 w-4 text-gray-500 cursor-pointer hover:text-gray-700" 
-                            data-testid="icon-info-header"
-                          />
-                        </button>
-                      </TooltipTrigger>
-                      <TooltipContent>
-                        <p className="max-w-xs">{outlet.description || "Media Outlet"}</p>
-                      </TooltipContent>
-                    </Tooltip>
-                  </TooltipProvider>
+                  <button
+                    type="button"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setLocation(`/media/${outlet.slug}/report`);
+                    }}
+                    className="inline-flex items-center"
+                    aria-label="View reports"
+                  >
+                    <Info 
+                      className="h-4 w-4 text-gray-500 cursor-pointer hover:text-gray-700" 
+                      data-testid="icon-info-header"
+                    />
+                  </button>
                 </div>
               </div>
             </div>
diff --git a/client/src/pages/Report.tsx b/client/src/pages/Report.tsx
index 0ce4272..d140155 100644
--- a/client/src/pages/Report.tsx
+++ b/client/src/pages/Report.tsx
@@ -140,26 +140,20 @@ export default function Report() {
                       <span className="text-lg font-bold text-gray-900" data-testid="text-outlet-name-header">
                         {outlet.name}
                       </span>
-                      <TooltipProvider>
-                        <Tooltip>
-                          <TooltipTrigger asChild>
-                            <button
-                              type="button"
-                              onClick={(e) => e.stopPropagation()}
-                              className="inline-flex items-center"
-                              aria-label="View outlet information"
-                            >
-                              <Info 
-                                className="h-4 w-4 text-gray-500 cursor-pointer hover:text-gray-700" 
-                                data-testid="icon-info-header"
-                              />
-                            </button>
-                          </TooltipTrigger>
-                          <TooltipContent>
-                            <p className="max-w-xs">{outlet.description || "Media Outlet"}</p>
-                          </TooltipContent>
-                        </Tooltip>
-                      </TooltipProvider>
+                      <button
+                        type="button"
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          setLocation(`/media/${outlet.slug}/report`);
+                        }}
+                        className="inline-flex items-center"
+                        aria-label="View reports"
+                      >
+                        <Info 
+                          className="h-4 w-4 text-gray-500 cursor-pointer hover:text-gray-700" 
+                          data-testid="icon-info-header"
+                        />
+                      </button>
                     </div>
                   </div>
                 </>