aboutsummaryrefslogtreecommitdiffstats
path: root/panel/src/pages/Roles.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'panel/src/pages/Roles.jsx')
-rw-r--r--panel/src/pages/Roles.jsx57
1 files changed, 57 insertions, 0 deletions
diff --git a/panel/src/pages/Roles.jsx b/panel/src/pages/Roles.jsx
new file mode 100644
index 0000000..5b18ace
--- /dev/null
+++ b/panel/src/pages/Roles.jsx
@@ -0,0 +1,57 @@
+import React, { useState, useEffect } from 'react';
+import { db, auth } from '../firebase';
+import { collection, getDocs } from 'firebase/firestore';
+import { httpsCallable } from 'firebase/functions';
+import Navbar from '../components/Navbar';
+
+const Roles = () => {
+ const [users, setUsers] = useState([]);
+ const [loading, setLoading] = useState(true);
+
+ const fetchUsers = async () => {
+ const querySnapshot = await getDocs(collection(db, 'users'));
+ const usersData = querySnapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
+ setUsers(usersData);
+ setLoading(false);
+ };
+
+ const handleRoleChange = async (email, newRole) => {
+ const addUserRole = httpsCallable(auth, 'addUserRole');
+ try {
+ await addUserRole({ email: email, role: newRole });
+ fetchUsers();
+ } catch (error) {
+ console.error('Error updating role:', error);
+ }
+ };
+
+ useEffect(() => {
+ fetchUsers();
+ }, []);
+
+ if (loading) {
+ return <p>Loading...</p>;
+ }
+
+ return (
+ <div>
+ <Navbar />
+ <div className="container mt-5">
+ <h4>Manage Roles</h4>
+ <div className="list-group">
+ {users.map((user, index) => (
+ <div key={index} className="list-group-item d-flex justify-content-between align-items-center">
+ <p className="mb-0">{user.email}</p>
+ <div>
+ <button onClick={() => handleRoleChange(user.email, 'admin')} className="btn btn-primary btn-sm mr-2">Make Admin</button>
+ <button onClick={() => handleRoleChange(user.email, 'user')} className="btn btn-secondary btn-sm">Make User</button>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+export default Roles;