From 6b970765bacebb04d14135d34b799b88e554d343 Mon Sep 17 00:00:00 2001
From: Felipe Cardoso <felipe.cardoso@shootify.io>
Date: Mon, 24 Nov 2025 20:30:58 +0100
Subject: [PATCH] Refactor components and scripts for improved typing, cleanup
 unused imports

- Updated chart components (`OrganizationDistributionChart`, `RegistrationActivityChart`, `UserGrowthChart`) with stricter TypeScript interfaces (`TooltipProps`).
- Removed unused imports (`useState`, `Badge`, `API_BASE_URL`) from `DemoModeBanner` and MSW scripts.
- Adjusted MSW function parameters (`_method`, `_operation`) to suppress unused variable warnings.
---
 frontend/scripts/generate-msw-handlers.ts                  | 5 ++---
 .../components/charts/OrganizationDistributionChart.tsx    | 7 ++++++-
 .../src/components/charts/RegistrationActivityChart.tsx    | 7 ++++++-
 frontend/src/components/charts/UserGrowthChart.tsx         | 7 ++++++-
 frontend/src/components/demo/DemoModeBanner.tsx            | 2 --
 5 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/frontend/scripts/generate-msw-handlers.ts b/frontend/scripts/generate-msw-handlers.ts
index ba49e8f..d65b206 100644
--- a/frontend/scripts/generate-msw-handlers.ts
+++ b/frontend/scripts/generate-msw-handlers.ts
@@ -66,7 +66,7 @@ function convertPathToMSWPattern(path: string): string {
   return path.replace(/\{([^}]+)\}/g, ':$1');
 }
 
-function shouldSkipEndpoint(path: string, method: string): boolean {
+function shouldSkipEndpoint(path: string, _method: string): boolean {
   // Skip health check and root endpoints
   if (path === '/' || path === '/health') return true;
 
@@ -83,7 +83,7 @@ function getHandlerCategory(path: string): 'auth' | 'users' | 'admin' | 'organiz
   return 'users';
 }
 
-function generateMockResponse(path: string, method: string, operation: any): string {
+function generateMockResponse(path: string, method: string, _operation: any): string {
   const category = getHandlerCategory(path);
 
   // Auth endpoints
@@ -267,7 +267,6 @@ function generateMockResponse(path: string, method: string, operation: any): str
 
 function generateHandlers(spec: OpenAPISpec): string {
   const handlers: string[] = [];
-  const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || 'http://localhost:8000';
 
   for (const [pathPattern, pathItem] of Object.entries(spec.paths)) {
     for (const [method, operation] of Object.entries(pathItem)) {
diff --git a/frontend/src/components/charts/OrganizationDistributionChart.tsx b/frontend/src/components/charts/OrganizationDistributionChart.tsx
index 3f283a1..d9c8ecd 100644
--- a/frontend/src/components/charts/OrganizationDistributionChart.tsx
+++ b/frontend/src/components/charts/OrganizationDistributionChart.tsx
@@ -21,7 +21,12 @@ interface OrganizationDistributionChartProps {
 }
 
 // Custom tooltip with proper theme colors
-const CustomTooltip = ({ active, payload }: any) => {
+interface TooltipProps {
+  active?: boolean;
+  payload?: Array<{ payload: OrgDistributionData; value: number }>;
+}
+
+const CustomTooltip = ({ active, payload }: TooltipProps) => {
   if (active && payload && payload.length) {
     return (
       <div
diff --git a/frontend/src/components/charts/RegistrationActivityChart.tsx b/frontend/src/components/charts/RegistrationActivityChart.tsx
index c30fb34..799003f 100644
--- a/frontend/src/components/charts/RegistrationActivityChart.tsx
+++ b/frontend/src/components/charts/RegistrationActivityChart.tsx
@@ -30,7 +30,12 @@ interface RegistrationActivityChartProps {
 }
 
 // Custom tooltip with proper theme colors
-const CustomTooltip = ({ active, payload }: any) => {
+interface TooltipProps {
+  active?: boolean;
+  payload?: Array<{ payload: RegistrationActivityData; value: number }>;
+}
+
+const CustomTooltip = ({ active, payload }: TooltipProps) => {
   if (active && payload && payload.length) {
     return (
       <div
diff --git a/frontend/src/components/charts/UserGrowthChart.tsx b/frontend/src/components/charts/UserGrowthChart.tsx
index 40fe2c7..2a5ccd9 100644
--- a/frontend/src/components/charts/UserGrowthChart.tsx
+++ b/frontend/src/components/charts/UserGrowthChart.tsx
@@ -31,7 +31,12 @@ export interface UserGrowthChartProps {
 }
 
 // Custom tooltip with proper theme colors
-const CustomTooltip = ({ active, payload }: any) => {
+interface TooltipProps {
+  active?: boolean;
+  payload?: Array<{ payload: UserGrowthData; value: number }>;
+}
+
+const CustomTooltip = ({ active, payload }: TooltipProps) => {
   if (active && payload && payload.length) {
     return (
       <div
diff --git a/frontend/src/components/demo/DemoModeBanner.tsx b/frontend/src/components/demo/DemoModeBanner.tsx
index 62b112b..44e212a 100644
--- a/frontend/src/components/demo/DemoModeBanner.tsx
+++ b/frontend/src/components/demo/DemoModeBanner.tsx
@@ -7,10 +7,8 @@
 
 'use client';
 
-import { useState } from 'react';
 import config from '@/config/app.config';
 import { Sparkles } from 'lucide-react';
-import { Badge } from '@/components/ui/badge';
 import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
 
 export function DemoModeBanner() {