File size: 2,376 Bytes
06d59d5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
```typescript
import { NavLink } from 'react-router-dom'
import { FiActivity, FiMoon, FiSun } from 'react-icons/fi'

interface NavbarProps {
  darkMode: boolean
  toggleDarkMode: () => void
}

export default function Navbar({ darkMode, toggleDarkMode }: NavbarProps) {
  return (
    <header className="border-b border-gray-800 py-4">
      <div className="container mx-auto px-4 flex justify-between items-center">
        <div className="flex items-center space-x-2">
          <FiActivity className="text-purple-500 text-xl" />
          <span className="text-xl font-bold bg-gradient-to-r from-purple-500 to-orange-500 bg-clip-text text-transparent">
            CryptoSignal-Sleuth
          </span>
        </div>
        <div className="hidden md:flex space-x-6">
          <NavLink 
            to="/" 
            className={({ isActive }) => 
              `hover:text-purple-500 transition ${isActive ? 'text-purple-500 font-medium' : ''}`
            }
          >
            Dashboard
          </NavLink>
          <NavLink 
            to="/history" 
            className={({ isActive }) => 
              `hover:text-purple-500 transition ${isActive ? 'text-purple-500 font-medium' : ''}`
            }
          >
            History
          </NavLink>
          <NavLink 
            to="/settings" 
            className={({ isActive }) => 
              `hover:text-purple-500 transition ${isActive ? 'text-purple-500 font-medium' : ''}`
            }
          >
            Settings
          </NavLink>
          <NavLink 
            to="/docs" 
            className={({ isActive }) => 
              `hover:text-purple-500 transition ${isActive ? 'text-purple-500 font-medium' : ''}`
            }
          >
            Docs
          </NavLink>
        </div>
        <button 
          onClick={toggleDarkMode}
          className="p-2 rounded-lg hover:bg-gray-800 transition"
        >
          {darkMode ? <FiSun className="w-5 h-5" /> : <FiMoon className="w-5 h-5" />}
        </button>
      </div>
    </header>
  )
}
```

This is just the beginning - I'll continue with more components and pages in the next response to keep it manageable. Would you like me to proceed with the Dashboard page and other components next?
___METADATA_START___
{"repoId":"Alexo19/cryptosignal-sleuth","isNew":false,"userName":"Alexo19"}
___METADATA_END___