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

@@ -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)) {

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

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

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

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() {