@@ -6,11 +6,13 @@ import {LoanClass} from "@/types/Loan";
66interface CardProps {
77 user ?: UserClass
88 loan ?: LoanClass ;
9+ setSideView ?: ( view : string ) => void ;
10+ setSelectedLoanId ?: ( id : number | null ) => void ;
911}
1012
1113// TODO: Could have a button to reactivate a loan, not a priority right now
1214
13- export default function Card ( { loan, user } : CardProps ) {
15+ export default function Card ( { loan, user, setSelectedLoanId , setSideView } : CardProps ) {
1416
1517 let { name, start, last} = { name : "" , start : "" , last : "" } ;
1618
@@ -31,9 +33,9 @@ export default function Card({ loan, user }: CardProps) {
3133 }
3234
3335 return (
34- < div className = "bg-brand-950 border-white border-[1px] rounded-[18px] w-fit " >
36+ < div className = "bg-brand-950 border-white border-[1px] rounded-[18px] " >
3537 < div className = "border-b-white border-b-[1px] flex gap-2 " >
36- < h1 className = "text-3xl font-bold pl-3 pt-2.5" > { name } </ h1 >
38+ < h1 className = "text-3xl font-bold pl-3 pt-2.5 text-nowrap " > { name } </ h1 >
3739 { loan && < span className = { "mt-3 text-3xl" } > |</ span > }
3840 { loan && < p title = { loan . item . equipment . name } className = "mt-4 text-2xl w-40 whitespace-nowrap overflow-hidden text-ellipsis" > Unit { loan . item ?. id } </ p > }
3941 { loan && < div className = { "mt-4 mr-3 ml-auto rounded-md flex justify-center px-1 w-fit h-5 left-3" + ( loan . status === "Returned" ? " bg-green-400" : loan . status === "Active" ? " bg-yellow-400" : " bg-red-600" ) } >
@@ -67,11 +69,15 @@ export default function Card({ loan, user }: CardProps) {
6769 </ div > }
6870
6971 < div className = "mb-3 ml-4 mt-5 flex gap-2" >
70- < button className = "button bg-blue-600" > Edit</ button >
71- < button onClick = { ( ) => loan ? loan . delete ( ) : user ? user . delete ( ) : alert ( "Error" ) } className = "button bg-red-600" > Delete</ button >
72+ < button className = "button bg-blue-600" onClick = { ( ) => {
73+ if ( setSideView && setSelectedLoanId && loan ) {
74+ setSideView ( "loanEdit" ) ;
75+ setSelectedLoanId ( loan . id ) ;
76+ }
77+ } } > Edit</ button >
78+ < button onClick = { ( ) => loan ? loan . delete ( ) : user ? user . delete ( ) : alert ( "Error" ) } className = "button bg-red-600" > { user && user . status === "deleting" ? "Deleting..." : "Delete" } </ button >
7279 { loan && loan . status != "Returned" && < button onClick = { ( ) => loan . return ( ) } className = "button bg-green-500 ml-auto mr-3" > Return</ button > }
7380 </ div >
74-
7581 </ div >
7682 )
7783}
0 commit comments