Skip to content

Commit 59d2527

Browse files
UWB-ACM-OFFICIALUWB-ACM-OFFICIAL
authored
Merge pull request #87 from UWB-ACM/pgobin/dashboard-fixes
Pgobin/dashboard fixes
2 parents c1c119c + 3d8ca3e commit 59d2527

5 files changed

Lines changed: 176 additions & 152 deletions

File tree

‎src/app/dashboard/DashboardPage.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export default async function DashboardPage({
5757

5858
{isStaff && (
5959
<div className="w-full min-h-screen">
60-
<div className="w-full py-4 px-8 grid place-content-center">
60+
<div className="w-full py-4 px-8 grid place-content-center gap-y-4">
6161
<h2 className="text-3xl text-center">
6262
User Management
6363
</h2>
@@ -74,7 +74,7 @@ export default async function DashboardPage({
7474
</div>
7575
{/* Container for Buttons */}
7676
{selectedUser != null && (
77-
<div className="w-[95vw] flex flex-col items-center md:flex-row gap-y-4 md:gap-x-4 justify-center mt-6 flex-wrap">
77+
<div className="w-[95vw] flex flex-col items-center md:flex-row gap-y-4 md:gap-x-4 justify-center flex-wrap">
7878
{isAdmin && (
7979
<AdminActionsUser user={selectedUser} />
8080
)}

‎src/app/dashboard/modify-user/[id]/ModifyUserPage.tsx‎

Lines changed: 36 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -30,42 +30,39 @@ export function ModifyUserPage({
3030
const [curBalance, setCurBalance] = useState(balance);
3131

3232
return (
33-
// centering all the content on the screen
34-
<div className="grid place-content-center">
35-
{/* the actual card with all the user data */}
36-
<div className="w-[90vw] lg:w-[40vw] bg-neutral-100 p-5 flex flex-col justify-between rounded-md border-2 border-black shadow-lg">
37-
{/* main content of the user, separate from the exit button */}
38-
<div>
39-
{/* displaying name and email of user, will have to change once database integrated*/}
40-
<div className="py-2">
41-
{user.name} | {user.email}
42-
</div>
43-
{/* displaying number of hackeroons user has */}
44-
<div className="py-2">
45-
Hackeroons{" "}
46-
<span className="text-2xl font-bold">{curBalance}</span>
47-
</div>
48-
{/* displaying user transactions */}
49-
<div className="py-2">
50-
Transactions
51-
<TransactionList
52-
history={curHistory}
53-
setHistory={setCurHistory}
54-
setBalance={setCurBalance}
55-
permission={permission}
56-
sessionUser={session.user!}
57-
balance={curBalance}
58-
/>
59-
</div>
33+
<div className="w-[90vw] max-w-[700px] mx-auto bg-neutral-100 p-5 flex flex-col justify-between rounded-md border-2 border-black shadow-lg">
34+
{/* main content of the user, separate from the exit button */}
35+
<div>
36+
{/* displaying name and email of user, will have to change once database integrated*/}
37+
<div className="py-2 text-lg md:text-xl lg:text-2xl">
38+
<span className="font-bold">{user.name}</span> |{" "}
39+
{user.email}
40+
</div>
41+
{/* displaying number of hackeroons user has */}
42+
<div className="py-2">
43+
Hackeroons{" "}
44+
<span className="text-2xl font-bold">{curBalance}</span>
45+
</div>
46+
{/* displaying user transactions */}
47+
<div className="py-2">
48+
<p className="font-bold">Transactions</p>
49+
<TransactionList
50+
history={curHistory}
51+
setHistory={setCurHistory}
52+
setBalance={setCurBalance}
53+
permission={permission}
54+
sessionUser={session.user!}
55+
balance={curBalance}
56+
/>
6057
</div>
61-
{/* exit button that returns user back to staff dashboard */}
62-
<Link
63-
className="mt-4 py-3 rounded-lg text-center bg-red-500 text-white"
64-
href={`/dashboard/${user.id}`}
65-
>
66-
Exit
67-
</Link>
6858
</div>
59+
{/* exit button that returns user back to staff dashboard */}
60+
<Link
61+
className="mt-4 py-3 rounded-lg text-center bg-red-500 text-white"
62+
href={`/dashboard/${user.id}`}
63+
>
64+
Exit
65+
</Link>
6966
</div>
7067
);
7168
}
@@ -86,10 +83,10 @@ function TransactionList({
8683
balance: number;
8784
}) {
8885
return (
89-
<ul>
86+
<ul className="flex flex-col gap-y-4">
9087
{/* iterating through user's transaction list */}
9188
{history.map((transaction) => (
92-
<li className="mt-4" key={transaction.id}>
89+
<li className="" key={transaction.id}>
9390
<TransactionItem
9491
transaction={transaction}
9592
permission={permission}
@@ -174,7 +171,7 @@ function TransactionItem({
174171
}
175172

176173
return (
177-
<div className="flex flex-row justify-between">
174+
<div className="flex flex-row justify-between items-center gap-x-4">
178175
<p
179176
className={
180177
(transaction.reverted ? "line-through" : "") +
@@ -194,7 +191,8 @@ function TransactionItem({
194191
{canRevert && (
195192
<button
196193
className={
197-
buttonColor + " border border-black rounded-xl p-2"
194+
buttonColor +
195+
" border border-black rounded-xl p-2 text-white"
198196
}
199197
onClick={async () => {
200198
if (!canRevert || !canRevertWithBalance) return;

‎src/app/dashboard/transfer-hackeroons/[id]/TransferHackaroonsPage.tsx‎

Lines changed: 90 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -127,106 +127,99 @@ export default function TransferHackaroonsPage({
127127

128128
return (
129129
<>
130-
<div className="h-screen grid place-content-center">
131-
{/* Container for "Transfer Hackeroons" Content */}
132-
<div className="h-[80vh] w-[80vw] max-w-[70vh] rounded-xl p-5 border border-black shadow-xl grid place-content-center">
133-
<form onSubmit={handleSubmit}>
134-
<h1 className="text-center text-2xl md:text-3xl lg:text-4xl">
135-
Transferring Hackeroons to{" "}
136-
<span className="font-bold whitespace-nowrap">
137-
{user.name}
138-
</span>
139-
</h1>
140-
<div className="grid place-content-center">
141-
{reason === "unknown" && (
142-
<div className="flex flex-col w-[60vw] max-w-[50vh] mt-4 md:text-sm lg:text-md">
143-
<span className="text-red-600">
144-
I have disabled Unknown for non-admins
145-
as it
146-
{"'"}s been causing issues with our
147-
systems and makes it difficult to
148-
understand transactions. If you{"'"}re
149-
trying to give a user Hackeroons for
150-
attending an event, please make an event
151-
code for them and have them enter it. If
152-
you have a legitimate need, please copy
153-
the URL in the address bar and send a
154-
message to Jonah discussing it.
155-
</span>
156-
</div>
157-
)}
158-
159-
{/* Only show amount for transaction types with no prescribed value. */}
160-
{!(
161-
reasonTypeMap[reason] in
162-
valuedTransactionAmounts
163-
) && (
164-
<>
165-
<div className="flex flex-col w-[60vw] max-w-[50vh] mt-4 md:text-lg lg:text-xl">
166-
<label htmlFor="amount">Amount</label>
167-
<input
168-
required
169-
id="amount"
170-
type="number"
171-
min={0}
172-
step={5}
173-
value={amount.toString()}
174-
className="px-4 py-3 border border-black rounded-md"
175-
onChange={(e) =>
176-
setAmount(
177-
Number(e.target.value),
178-
)
179-
}
180-
/>
181-
</div>
182-
</>
183-
)}
184-
<div className="flex flex-col w-[60vw] max-w-[50vh] mt-4 md:text-lg lg:text-xl">
185-
<label htmlFor="reason">Reason</label>
186-
<select
187-
id="reason"
188-
value={reason}
189-
className="px-4 py-3 border border-black rounded-md"
190-
onChange={(e) =>
191-
setReason(
192-
e.target
193-
.value as keyof typeof reasonTypeMap,
194-
)
195-
}
196-
>
197-
{Object.keys(reasonTypeMap)
198-
.filter(
199-
(el) =>
200-
!excludedTypes.includes(
201-
el as keyof typeof reasonTypeMap,
202-
),
203-
)
204-
.map((key) => (
205-
<option key={key} value={key}>
206-
{
207-
reasonNameMap[
208-
key as keyof typeof reasonTypeMap
209-
]
210-
}
211-
</option>
212-
))}
213-
</select>
130+
{/* Container for "Transfer Hackeroons" Content */}
131+
<div className="w-[90vw] max-w-[700px] bg-white p-5 mx-auto my-2 rounded-xl border border-black grid place-content-center">
132+
<form onSubmit={handleSubmit}>
133+
<h1 className="text-center text-2xl md:text-3xl lg:text-4xl">
134+
Transferring Hackeroons to{" "}
135+
<span className="font-bold whitespace-nowrap">
136+
{user.name}
137+
</span>
138+
</h1>
139+
<div className="grid place-content-center">
140+
{reason === "unknown" && (
141+
<div className="flex flex-col w-full mt-4 md:text-sm lg:text-md">
142+
<span className="text-red-600">
143+
I have disabled Unknown for non-admins as it
144+
{"'"}s been causing issues with our systems
145+
and makes it difficult to understand
146+
transactions. If you{"'"}re trying to give a
147+
user Hackeroons for attending an event,
148+
please make an event code for them and have
149+
them enter it. If you have a legitimate
150+
need, please copy the URL in the address bar
151+
and send a message to Jonah discussing it.
152+
</span>
214153
</div>
215-
<input
216-
className="mt-4 py-3 bg-green-500 hover:bg-green-600 duration-200 rounded-md border border-black text-white cursor-pointer"
217-
type="submit"
218-
/>
219-
220-
{/* exit button that returns user back to staff dashboard */}
221-
<Link
222-
className="mt-4 py-3 bg-red-500 hover:bg-red-600 duration-200 rounded-md border border-black text-white text-center cursor-pointer"
223-
href={`/dashboard/${user.id}`}
154+
)}
155+
156+
{/* Only show amount for transaction types with no prescribed value. */}
157+
{!(
158+
reasonTypeMap[reason] in valuedTransactionAmounts
159+
) && (
160+
<>
161+
<div className="flex flex-col w-full mt-4 md:text-lg lg:text-xl">
162+
<label htmlFor="amount">Amount</label>
163+
<input
164+
required
165+
id="amount"
166+
type="number"
167+
min={0}
168+
step={5}
169+
value={amount.toString()}
170+
className="px-4 py-3 border border-black rounded-md"
171+
onChange={(e) =>
172+
setAmount(Number(e.target.value))
173+
}
174+
/>
175+
</div>
176+
</>
177+
)}
178+
<div className="flex flex-col w-full mt-4 md:text-lg lg:text-xl">
179+
<label htmlFor="reason">Reason</label>
180+
<select
181+
id="reason"
182+
value={reason}
183+
className="px-4 py-3 border border-black rounded-md"
184+
onChange={(e) =>
185+
setReason(
186+
e.target
187+
.value as keyof typeof reasonTypeMap,
188+
)
189+
}
224190
>
225-
Exit
226-
</Link>
191+
{Object.keys(reasonTypeMap)
192+
.filter(
193+
(el) =>
194+
!excludedTypes.includes(
195+
el as keyof typeof reasonTypeMap,
196+
),
197+
)
198+
.map((key) => (
199+
<option key={key} value={key}>
200+
{
201+
reasonNameMap[
202+
key as keyof typeof reasonTypeMap
203+
]
204+
}
205+
</option>
206+
))}
207+
</select>
227208
</div>
228-
</form>
229-
</div>
209+
<input
210+
className="mt-4 py-3 bg-green-500 hover:bg-green-600 duration-200 rounded-md border border-black text-white cursor-pointer"
211+
type="submit"
212+
/>
213+
214+
{/* exit button that returns user back to staff dashboard */}
215+
<Link
216+
className="mt-4 py-3 bg-red-500 hover:bg-red-600 duration-200 rounded-md border border-black text-white text-center cursor-pointer"
217+
href={`/dashboard/${user.id}`}
218+
>
219+
Exit
220+
</Link>
221+
</div>
222+
</form>
230223
</div>
231224

232225
<DashboardFeedback

0 commit comments

Comments
 (0)