MOOORE UI CHANGES FFS

src/app/components/BiddingTable.tsx

@@ -18,6 +18,7 @@ import type { ToastMessage } from "@/src/app/dashboard/jersey/page";
 import { BiddingData, EligibleBids, UserBid } from "../dashboard/jersey/types";
 
 interface BiddingList {
+  user:any,
   userBids: UserBid;
   refetchUserBids: () => Promise<QueryObserverResult<UserBid, Error>>;
   biddings: BiddingData;
@@ -31,7 +32,7 @@ interface BiddingList {
 axios.defaults.withCredentials = true;
 
 // User submit bid form
-const BiddingTable: React.FC<BiddingList> = ({ userBids, refetchUserBids, biddings, userEligibleBids }) => {
+const BiddingTable: React.FC<BiddingList> = ({user, userBids, refetchUserBids, biddings, userEligibleBids }) => {
   const [open, setOpen] = useState(false);
   const [selectedNumber, setSelectedNumber] = useState<number | null>(null);
   const priority = userBids ? userBids.bids.length : 0;
@@ -50,7 +51,6 @@ const BiddingTable: React.FC<BiddingList> = ({ userBids, refetchUserBids, biddin
     setSelectedNumber(number);
   };
 
-  console.log("userBids", userBids);
   const handlePlaceBid = async (number: number) => {
     try {
       const newBids = {
@@ -194,17 +194,21 @@ const BiddingTable: React.FC<BiddingList> = ({ userBids, refetchUserBids, biddin
     </div>*/
     <div className="container mx-auto p-4">
       <h1 className="mb-4 text-2xl font-bold">Bidding Table</h1>
-      {userBids && (
-        <Card className="mx-auto mb-2 w-full">
+      <Card className="mx-auto mb-2 w-full">
           <CardHeader className="space-y-1 sm:space-y-1">
-            <CardTitle className="text-l sm:text-l font-bold">Your Bids</CardTitle>
-            <CardDescription className="text-sm sm:text-base">View and manage your current bids</CardDescription>
+            <CardTitle className="text-l sm:text-l font-bold">{user.username}</CardTitle>
+            <CardDescription className="text-sm sm:text-base">Year: {user.year}, Gender: {user.gender}</CardDescription>
           </CardHeader>
           <CardContent>
             <div className="overflow-x-auto">
               <div className="space-y-6">
                 <div className="flex items-center justify-between">
-                  <h2 className="text-lg font-semibold">Status: {canBid ? "Can Bid" : "Cannot Bid"}</h2>
+                  <h2 className="text-lg font-semibold">Round To Bid: {userBids.info.round} </h2>
+                  <p className="text-lg font-bold text-primary">Current Round: {userBids.system.bidRound}</p>
+                </div>
+                <div className="flex items-center justify-between">
+                  <h2 className="text-lg font-semibold">Status: </h2>
+                  <p className="text-lg font-bold text-primary">{canBid ? "Can Bid" : "Cannot Bid"}</p>
                 </div>
                 <div className="flex items-center justify-between">
                   <h2 className="text-lg font-semibold">Points:</h2>
@@ -214,14 +218,26 @@ const BiddingTable: React.FC<BiddingList> = ({ userBids, refetchUserBids, biddin
                   <h2 className="mb-2 text-lg font-semibold">Teams : </h2>
                   <div className="flex flex-wrap gap-2">
                     {userBids.info.teams.map(team => (
-                      <Badge key={team.team.name} variant="secondary" className={`bg-green-500 text-white`}>
+                      <Badge key={team.team.name} variant="outline" className={`bg-green-500 text-white`}>
                         {team.team.name}
                       </Badge>
                     ))}
                   </div>
                 </div>
-                <h2 className="mb-2 text-lg font-semibold">Bids : </h2>
               </div>
+            </div>
+            <div className="mt-4 flex justify-end"></div>
+          </CardContent>
+        </Card>
+
+      {userBids && (
+        <Card className="mx-auto mb-2 w-full">
+          <CardHeader className="space-y-1 sm:space-y-1">
+            <CardTitle className="text-l sm:text-l font-bold">Your Bids</CardTitle>
+            <CardDescription className="text-sm sm:text-base">View and manage your current bids</CardDescription>
+          </CardHeader>
+          <CardContent>
+            <div className="overflow-x-auto">
               <Table>
                 <TableHeader>
                   <TableRow>
@@ -261,7 +277,7 @@ const BiddingTable: React.FC<BiddingList> = ({ userBids, refetchUserBids, biddin
       <h1 className="text-l mb-4 font-bold"> Eligible Bidding Numbers : </h1>
 
       <div className="grid grid-cols-2 gap-2 sm:grid-cols-5 md:grid-cols-8 lg:grid-cols-10">
-        {Array.from({ length: 99 }, (_, i) => i + 1).map(number => {
+        {Array.from({ length: 100 }, (_, i) => i ).map(number => {
           const isEligible = userEligibleBids !== undefined ? userEligibleBids.jerseys.includes(number) : false; // Check if the number is eligible
           return (
             <Button

src/app/components/LoginForm.tsx

@@ -19,7 +19,7 @@ export default function LoginForm() {
 
   useEffect(() => {
     if (user !== null) {
-      router.push(`/dashboard/profile`);
+      router.push(`/dashboard/jersey`);
     }
   });
 

src/app/dashboard/jersey/page.tsx

@@ -55,10 +55,10 @@ const Jersey: React.FC = () => {
     try {
       const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_URL}/jersey/info`);
 
-      console.log("response", response.data.data);
+      //console.log("response", response.data.data);
 
       if (response.data.success) {
-        console.log("This is eligible bids" + JSON.stringify(response.data.data));
+        //console.log("This is eligible bids" + JSON.stringify(response.data.data));
         return response.data.data;
       }
     } catch (error) {
@@ -70,14 +70,14 @@ const Jersey: React.FC = () => {
     try{
       const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_URL}/jersey/eligible`);
 
-      console.log("response", response.data.data);
+      //console.log("response", response.data.data);
 
       if (response.data.success) {
-        console.log("This is eligible numbers" + JSON.stringify(response.data.data));
+        //console.log("This is eligible numbers" + JSON.stringify(response.data.data));
         return response.data.data;
       }
     } catch (error) {
-      console.error("Error during getting user bids", error);
+      console.error("Error during getting eligible numbers", error);
     }
   }
 
@@ -155,6 +155,7 @@ const Jersey: React.FC = () => {
         <Loading />
       ) : (
         <BiddingTable
+          user={user}
           userBids={userBids}
           refetchUserBids={refetchUserBids}
           biddings={bids}
@@ -163,7 +164,7 @@ const Jersey: React.FC = () => {
       )}
     </div>
   );
-  
+
 };
 
 export default Jersey;

src/app/dashboard/jersey/types.ts

@@ -3,30 +3,40 @@ export interface UserInfo {
   points: number;
   isAllocated: boolean;
   jersey?: JerseyType; // Only present if isAllocated is true
+<<<<<<< HEAD
+  teams: Team[];
+=======
   teams: TeamContainer[];
+>>>>>>> 81df05bbaae3cbaa3ef923043f4dd1a0af505bbf
 }
 
 export interface JerseyType {
   number: number;
   quota: Quota;
 }
 
+<<<<<<< HEAD
+=======
 export interface EligibleBids {
   jerseys: number[];
 }
 
+>>>>>>> 81df05bbaae3cbaa3ef923043f4dd1a0af505bbf
 export interface Quota {
   male: number;
   female: number;
 }
 
 interface Team {
   name: string;
+<<<<<<< HEAD
+=======
   shareable: boolean;
 }
 
 interface TeamContainer {
   team: Team;
+>>>>>>> 81df05bbaae3cbaa3ef923043f4dd1a0af505bbf
 }
 
 interface Bid {