fix : import issues

src/components/layout/Sidebar.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Link, useLocation } from "wouter";
 import { useAuth } from "@/contexts/AuthContext";
 import { cn } from "@/lib/utils";

src/components/shared/LoadingSkeleton.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Skeleton } from "@/components/ui/skeleton";
 import { Card, CardContent, CardHeader } from "@/components/ui/card";
 

src/components/shared/PriorityBadge.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Badge } from "@/components/ui/badge";
 import { cn } from "@/lib/utils";
 

src/components/shared/StatusBadge.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import { Badge } from "@/components/ui/badge";
 import { cn } from "@/lib/utils";
 

src/components/ui/chart.tsx

@@ -111,8 +111,8 @@ const ChartTooltipContent = React.forwardRef<
       labelKey?: string
     }
 >(
-  (
-    {
+  (props: any, ref) => {
+    const {
       active,
       payload,
       className,
@@ -126,9 +126,8 @@ const ChartTooltipContent = React.forwardRef<
       color,
       nameKey,
       labelKey,
-    },
-    ref
-  ) => {
+    } = props
+
     const { config } = useChart()
 
     const tooltipLabel = React.useMemo(() => {
@@ -184,8 +183,8 @@ const ChartTooltipContent = React.forwardRef<
         {!nestLabel ? tooltipLabel : null}
         <div className="grid gap-1.5">
           {payload
-            .filter((item) => item.type !== "none")
-            .map((item, index) => {
+            .filter((item: any) => item.type !== "none")
+            .map((item: any, index: number) => {
               const key = `${nameKey || item.name || item.dataKey || "value"}`
               const itemConfig = getPayloadConfigFromPayload(config, item, key)
               const indicatorColor = color || item.payload.fill || item.color
@@ -260,11 +259,7 @@ const ChartLegend = RechartsPrimitive.Legend
 
 const ChartLegendContent = React.forwardRef<
   HTMLDivElement,
-  React.ComponentProps<"div"> &
-    Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
-      hideIcon?: boolean
-      nameKey?: string
-    }
+  any
 >(
   (
     { className, hideIcon = false, payload, verticalAlign = "bottom", nameKey },
@@ -286,8 +281,8 @@ const ChartLegendContent = React.forwardRef<
         )}
       >
         {payload
-          .filter((item) => item.type !== "none")
-          .map((item) => {
+          .filter((item: any) => item.type !== "none")
+          .map((item: any) => {
             const key = `${nameKey || item.dataKey || "value"}`
             const itemConfig = getPayloadConfigFromPayload(config, item, key)
 

src/components/ui/resizable.tsx

@@ -1,15 +1,15 @@
 "use client"
 
 import { GripVertical } from "lucide-react"
-import * as ResizablePrimitive from "react-resizable-panels"
+import { Panel, Group as PanelGroup, Separator as PanelResizeHandle } from "react-resizable-panels"
 
 import { cn } from "@/lib/utils"
 
 const ResizablePanelGroup = ({
   className,
   ...props
-}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => (
-  <ResizablePrimitive.PanelGroup
+}: React.ComponentProps<typeof PanelGroup>) => (
+  <PanelGroup
     className={cn(
       "flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
       className
@@ -18,16 +18,16 @@ const ResizablePanelGroup = ({
   />
 )
 
-const ResizablePanel = ResizablePrimitive.Panel
+const ResizablePanel = Panel
 
 const ResizableHandle = ({
   withHandle,
   className,
   ...props
-}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+}: React.ComponentProps<typeof PanelResizeHandle> & {
   withHandle?: boolean
 }) => (
-  <ResizablePrimitive.PanelResizeHandle
+  <PanelResizeHandle
     className={cn(
       "relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:-translate-y-1/2 data-[panel-group-direction=vertical]:after:translate-x-0 [&[data-panel-group-direction=vertical]>div]:rotate-90",
       className
@@ -39,7 +39,7 @@ const ResizableHandle = ({
         <GripVertical className="h-2.5 w-2.5" />
       </div>
     )}
-  </ResizablePrimitive.PanelResizeHandle>
+  </PanelResizeHandle>
 )
 
 export { ResizablePanelGroup, ResizablePanel, ResizableHandle }

src/contexts/TenantContext.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, ReactNode } from "react";
+import { createContext, useContext, ReactNode } from "react";
 import { useAuth } from "./AuthContext";
 
 interface TenantContextType {

src/data/mockData.ts

@@ -6,6 +6,7 @@ export type TaskPriority = "high" | "medium" | "low";
 export interface MockUser {
   id: number;
   tenantId: number;
+  tenantName: string;
   name: string;
   email: string;
   role: UserRole;
@@ -110,6 +111,7 @@ export interface MockActivityLog {
 export const CURRENT_USER: MockUser = {
   id: 1,
   tenantId: 1,
+  tenantName: "Acme Corporation",
   name: "Alex Johnson",
   email: "admin@acme.corp",
   role: "tenant_admin",
@@ -134,6 +136,7 @@ export const MOCK_USERS: MockUser[] = [
   {
     id: 1,
     tenantId: 1,
+    tenantName: "Acme Corporation",
     name: "Alex Johnson",
     email: "admin@acme.corp",
     role: "tenant_admin",
@@ -146,6 +149,7 @@ export const MOCK_USERS: MockUser[] = [
   {
     id: 2,
     tenantId: 1,
+    tenantName: "Acme Corporation",
     name: "Sarah Chen",
     email: "sarah@acme.corp",
     role: "manager",
@@ -158,6 +162,7 @@ export const MOCK_USERS: MockUser[] = [
   {
     id: 3,
     tenantId: 1,
+    tenantName: "Acme Corporation",
     name: "Marcus Williams",
     email: "marcus@acme.corp",
     role: "employee",
@@ -170,6 +175,7 @@ export const MOCK_USERS: MockUser[] = [
   {
     id: 4,
     tenantId: 1,
+    tenantName: "Acme Corporation",
     name: "Priya Patel",
     email: "priya@acme.corp",
     role: "employee",
@@ -182,6 +188,7 @@ export const MOCK_USERS: MockUser[] = [
   {
     id: 5,
     tenantId: 1,
+    tenantName: "Acme Corporation",
     name: "David Kim",
     email: "david@acme.corp",
     role: "employee",

src/pages/UsersPage.tsx

@@ -35,6 +35,7 @@ export default function UsersPage() {
     const user: MockUser = {
       id: users.length + 100,
       tenantId: 1,
+      tenantName: "Acme Corporation",
       name: newUser.name,
       email: newUser.email,
       role: newUser.role,