21

frontend/src/components/auth/ProtectedRoute.tsx

@@ -1,5 +1,5 @@
 import { useEffect, ReactNode, useState } from "react";
-import { Navigate, useLocation } from "react-router";
+import { Navigate, useLocation } from "react-router-dom";
 import { useAuthStore } from "../../store/authStore";
 import { useErrorHandler } from "../../hooks/useErrorHandler";
 import { trackLoading } from "../common/LoadingStateMonitor";

frontend/src/components/auth/SignInForm.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { Link, useNavigate, useLocation } from "react-router";
+import { Link, useNavigate, useLocation } from "react-router-dom";
 import { ChevronLeftIcon, EyeCloseIcon, EyeIcon } from "../../icons";
 import Label from "../form/Label";
 import Input from "../form/input/InputField";

frontend/src/components/auth/SignUpForm.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { Link, useNavigate } from "react-router";
+import { Link, useNavigate } from "react-router-dom";
 import { ChevronLeftIcon, EyeCloseIcon, EyeIcon } from "../../icons";
 import Label from "../form/Label";
 import Input from "../form/input/InputField";

frontend/src/components/common/PageBreadCrumb.tsx

@@ -1,4 +1,4 @@
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 interface BreadcrumbProps {
   pageTitle: string;

frontend/src/components/common/ScrollToTop.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from "react";
-import { useLocation } from "react-router";
+import { useLocation } from "react-router-dom";
 
 export function ScrollToTop() {
   const { pathname } = useLocation();

frontend/src/components/dashboard/EnhancedMetricCard.tsx

@@ -1,5 +1,5 @@
 import React, { ReactNode, useState } from "react";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 import { ArrowUpIcon, ArrowDownIcon } from "../../icons";
 import { EnhancedTooltip } from "../ui/tooltip/EnhancedTooltip";
 

frontend/src/components/dashboard/WorkflowPipeline.tsx

@@ -1,5 +1,5 @@
 import React, { ReactNode } from "react";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 import { CheckCircleIcon, TimeIcon, ArrowRightIcon } from "../../icons";
 import { Tooltip } from "../ui/tooltip";
 

frontend/src/components/header/Header.tsx

@@ -2,7 +2,7 @@ import { useState } from "react";
 import { ThemeToggleButton } from "../common/ThemeToggleButton";
 import NotificationDropdown from "./NotificationDropdown";
 import UserDropdown from "./UserDropdown";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 // Define the interface for the props
 interface HeaderProps {

frontend/src/components/header/NotificationDropdown.tsx

@@ -1,7 +1,7 @@
 import { useState, useRef } from "react";
 import { Dropdown } from "../ui/dropdown/Dropdown";
 import { DropdownItem } from "../ui/dropdown/DropdownItem";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 export default function NotificationDropdown() {
   const [isOpen, setIsOpen] = useState(false);

frontend/src/components/header/SiteSwitcher.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useRef } from "react";
-import { useLocation, useNavigate } from "react-router";
+import { useLocation, useNavigate } from "react-router-dom";
 import { Dropdown } from "../ui/dropdown/Dropdown";
 import { DropdownItem } from "../ui/dropdown/DropdownItem";
 import { fetchSites, Site, setActiveSite as apiSetActiveSite } from "../../services/api";

frontend/src/components/header/UserDropdown.tsx

@@ -1,8 +1,8 @@
 import { useState, useRef } from "react";
-import { useNavigate } from "react-router";
+import { useNavigate } from "react-router-dom";
 import { DropdownItem } from "../ui/dropdown/DropdownItem";
 import { Dropdown } from "../ui/dropdown/Dropdown";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 import { useAuthStore } from "../../store/authStore";
 
 export default function UserDropdown() {

frontend/src/components/sidebar/ApiStatusIndicator.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback, useRef } from "react";
-import { useLocation } from "react-router";
+import { useLocation } from "react-router-dom";
 import { API_BASE_URL } from "../../services/api";
 import { useAuthStore } from "../../store/authStore";
 

frontend/src/components/tasks/RelationshipMap.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 import { ArrowRightIcon } from "../../icons";
 
 export interface RelationshipData {

frontend/src/components/ui/alert/Alert.tsx

@@ -1,4 +1,4 @@
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 interface AlertProps {
   variant: "success" | "error" | "warning" | "info"; // Alert type

frontend/src/components/ui/breadcrumb/Breadcrumb.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from "react";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 interface BreadcrumbProps {
   items: Array<{

frontend/src/components/ui/dropdown/DropdownItem.tsx

@@ -1,5 +1,5 @@
 import type React from "react";
-import { Link } from "react-router";
+import { Link } from "react-router-dom";
 
 interface DropdownItemProps {
   tag?: "a" | "button";