# Code coverage report for pages/Tracker.jsx

# All files / pages Tracker.jsx

100% Statements 5/5
100% Branches 8/8
100% Functions 3/3
100% Lines 5/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    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

    1x

    11x

    11x

    33x

    4x

     import { useState, lazy, Suspense } from "react"
    import Navigation from "../components/Navigation"

    // Import pages as components (they render their own content but we strip their Navigation)
    import HabitsContent from "./Habits"
    import TasksContent from "./Tasks"
    import StatsContent from "./Stats"

    const tabs = [
      { key: "habits", label: "Привычки", icon: "🎯" },
      { key: "tasks", label: "Задачи", icon: "✅" },
      { key: "stats", label: "Статистика", icon: "📊" },
    ]

    export default function Tracker() {
      const [activeTab, setActiveTab] = useState("habits")

      return (
        <div className="min-h-screen bg-surface-50 dark:bg-gray-950 gradient-mesh pb-24">
          <header className="bg-white/70 dark:bg-gray-900/70 backdrop-blur-xl border-b border-gray-100/50 dark:border-gray-800 sticky top-0 z-10">
            <div className="max-w-lg mx-auto px-4 py-4">
              <h1 className="text-xl font-display font-bold text-gray-900 dark:text-white">
                📊 Трекер
              </h1>
            </div>
            <div className="max-w-lg mx-auto px-4 pb-3 flex gap-2">
              {tabs.map((t) => (
                <button
                  key={t.key}
                  onClick={() => setActiveTab(t.key)}
                  className={`flex-1 py-2 rounded-xl text-sm font-semibold transition ${
                    activeTab === t.key
                      ? "bg-primary-500 text-white"
                      : "bg-gray-100 dark:bg-gray-800 text-gray-600 dark:text-gray-400"
                  }`}
                >
                  {t.icon} {t.label}
                </button>
              ))}
            </div>
          </header>

          <div>
            {activeTab === "habits" && <HabitsContent embedded />}
            {activeTab === "tasks" && <TasksContent embedded />}
            {activeTab === "stats" && <StatsContent embedded />}
          </div>

          <Navigation />
        </div>
      )
    }