Skip to content

Commit 53acc8e

Browse files
Merge pull request #97 from RUBA-Labs/main_demo
Admin / Student / Academic / Lab allocation admin : Dashboards update
2 parents 9b76054 + 682763c commit 53acc8e

14 files changed

Lines changed: 1954 additions & 107 deletions

File tree

src/app/(auth)/components/loginForm.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export default function LoginForm() {
2121
const response = await login(email, password);
2222
console.log("Login successful:", response);
2323
authLogin(response.access_token, response.user);
24-
router.push("/user-dashboard");
24+
router.push("/admin-dashboard");
2525
} catch (error) {
2626
console.error("Login failed:", error);
2727
// Handle login error (e.g., display error message to user)

src/app/(dashboard)/(pages)/academic-dashboard/page.tsx

Lines changed: 531 additions & 16 deletions
Large diffs are not rendered by default.
Lines changed: 259 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
"use client";
22
import Footer from "@/components/footer";
3+
import PrivateRoute from "@/components/PrivateRoute";
34
import "../../style/page.css";
45
import Header from "../../components/header";
56
import Sidebar, { MenuItem } from "../../components/sidebar";
67
import { useState } from "react";
7-
import { FaChartBar, FaCog, FaTachometerAlt, FaUsers } from "react-icons/fa";
8+
import { FaChartBar, FaCog, FaEdit, FaTachometerAlt, FaTrash, FaUsers } from "react-icons/fa";
9+
810

911
export default function AdminDashboardPage() {
1012
const [selectedMenu, setSelectedMenu] = useState("overview");
@@ -18,31 +20,268 @@ export default function AdminDashboardPage() {
1820

1921
let content;
2022
if (selectedMenu === "overview") {
21-
content = <p>Overview Content</p>;
23+
content = (
24+
<div className="space-y-6">
25+
<h1 className="text-2xl font-bold text-gray-800 dark:text-white">Admin Dashboard Overview</h1>
26+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
27+
<div className="bg-blue-100 dark:bg-blue-900/50 p-6 rounded-xl shadow">
28+
<h3 className="text-lg font-semibold text-blue-800 dark:text-blue-200">Total Users</h3>
29+
<p className="text-3xl font-bold mt-2">1,248</p>
30+
<p className="text-sm text-blue-600 dark:text-blue-300 mt-1">+12% from last month</p>
31+
</div>
32+
<div className="bg-green-100 dark:bg-green-900/50 p-6 rounded-xl shadow">
33+
<h3 className="text-lg font-semibold text-green-800 dark:text-green-200">Active Sessions</h3>
34+
<p className="text-3xl font-bold mt-2">342</p>
35+
<p className="text-sm text-green-600 dark:text-green-300 mt-1">+5% from last hour</p>
36+
</div>
37+
<div className="bg-yellow-100 dark:bg-yellow-900/50 p-6 rounded-xl shadow">
38+
<h3 className="text-lg font-semibold text-yellow-800 dark:text-yellow-200">Pending Requests</h3>
39+
<p className="text-3xl font-bold mt-2">24</p>
40+
<p className="text-sm text-yellow-600 dark:text-yellow-300 mt-1">3 require immediate attention</p>
41+
</div>
42+
<div className="bg-purple-100 dark:bg-purple-900/50 p-6 rounded-xl shadow">
43+
<h3 className="text-lg font-semibold text-purple-800 dark:text-purple-200">System Status</h3>
44+
<p className="text-3xl font-bold mt-2">Operational</p>
45+
<p className="text-sm text-purple-600 dark:text-purple-300 mt-1">All systems running smoothly</p>
46+
</div>
47+
</div>
48+
<div className="mt-8">
49+
<h2 className="text-xl font-semibold text-gray-800 dark:text-white mb-4">Quick Actions</h2>
50+
<div className="flex flex-wrap gap-4">
51+
<button className="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-lg transition">
52+
Add New User
53+
</button>
54+
<button className="bg-green-500 hover:bg-green-600 text-white px-4 py-2 rounded-lg transition">
55+
Generate Report
56+
</button>
57+
<button className="bg-purple-500 hover:bg-purple-600 text-white px-4 py-2 rounded-lg transition">
58+
System Settings
59+
</button>
60+
</div>
61+
</div>
62+
</div>
63+
);
2264
} else if (selectedMenu === "users") {
23-
content = <p>Users Content</p>;
65+
content = (
66+
<div className="space-y-6">
67+
<div className="flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
68+
<h1 className="text-2xl font-bold text-gray-800 dark:text-white">User Management</h1>
69+
<div className="flex flex-col sm:flex-row gap-3 w-full md:w-auto">
70+
<div className="relative">
71+
<input
72+
type="text"
73+
placeholder="Search users..."
74+
className="w-full sm:w-64 px-4 py-2 border border-gray-300 dark:border-dark3 rounded-lg bg-white dark:bg-dark3/20 focus:outline-none focus:ring-2 focus:ring-blue-500"
75+
/>
76+
</div>
77+
<button className="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-lg transition whitespace-nowrap">
78+
Add New User
79+
</button>
80+
</div>
81+
</div>
82+
<div className="bg-white dark:bg-dark3/40 rounded-xl shadow overflow-hidden">
83+
<table className="w-full">
84+
<thead className="bg-gray-100 dark:bg-dark3/60">
85+
<tr>
86+
<th className="py-3 px-4 text-left">User</th>
87+
<th className="py-3 px-4 text-left">Role</th>
88+
<th className="py-3 px-4 text-left">Email</th>
89+
<th className="py-3 px-4 text-left">Last login</th>
90+
<th className="py-3 px-4 text-left">Actions</th>
91+
</tr>
92+
</thead>
93+
<tbody>
94+
<tr className="border-b border-gray-200 dark:border-dark3/30">
95+
<td className="py-3 px-4">John Doe</td>
96+
<td className="py-3 px-4">Administrator</td>
97+
<td className="py-3 px-4">
98+
<span className="bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded">john12@gmail.com</span>
99+
</td>
100+
<td className="py-3 px-4">2023-05-15 14:30</td>
101+
<td className="py-3 px-4">
102+
<button className="text-blue-500 hover:text-blue-700 mr-2 p-1 rounded-full hover:bg-blue-100 dark:hover:bg-blue-900/30">
103+
<FaEdit />
104+
</button>
105+
<button className="text-red-500 hover:text-red-700 p-1 rounded-full hover:bg-red-100 dark:hover:bg-red-900/30">
106+
<FaTrash />
107+
</button>
108+
</td>
109+
</tr>
110+
<tr className="border-b border-gray-200 dark:border-dark3/30">
111+
<td className="py-3 px-4">Jane Smith</td>
112+
<td className="py-3 px-4">Editor</td>
113+
<td className="py-3 px-4">
114+
<span className="bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded">smith9@gmail.com</span>
115+
</td>
116+
<td className="py-3 px-4">2023-05-14 09:15</td>
117+
<td className="py-3 px-4">
118+
<button className="text-blue-500 hover:text-blue-700 mr-2 p-1 rounded-full hover:bg-blue-100 dark:hover:bg-blue-900/30">
119+
<FaEdit />
120+
</button>
121+
<button className="text-red-500 hover:text-red-700 p-1 rounded-full hover:bg-red-100 dark:hover:bg-red-900/30">
122+
<FaTrash />
123+
</button>
124+
</td>
125+
</tr>
126+
<tr>
127+
<td className="py-3 px-4">Robert Johnson</td>
128+
<td className="py-3 px-4">Viewer</td>
129+
<td className="py-3 px-4">
130+
<span className="bg-gray-100 text-gray-800 text-xs px-2 py-1 rounded">rbjohn@gmail.com</span>
131+
</td>
132+
<td className="py-3 px-4">2023-05-10 16:45</td>
133+
<td className="py-3 px-4">
134+
<button className="text-blue-500 hover:text-blue-700 mr-2 p-1 rounded-full hover:bg-blue-100 dark:hover:bg-blue-900/30">
135+
<FaEdit />
136+
</button>
137+
138+
<button className="text-red-500 hover:text-red-700 p-1 rounded-full hover:bg-red-100 dark:hover:bg-red-900/30">
139+
<FaTrash />
140+
</button>
141+
</td>
142+
</tr>
143+
</tbody>
144+
</table>
145+
</div>
146+
</div>
147+
);
24148
} else if (selectedMenu === "analytics") {
25-
content = <p>Analytics Content</p>;
149+
content = (
150+
<div className="space-y-6">
151+
<h1 className="text-2xl font-bold text-gray-800 dark:text-white">Analytics Dashboard</h1>
152+
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
153+
<div className="bg-white dark:bg-dark3/40 p-6 rounded-xl shadow">
154+
<h2 className="text-lg font-semibold mb-4">User Activity</h2>
155+
<div className="h-64 flex items-center justify-center bg-gray-100 dark:bg-dark3/20 rounded-lg">
156+
<p className="text-gray-500 dark:text-gray-400">User Activity Chart</p>
157+
</div>
158+
</div>
159+
<div className="bg-white dark:bg-dark3/40 p-6 rounded-xl shadow">
160+
<h2 className="text-lg font-semibold mb-4">System Performance</h2>
161+
<div className="h-64 flex items-center justify-center bg-gray-100 dark:bg-dark3/20 rounded-lg">
162+
<p className="text-gray-500 dark:text-gray-400">Performance Metrics Chart</p>
163+
</div>
164+
</div>
165+
</div>
166+
<div className="bg-white dark:bg-dark3/40 p-6 rounded-xl shadow">
167+
<h2 className="text-lg font-semibold mb-4">Recent Activity</h2>
168+
<ul className="space-y-3">
169+
<li className="flex justify-between border-b border-gray-200 dark:border-dark3/30 pb-2">
170+
<span>New user registered</span>
171+
<span className="text-gray-500 dark:text-gray-400">2 hours ago</span>
172+
</li>
173+
<li className="flex justify-between border-b border-gray-200 dark:border-dark3/30 pb-2">
174+
<span>Report generated</span>
175+
<span className="text-gray-500 dark:text-gray-400">5 hours ago</span>
176+
</li>
177+
<li className="flex justify-between border-b border-gray-200 dark:border-dark3/30 pb-2">
178+
<span>Settings updated</span>
179+
<span className="text-gray-500 dark:text-gray-400">1 day ago</span>
180+
</li>
181+
<li className="flex justify-between pb-2">
182+
<span>Security scan completed</span>
183+
<span className="text-gray-500 dark:text-gray-400">2 days ago</span>
184+
</li>
185+
</ul>
186+
</div>
187+
</div>
188+
);
26189
} else if (selectedMenu === "settings") {
27-
content = <p>Settings Content</p>;
190+
content = (
191+
<div className="space-y-6">
192+
<h1 className="text-2xl font-bold text-gray-800 dark:text-white">System Settings</h1>
193+
<div className="bg-white dark:bg-dark3/40 rounded-xl shadow overflow-hidden">
194+
<div className="p-6">
195+
<h2 className="text-lg font-semibold mb-4">General Settings</h2>
196+
<div className="space-y-4">
197+
<div>
198+
<label className="block text-gray-700 dark:text-gray-300 mb-2">Site Name</label>
199+
<input
200+
type="text"
201+
defaultValue="Admin Dashboard"
202+
className="w-full p-2 border border-gray-300 dark:border-dark3 rounded bg-white dark:bg-dark3/20"
203+
/>
204+
</div>
205+
<div>
206+
<label className="block text-gray-700 dark:text-gray-300 mb-2">Admin Email</label>
207+
<input
208+
type="email"
209+
defaultValue="admin@example.com"
210+
className="w-full p-2 border border-gray-300 dark:border-dark3 rounded bg-white dark:bg-dark3/20"
211+
/>
212+
</div>
213+
<div>
214+
<label className="block text-gray-700 dark:text-gray-300 mb-2">Maintenance Mode</label>
215+
<div className="flex items-center">
216+
<input
217+
type="checkbox"
218+
id="maintenance"
219+
className="mr-2"
220+
/>
221+
<label htmlFor="maintenance" className="text-gray-700 dark:text-gray-300">
222+
Enable maintenance mode
223+
</label>
224+
</div>
225+
</div>
226+
</div>
227+
</div>
228+
<div className="p-6 border-t border-gray-200 dark:border-dark3/30">
229+
<h2 className="text-lg font-semibold mb-4">Security Settings</h2>
230+
<div className="space-y-4">
231+
<div>
232+
<label className="block text-gray-700 dark:text-gray-300 mb-2">Session Timeout (minutes)</label>
233+
<input
234+
type="number"
235+
defaultValue="30"
236+
className="w-full p-2 border border-gray-300 dark:border-dark3 rounded bg-white dark:bg-dark3/20"
237+
/>
238+
</div>
239+
<div>
240+
<label className="block text-gray-700 dark:text-gray-300 mb-2">Two-Factor Authentication</label>
241+
<div className="flex items-center">
242+
<input
243+
type="checkbox"
244+
id="2fa"
245+
defaultChecked
246+
className="mr-2"
247+
/>
248+
<label htmlFor="2fa" className="text-gray-700 dark:text-gray-300">
249+
Require 2FA for all admin users
250+
</label>
251+
</div>
252+
</div>
253+
</div>
254+
</div>
255+
<div className="p-6 border-t border-gray-200 dark:border-dark3/30">
256+
<button className="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-lg transition">
257+
Save Settings
258+
</button>
259+
</div>
260+
</div>
261+
</div>
262+
);
28263
}
29264

30265
return (
31-
<div className="pagebackground min-h-screen flex flex-col">
32-
<Header />
33-
<div className="flex flex-1 flex-col md:flex-row w-full">
34-
<Sidebar
35-
menuItems={menuItems}
36-
onMenuSelect={setSelectedMenu}
37-
selectedMenu={selectedMenu}
38-
/>
39-
<div className="flex-1 flex justify-center items-start p-4">
40-
<div className="w-full bg-white/40 dark:bg-dark3/30 rounded-xl p-4 shadow-lg">
41-
{content}
42-
</div>
266+
<PrivateRoute>
267+
<div className="pagebackground min-h-screen flex flex-col">
268+
269+
<Header />
270+
271+
<div className="flex flex-1 flex-col md:flex-row w-full pt-20">
272+
<Sidebar
273+
menuItems={menuItems}
274+
onMenuSelect={setSelectedMenu}
275+
selectedMenu={selectedMenu}
276+
/>
277+
<div className="flex-1 flex justify-center items-start p-4 mt-4">
278+
<div className="w-full bg-white/40 dark:bg-dark3/30 rounded-xl p-4 shadow-lg overflow-y-auto max-h-[calc(100vh-120px)]">
279+
{content}
280+
</div>
281+
</div>
43282
</div>
44-
</div>
45-
<Footer />
46-
</div>
283+
<Footer />
284+
</div>
285+
</PrivateRoute>
47286
);
48287
}
Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,25 @@
11

22
import Footer from "@/components/footer";
3+
import PrivateRoute from "@/components/PrivateRoute";
34
import React from "react";
45
import "../../style/page.css";
56

67

78
export default function DeveloperDashboardPage() {
89
return (
9-
<div className="pagebackground min-h-screen flex flex-col">
10-
{/* Middle - Main Content */}
11-
<div className="pageflexbox flex flex-1 justify-center items-start">
12-
<div className="w-full flex justify-center">
13-
<div className="scale-90 sm:scale-95 lg:scale-100 w-full">
14-
10+
<PrivateRoute>
11+
<div className="pagebackground min-h-screen flex flex-col">
12+
{/* Middle - Main Content */}
13+
<div className="pageflexbox flex flex-1 justify-center items-start">
14+
<div className="w-full flex justify-center">
15+
<div className="scale-90 sm:scale-95 lg:scale-100 w-full">
16+
17+
</div>
1518
</div>
1619
</div>
20+
{/* Bottom - Footer */}
21+
<Footer />
1722
</div>
18-
{/* Bottom - Footer */}
19-
<Footer />
20-
</div>
23+
</PrivateRoute>
2124
);
2225
}
Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,25 @@
11

22
import Footer from "@/components/footer";
3+
import PrivateRoute from "@/components/PrivateRoute";
34
import React from "react";
45
import "../../style/page.css";
56

67

78
export default function ExamClaimAdminDashboardPage() {
89
return (
9-
<div className="pagebackground min-h-screen flex flex-col">
10-
{/* Middle - Main Content */}
11-
<div className="pageflexbox flex flex-1 justify-center items-start">
12-
<div className="w-full flex justify-center">
13-
<div className="scale-90 sm:scale-95 lg:scale-100 w-full">
14-
10+
<PrivateRoute>
11+
<div className="pagebackground min-h-screen flex flex-col">
12+
{/* Middle - Main Content */}
13+
<div className="pageflexbox flex flex-1 justify-center items-start">
14+
<div className="w-full flex justify-center">
15+
<div className="scale-90 sm:scale-95 lg:scale-100 w-full">
16+
17+
</div>
1518
</div>
1619
</div>
20+
{/* Bottom - Footer */}
21+
<Footer />
1722
</div>
18-
{/* Bottom - Footer */}
19-
<Footer />
20-
</div>
23+
</PrivateRoute>
2124
);
2225
}

0 commit comments

Comments
 (0)