From efa2f2a8d819a9d6b9679c1784c5cee16914d8cb Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:04:50 +0100 Subject: [PATCH 01/42] fix: correct Button import paths to use lowercase button --- apps/admin/src/app/profile/page.tsx | 2 +- apps/admin/src/components/Navigation.tsx | 2 +- apps/admin/src/components/users/Recommendations.tsx | 2 +- apps/admin/src/components/users/UserManagement.tsx | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/admin/src/app/profile/page.tsx b/apps/admin/src/app/profile/page.tsx index 646ae54..43533e2 100644 --- a/apps/admin/src/app/profile/page.tsx +++ b/apps/admin/src/app/profile/page.tsx @@ -2,7 +2,7 @@ import { useEffect, useState } from "react"; import { useUser } from "@clerk/nextjs"; -import { Button } from "@/components/ui/Button"; +import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; interface UserProfile { diff --git a/apps/admin/src/components/Navigation.tsx b/apps/admin/src/components/Navigation.tsx index 9faa549..8762d83 100644 --- a/apps/admin/src/components/Navigation.tsx +++ b/apps/admin/src/components/Navigation.tsx @@ -6,7 +6,7 @@ import { usePathname } from "next/navigation"; import { Home, Users, BarChart3, User, Brain } from "lucide-react"; import { SignedIn, UserButton } from "@clerk/nextjs"; import { cn } from "@/lib/utils"; -import { Button } from "@/components/ui/Button"; +import { Button } from "@/components/ui/button"; interface NavItem { href: string; diff --git a/apps/admin/src/components/users/Recommendations.tsx b/apps/admin/src/components/users/Recommendations.tsx index 13a6828..a2e4f8d 100644 --- a/apps/admin/src/components/users/Recommendations.tsx +++ b/apps/admin/src/components/users/Recommendations.tsx @@ -1,7 +1,7 @@ "use client"; import { useState, useEffect } from "react"; -import { Button } from "@/components/ui/Button"; +import { Button } from "@/components/ui/button"; import { Card, CardHeader, CardContent } from "@/components/ui/card"; interface Recommendation { diff --git a/apps/admin/src/components/users/UserManagement.tsx b/apps/admin/src/components/users/UserManagement.tsx index 15b7066..b1640a1 100644 --- a/apps/admin/src/components/users/UserManagement.tsx +++ b/apps/admin/src/components/users/UserManagement.tsx @@ -2,7 +2,7 @@ import { useState, useEffect } from "react"; import { UserGrid } from "@/components/users/UserGrid"; -import { Button } from "@/components/ui/Button"; +import { Button } from "@/components/ui/button"; import { Card, CardHeader, CardContent } from "@/components/ui/card"; interface User { -- 2.45.2 From 16e22f330a4079043f5f6193bb8f07c4bbbc4784 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:10:51 +0100 Subject: [PATCH 02/42] fix: update route params to Promise type for Next.js 16 compatibility --- apps/admin/src/app/api/fitness-goals/[id]/complete/route.ts | 2 +- apps/admin/src/app/api/fitness-goals/[id]/route.ts | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/admin/src/app/api/fitness-goals/[id]/complete/route.ts b/apps/admin/src/app/api/fitness-goals/[id]/complete/route.ts index 6f62465..28a8504 100644 --- a/apps/admin/src/app/api/fitness-goals/[id]/complete/route.ts +++ b/apps/admin/src/app/api/fitness-goals/[id]/complete/route.ts @@ -5,7 +5,7 @@ import { getDatabase } from '@/lib/database'; // POST - Mark goal as complete export async function POST( req: NextRequest, - { params }: { params: { id: string } } + { params }: { params: Promise<{ id: string }> } ) { try { const { userId } = await auth(); diff --git a/apps/admin/src/app/api/fitness-goals/[id]/route.ts b/apps/admin/src/app/api/fitness-goals/[id]/route.ts index dc31594..d0f6fb5 100644 --- a/apps/admin/src/app/api/fitness-goals/[id]/route.ts +++ b/apps/admin/src/app/api/fitness-goals/[id]/route.ts @@ -5,7 +5,7 @@ import { getDatabase } from '@/lib/database'; // GET - Get specific goal export async function GET( req: NextRequest, - { params }: { params: { id: string } } + { params }: { params: Promise<{ id: string }> } ) { try { const { userId } = await auth(); @@ -40,7 +40,7 @@ export async function GET( // PUT - Update goal export async function PUT( req: NextRequest, - { params }: { params: { id: string } } + { params }: { params: Promise<{ id: string }> } ) { try { const { userId } = await auth(); @@ -82,7 +82,7 @@ export async function PUT( // DELETE - Delete goal export async function DELETE( req: NextRequest, - { params }: { params: { id: string } } + { params }: { params: Promise<{ id: string }> } ) { try { const { userId } = await auth(); -- 2.45.2 From bbd0cfde9cb1bfa3d03db8f88bf8038b223d7ea1 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:15:33 +0100 Subject: [PATCH 03/42] fix: add platform check for WebBrowser warmUpAsync on web --- apps/mobile/src/hooks/useWarmUpBrowser.ts | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/apps/mobile/src/hooks/useWarmUpBrowser.ts b/apps/mobile/src/hooks/useWarmUpBrowser.ts index 9dd2212..a86bdcf 100644 --- a/apps/mobile/src/hooks/useWarmUpBrowser.ts +++ b/apps/mobile/src/hooks/useWarmUpBrowser.ts @@ -1,13 +1,17 @@ import React from "react"; import * as WebBrowser from "expo-web-browser"; +import { Platform } from "react-native"; export const useWarmUpBrowser = () => { React.useEffect(() => { // Warm up the android browser to improve UX // https://docs.expo.dev/guides/authentication/#improving-user-experience - void WebBrowser.warmUpAsync(); - return () => { - void WebBrowser.coolDownAsync(); - }; + // Only available on native platforms (iOS/Android), not on web + if (Platform.OS !== "web") { + void WebBrowser.warmUpAsync(); + return () => { + void WebBrowser.coolDownAsync(); + }; + } }, []); }; -- 2.45.2 From 2d9fbd186bbb27e00b934e5f7a99039467f9c664 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:19:09 +0100 Subject: [PATCH 04/42] fix: disable barcode scanner on web platform --- apps/mobile/src/components/ScanFoodModal.tsx | 44 ++++++++++++++------ 1 file changed, 31 insertions(+), 13 deletions(-) diff --git a/apps/mobile/src/components/ScanFoodModal.tsx b/apps/mobile/src/components/ScanFoodModal.tsx index dfaa5c0..b90db2c 100644 --- a/apps/mobile/src/components/ScanFoodModal.tsx +++ b/apps/mobile/src/components/ScanFoodModal.tsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { View, Text, StyleSheet, Modal, TouchableOpacity, TextInput, Alert } from 'react-native'; +import { View, Text, StyleSheet, Modal, TouchableOpacity, TextInput, Alert, Platform } from 'react-native'; import { CameraView, useCameraPermissions } from 'expo-camera'; import { Ionicons } from '@expo/vector-icons'; import { LinearGradient } from 'expo-linear-gradient'; @@ -111,19 +111,25 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp - - - - Position barcode within frame + {Platform.OS === 'web' ? ( + + Barcode scanning is only available on mobile devices - + ) : ( + + + + Position barcode within frame + + + )} ) : ( @@ -230,6 +236,18 @@ const styles = StyleSheet.create({ camera: { flex: 1, }, + webPlaceholder: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + backgroundColor: '#1a1a1a', + }, + webText: { + color: '#999', + fontSize: 16, + textAlign: 'center', + paddingHorizontal: 40, + }, scanOverlay: { flex: 1, justifyContent: 'center', -- 2.45.2 From fda66a770380267920e662ca4568f188bd64008f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:23:56 +0100 Subject: [PATCH 05/42] fix: completely disable camera/barcode on web platform --- apps/mobile/src/components/ScanFoodModal.tsx | 23 ++++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) diff --git a/apps/mobile/src/components/ScanFoodModal.tsx b/apps/mobile/src/components/ScanFoodModal.tsx index b90db2c..ff060db 100644 --- a/apps/mobile/src/components/ScanFoodModal.tsx +++ b/apps/mobile/src/components/ScanFoodModal.tsx @@ -20,7 +20,7 @@ const FOOD_DATABASE: { [key: string]: { name: string; calories: number; servingS }; export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProps) { - const [permission, requestPermission] = useCameraPermissions(); + const [permission, requestPermission] = Platform.OS === 'web' ? [null, null] : useCameraPermissions() as any; const [scanned, setScanned] = useState(false); const [foodData, setFoodData] = useState<{ name: string; calories: number; servingSize: string } | null>(null); const [servings, setServings] = useState('1'); @@ -68,10 +68,29 @@ export function ScanFoodModal({ visible, onClose, onAddFood }: ScanFoodModalProp }; if (!permission) { + if (Platform.OS === 'web') { + // On web, show normal modal without permissions + return ( + + + + + + + Scan Food Barcode + + + + Barcode scanning is only available on mobile devices + + + + ); + } return null; } - if (!permission.granted) { + if (!permission.granted && Platform.OS !== 'web') { return ( -- 2.45.2 From e84d0f5f8f1c7871c829b7542e9ee6e3c3053688 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:27:57 +0100 Subject: [PATCH 06/42] feat: modernize admin dashboard with premium sports design --- apps/admin/src/app/globals.css | 2 +- apps/admin/src/app/layout.tsx | 31 ++++- apps/admin/src/app/page.tsx | 118 +++++++++++------- .../analytics/AnalyticsDashboard.tsx | 107 ++++++++-------- apps/admin/src/components/ui/Sidebar.tsx | 55 +++++--- apps/admin/src/components/ui/StatsCard.tsx | 70 +++++++---- apps/admin/src/components/users/UserGrid.tsx | 69 ++++++---- 7 files changed, 284 insertions(+), 168 deletions(-) diff --git a/apps/admin/src/app/globals.css b/apps/admin/src/app/globals.css index b219a46..82fe513 100644 --- a/apps/admin/src/app/globals.css +++ b/apps/admin/src/app/globals.css @@ -32,7 +32,7 @@ --input: 214.3 31.8% 91.4%; --ring: 222.2 84% 4.9%; - --radius: 0.5rem; + --radius: 0.75rem; } .dark { diff --git a/apps/admin/src/app/layout.tsx b/apps/admin/src/app/layout.tsx index 8ae151c..82fe904 100644 --- a/apps/admin/src/app/layout.tsx +++ b/apps/admin/src/app/layout.tsx @@ -25,11 +25,34 @@ export default function RootLayout({ return ( - -
+ +
-
- {children} +
+
+
+
+

FitAI Pro

+
+
+ + + + + + +
+
+
+
+ {children} +
diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index a0d682a..dc8ed12 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -46,56 +46,78 @@ export default function Home() { }; return ( -
-
-

Dashboard

-

Welcome back, here's what's happening today.

-
- -
- - - 0 ? "+" : ""}${stats.revenueGrowth}%`} - trend={stats.revenueGrowth >= 0 ? "up" : "down"} - icon={CreditCard} - color="purple" - /> - -
- -
-
-

Recent Activity

- +
+
+ {/* Hero Section */} +
+
+
+
+

+ FitAI Dashboard +

+
+

Performance metrics & athlete insights

+
-
-

Quick Analytics

- + {/* Stats Grid */} +
+ + + 0 ? "+" : ""}${stats.revenueGrowth}%`} + trend={stats.revenueGrowth >= 0 ? "up" : "down"} + icon={CreditCard} + color="purple" + /> + +
+ + {/* Main Content Grid */} +
+
+
+
+

Active Athletes

+

Manage and monitor your fitness clients

+
+ +
+
+ +
+
+
+

Performance

+

Quick insights & analytics

+
+ +
+
diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index 8031fdc..e4825b8 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -67,74 +67,71 @@ export function AnalyticsDashboard() { if (loading) { return (
-
Loading analytics...
+
+
⚡
+

Loading analytics...

+
) } return (
-

Analytics Dashboard

+ {/* Key Metrics Cards */} +
+
+

Total Athletes

+
+
{totalUsers}
+ active +
+
- {/* Key Metrics */} -
- - -
-
{totalUsers}
-
Total Users
-
- - +
+

Total Revenue

+
+
${totalRevenue.toLocaleString()}
+ ytd +
+
- - -
-
${totalRevenue.toLocaleString()}
-
Total Revenue
-
- - - - - -
-
{activeMembers}
-
Active Members
-
- - +
+

Active Members

+
+
{activeMembers}
+ members +
+
- {/* Charts */} -
- - -

User Growth

- - - - - + {/* Charts Grid */} +
+
+
+

User Growth Trend

+

Last 6 months performance

+
+ +
- - -

Membership Distribution

- - +
+
+
+

Membership Mix

+

Distribution breakdown

+
- - -
+
- - -

Monthly Revenue

- - - - - +
+
+

Revenue Stream

+

Monthly earnings

+
+ +
+
+
) } \ No newline at end of file diff --git a/apps/admin/src/components/ui/Sidebar.tsx b/apps/admin/src/components/ui/Sidebar.tsx index 8332f86..3082650 100644 --- a/apps/admin/src/components/ui/Sidebar.tsx +++ b/apps/admin/src/components/ui/Sidebar.tsx @@ -65,14 +65,24 @@ export function Sidebar() { ]; return ( - - ); -

-

- {user?.primaryEmailAddress?.emailAddress} -

-
-
-
- ); } -- 2.45.2 From d38f0a4cc26d804fefad38acc6c90b079dde7ee1 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:32:35 +0100 Subject: [PATCH 08/42] style: enhance card colors and improve typography hierarchy --- .../analytics/AnalyticsDashboard.tsx | 30 ++++---- apps/admin/src/components/ui/StatsCard.tsx | 76 +++++++++++-------- 2 files changed, 60 insertions(+), 46 deletions(-) diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index e4825b8..f76b01d 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -79,27 +79,27 @@ export function AnalyticsDashboard() {
{/* Key Metrics Cards */}
-
-

Total Athletes

-
-
{totalUsers}
- active +
+

Total Athletes

+
+
{totalUsers}
+ active
-
-

Total Revenue

-
-
${totalRevenue.toLocaleString()}
- ytd +
+

Total Revenue

+
+
${totalRevenue.toLocaleString()}
+ ytd
-
-

Active Members

-
-
{activeMembers}
- members +
+

Active Members

+
+
{activeMembers}
+ members
diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index 7e23530..a277723 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -13,56 +13,70 @@ interface StatsCardProps { export function StatsCard({ title, value, change, trend, icon: Icon, color = "blue" }: StatsCardProps) { const colorStyles = { blue: { - bg: "bg-gradient-to-br from-blue-600 to-blue-700", - iconBg: "bg-blue-500/20 text-blue-300", - light: "from-blue-50 to-blue-100/50", + bg: "bg-gradient-to-br from-blue-600 to-blue-800", + text: "text-blue-800", + light: "from-blue-100/80 to-blue-150/80", + badge: "bg-blue-200/60 text-blue-900", + icon: "bg-blue-600/30 text-blue-700", }, green: { - bg: "bg-gradient-to-br from-emerald-600 to-emerald-700", - iconBg: "bg-emerald-500/20 text-emerald-300", - light: "from-emerald-50 to-emerald-100/50", + bg: "bg-gradient-to-br from-emerald-600 to-emerald-800", + text: "text-emerald-800", + light: "from-emerald-100/80 to-emerald-150/80", + badge: "bg-emerald-200/60 text-emerald-900", + icon: "bg-emerald-600/30 text-emerald-700", }, purple: { - bg: "bg-gradient-to-br from-purple-600 to-purple-700", - iconBg: "bg-purple-500/20 text-purple-300", - light: "from-purple-50 to-purple-100/50", + bg: "bg-gradient-to-br from-purple-600 to-purple-800", + text: "text-purple-800", + light: "from-purple-100/80 to-purple-150/80", + badge: "bg-purple-200/60 text-purple-900", + icon: "bg-purple-600/30 text-purple-700", }, orange: { - bg: "bg-gradient-to-br from-orange-600 to-orange-700", - iconBg: "bg-orange-500/20 text-orange-300", - light: "from-orange-50 to-orange-100/50", + bg: "bg-gradient-to-br from-orange-600 to-orange-800", + text: "text-orange-800", + light: "from-orange-100/80 to-orange-150/80", + badge: "bg-orange-200/60 text-orange-900", + icon: "bg-orange-600/30 text-orange-700", }, }; const styles = colorStyles[color]; return ( - -
- - + + + {title} -
- +
+
- -
+ +
{value}
{change && ( -
-

- +

+ + {trend === "up" ? "↑" : trend === "down" ? "↓" : "→"} {change} + + vs last month +
+ )} + + + ); {trend === "up" ? "↑" : trend === "down" ? "↓" : "→"} {change}

-- 2.45.2 From 77546a50175d033aab171df9ed8bf67ad33ed0fe Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:34:40 +0100 Subject: [PATCH 09/42] fix: remove duplicate code in StatsCard --- apps/admin/src/components/ui/StatsCard.tsx | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index a277723..690130f 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -77,12 +77,7 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl ); - {trend === "up" ? "↑" : trend === "down" ? "↓" : "→"} {change} - -

- vs last month -
- )} +} ); -- 2.45.2 From feacef2a81483eab14eb221584dfffdbb981ede3 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:35:37 +0100 Subject: [PATCH 10/42] fix: remove all duplicate closing tags in StatsCard --- apps/admin/src/components/ui/StatsCard.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index 690130f..2096291 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -77,8 +77,4 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl ); -} - - - ); } -- 2.45.2 From 51df7f57ecbc20a9160cf07379eddcb5e2a0bd55 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:37:01 +0100 Subject: [PATCH 11/42] style: compact stats cards with better colors and layout --- apps/admin/src/components/ui/StatsCard.tsx | 67 ++++++++++------------ 1 file changed, 31 insertions(+), 36 deletions(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index 2096291..ceb2494 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -13,68 +13,63 @@ interface StatsCardProps { export function StatsCard({ title, value, change, trend, icon: Icon, color = "blue" }: StatsCardProps) { const colorStyles = { blue: { - bg: "bg-gradient-to-br from-blue-600 to-blue-800", - text: "text-blue-800", - light: "from-blue-100/80 to-blue-150/80", - badge: "bg-blue-200/60 text-blue-900", - icon: "bg-blue-600/30 text-blue-700", + bg: "from-blue-600 to-blue-700", + text: "text-blue-900", + light: "from-blue-50 to-blue-100", + badge: "bg-blue-100 text-blue-700", + icon: "bg-blue-200/70 text-blue-700", }, green: { - bg: "bg-gradient-to-br from-emerald-600 to-emerald-800", - text: "text-emerald-800", - light: "from-emerald-100/80 to-emerald-150/80", - badge: "bg-emerald-200/60 text-emerald-900", - icon: "bg-emerald-600/30 text-emerald-700", + bg: "from-emerald-600 to-emerald-700", + text: "text-emerald-900", + light: "from-emerald-50 to-emerald-100", + badge: "bg-emerald-100 text-emerald-700", + icon: "bg-emerald-200/70 text-emerald-700", }, purple: { - bg: "bg-gradient-to-br from-purple-600 to-purple-800", - text: "text-purple-800", - light: "from-purple-100/80 to-purple-150/80", - badge: "bg-purple-200/60 text-purple-900", - icon: "bg-purple-600/30 text-purple-700", + bg: "from-purple-600 to-purple-700", + text: "text-purple-900", + light: "from-purple-50 to-purple-100", + badge: "bg-purple-100 text-purple-700", + icon: "bg-purple-200/70 text-purple-700", }, orange: { - bg: "bg-gradient-to-br from-orange-600 to-orange-800", - text: "text-orange-800", - light: "from-orange-100/80 to-orange-150/80", - badge: "bg-orange-200/60 text-orange-900", - icon: "bg-orange-600/30 text-orange-700", + bg: "from-orange-600 to-orange-700", + text: "text-orange-900", + light: "from-orange-50 to-orange-100", + badge: "bg-orange-100 text-orange-700", + icon: "bg-orange-200/70 text-orange-700", }, }; const styles = colorStyles[color]; return ( - - - + + + {title} -
- +
+
- -
+ +
{value}
{change && ( -
+
{trend === "up" ? "↑" : trend === "down" ? "↓" : "→"} {change} - vs last month + vs month
)} ); } +} -- 2.45.2 From 0a55438bcea63d634d682db45300afca84359605 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:38:03 +0100 Subject: [PATCH 12/42] fix: remove extra closing brace in StatsCard --- apps/admin/src/components/ui/StatsCard.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index ceb2494..aa49762 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -72,4 +72,3 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl ); } -} -- 2.45.2 From dd78602dd6774fe31a5d235d56303ff62be9b3b2 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:39:42 +0100 Subject: [PATCH 13/42] style: improve UserManagement layout with flex-wrap and better organization --- .../src/components/users/UserManagement.tsx | 178 ++++++++++-------- 1 file changed, 96 insertions(+), 82 deletions(-) diff --git a/apps/admin/src/components/users/UserManagement.tsx b/apps/admin/src/components/users/UserManagement.tsx index b1640a1..1878123 100644 --- a/apps/admin/src/components/users/UserManagement.tsx +++ b/apps/admin/src/components/users/UserManagement.tsx @@ -205,92 +205,106 @@ export function UserManagement() { }; return ( -
-
-

User Management

-
- - - - - - - - -
+
+ {/* Header Section */} +
+

User Management

+

Manage and monitor your fitness clients

-
-
- Showing {users.length} users - {selectedUser && ( - - Selected: {selectedUser.firstName} {selectedUser.lastName} - - )} -
-
- - -
+ {/* Filter Buttons */} +
+ + + + +
+ {/* Action Buttons */} +
+ + + + + +
+ + {/* Stats */} +
+ Showing {users.length} users + {selectedUser && ( + + Selected: {selectedUser.firstName} {selectedUser.lastName} + + )} +
+ + {/* User Grid */} Date: Thu, 11 Dec 2025 13:41:57 +0100 Subject: [PATCH 14/42] fix: simplify AnalyticsDashboard layout to prevent text overflow and improve stability --- .../analytics/AnalyticsDashboard.tsx | 76 ++++++++++--------- 1 file changed, 40 insertions(+), 36 deletions(-) diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index f76b01d..2bfeab6 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -76,58 +76,62 @@ export function AnalyticsDashboard() { } return ( -
- {/* Key Metrics Cards */} -
-
-

Total Athletes

-
-
{totalUsers}
- active +
+ {/* Key Metrics Cards - Stacked vertically */} +
+
+

Total Athletes

+
+
{totalUsers}
+ active
-
-

Total Revenue

-
-
${totalRevenue.toLocaleString()}
- ytd +
+

Total Revenue

+
+
${totalRevenue.toLocaleString()}
+ ytd
-
-

Active Members

-
-
{activeMembers}
- members +
+

Active Members

+
+
{activeMembers}
+ members
- {/* Charts Grid */} -
-
-
-

User Growth Trend

-

Last 6 months performance

+ {/* Charts - Single column layout for stability */} +
+
+
+

User Growth Trend

+

Last 6 months performance

+
+
+
-
-
-
-
-

Membership Mix

-

Distribution breakdown

-
+
+
+

Membership Mix

+

Distribution breakdown

+
+
+
-
-
-

Revenue Stream

-

Monthly earnings

-
+
+
+

Revenue Stream

+

Monthly earnings

+
+
-- 2.45.2 From 6dc90f1745084f1ec32b152b4954cb713560d1fa Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:44:02 +0100 Subject: [PATCH 15/42] feat: reorganize dashboard layout with UserManagement full-width and horizontal analytics charts --- apps/admin/src/app/page.tsx | 18 ++++++++--------- .../analytics/AnalyticsDashboard.tsx | 20 +++++++++---------- 2 files changed, 19 insertions(+), 19 deletions(-) diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index dc8ed12..74ddbab 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -98,8 +98,9 @@ export default function Home() {
{/* Main Content Grid */} -
-
+
+ {/* User Management - Full Width */} +

Active Athletes

@@ -109,14 +110,13 @@ export default function Home() {
-
-
-
-

Performance

-

Quick insights & analytics

-
- + {/* Analytics - 3 Columns Horizontal Layout */} +
+
+

Analytics

+

Performance metrics and insights

+
diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index 2bfeab6..3b3e184 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -77,8 +77,8 @@ export function AnalyticsDashboard() { return (
- {/* Key Metrics Cards - Stacked vertically */} -
+ {/* Key Metrics Cards - 3 columns */} +

Total Athletes

@@ -104,34 +104,34 @@ export function AnalyticsDashboard() {
- {/* Charts - Single column layout for stability */} -
+ {/* Charts - 3 Columns Horizontal */} +
-

User Growth Trend

+

User Growth Trend

Last 6 months performance

-
+
-

Membership Mix

+

Membership Mix

Distribution breakdown

-
+
-

Revenue Stream

+

Revenue Stream

Monthly earnings

-
+
-- 2.45.2 From 35d64ef3c08ee779850c6af32af57f05dcbe6c61 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:48:30 +0100 Subject: [PATCH 16/42] style: apply bold modern colors throughout dashboard - dark backgrounds, vibrant gradients, white text --- apps/admin/src/app/page.tsx | 16 +++---- .../analytics/AnalyticsDashboard.tsx | 42 +++++++++---------- apps/admin/src/components/ui/StatsCard.tsx | 34 +++++++-------- 3 files changed, 46 insertions(+), 46 deletions(-) diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index 74ddbab..5838790 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -46,18 +46,18 @@ export default function Home() { }; return ( -
+
{/* Hero Section */}
-

+

FitAI Dashboard

-

Performance metrics & athlete insights

+

Performance metrics & athlete insights

@@ -100,11 +100,11 @@ export default function Home() { {/* Main Content Grid */}
{/* User Management - Full Width */} -
+
-

Active Athletes

-

Manage and monitor your fitness clients

+

Active Athletes

+

Manage and monitor your fitness clients

@@ -113,8 +113,8 @@ export default function Home() { {/* Analytics - 3 Columns Horizontal Layout */}
-

Analytics

-

Performance metrics and insights

+

Analytics

+

Performance metrics and insights

diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index 3b3e184..d6c393b 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -79,57 +79,57 @@ export function AnalyticsDashboard() {
{/* Key Metrics Cards - 3 columns */}
-
-

Total Athletes

+
+

Total Athletes

-
{totalUsers}
- active +
{totalUsers}
+ active
-
-

Total Revenue

+
+

Total Revenue

-
${totalRevenue.toLocaleString()}
- ytd +
${totalRevenue.toLocaleString()}
+ ytd
-
-

Active Members

+
+

Active Members

-
{activeMembers}
- members +
{activeMembers}
+ members
{/* Charts - 3 Columns Horizontal */}
-
+
-

User Growth Trend

-

Last 6 months performance

+

User Growth Trend

+

Last 6 months performance

-
+
-

Membership Mix

-

Distribution breakdown

+

Membership Mix

+

Distribution breakdown

-
+
-

Revenue Stream

-

Monthly earnings

+

Revenue Stream

+

Monthly earnings

diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index aa49762..d6aacf6 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -14,38 +14,38 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl const colorStyles = { blue: { bg: "from-blue-600 to-blue-700", - text: "text-blue-900", - light: "from-blue-50 to-blue-100", - badge: "bg-blue-100 text-blue-700", - icon: "bg-blue-200/70 text-blue-700", + text: "text-white", + light: "from-blue-600 to-blue-700", + badge: "bg-blue-400 text-white", + icon: "bg-white/20 text-white", }, green: { bg: "from-emerald-600 to-emerald-700", - text: "text-emerald-900", - light: "from-emerald-50 to-emerald-100", - badge: "bg-emerald-100 text-emerald-700", - icon: "bg-emerald-200/70 text-emerald-700", + text: "text-white", + light: "from-emerald-600 to-emerald-700", + badge: "bg-emerald-400 text-white", + icon: "bg-white/20 text-white", }, purple: { bg: "from-purple-600 to-purple-700", - text: "text-purple-900", - light: "from-purple-50 to-purple-100", - badge: "bg-purple-100 text-purple-700", - icon: "bg-purple-200/70 text-purple-700", + text: "text-white", + light: "from-purple-600 to-purple-700", + badge: "bg-purple-400 text-white", + icon: "bg-white/20 text-white", }, orange: { bg: "from-orange-600 to-orange-700", - text: "text-orange-900", - light: "from-orange-50 to-orange-100", - badge: "bg-orange-100 text-orange-700", - icon: "bg-orange-200/70 text-orange-700", + text: "text-white", + light: "from-orange-600 to-orange-700", + badge: "bg-orange-400 text-white", + icon: "bg-white/20 text-white", }, }; const styles = colorStyles[color]; return ( - + {title} -- 2.45.2 From c9fbab3bbbe7240511a0d2c814ce0dc8d85d04ab Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:51:36 +0100 Subject: [PATCH 17/42] style: revert background to light theme and update card colors to match sidebar palette --- apps/admin/src/app/page.tsx | 16 +++++----- .../analytics/AnalyticsDashboard.tsx | 30 ++++++++--------- apps/admin/src/components/ui/StatsCard.tsx | 32 +++++++++---------- 3 files changed, 39 insertions(+), 39 deletions(-) diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index 5838790..74ddbab 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -46,18 +46,18 @@ export default function Home() { }; return ( -
+
{/* Hero Section */}
-

+

FitAI Dashboard

-

Performance metrics & athlete insights

+

Performance metrics & athlete insights

@@ -100,11 +100,11 @@ export default function Home() { {/* Main Content Grid */}
{/* User Management - Full Width */} -
+
-

Active Athletes

-

Manage and monitor your fitness clients

+

Active Athletes

+

Manage and monitor your fitness clients

@@ -113,8 +113,8 @@ export default function Home() { {/* Analytics - 3 Columns Horizontal Layout */}
-

Analytics

-

Performance metrics and insights

+

Analytics

+

Performance metrics and insights

diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index d6c393b..43bba23 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -79,57 +79,57 @@ export function AnalyticsDashboard() {
{/* Key Metrics Cards - 3 columns */}
-
+

Total Athletes

{totalUsers}
- active + active
-
+

Total Revenue

${totalRevenue.toLocaleString()}
- ytd + ytd
-
+

Active Members

{activeMembers}
- members + members
{/* Charts - 3 Columns Horizontal */}
-
+
-

User Growth Trend

-

Last 6 months performance

+

User Growth Trend

+

Last 6 months performance

-
+
-

Membership Mix

-

Distribution breakdown

+

Membership Mix

+

Distribution breakdown

-
+
-

Revenue Stream

-

Monthly earnings

+

Revenue Stream

+

Monthly earnings

diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index d6aacf6..07ae4b6 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -13,32 +13,32 @@ interface StatsCardProps { export function StatsCard({ title, value, change, trend, icon: Icon, color = "blue" }: StatsCardProps) { const colorStyles = { blue: { - bg: "from-blue-600 to-blue-700", + bg: "from-blue-600 to-cyan-600", text: "text-white", - light: "from-blue-600 to-blue-700", - badge: "bg-blue-400 text-white", - icon: "bg-white/20 text-white", + light: "from-blue-50 to-cyan-50", + badge: "bg-blue-100 text-blue-700", + icon: "bg-blue-100/50 text-blue-600", }, green: { - bg: "from-emerald-600 to-emerald-700", + bg: "from-emerald-600 to-teal-600", text: "text-white", - light: "from-emerald-600 to-emerald-700", - badge: "bg-emerald-400 text-white", - icon: "bg-white/20 text-white", + light: "from-emerald-50 to-teal-50", + badge: "bg-emerald-100 text-emerald-700", + icon: "bg-emerald-100/50 text-emerald-600", }, purple: { - bg: "from-purple-600 to-purple-700", + bg: "from-purple-600 to-blue-600", text: "text-white", - light: "from-purple-600 to-purple-700", - badge: "bg-purple-400 text-white", - icon: "bg-white/20 text-white", + light: "from-purple-50 to-blue-50", + badge: "bg-purple-100 text-purple-700", + icon: "bg-purple-100/50 text-purple-600", }, orange: { - bg: "from-orange-600 to-orange-700", + bg: "from-orange-600 to-red-600", text: "text-white", - light: "from-orange-600 to-orange-700", - badge: "bg-orange-400 text-white", - icon: "bg-white/20 text-white", + light: "from-orange-50 to-red-50", + badge: "bg-orange-100 text-orange-700", + icon: "bg-orange-100/50 text-orange-600", }, }; -- 2.45.2 From 0024510fdb3c4967f1b487c9230b974b71ca90a5 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:54:01 +0100 Subject: [PATCH 18/42] feat: add performance metrics dashboard to mobile home screen with gradient cards --- apps/mobile/src/app/(tabs)/index.tsx | 4 + .../src/components/PerformanceMetrics.tsx | 191 ++++++++++++++++++ 2 files changed, 195 insertions(+) create mode 100644 apps/mobile/src/components/PerformanceMetrics.tsx diff --git a/apps/mobile/src/app/(tabs)/index.tsx b/apps/mobile/src/app/(tabs)/index.tsx index e0d323f..9149541 100644 --- a/apps/mobile/src/app/(tabs)/index.tsx +++ b/apps/mobile/src/app/(tabs)/index.tsx @@ -10,6 +10,7 @@ import { TrackMealModal } from "../../components/TrackMealModal"; import { AddWaterModal } from "../../components/AddWaterModal"; import { HydrationWidget } from "../../components/HydrationWidget"; import { ScanFoodModal } from "../../components/ScanFoodModal"; +import { PerformanceMetrics } from "../../components/PerformanceMetrics"; import { Ionicons } from "@expo/vector-icons"; export default function HomeScreen() { @@ -131,6 +132,9 @@ export default function HomeScreen() { duration={45} /> + {/* Performance Metrics */} + + {/* Hydration Widget */} = ({ title, value, change, trend, icon, colors }) => { + const isPositive = trend === 'up'; + const changeColor = isPositive ? '#10b981' : '#ef4444'; + const trendIcon = isPositive ? 'arrow-up' : 'arrow-down'; + + return ( + + + + + + + + {title} + {value} + + + + + + {change} + + vs month + + + + ); +}; + +export const PerformanceMetrics: React.FC = () => { + const metrics: MetricProps[] = [ + { + title: 'Total Users', + value: '0', + change: '+12%', + trend: 'up', + icon: 'people', + colors: ['#3b82f6', '#06b6d4'], + }, + { + title: 'Active Clients', + value: '0', + change: '+5%', + trend: 'up', + icon: 'person-add', + colors: ['#10b981', '#14b8a6'], + }, + { + title: 'Revenue', + value: '$0.00', + change: '0%', + trend: 'down', + icon: 'wallet', + colors: ['#a855f7', '#3b82f6'], + }, + { + title: 'Growth', + value: '24%', + change: '-2%', + trend: 'down', + icon: 'trending-up', + colors: ['#f97316', '#ef4444'], + }, + ]; + + return ( + + + Performance metrics & athlete insights + + + + {metrics.map((metric, index) => ( + + + + ))} + + + ); +}; + +const styles = StyleSheet.create({ + container: { + paddingHorizontal: 20, + marginBottom: 24, + }, + header: { + marginBottom: 16, + }, + title: { + fontSize: 14, + fontWeight: '600', + color: theme.colors.gray600, + letterSpacing: 0.3, + }, + metricsGrid: { + flexDirection: 'row', + flexWrap: 'wrap', + justifyContent: 'space-between', + gap: 12, + }, + metricWrapper: { + width: '48%', + }, + card: { + borderRadius: 20, + overflow: 'hidden', + elevation: 5, + shadowColor: '#000', + shadowOffset: { width: 0, height: 4 }, + shadowOpacity: 0.15, + shadowRadius: 12, + }, + cardContent: { + padding: 16, + minHeight: 140, + justifyContent: 'space-between', + }, + iconContainer: { + width: 40, + height: 40, + borderRadius: 12, + backgroundColor: 'rgba(255, 255, 255, 0.2)', + justifyContent: 'center', + alignItems: 'center', + marginBottom: 12, + }, + info: { + marginBottom: 12, + }, + label: { + fontSize: 12, + fontWeight: '600', + color: 'rgba(255, 255, 255, 0.8)', + letterSpacing: 0.5, + marginBottom: 6, + textTransform: 'uppercase', + }, + value: { + fontSize: 24, + fontWeight: '800', + color: '#fff', + }, + changeContainer: { + alignItems: 'flex-start', + }, + trendBadge: { + flexDirection: 'row', + paddingHorizontal: 10, + paddingVertical: 4, + borderRadius: 8, + alignItems: 'center', + marginBottom: 4, + }, + changeText: { + fontSize: 12, + fontWeight: '700', + color: '#fff', + }, + compareText: { + fontSize: 10, + color: 'rgba(255, 255, 255, 0.7)', + fontWeight: '500', + }, +}); -- 2.45.2 From e4eadc858c454fd4912ae4c255d66f709e27c23f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 13:56:18 +0100 Subject: [PATCH 19/42] style: strengthen performance metrics colors with darker gradients and brighter white text --- apps/mobile/src/components/PerformanceMetrics.tsx | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/apps/mobile/src/components/PerformanceMetrics.tsx b/apps/mobile/src/components/PerformanceMetrics.tsx index 2b4e261..3e681c3 100644 --- a/apps/mobile/src/components/PerformanceMetrics.tsx +++ b/apps/mobile/src/components/PerformanceMetrics.tsx @@ -60,7 +60,7 @@ export const PerformanceMetrics: React.FC = () => { change: '+12%', trend: 'up', icon: 'people', - colors: ['#3b82f6', '#06b6d4'], + colors: ['#1e40af', '#0369a1'], }, { title: 'Active Clients', @@ -68,7 +68,7 @@ export const PerformanceMetrics: React.FC = () => { change: '+5%', trend: 'up', icon: 'person-add', - colors: ['#10b981', '#14b8a6'], + colors: ['#065f46', '#0d9488'], }, { title: 'Revenue', @@ -76,7 +76,7 @@ export const PerformanceMetrics: React.FC = () => { change: '0%', trend: 'down', icon: 'wallet', - colors: ['#a855f7', '#3b82f6'], + colors: ['#6b21a8', '#1e40af'], }, { title: 'Growth', @@ -84,7 +84,7 @@ export const PerformanceMetrics: React.FC = () => { change: '-2%', trend: 'down', icon: 'trending-up', - colors: ['#f97316', '#ef4444'], + colors: ['#9a3412', '#dc2626'], }, ]; @@ -146,7 +146,7 @@ const styles = StyleSheet.create({ width: 40, height: 40, borderRadius: 12, - backgroundColor: 'rgba(255, 255, 255, 0.2)', + backgroundColor: 'rgba(255, 255, 255, 0.3)', justifyContent: 'center', alignItems: 'center', marginBottom: 12, @@ -157,7 +157,7 @@ const styles = StyleSheet.create({ label: { fontSize: 12, fontWeight: '600', - color: 'rgba(255, 255, 255, 0.8)', + color: '#fff', letterSpacing: 0.5, marginBottom: 6, textTransform: 'uppercase', @@ -185,7 +185,7 @@ const styles = StyleSheet.create({ }, compareText: { fontSize: 10, - color: 'rgba(255, 255, 255, 0.7)', + color: '#fff', fontWeight: '500', }, }); -- 2.45.2 From 71a05c51bf282cd868c8986a83970ae4876e378d Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:00:03 +0100 Subject: [PATCH 20/42] fix: update mobile metric cards with proper 500-range vibrant colors matching admin dashboard --- .../src/components/PerformanceMetrics.tsx | 115 +++++++++++------- 1 file changed, 72 insertions(+), 43 deletions(-) diff --git a/apps/mobile/src/components/PerformanceMetrics.tsx b/apps/mobile/src/components/PerformanceMetrics.tsx index 3e681c3..b21b053 100644 --- a/apps/mobile/src/components/PerformanceMetrics.tsx +++ b/apps/mobile/src/components/PerformanceMetrics.tsx @@ -10,42 +10,78 @@ interface MetricProps { change: string; trend: 'up' | 'down'; icon: string; - colors: string[]; + colorScheme: 'blue' | 'green' | 'purple' | 'orange'; } -const MetricCard: React.FC = ({ title, value, change, trend, icon, colors }) => { +const getColorScheme = (colorScheme: 'blue' | 'green' | 'purple' | 'orange') => { + const schemes = { + blue: { + colors: ['#3b82f6', '#06b6d4'], + text: '#ffffff', + badge: '#dbeafe', + badgeText: '#1e40af', + icon: '#60a5fa', + }, + green: { + colors: ['#10b981', '#14b8a6'], + text: '#ffffff', + badge: '#dcfce7', + badgeText: '#047857', + icon: '#34d399', + }, + purple: { + colors: ['#a855f7', '#3b82f6'], + text: '#ffffff', + badge: '#e9d5ff', + badgeText: '#6b21a8', + icon: '#c084fc', + }, + orange: { + colors: ['#f97316', '#ef4444'], + text: '#ffffff', + badge: '#fed7aa', + badgeText: '#92400e', + icon: '#fb923c', + }, + }; + return schemes[colorScheme]; +}; + +const MetricCard: React.FC = ({ title, value, change, trend, icon, colorScheme }) => { + const colors = getColorScheme(colorScheme); const isPositive = trend === 'up'; - const changeColor = isPositive ? '#10b981' : '#ef4444'; const trendIcon = isPositive ? 'arrow-up' : 'arrow-down'; return ( - - + + {title} + + + - - {title} - {value} - + {value} - + - {change} + + {trend === 'up' ? '↑' : '↓'} {change} + - vs month + vs month @@ -60,7 +96,7 @@ export const PerformanceMetrics: React.FC = () => { change: '+12%', trend: 'up', icon: 'people', - colors: ['#1e40af', '#0369a1'], + colorScheme: 'blue', }, { title: 'Active Clients', @@ -68,7 +104,7 @@ export const PerformanceMetrics: React.FC = () => { change: '+5%', trend: 'up', icon: 'person-add', - colors: ['#065f46', '#0d9488'], + colorScheme: 'green', }, { title: 'Revenue', @@ -76,7 +112,7 @@ export const PerformanceMetrics: React.FC = () => { change: '0%', trend: 'down', icon: 'wallet', - colors: ['#6b21a8', '#1e40af'], + colorScheme: 'purple', }, { title: 'Growth', @@ -84,7 +120,7 @@ export const PerformanceMetrics: React.FC = () => { change: '-2%', trend: 'down', icon: 'trending-up', - colors: ['#9a3412', '#dc2626'], + colorScheme: 'orange', }, ]; @@ -116,7 +152,7 @@ const styles = StyleSheet.create({ title: { fontSize: 14, fontWeight: '600', - color: theme.colors.gray600, + color: '#4b5563', letterSpacing: 0.3, }, metricsGrid: { @@ -131,61 +167,54 @@ const styles = StyleSheet.create({ card: { borderRadius: 20, overflow: 'hidden', - elevation: 5, + elevation: 8, shadowColor: '#000', shadowOffset: { width: 0, height: 4 }, - shadowOpacity: 0.15, + shadowOpacity: 0.2, shadowRadius: 12, }, cardContent: { padding: 16, - minHeight: 140, + minHeight: 160, justifyContent: 'space-between', }, iconContainer: { - width: 40, - height: 40, - borderRadius: 12, - backgroundColor: 'rgba(255, 255, 255, 0.3)', + width: 36, + height: 36, + borderRadius: 10, justifyContent: 'center', alignItems: 'center', - marginBottom: 12, - }, - info: { - marginBottom: 12, }, label: { - fontSize: 12, - fontWeight: '600', - color: '#fff', - letterSpacing: 0.5, - marginBottom: 6, + fontSize: 11, + fontWeight: '700', + letterSpacing: 0.6, + marginBottom: 12, textTransform: 'uppercase', }, value: { - fontSize: 24, + fontSize: 28, fontWeight: '800', - color: '#fff', + marginBottom: 12, }, changeContainer: { alignItems: 'flex-start', }, trendBadge: { flexDirection: 'row', - paddingHorizontal: 10, + paddingHorizontal: 8, paddingVertical: 4, - borderRadius: 8, + borderRadius: 6, alignItems: 'center', - marginBottom: 4, + marginBottom: 6, }, changeText: { - fontSize: 12, + fontSize: 11, fontWeight: '700', - color: '#fff', }, compareText: { fontSize: 10, - color: '#fff', fontWeight: '500', }, }); + -- 2.45.2 From 966bcb084d340487b5e116a0329e5e434925e425 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:01:32 +0100 Subject: [PATCH 21/42] style: implement dark gradient metric cards with high contrast white text and colored labels --- .../src/components/PerformanceMetrics.tsx | 30 +++++++++++-------- 1 file changed, 17 insertions(+), 13 deletions(-) diff --git a/apps/mobile/src/components/PerformanceMetrics.tsx b/apps/mobile/src/components/PerformanceMetrics.tsx index b21b053..3d410e8 100644 --- a/apps/mobile/src/components/PerformanceMetrics.tsx +++ b/apps/mobile/src/components/PerformanceMetrics.tsx @@ -16,31 +16,35 @@ interface MetricProps { const getColorScheme = (colorScheme: 'blue' | 'green' | 'purple' | 'orange') => { const schemes = { blue: { - colors: ['#3b82f6', '#06b6d4'], + colors: ['#1e3a8a', '#0c4a6e'], text: '#ffffff', - badge: '#dbeafe', - badgeText: '#1e40af', + label: '#93c5fd', + badge: '#3b82f6', + badgeText: '#ffffff', icon: '#60a5fa', }, green: { - colors: ['#10b981', '#14b8a6'], + colors: ['#064e3b', '#047857'], text: '#ffffff', - badge: '#dcfce7', - badgeText: '#047857', + label: '#86efac', + badge: '#10b981', + badgeText: '#ffffff', icon: '#34d399', }, purple: { - colors: ['#a855f7', '#3b82f6'], + colors: ['#581c87', '#7c3aed'], text: '#ffffff', - badge: '#e9d5ff', - badgeText: '#6b21a8', + label: '#d8b4fe', + badge: '#a855f7', + badgeText: '#ffffff', icon: '#c084fc', }, orange: { - colors: ['#f97316', '#ef4444'], + colors: ['#92400e', '#b45309'], text: '#ffffff', - badge: '#fed7aa', - badgeText: '#92400e', + label: '#fcd34d', + badge: '#f97316', + badgeText: '#ffffff', icon: '#fb923c', }, }; @@ -61,7 +65,7 @@ const MetricCard: React.FC = ({ title, value, change, trend, icon, > - {title} + {title} -- 2.45.2 From 61bad8d30cb67cd26ccc3dcb1c39fa8fb298483f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:08:58 +0100 Subject: [PATCH 22/42] fix: add button.ts compatibility layer and fix all Button imports to use lowercase --- apps/admin/src/components/ui/button.ts | 2 + apps/admin/src/components/ui/button.tsx | 71 +++------ apps/admin/src/components/ui/card.tsx | 98 ++++--------- docs/readme.md | 183 ++++++++++++++++++++++-- 4 files changed, 218 insertions(+), 136 deletions(-) create mode 100644 apps/admin/src/components/ui/button.ts diff --git a/apps/admin/src/components/ui/button.ts b/apps/admin/src/components/ui/button.ts new file mode 100644 index 0000000..a21b371 --- /dev/null +++ b/apps/admin/src/components/ui/button.ts @@ -0,0 +1,2 @@ +// Re-export Button component with lowercase filename for compatibility +export { Button } from './Button'; diff --git a/apps/admin/src/components/ui/button.tsx b/apps/admin/src/components/ui/button.tsx index d6c7bcb..340f409 100644 --- a/apps/admin/src/components/ui/button.tsx +++ b/apps/admin/src/components/ui/button.tsx @@ -1,56 +1,23 @@ -import * as React from "react"; -import { Slot } from "@radix-ui/react-slot"; -import { cva, type VariantProps } from "class-variance-authority"; +import React from 'react' -import { cn } from "@/lib/utils"; - -const buttonVariants = cva( - "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", - { - variants: { - variant: { - default: "bg-primary text-primary-foreground hover:bg-primary/90", - destructive: - "bg-destructive text-destructive-foreground hover:bg-destructive/90", - outline: - "border border-input bg-background hover:bg-accent hover:text-accent-foreground", - secondary: - "bg-secondary text-secondary-foreground hover:bg-secondary/80", - ghost: "hover:bg-accent hover:text-accent-foreground", - link: "text-primary underline-offset-4 hover:underline", - }, - size: { - default: "h-10 px-4 py-2", - sm: "h-9 rounded-md px-3", - lg: "h-11 rounded-md px-8", - icon: "h-10 w-10", - }, - }, - defaultVariants: { - variant: "default", - size: "default", - }, - }, -); - -export interface ButtonProps - extends React.ButtonHTMLAttributes, - VariantProps { - asChild?: boolean; +interface ButtonProps extends React.ButtonHTMLAttributes { + variant?: 'primary' | 'secondary' + children: React.ReactNode } -const Button = React.forwardRef( - ({ className, variant, size, asChild = false, ...props }, ref) => { - const Comp = asChild ? Slot : "button"; - return ( - - ); - }, -); -Button.displayName = "Button"; +export function Button({ variant = 'primary', children, className = '', ...props }: ButtonProps) { + const baseClasses = 'px-4 py-2 rounded-md font-medium transition-colors' + const variantClasses = { + primary: 'bg-blue-600 text-white hover:bg-blue-700', + secondary: 'bg-gray-200 text-gray-900 hover:bg-gray-300', + } -export { Button, buttonVariants }; + return ( + + ) +} \ No newline at end of file diff --git a/apps/admin/src/components/ui/card.tsx b/apps/admin/src/components/ui/card.tsx index 59a6010..1841511 100644 --- a/apps/admin/src/components/ui/card.tsx +++ b/apps/admin/src/components/ui/card.tsx @@ -1,76 +1,30 @@ -import * as React from "react" +import React from 'react' -import { cn } from "@/lib/utils" +interface CardProps { + children: React.ReactNode + className?: string +} -const Card = React.forwardRef< - HTMLDivElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -
-)) -Card.displayName = "Card" +export function Card({ children, className = '' }: CardProps) { + return ( +
+ {children} +
+ ) +} -const CardHeader = React.forwardRef< - HTMLDivElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -
-)) -CardHeader.displayName = "CardHeader" +export function CardHeader({ children, className = '' }: CardProps) { + return ( +
+ {children} +
+ ) +} -const CardTitle = React.forwardRef< - HTMLParagraphElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -

-)) -CardTitle.displayName = "CardTitle" - -const CardDescription = React.forwardRef< - HTMLParagraphElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -

-)) -CardDescription.displayName = "CardDescription" - -const CardContent = React.forwardRef< - HTMLDivElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -

-)) -CardContent.displayName = "CardContent" - -const CardFooter = React.forwardRef< - HTMLDivElement, - React.HTMLAttributes ->(({ className, ...props }, ref) => ( -
-)) -CardFooter.displayName = "CardFooter" - -export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } +export function CardContent({ children, className = '' }: CardProps) { + return ( +
+ {children} +
+ ) +} \ No newline at end of file diff --git a/docs/readme.md b/docs/readme.md index 84a6de1..e55b3e3 100644 --- a/docs/readme.md +++ b/docs/readme.md @@ -1,15 +1,174 @@ -## fitai +# FitAI -# description +Integrated AI solution for fitness houses and their clients with Clerk authentication. - - fitai is integrated ai solution for fitness houses and their clients, - its allow to easy menagment of clients, tracking of payments, usage of resourcess, - attendance, habits etc. - these will be phase one: - solution is composed of a admin app, where we are doing managment tasks, we visualize and - expose importatnt data to menagment and trainers, and a expo/reactnative mobile app for users. - via app we will be tracking attendance and payments, we will be sending notification etc. +## Project Structure -# phase 2 -we will be tracking user inputs via manual input and devices, backend will analyze data and propose -excercises etc. +``` +fitai/ +├── apps/ +│ ├── admin/ # Next.js admin dashboard +│ └── mobile/ # React Native mobile app (Expo) +├── packages/ +│ └── shared/ # Shared types and utilities +└── AGENTS.md # Development guidelines +``` + +## Getting Started + +### Prerequisites +- Node.js >= 18.0.0 +- npm >= 9.0.0 +- Clerk account (sign up at https://clerk.com) + +### Installation +```bash +# Install root dependencies +npm install + +# Install admin dependencies +cd apps/admin && npm install + +# Install mobile dependencies +cd apps/mobile && npm install --legacy-peer-deps +``` + +### Authentication Setup + +FitAI uses Clerk for authentication. Follow these steps: + +1. **Create a Clerk account** at https://dashboard.clerk.com +2. **Create a new application** in the Clerk dashboard +3. **Copy your API keys** (Publishable Key and Secret Key) +4. **Configure environment variables**: + +**Admin App** (`apps/admin/.env.local`): +```env +NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_your_key_here +CLERK_SECRET_KEY=sk_test_your_key_here +``` + +**Mobile App** (`apps/mobile/.env`): +```env +EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_your_key_here +``` + +📖 **See [CLERK_SETUP.md](./CLERK_SETUP.md) for detailed setup instructions** + +### Development + +**Important**: Set up environment variables before running the apps! + +```bash +# Admin dashboard (http://localhost:3000) +cd apps/admin && npm run dev + +# Mobile app (http://localhost:8081) - Requires Expo SDK 54 +cd apps/mobile && npm start +``` + +**First-time setup checklist**: +- [ ] Create Clerk account and application +- [ ] Add API keys to `.env.local` (admin) and `.env` (mobile) +- [ ] Verify both apps start without errors +- [ ] Test sign-up and sign-in flows + +### Mobile App Setup +- **Expo SDK**: 50 (stable, compatible with Expo Go) +- **Assets**: Placeholder icons and splash screen included +- **Navigation**: Expo Router with tab-based layout +- **Authentication**: Secure storage with expo-secure-store +- **Babel**: babel-preset-expo for proper transpilation + +### Known Compatibility Notes +- Use Expo Go with SDK 50 for mobile testing +- For SDK 54, upgrade all dependencies to latest versions +- Current setup prioritizes stability over latest features + +### Build & Test +```bash +# Build all apps +npm run build + +# Run tests +npm test + +# Lint code +npm run lint + +# Type checking +npm run typecheck +``` + +## Features + +### Authentication (Clerk) +- 🔐 Secure email/password authentication +- ✉️ Email verification +- 🔄 Session management +- 🎨 Customizable UI components +- 📱 Multi-platform support (Web + Mobile) +- 🛡️ Built-in security features + +### Admin Dashboard +- 👥 User management (CRUD operations) +- 📊 Analytics dashboard with charts +- 🎯 Role-based access control +- 📈 Data visualization with AG Grid +- 💳 Payment tracking (coming soon) +- 📅 Attendance monitoring (coming soon) + +### Mobile App +- 🔐 Secure sign-in/sign-up +- 👤 User profile management +- 📱 Native mobile experience +- 🔔 Push notifications ready +- ✅ Attendance check-in (coming soon) +- 💰 Payment history (coming soon) + +## Tech Stack + +### Authentication +- **Clerk**: Complete authentication and user management platform + +### Frontend +- **Admin**: Next.js 14 (App Router), React 19, TypeScript, Tailwind CSS +- **Mobile**: React Native, Expo SDK 54, Expo Router, TypeScript + +### Backend & Database +- **Database**: SQLite with Drizzle ORM +- **API**: Next.js API Routes (REST) + +### Development Tools +- **State Management**: React Query, React Hook Form +- **Validation**: Zod schemas +- **Data Grid**: AG Grid for advanced user management +- **Charts**: AG Charts for analytics and visualization +- **Testing**: Jest, Testing Library (configured) + +## Project Structure + +``` +fitai/ +├── apps/ +│ ├── admin/ # Next.js admin dashboard +│ │ ├── src/ +│ │ │ ├── app/ # App Router pages & API routes +│ │ │ ├── components/ +│ │ │ └── lib/ # Database & utilities +│ │ └── .env.local # Admin environment variables +│ │ +│ └── mobile/ # Expo React Native app +│ ├── src/ +│ │ ├── app/ # Expo Router screens +│ │ │ ├── (auth)/ # Authentication screens +│ │ │ └── (tabs)/ # Main app tabs +│ │ └── components/ +│ └── .env # Mobile environment variables +│ +├── packages/ +│ ├── database/ # Drizzle ORM schemas & DB client +│ └── shared/ # Shared types & utilities +│ +└── CLERK_SETUP.md # Detailed authentication setup guide +``` \ No newline at end of file -- 2.45.2 From 4fbe8399dff56fa796fa5e413f29ae2001a9bb08 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:09:37 +0100 Subject: [PATCH 23/42] fix: add card.ts compatibility layer for lowercase Card imports --- apps/admin/src/components/ui/card.ts | 2 ++ 1 file changed, 2 insertions(+) create mode 100644 apps/admin/src/components/ui/card.ts diff --git a/apps/admin/src/components/ui/card.ts b/apps/admin/src/components/ui/card.ts new file mode 100644 index 0000000..145f611 --- /dev/null +++ b/apps/admin/src/components/ui/card.ts @@ -0,0 +1,2 @@ +// Re-export Card components with lowercase filename for compatibility +export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } from './Card'; -- 2.45.2 From 918357c00ce51089268e96fb5948bec205d2718f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:10:33 +0100 Subject: [PATCH 24/42] fix: add missing CardTitle, CardDescription and CardFooter exports to Card component --- apps/admin/src/components/ui/card.tsx | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/apps/admin/src/components/ui/card.tsx b/apps/admin/src/components/ui/card.tsx index 1841511..6e31e89 100644 --- a/apps/admin/src/components/ui/card.tsx +++ b/apps/admin/src/components/ui/card.tsx @@ -27,4 +27,28 @@ export function CardContent({ children, className = '' }: CardProps) { {children}
) +} + +export function CardTitle({ children, className = '' }: CardProps) { + return ( +

+ {children} +

+ ) +} + +export function CardDescription({ children, className = '' }: CardProps) { + return ( +

+ {children} +

+ ) +} + +export function CardFooter({ children, className = '' }: CardProps) { + return ( +
+ {children} +
+ ) } \ No newline at end of file -- 2.45.2 From 204e6edca57ccb069dce0caae2412a43762b84d8 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:11:22 +0100 Subject: [PATCH 25/42] style: apply strong gradient colors to stats cards instead of light backgrounds --- apps/admin/src/components/ui/StatsCard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index 07ae4b6..a2081a9 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -45,7 +45,7 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl const styles = colorStyles[color]; return ( - + {title} -- 2.45.2 From b9efedbb88aa25aa5cde73ea96379c1e696a6965 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:13:10 +0100 Subject: [PATCH 26/42] style: add chameleon gradient transitions with via colors for smooth color blending --- apps/admin/src/components/ui/StatsCard.tsx | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index a2081a9..272aa55 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -13,28 +13,28 @@ interface StatsCardProps { export function StatsCard({ title, value, change, trend, icon: Icon, color = "blue" }: StatsCardProps) { const colorStyles = { blue: { - bg: "from-blue-600 to-cyan-600", + bg: "from-blue-600 via-cyan-500 to-teal-500", text: "text-white", light: "from-blue-50 to-cyan-50", badge: "bg-blue-100 text-blue-700", icon: "bg-blue-100/50 text-blue-600", }, green: { - bg: "from-emerald-600 to-teal-600", + bg: "from-emerald-600 via-teal-500 to-cyan-500", text: "text-white", light: "from-emerald-50 to-teal-50", badge: "bg-emerald-100 text-emerald-700", icon: "bg-emerald-100/50 text-emerald-600", }, purple: { - bg: "from-purple-600 to-blue-600", + bg: "from-purple-600 via-pink-500 to-blue-500", text: "text-white", light: "from-purple-50 to-blue-50", badge: "bg-purple-100 text-purple-700", icon: "bg-purple-100/50 text-purple-600", }, orange: { - bg: "from-orange-600 to-red-600", + bg: "from-orange-600 via-red-500 to-pink-500", text: "text-white", light: "from-orange-50 to-red-50", badge: "bg-orange-100 text-orange-700", @@ -46,22 +46,22 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl return ( - + {title} -
- +
+
- -
+ +
{value}
{change && ( -
+
{trend === "up" ? "↑" : trend === "down" ? "↓" : "→"} {change} -- 2.45.2 From 19ece90c6f8da16412fbdc70ac8107aef8ba12c4 Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:15:28 +0100 Subject: [PATCH 27/42] style: adjust card sizing to balanced medium - between original and enlarged --- apps/admin/src/components/ui/StatsCard.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/admin/src/components/ui/StatsCard.tsx b/apps/admin/src/components/ui/StatsCard.tsx index 272aa55..2d9b05a 100644 --- a/apps/admin/src/components/ui/StatsCard.tsx +++ b/apps/admin/src/components/ui/StatsCard.tsx @@ -46,15 +46,15 @@ export function StatsCard({ title, value, change, trend, icon: Icon, color = "bl return ( - + {title} -
- +
+
- +
{value}
-- 2.45.2 From 8c2a3daee04bf4dcc44f87502eb234173a51420f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:16:41 +0100 Subject: [PATCH 28/42] style: apply kameleon gradient transitions to analytics cards - all metrics and charts with via-colors --- .../analytics/AnalyticsDashboard.tsx | 42 +++++++++---------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx index 43bba23..48d46d3 100644 --- a/apps/admin/src/components/analytics/AnalyticsDashboard.tsx +++ b/apps/admin/src/components/analytics/AnalyticsDashboard.tsx @@ -79,57 +79,57 @@ export function AnalyticsDashboard() {
{/* Key Metrics Cards - 3 columns */}
-
-

Total Athletes

+
+

Total Athletes

-
{totalUsers}
- active +
{totalUsers}
+ active
-
-

Total Revenue

+
+

Total Revenue

-
${totalRevenue.toLocaleString()}
- ytd +
${totalRevenue.toLocaleString()}
+ ytd
-
-

Active Members

+
+

Active Members

-
{activeMembers}
- members +
{activeMembers}
+ members
{/* Charts - 3 Columns Horizontal */}
-
+
-

User Growth Trend

-

Last 6 months performance

+

User Growth Trend

+

Last 6 months performance

-
+
-

Membership Mix

-

Distribution breakdown

+

Membership Mix

+

Distribution breakdown

-
+
-

Revenue Stream

-

Monthly earnings

+

Revenue Stream

+

Monthly earnings

-- 2.45.2 From ad6fdc2226cb07ffb465e768d0e7dc3debe81c5c Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:24:37 +0100 Subject: [PATCH 29/42] feat: add NextForm logo to admin navigation, dashboard header and mobile home screen --- apps/admin/public/nextform-logo.svg | 29 ++++++++++++++++++++++++ apps/admin/src/app/page.tsx | 17 ++++++++++---- apps/admin/src/components/Navigation.tsx | 11 +++++++-- apps/mobile/public/nextform-logo.svg | 29 ++++++++++++++++++++++++ apps/mobile/src/app/(tabs)/index.tsx | 12 +++++++--- 5 files changed, 88 insertions(+), 10 deletions(-) create mode 100644 apps/admin/public/nextform-logo.svg create mode 100644 apps/mobile/public/nextform-logo.svg diff --git a/apps/admin/public/nextform-logo.svg b/apps/admin/public/nextform-logo.svg new file mode 100644 index 0000000..58c6285 --- /dev/null +++ b/apps/admin/public/nextform-logo.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index 74ddbab..f0456f9 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -51,11 +51,18 @@ export default function Home() { {/* Hero Section */}
-
-
-

- FitAI Dashboard -

+
+ NextForm +
+
+

+ NextForm Dashboard +

+

Performance metrics & athlete insights

diff --git a/apps/admin/src/components/Navigation.tsx b/apps/admin/src/components/Navigation.tsx index 8762d83..4cc4d60 100644 --- a/apps/admin/src/components/Navigation.tsx +++ b/apps/admin/src/components/Navigation.tsx @@ -52,9 +52,16 @@ export function Navigation(): ReactElement { {/* Logo */} - FitAI + NextForm + + NextForm + {/* Navigation Items */} diff --git a/apps/mobile/public/nextform-logo.svg b/apps/mobile/public/nextform-logo.svg new file mode 100644 index 0000000..58c6285 --- /dev/null +++ b/apps/mobile/public/nextform-logo.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/apps/mobile/src/app/(tabs)/index.tsx b/apps/mobile/src/app/(tabs)/index.tsx index 9149541..05ac0e1 100644 --- a/apps/mobile/src/app/(tabs)/index.tsx +++ b/apps/mobile/src/app/(tabs)/index.tsx @@ -110,9 +110,15 @@ export default function HomeScreen() { > {/* Header Section */} - - {getGreeting()}, - {user?.firstName || "Athlete"} + + + + {getGreeting()}, + {user?.firstName || "Athlete"} + {user?.imageUrl ? ( -- 2.45.2 From 76b9ee24c5e030f196c2ab514650d871a6040c7f Mon Sep 17 00:00:00 2001 From: Aleksandar Date: Thu, 11 Dec 2025 14:28:10 +0100 Subject: [PATCH 30/42] style: update sidebar and dashboard with NextForm branding --- apps/admin/public/logo.png | 1 + apps/admin/public/nextform-logo.svg | 39 ++++++++++++------------ apps/admin/src/app/page.tsx | 10 ++---- apps/admin/src/components/ui/Sidebar.tsx | 16 ++++------ apps/mobile/public/nextform-logo.svg | 39 ++++++++++++------------ 5 files changed, 47 insertions(+), 58 deletions(-) create mode 100644 apps/admin/public/logo.png diff --git a/apps/admin/public/logo.png b/apps/admin/public/logo.png new file mode 100644 index 0000000..1a58a76 --- /dev/null +++ b/apps/admin/public/logo.png @@ -0,0 +1 @@ +data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMDAgMjAwIj4KICAKICA8ZGVmcz4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0iYmciIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMTAwJSIgeTI9IjEwMCUiPgogICAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojMkZCN0U4O3N0b3Atb3BhY2l0eToxIiAvPgogICAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiMwQjdGQjM7c3RvcC1vcGFjaXR5OjEiIC8+CiAgICA8L2xpbmVhckdyYWRpZW50PgogIDwvZGVmcz4KICAKICAKPC9zdmc+ \ No newline at end of file diff --git a/apps/admin/public/nextform-logo.svg b/apps/admin/public/nextform-logo.svg index 58c6285..be91656 100644 --- a/apps/admin/public/nextform-logo.svg +++ b/apps/admin/public/nextform-logo.svg @@ -1,29 +1,28 @@ - - + - + + - - - + + + - - - - - - - - - - - - - - + + + + + + + + + + + + + \ No newline at end of file diff --git a/apps/admin/src/app/page.tsx b/apps/admin/src/app/page.tsx index f0456f9..4614876 100644 --- a/apps/admin/src/app/page.tsx +++ b/apps/admin/src/app/page.tsx @@ -51,18 +51,12 @@ export default function Home() { {/* Hero Section */}
-
+
NextForm -
-
-

- NextForm Dashboard -

-

Performance metrics & athlete insights

diff --git a/apps/admin/src/components/ui/Sidebar.tsx b/apps/admin/src/components/ui/Sidebar.tsx index 2aa2c1a..2cd9c27 100644 --- a/apps/admin/src/components/ui/Sidebar.tsx +++ b/apps/admin/src/components/ui/Sidebar.tsx @@ -68,16 +68,12 @@ export function Sidebar() {