keannu125/Borrowing-TrackerFrontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Borrowing-TrackerFrontend.git synced 2024-11-17 06:19:27 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Refactor onClick function on transaction entry

Browse source
This commit is contained in:
Keannu Bernasol 2024-01-03 16:09:09 +08:00
parent f9b4729ee7
commit e8864bc28c
3 changed files with 24 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/Components/DashboardPage/Student/StudentTransactionListView.tsx
View file

@ -5,8 +5,10 @@ import CircularProgress from "@mui/material/CircularProgress/CircularProgress";
import React, { useState } from "react";
import TransactionEntry from "../../TransactionEntry/TransactionEntry";
import TransactionFilterMenu from "../TransactionFilterMenu";
import { useNavigate } from "react-router-dom";
export default function StudentTransactionListView() {
const navigate = useNavigate();
const transactions = useQuery({
queryKey: ["transactions_student"],
queryFn: TransactionsByStudentAPI,
@ -54,7 +56,15 @@ export default function StudentTransactionListView() {
)
.map((transaction) => (
<React.Fragment key={transaction.id}>
<TransactionEntry transaction={transaction} />
<TransactionEntry
onClick={() =>
navigate(`/view/transaction/${transaction.id}`, {
replace: true,
state: { id: transaction.id },
})
}
transaction={transaction}
/>
</React.Fragment>
))
) : (

12
src/Components/DashboardPage/Teacher/TeacherTransactionListView.tsx
View file

@ -5,8 +5,10 @@ import CircularProgress from "@mui/material/CircularProgress/CircularProgress";
import React, { useState } from "react";
import TransactionEntry from "../../TransactionEntry/TransactionEntry";
import TransactionFilterMenu from "../TransactionFilterMenu";
import { useNavigate } from "react-router-dom";
export default function TeacherTransactionListView() {
const navigate = useNavigate();
const transactions = useQuery({
queryKey: ["transactions_teacher"],
queryFn: TransactionsByTeacherAPI,
@ -54,7 +56,15 @@ export default function TeacherTransactionListView() {
)
.map((transaction) => (
<React.Fragment key={transaction.id}>
<TransactionEntry transaction={transaction} />
<TransactionEntry
onClick={() =>
navigate(`/view/transaction/${transaction.id}`, {
replace: true,
state: { id: transaction.id },
})
}
transaction={transaction}
/>
</React.Fragment>
))
) : (

10
src/Components/TransactionEntry/TransactionEntry.tsx
View file

@ -1,14 +1,13 @@
import styles from "../../styles";
import { colors } from "../../styles";
import { TransactionType } from "../Types/Types";
import { useNavigate } from "react-router-dom";
import StatusTextColor from "../StatusTextColor/StatusTextColor";
export interface props {
transaction: TransactionType;
onClick?: React.MouseEventHandler<HTMLButtonElement>;
}
export default function TransactionEntry(props: props) {
const navigate = useNavigate();
return (
<div
style={{
@ -20,12 +19,7 @@ export default function TransactionEntry(props: props) {
margin: "8px",
padding: "8px",
}}
onClick={() =>
navigate(`/view/transaction/${props.transaction.id}`, {
replace: true,
state: { id: props.transaction.id },
})
}
onClick={() => props.onClick}
>
<div style={styles.flex_row}>
<p