Skip to content

Commit

Permalink
Merge pull request #35 from aswanthabam/dev
Browse files Browse the repository at this point in the history
feat (admin): admin panel updated
  • Loading branch information
aswanthabam authored Dec 11, 2023
2 parents 58a23af + 68388d2 commit 70ec081
Show file tree
Hide file tree
Showing 11 changed files with 491 additions and 11 deletions.
11 changes: 11 additions & 0 deletions src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,11 @@ import Launch from "./pages/launch/launch";
import LaunchHome from "./pages/launch/Home";
import Admin from "./pages/admin/Admin";
import NewEvent from "./pages/admin/admin_pages/new_event/NewEvent";
import ViewEvent from "./pages/admin/admin_pages/view_events/ViewEvents";
import UserList from "./pages/admin/admin_pages/users_list/UserList";
import RequestLog from "./pages/admin/admin_pages/request_log/RequestLog";
import ErrorLog from "./pages/admin/admin_pages/error_log/ErrorLog";
import AddAdmin from "./pages/admin/admin_pages/add_admin/AddAdmin";

function getTheme() {
var theme = localStorage.getItem("theme");
Expand Down Expand Up @@ -185,6 +190,12 @@ function App() {
></Route>
<Route path="/admin" element={<Admin />}>
<Route path="" element={<NewEvent />}></Route>
<Route path="admin/new" element={<AddAdmin />}></Route>
<Route path="events/" element={<ViewEvent />}></Route>
<Route path="events/new" element={<NewEvent />}></Route>
<Route path="users/" element={<UserList />}></Route>
<Route path="logs/request" element={<RequestLog />}></Route>
<Route path="logs/error" element={<ErrorLog />}></Route>
</Route>
<Route path="*" element={<Error404 />}></Route>
</Routes>
Expand Down
61 changes: 60 additions & 1 deletion src/apis/adminApi.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
import { _EventCreateData } from "../utils/types";
import {
_AdminErrorLog,
_AdminRequestLog,
_AdminUserList,
_EventCreateData,
} from "../utils/types";
import {
ApiResponse,
ResponseStatus,
Expand All @@ -7,6 +12,60 @@ import {
validateResponse,
} from "./api";

export const addAdmin = async (
data: { email: string },
setToast: (
status: boolean,
message: string | null,
hideAfter: number | null
) => void
): Promise<ApiResponse> => {
var res = publicRouter.post("/api/v2/admin/add_admin", data);
var val = await validateResponse(res);
setToast(true, val.data.message, 3000);
return val;
};

export const errorLog = async (
count: number = 10
): Promise<_AdminErrorLog[] | null> => {
var res = publicRouter.get("/api/v2/admin/logs/error?count=" + count);
var val = await validateResponse(res);
if (
val.status == ResponseStatus.SUCCESS &&
val.contentType == ResponseType.DATA
) {
return (val.data.data as any)["logs"] as _AdminErrorLog[];
}
return null;
};

export const requestLog = async (
count: number = 10
): Promise<_AdminRequestLog[] | null> => {
var res = publicRouter.get("/api/v2/admin/logs/request?count=" + count);
var val = await validateResponse(res);
if (
val.status == ResponseStatus.SUCCESS &&
val.contentType == ResponseType.DATA
) {
return (val.data.data as any)["logs"] as _AdminRequestLog[];
}
return null;
};

export const usersList = async (): Promise<_AdminUserList[] | null> => {
var res = publicRouter.post("/api/v2/admin/users");
var val = await validateResponse(res);
if (
val.status == ResponseStatus.SUCCESS &&
val.contentType == ResponseType.DATA
) {
return (val.data.data as any)["users"] as _AdminUserList[];
}
return null;
};

export const isAdmin = async (): Promise<boolean> => {
var res = publicRouter.post("/api/v2/admin/is_admin");
var val = await validateResponse(res);
Expand Down
61 changes: 56 additions & 5 deletions src/pages/admin/Admin.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,62 @@ const Admin: React.FC<AdminProps> = ({}) => {
<div className="col-3">
<h3 style={{ textAlign: "center" }}>Vijnana Admin</h3>
<ul className="list-group">
<li className="list-group-item">About Event</li>
<li className="list-group-item">Events</li>
<li className="list-group-item">Add Event</li>
<li className="list-group-item">Add Admin</li>
<li className="list-group-item">Users</li>
<li
onClick={() => {
redirect("/admin/about");
}}
className="list-group-item"
>
About Event
</li>
<li
onClick={() => {
redirect("/admin/events");
}}
className="list-group-item"
>
Events
</li>
<li
onClick={() => {
redirect("/admin/events/new");
}}
className="list-group-item"
>
Add Event
</li>
<li
onClick={() => {
redirect("/admin/admin/new");
}}
className="list-group-item"
>
Add Admin
</li>
<li
onClick={() => {
redirect("/admin/users");
}}
className="list-group-item"
>
Users
</li>
<li
onClick={() => {
redirect("/admin/logs/error");
}}
className="list-group-item"
>
Error Log
</li>
<li
onClick={() => {
redirect("/admin/logs/request");
}}
className="list-group-item"
>
Request Log
</li>
</ul>
</div>
<div className={style.content + " col-9"}>
Expand Down
55 changes: 55 additions & 0 deletions src/pages/admin/admin_pages/add_admin/AddAdmin.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import React, { useState } from "react";
import { _Event, _EventCreateData } from "../../../../utils/types";
import { useToast } from "../../../../components/toast/useToast";
import { addAdmin } from "../../../../apis/adminApi";

const AddAdmin: React.FC = () => {
const [formData, setFormData] = useState({
email: "",
});
const { setToastStatus } = useToast();
const handleChange = (
e: React.ChangeEvent<
HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
>
) => {
console.log(e.target.id, e.target.value);
setFormData({
...formData,
[e.target.id]: e.target.value,
});
};

const handleSubmit = async (event: React.FormEvent) => {
event.preventDefault();
console.log("Form submitted!");
console.log(formData);
await addAdmin(formData, setToastStatus);
};

return (
<div>
<h3 className="underline start" style={{ marginBottom: "30px" }}>
Add A new Administrator
</h3>
<form onSubmit={handleSubmit} method="post">
<div className="mb-3">
<label htmlFor="title" className="form-label">
Target Email ID:
</label>
<input
type="email"
id="email"
className="form-control"
value={formData.email}
onChange={handleChange}
required
/>
</div>
<button className="btn btn-primary">Add Admin</button>
</form>
</div>
);
};

export default AddAdmin;
68 changes: 68 additions & 0 deletions src/pages/admin/admin_pages/error_log/ErrorLog.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import React, { useEffect, useState } from "react";
import {
_AdminErrorLog,
_Event,
_EventCreateData,
_EventInfo,
} from "../../../../utils/types";
import { errorLog } from "../../../../apis/adminApi";

const ErrorLog: React.FC = () => {
const [logs, setLogs] = useState<_AdminErrorLog[]>([]);
const [limit, setLimit] = useState<number>(10);
const getLogs = (limit = 10) => {
errorLog(limit).then((res) => {
console.log(res);
setLogs(res ? res : []);
});
};

useEffect(() => {
getLogs();
}, []);

return (
<div>
<h3 className="underline start" style={{ marginBottom: "30px" }}>
Error Logs
</h3>
<input
type="number"
placeholder="Limit"
onChange={(e) => {
setLimit(parseInt(e.target.value));
}}
/>
<input
type="button"
value="Refresh"
onClick={() => {
getLogs(limit);
}}
/>
{logs.map((l) => {
return (
<div className="card m-2">
<div className="card-body">
<h6 className="card-title ">URL : {l.url}</h6>
<p className="card-text">
Requested At :{" "}
<code>{new Date(l.requestTime).toLocaleString()}</code>
<br />
Response At :{" "}
<code>{new Date(l.responseTime).toLocaleString()}</code>
<br />
Error : <code>{l.error}</code>
<br />
Response : <code>{l.stack}</code>
<br />
</p>
</div>
</div>
);
})}
</div>
);
};

export default ErrorLog;
78 changes: 78 additions & 0 deletions src/pages/admin/admin_pages/request_log/RequestLog.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
import React, { useEffect, useState } from "react";
import {
_AdminRequestLog,
_Event,
_EventCreateData,
_EventInfo,
} from "../../../../utils/types";
import { requestLog } from "../../../../apis/adminApi";

const RequestLog: React.FC = () => {
const [logs, setLogs] = useState<_AdminRequestLog[]>([]);
const [limit, setLimit] = useState<number>(10);
const getLogs = (limit = 10) => {
requestLog(limit).then((res) => {
console.log(res);
setLogs(res ? res : []);
});
};

useEffect(() => {
getLogs();
}, []);

return (
<div>
<h3 className="underline start" style={{ marginBottom: "30px" }}>
Request Logs
</h3>
<input
type="number"
placeholder="Limit"
onChange={(e) => {
setLimit(parseInt(e.target.value));
}}
/>
<input
type="button"
value="Refresh"
onClick={() => {
getLogs(limit);
}}
/>
{logs.map((l) => {
return (
<div className="card m-2">
<div className="card-body">
<h6 className="card-title ">
URL : {l.url} ({l.status})
</h6>
Requested At :{" "}
<code>{new Date(l.requestTime).toLocaleString()}</code>
<br />
Response At :{" "}
<code>{new Date(l.responseTime).toLocaleString()}</code>
<br />
<p className="card-text">
Request :{" "}
<code>
{l.data ? JSON.stringify(l.data, [], 2) : "No data"}
</code>
<br />
Response :{" "}
<code>
{l.response
? JSON.stringify(l.response, null, 2)
: "No Response"}
</code>
<br />
</p>
</div>
</div>
);
})}
</div>
);
};

export default RequestLog;
Loading

0 comments on commit 70ec081

Please sign in to comment.