diff --git a/app/admin/account-settings/layout.tsx b/app/admin/account-settings/layout.tsx new file mode 100644 index 0000000..d1ff37e --- /dev/null +++ b/app/admin/account-settings/layout.tsx @@ -0,0 +1,21 @@ +import '../../globals.css' +import type { Metadata } from 'next' + +export const metadata: Metadata = { + title: 'Whyphi - Account Settings', +} + +export default function RootLayout({ + children, +}: { + children: React.ReactNode +}) { + return ( + +
+ {children} +
+ + + ) +} diff --git a/app/admin/account-settings/page.tsx b/app/admin/account-settings/page.tsx new file mode 100644 index 0000000..2e2d908 --- /dev/null +++ b/app/admin/account-settings/page.tsx @@ -0,0 +1,184 @@ +"use client" + +import React, { useState, useEffect } from "react"; +import { useRouter } from 'next/navigation'; +import { useAuth, getUserId } from "@/app/contexts/AuthContext"; +import { Button, Card, Select, Label, TextInput } from "flowbite-react"; +import { Member } from "@/types/admin/account-settings/member"; +import { AdminTextStyles } from "@/styles/TextStyles"; + +export default function AccountSettings() { + const { token } = useAuth(); + const _id = getUserId(); + const router = useRouter(); + + const [user, setUser] = useState({} as Member); + + useEffect(() => { + const fetchUser = async () => { + try { + const response = await fetch(`${process.env.NEXT_PUBLIC_API_BASE_URL}/member/${_id}`, { + method: "GET", + headers: { + Authorization: `Bearer ${token}`, + "Content-Type": "application/json", + } + }); + const data = await response.json(); + setUser(data); + } catch (error) { + console.error("Error fetching user:", error); + } + } + fetchUser(); + }, [_id, token]); // Include _id and token in the dependency array + + const handleInputChange = (event: React.ChangeEvent) => { + setUser((prevUser) => ({ + ...prevUser, + [event.target.id]: event.target.value + })); + } + + return ( +
+ +

Account Settings

+
{ + e.preventDefault(); + console.log(user); + fetch(`${process.env.NEXT_PUBLIC_API_BASE_URL}/member/${_id}`, { + method: "PUT", + headers: { + Authorization: `Bearer ${token}`, + "Content-Type": "application/json", + }, + body: JSON.stringify(user) + }) + .then(() => router.push("/admin")) + .catch(console.error); + }}> + + {/* Personal Information */} +
+

Personal Information

+ + {/* Name and Email */} +
+
+
+
+ +
+
+
+
+ +
+
+ + {/* Graduation Year and College */} +
+
+
+
+ +
+
+
+
+ +
+
+ + {/* Major and Minor */} +
+
+
+
+ +
+
+
+
+ +
+
+ + +
+ + {/* PCT-related Information */} +
+

PCT-related Information

+ + {/* Class and Family */} +
+
+
+
+ +
+ +
+
+
+ +
+
+ + {/* Team and Big */} +
+
+
+
+ + +
+ +
+
+
+ +
+
+
+ +
+
+
+ ) +} diff --git a/app/admin/accountability/page.tsx b/app/admin/accountability/page.tsx index 36740c5..d0055a2 100644 --- a/app/admin/accountability/page.tsx +++ b/app/admin/accountability/page.tsx @@ -7,6 +7,7 @@ import Loader from "@/components/Loader"; import { AgGridReact } from 'ag-grid-react'; // AG Grid Component import "ag-grid-community/styles/ag-grid.css"; // Mandatory CSS required by the grid import "ag-grid-community/styles/ag-theme-quartz.css"; // Optional Theme applied to the grid +import { AdminTextStyles } from "@/styles/TextStyles"; export default function Accountability() { @@ -69,18 +70,13 @@ export default function Accountability() { fetchData(); }, []); - const textStyles = { - title: "text-4xl font-bold dark:text-white mb-6 mt-4 ", - subtitle: "mb-4 text-lg font-normal text-gray-500 dark:text-gray-400", - }; - if (isLoading) { return } return (
-

Accountability Tracker

+

Accountability Tracker

-

Announcements

+

Announcements

{dummyAnnouncements.map((announcement, index) => (
{announcement.title}

{announcement.date}

-

+

{announcement.content}

diff --git a/app/admin/create/page.tsx b/app/admin/create/page.tsx index ca06271..eabd6f7 100644 --- a/app/admin/create/page.tsx +++ b/app/admin/create/page.tsx @@ -3,8 +3,9 @@ import React, { useState } from "react"; import DatePicker from "react-datepicker"; import "react-datepicker/dist/react-datepicker.css"; import { useRouter } from 'next/navigation' -import { Checkbox, Label } from 'flowbite-react'; +import { Checkbox, Label, TextInput } from 'flowbite-react'; import { useAuth } from "@/app/contexts/AuthContext"; +import { AdminTextStyles } from "@/styles/TextStyles"; @@ -160,11 +161,10 @@ export default function Create() { required: boolean = false ) => (
-