diff --git a/app/settings/page.tsx b/app/settings/page.tsx index 8c21c77..a5fdce3 100644 --- a/app/settings/page.tsx +++ b/app/settings/page.tsx @@ -8,9 +8,23 @@ import { CardHeader, CardTitle, } from "@/components/ui/card"; +import { Progress } from "@/components/ui/progress"; import Link from "next/link"; export default function SettingsPage() { + // Dummy user statistics data + const userStats = { + rank: "Gold Tier", + apiHitsToday: 750, + apiLimitDaily: 1000, + manualDownloadsToday: 5, + manualDownloadLimitDaily: 20, + filesDownloaded: 123, + }; + + const apiUsagePercentage = (userStats.apiHitsToday / userStats.apiLimitDaily) * 100; + const manualDownloadsPercentage = (userStats.manualDownloadsToday / userStats.manualDownloadLimitDaily) * 100; + return (
@@ -28,6 +42,47 @@ export default function SettingsPage() {
+ {/* User Statistics Card */} + + + Your Statistics + Overview of your account activity and limits. + + +
+ Current Rank: + {userStats.rank} +
+
+
+ Daily API Usage: + + {userStats.apiHitsToday.toLocaleString()} / {userStats.apiLimitDaily.toLocaleString()} hits + +
+ +
+
+
+ Daily Manual Downloads: + + {userStats.manualDownloadsToday.toLocaleString()} / {userStats.manualDownloadLimitDaily.toLocaleString()} files + +
+ +
+
+ Total Releases Grabbed (All Time): + {userStats.filesDownloaded.toLocaleString()} +
+
+ + + + + +
+ Account Information diff --git a/components/ui/progress.tsx b/components/ui/progress.tsx new file mode 100644 index 0000000..4fc3b47 --- /dev/null +++ b/components/ui/progress.tsx @@ -0,0 +1,28 @@ +"use client" + +import * as React from "react" +import * as ProgressPrimitive from "@radix-ui/react-progress" + +import { cn } from "@/lib/utils" + +const Progress = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, value, ...props }, ref) => ( + + + +)) +Progress.displayName = ProgressPrimitive.Root.displayName + +export { Progress } diff --git a/package-lock.json b/package-lock.json index 9c833fd..c1dfac1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.1.0", "dependencies": { "@radix-ui/react-dialog": "^1.1.14", + "@radix-ui/react-progress": "^1.1.7", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tabs": "^1.1.12", "class-variance-authority": "^0.7.1", @@ -1193,6 +1194,30 @@ } } }, + "node_modules/@radix-ui/react-progress": { + "version": "1.1.7", + "resolved": "https://registry.npmjs.org/@radix-ui/react-progress/-/react-progress-1.1.7.tgz", + "integrity": "sha512-vPdg/tF6YC/ynuBIJlk1mm7Le0VgW6ub6J2UWnTQ7/D23KXcPI1qy+0vBkgKgd38RCMJavBXpB83HPNFMTb0Fg==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-context": "1.1.2", + "@radix-ui/react-primitive": "2.1.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-roving-focus": { "version": "1.1.10", "resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.1.10.tgz", diff --git a/package.json b/package.json index a061edd..7807f43 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ }, "dependencies": { "@radix-ui/react-dialog": "^1.1.14", + "@radix-ui/react-progress": "^1.1.7", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tabs": "^1.1.12", "class-variance-authority": "^0.7.1",