set up pnl leaderboard api

src/constants/applications.ts

@@ -16,4 +16,4 @@ export enum NAVBAR_MODE {
   DEFAULT = "default",
 }
 
-export const LEADERBOARD_POINTS_API = 'https://api.overlay.market/point-system/points/leaderboard'
+export const LEADERBOARD_POINTS_API = 'https://api.overlay.market/leaderboard-pnl/points/leaderboard'

src/pages/Leaderboard/LeaderboardTable.tsx

@@ -27,6 +27,7 @@ const LeaderboardTable: React.FC<LeaderboardTableProps> = ({
 }) => {
   const { address: account } = useAccount();
   const isMobile = useMediaQuery("(max-width: 767px)");
+  const isMultipleSessions = false;
 
   return (
     <Table>
@@ -39,12 +40,12 @@ const LeaderboardTable: React.FC<LeaderboardTableProps> = ({
           >
             Leaderboard Rankings
           </StyledHeader>
-          {!isMobile && (
+          {!isMobile && isMultipleSessions && (
             <StyledHeader textalign={"right"}>
               Points-Previous Week
             </StyledHeader>
           )}
-          <StyledHeader textalign={"right"}>Total Points</StyledHeader>
+          <StyledHeader textalign={"right"}>Total PnL</StyledHeader>
         </tr>
       </thead>
 
@@ -73,13 +74,13 @@ const LeaderboardTable: React.FC<LeaderboardTableProps> = ({
                 </Text>
               </Flex>
             </StyledCell>
-            {!isMobile && (
+            {!isMobile && isMultipleSessions && (
               <StyledCell textalign="right">
                 {currentUserData?.previousWeekPoints ?? "0"}
               </StyledCell>
             )}
             <StyledCell textalign="right">
-              {currentUserData?.totalPoints ?? "0"}
+              {currentUserData?.totalPoints ? (+currentUserData?.totalPoints).toFixed(2) + "%" : "0"}
             </StyledCell>
           </CurrentUserRankingRow>
           <BgRow></BgRow>
@@ -125,12 +126,12 @@ const LeaderboardTable: React.FC<LeaderboardTableProps> = ({
                   <Text>{shortenAddress(rank._id)}</Text>
                 </Flex>
               </StyledCell>
-              {!isMobile && (
+              {!isMobile && isMultipleSessions && (
                 <StyledCell textalign="right">
                   {rank.previousWeekPoints}
                 </StyledCell>
               )}
-              <StyledCell textalign="right">{rank.totalPoints}</StyledCell>
+              <StyledCell textalign="right">{rank.totalPoints.toFixed(2) + "%"}</StyledCell>
             </StyledRow>
           ))}
       </tbody>

src/pages/Leaderboard/PointsUpdateSection.tsx

@@ -33,7 +33,7 @@ const PointsUpdateSection: React.FC<PointsUpdateSectionProps> = ({
 
       <Flex direction={"column"} gap={"4px"}>
         <Text size={"1"} style={{ color: theme.color.grey1 }}>
-          Points Updated At
+          Updated At
         </Text>
         <Text size={"3"} style={{ fontWeight: "600" }}>
           {pointsUpdatedAt ? (

src/pages/Leaderboard/UserPointsSection.tsx

@@ -35,7 +35,7 @@ const UserPointsSection: React.FC<UserPointsSectionProps> = ({
               color: isMobile ? theme.color.grey1 : theme.color.grey2,
             }}
           >
-            You have {isLoading ? <Loader /> : `${userPoints ?? "0"} points`}
+            You have {isLoading ? <Loader /> : `${userPoints ? userPoints.toFixed(2) + "%" : "0"} PnL`}
           </Text>
         </Flex>
       ) : (
@@ -57,18 +57,18 @@ const UserPointsSection: React.FC<UserPointsSectionProps> = ({
               color: isMobile ? theme.color.grey1 : theme.color.grey2,
             }}
           >
-            to see points
+            to see your place on the leaderboard
           </Text>
         </Flex>
       )}
 
       <Flex gap={"8px"} align={"center"}>
         <Text size={"1"} style={{ color: theme.color.grey3 }}>
-          Points are calculated on Thursdays
+          Leaderboard is updated every minute!
         </Text>
-        <Link target="_blank" href={LEADERBOARD_LEARN_MORE_LINK}>
+        {false && <Link target="_blank" href={LEADERBOARD_LEARN_MORE_LINK}>
           <GradientText>Learn more</GradientText>
-        </Link>
+        </Link>}
       </Flex>
     </Flex>
   );

src/pages/Leaderboard/index.tsx

@@ -11,6 +11,7 @@ import {
   ExtendedUserData,
   LeaderboardPointsData,
   PrevWeekDetails,
+  SessionDetails,
   UserData,
 } from "./types";
 import { Address } from "viem";
@@ -21,7 +22,7 @@ import { GradientText } from "./user-points-section-styles";
 
 const INITIAL_NUMBER_OF_ROWS = 10;
 const ROWS_PER_LOAD = 20;
-const comingSoon = true;
+const comingSoon = false;
 
 const Leaderboard: React.FC = () => {
   const { address: account } = useAccount();
@@ -78,6 +79,12 @@ const Leaderboard: React.FC = () => {
     }
   }, [pointsData]);
 
+  const sessionDetails = useMemo<SessionDetails | undefined>(() => {
+    if (pointsData) {
+      return pointsData.sessionDetails;
+    }
+  }, [pointsData]);
+
   const initialUserData = useMemo<UserData | undefined>(() => {
     if (pointsData) {
       return pointsData.user;
@@ -252,7 +259,7 @@ const Leaderboard: React.FC = () => {
             userPoints={currentUserData?.totalPoints}
             isLoading={fetchingPointsData}
           />
-          <PointsUpdateSection pointsUpdatedAt={prevWeekDetails?.sessionEnd} />
+          <PointsUpdateSection pointsUpdatedAt={sessionDetails?.sessionLastUpdated || prevWeekDetails?.sessionEnd} />
         </Flex>
 
         <LeaderboardTable ranks={ranks} currentUserData={currentUserData} />

src/pages/Leaderboard/types.ts

@@ -3,6 +3,12 @@ export interface PrevWeekDetails {
   sessionStart: string
   sessionEnd: string
 }
+
+export interface SessionDetails {
+  sessionStart: string
+  sessionEnd: string
+  sessionLastUpdated: string
+}
 export interface UserData {
   _id: string
   totalPoints: number
@@ -18,5 +24,6 @@ export interface LeaderboardPointsData {
   previousWeekDetails: PrevWeekDetails
   totalUsers: number
   leaderboardTable: [UserData]
+  sessionDetails: SessionDetails
   user?: UserData
 }