diff --git a/src/components/common/balances/Balance.tsx b/src/components/common/balances/Balance.tsx
index b9870e0e0..80f6dbc30 100644
--- a/src/components/common/balances/Balance.tsx
+++ b/src/components/common/balances/Balance.tsx
@@ -19,52 +19,69 @@ const log = newLogger('useCreateBallance')
 const M_LENGTH = 6 + 1
 const K_LENGTH = 3 + 1
 
-function format(
-  value: Compact<any> | BN | string,
-  currency: string,
-  decimals: number,
-  withSi?: boolean,
-  _isShort?: boolean,
-  precision?: number,
+function format({
+  value,
+  currency,
+  decimals,
+  withSi,
+  isShort: _isShort,
+  fixedDecimalsLength,
+  precision,
   withMutedDecimals = true,
   alwaysShowDecimals = false,
-): React.ReactNode {
+}: {
+  value: Compact<any> | BN | string
+  currency: string
+  fixedDecimalsLength?: number
+  decimals: number
+  withSi?: boolean
+  isShort?: boolean
+  precision?: number
+  withMutedDecimals?: boolean
+  alwaysShowDecimals?: boolean
+}): React.ReactNode {
   // Remove any excess decimals, because this expects big integers
   const balanceValue = value.toString().split('.')[0]
 
-  const [prefix, postfix] = formatBalance(balanceValue, {
-    forceUnit: '-',
-    decimals,
-    withSi: false,
-    withZero: true,
-  }).split('.')
-  const isShort = _isShort || (withSi && prefix.length >= K_LENGTH && !alwaysShowDecimals)
+  try {
+    const [prefix, postfix] = formatBalance(balanceValue, {
+      forceUnit: '-',
+      decimals,
+      withSi: false,
+      withZero: true,
+    }).split('.')
+    const isShort = _isShort || (withSi && prefix.length >= K_LENGTH && !alwaysShowDecimals)
+
+    if (prefix.length > M_LENGTH && !alwaysShowDecimals) {
+      const balance = formatBalance(balanceValue, { decimals, withUnit: false })
+      return (
+        <>
+          {balance}&nbsp;{currency}
+        </>
+      )
+    }
 
-  if (prefix.length > M_LENGTH && !alwaysShowDecimals) {
-    const balance = formatBalance(balanceValue, { decimals, withUnit: false })
     return (
       <>
-        {balance}&nbsp;{currency}
+        {prefix}
+        {!isShort && (
+          <>
+            .
+            <span className={clsx(withMutedDecimals && 'DfBalanceDecimals')}>
+              {fixedDecimalsLength
+                ? postfix.substring(0, fixedDecimalsLength).padEnd(fixedDecimalsLength, '0')
+                : precision
+                ? parseFloat(`0.${postfix}`).toPrecision(precision).substring(2)
+                : postfix || '0000'}
+            </span>
+          </>
+        )}
+        &nbsp;{currency}
       </>
     )
+  } catch {
+    return null
   }
-
-  return (
-    <>
-      {prefix}
-      {!isShort && (
-        <>
-          .
-          <span className={clsx(withMutedDecimals && 'DfBalanceDecimals')}>
-            {precision
-              ? parseFloat(`0.${postfix}`).toPrecision(precision).substring(2)
-              : postfix || '0000'}
-          </span>
-        </>
-      )}
-      &nbsp;{currency}
-    </>
-  )
 }
 
 type FormatBalanceProps = BareProps & {
@@ -75,6 +92,7 @@ type FormatBalanceProps = BareProps & {
   precision?: number
   withMutedDecimals?: boolean
   alwaysShowDecimals?: boolean
+  fixedDecimalsLength?: number
 }
 
 export const FormatBalance = ({
@@ -84,6 +102,7 @@ export const FormatBalance = ({
   isShort,
   className,
   precision,
+  fixedDecimalsLength,
   withMutedDecimals = true,
   alwaysShowDecimals,
   ...bareProps
@@ -92,16 +111,17 @@ export const FormatBalance = ({
 
   const { unit: defaultCurrency, decimals: defaultDecimal } = formatBalance.getDefaults()
 
-  const balance = format(
+  const balance = format({
     value,
-    currency || defaultCurrency,
-    decimals || defaultDecimal,
-    true,
+    currency: currency || defaultCurrency,
+    decimals: decimals || defaultDecimal,
+    withSi: true,
     isShort,
     precision,
+    fixedDecimalsLength,
     withMutedDecimals,
     alwaysShowDecimals,
-  )
+  })
 
   return (
     <span className={clsx('DfFormatBalance', className)} {...bareProps}>
diff --git a/src/components/leaderboard/UserLeaderboardPage.tsx b/src/components/leaderboard/UserLeaderboardPage.tsx
index 89af27cbc..5e0569f38 100644
--- a/src/components/leaderboard/UserLeaderboardPage.tsx
+++ b/src/components/leaderboard/UserLeaderboardPage.tsx
@@ -156,6 +156,7 @@ export default function UserLeaderboardPage({ address }: UserLeaderboardPageProp
       {data && (
         <div className={clsx(styles.Statistics)}>
           <ProfileCard
+            rank={data[tabState]?.rank}
             variant={tabState === 'creator' ? 'pink' : 'blue'}
             address={address}
             detail={
@@ -207,7 +208,13 @@ export default function UserLeaderboardPage({ address }: UserLeaderboardPageProp
                 : 'Creators ranked by the amount of SUB earned with Active Staking this week.'}
             </MutedSpan>
           </div>
-          <LeaderboardTable className='mt-3' role={tabState} />
+          <LeaderboardTable
+            className='mt-3'
+            role={tabState}
+            currentUserRank={
+              data && { address, rank: data[tabState].rank, reward: data[tabState].earnedByPeriod }
+            }
+          />
         </DfCard>
       </div>
       <DfCard size='small' withShadow={false} className='lg-hidden mt-4'>
diff --git a/src/components/leaderboard/common/LeaderboardTable.tsx b/src/components/leaderboard/common/LeaderboardTable.tsx
index d110f8281..fdaa29802 100644
--- a/src/components/leaderboard/common/LeaderboardTable.tsx
+++ b/src/components/leaderboard/common/LeaderboardTable.tsx
@@ -29,10 +29,19 @@ import styles from './LeaderboardTable.module.sass'
 
 export type LeaderboardTableProps = ComponentProps<'div'> & {
   role: LeaderboardRole
+  currentUserRank?: {
+    rank: number
+    reward: string
+    address: string
+  }
 }
 
 const TABLE_LIMIT = 10
-export default function LeaderboardTable({ role, ...props }: LeaderboardTableProps) {
+export default function LeaderboardTable({
+  role,
+  currentUserRank,
+  ...props
+}: LeaderboardTableProps) {
   const [isOpenModal, setIsOpenModal] = useState(false)
   const { page, data } = useGetLeaderboardData(role)
   const dispatch = useAppDispatch()
@@ -42,13 +51,25 @@ export default function LeaderboardTable({ role, ...props }: LeaderboardTablePro
     }
   }, [dispatch, role])
 
-  const { addresses, slicedData } = useMemo(
-    () => ({
-      addresses: data.slice(0, TABLE_LIMIT).map(row => row.address),
-      slicedData: data.slice(0, TABLE_LIMIT),
-    }),
-    [data],
-  )
+  const { addresses, slicedData } = useMemo<{
+    addresses: string[]
+    slicedData: typeof data
+  }>(() => {
+    if (!currentUserRank || currentUserRank.rank < TABLE_LIMIT) {
+      return {
+        addresses: data.slice(0, TABLE_LIMIT).map(row => row.address),
+        slicedData: data.slice(0, TABLE_LIMIT),
+      }
+    }
+    return {
+      addresses: [
+        ...data.slice(0, TABLE_LIMIT - 1).map(row => row.address),
+        currentUserRank.address,
+      ],
+      slicedData: [...data.slice(0, TABLE_LIMIT - 1), currentUserRank],
+    }
+  }, [data, currentUserRank])
+
   const { loading } = useFetchProfileSpaces({ ids: addresses })
 
   return (
@@ -65,7 +86,13 @@ export default function LeaderboardTable({ role, ...props }: LeaderboardTablePro
         {slicedData.length === 0 &&
           Array.from({ length: 3 }).map((_, idx) => <UserRowSkeleton key={idx} />)}
         {slicedData.map(row => (
-          <UserRow role={role} key={row.rank} data={row} loading={!!loading} />
+          <UserRow
+            currentAddress={currentUserRank?.address}
+            role={role}
+            key={row.rank}
+            data={row}
+            loading={!!loading}
+          />
         ))}
         <Button onClick={() => setIsOpenModal(true)} type='link' className={styles.ViewMore}>
           View more
@@ -76,6 +103,7 @@ export default function LeaderboardTable({ role, ...props }: LeaderboardTablePro
         visible={isOpenModal}
         onCancel={() => setIsOpenModal(false)}
         role={role}
+        currentAddress={currentUserRank?.address}
       />
     </>
   )
@@ -100,10 +128,12 @@ function UserRow({
   data,
   loading,
   role,
+  currentAddress,
 }: {
   data: LeaderboardData['data'][number]
   loading: boolean
   role: LeaderboardRole
+  currentAddress?: string
 }) {
   const myAddress = useMyAddress() ?? ''
   const sendEvent = useSendEvent()
@@ -127,12 +157,12 @@ function UserRow({
         className={clsx(
           styles.LeaderboardRow,
           role === 'creator' && styles.RowPink,
-          myAddress === data.address && styles.Active,
+          (isMyAddress || currentAddress === data.address) && styles.Active,
           '!ColorNormal',
         )}
       >
         <MutedSpan>{data.rank + 1}</MutedSpan>
-        <div className='d-flex align-items-center' style={{ minWidth: 0 }}>
+        <div className='d-flex align-items-center' style={{ minWidth: 0, height: '41px' }}>
           {isLoading ? (
             <>
               <Skeleton.Avatar size={32} className='mr-1' />
@@ -146,10 +176,7 @@ function UserRow({
                 avatar={profile?.content?.image}
                 size={32}
               />
-              <div
-                className='d-flex flex-column justify-content-center'
-                style={{ minWidth: 0, height: '41px' }}
-              >
+              <div className='d-flex flex-column justify-content-center' style={{ minWidth: 0 }}>
                 <span
                   style={{
                     overflow: 'hidden',
@@ -185,7 +212,7 @@ function UserRow({
             value={data.reward}
             currency='SUB'
             decimals={10}
-            precision={2}
+            fixedDecimalsLength={2}
           />
         </span>
       </a>
@@ -196,10 +223,12 @@ function UserRow({
 type LeaderboardTableModalProps = {
   role: LeaderboardRole
   isLoadingFirstBatchOfData: boolean
+  currentAddress?: string
 } & CustomModalProps
 function LeaderboardTableModal({
   role,
   isLoadingFirstBatchOfData,
+  currentAddress,
   ...props
 }: LeaderboardTableModalProps) {
   const { data, hasMore } = useGetLeaderboardData(role)
@@ -260,7 +289,13 @@ function LeaderboardTableModal({
           loader={<Loading className={styles.Loading} />}
         >
           {data.map(row => (
-            <UserRow role={role} data={row} loading={isLoading} key={row.rank} />
+            <UserRow
+              currentAddress={currentAddress}
+              role={role}
+              data={row}
+              loading={isLoading}
+              key={row.rank}
+            />
           ))}
         </InfiniteScroll>
       </div>
diff --git a/src/components/leaderboard/common/ProfileCard.module.sass b/src/components/leaderboard/common/ProfileCard.module.sass
index 65b05dccd..c3b8eff98 100644
--- a/src/components/leaderboard/common/ProfileCard.module.sass
+++ b/src/components/leaderboard/common/ProfileCard.module.sass
@@ -7,6 +7,14 @@
   align-items: center
   gap: $space_normal
   grid-row: span 2
+  position: relative
+
+  .Rank
+    position: absolute
+    right: $space_normal
+    top: $space_normal
+    font-weight: $font_weight_semibold
+    color: $color_muted
 
   .ProfileContent
     display: flex
diff --git a/src/components/leaderboard/common/ProfileCard.tsx b/src/components/leaderboard/common/ProfileCard.tsx
index 405bac5fc..fcc626ada 100644
--- a/src/components/leaderboard/common/ProfileCard.tsx
+++ b/src/components/leaderboard/common/ProfileCard.tsx
@@ -13,9 +13,10 @@ export type ProfileCardProps = DfCardProps & {
   address?: string
   title?: string
   detail?: ReactNode
+  rank?: number
 }
 
-export default function ProfileCard({ address, title, detail, ...props }: ProfileCardProps) {
+export default function ProfileCard({ address, rank, title, detail, ...props }: ProfileCardProps) {
   const isMobile = useIsMobileWidthOrDevice()
   const profile = useSelectProfile(address)
 
@@ -41,6 +42,7 @@ export default function ProfileCard({ address, title, detail, ...props }: Profil
       size='small'
       withShadow={false}
     >
+      {typeof rank === 'number' && <span className={clsx(styles.Rank)}>#{rank + 1}</span>}
       {address ? (
         profile?.struct ? (
           <ViewSpaceLink space={profile?.struct} title={avatar} />
diff --git a/src/components/posts/view-post/PostRewardStat.tsx b/src/components/posts/view-post/PostRewardStat.tsx
index 40a2fc88c..6470e2a4f 100644
--- a/src/components/posts/view-post/PostRewardStat.tsx
+++ b/src/components/posts/view-post/PostRewardStat.tsx
@@ -11,25 +11,77 @@ export default function PostRewardStat({ postId, ...props }: PostRewardStatProps
   const reward = useSelectPostReward(postId)
   if (!reward?.isNotZero) return null
 
+  let finalReward = '0'
+  try {
+    finalReward = (BigInt(reward.reward) + BigInt(reward.draftReward)).toString()
+  } catch {}
+
   return (
     <div {...props} className={clsx(props.className)}>
-      <Tooltip
-        className='d-flex align-items-center GapMini FontWeightMedium ColorMuted'
-        title='Rewards earned depend on how many likes a post or comment gets, and how much SUB each liker has staked'
-      >
-        <TbCoins className='FontNormal' />
-        <span className='FontWeightSemibold'>
-          <FormatBalance
-            style={{ whiteSpace: 'nowrap' }}
-            currency='SUB'
-            decimals={10}
-            precision={2}
-            withMutedDecimals={false}
-            value={reward.amount}
-          />
-        </span>
-        <span className='d-flex align-items-center GapMini'>earned</span>
-      </Tooltip>
+      <div className='d-flex align-items-center GapMini FontWeightMedium ColorMuted'>
+        <div className='position-relative d-flex align-items-center mr-1'>
+          {reward.draftReward ? (
+            <Tooltip
+              className='d-flex align-items-center'
+              title={
+                <span>
+                  {BigInt(reward.reward) > 0 && (
+                    <>
+                      <FormatBalance
+                        withMutedDecimals={false}
+                        value={reward.reward}
+                        currency='SUB'
+                        decimals={10}
+                        precision={2}
+                      />{' '}
+                      earned +{' '}
+                    </>
+                  )}
+                  <FormatBalance
+                    withMutedDecimals={false}
+                    value={reward.draftReward}
+                    currency='SUB'
+                    decimals={10}
+                    precision={2}
+                  />{' '}
+                  approx. today
+                </span>
+              }
+            >
+              <TbCoins className='FontNormal' />
+              <div
+                style={{
+                  width: '4px',
+                  height: '4px',
+                  background: '#F8963A',
+                  position: 'absolute',
+                  top: 0,
+                  right: 0,
+                  borderRadius: '50%',
+                }}
+              />
+            </Tooltip>
+          ) : (
+            <TbCoins className='FontNormal' />
+          )}
+        </div>
+        <Tooltip
+          className='d-flex align-items-center GapMini'
+          title='Rewards earned depend on how many likes a post or comment gets, and how much SUB each liker has staked'
+        >
+          <span className='FontWeightSemibold'>
+            <FormatBalance
+              style={{ whiteSpace: 'nowrap' }}
+              currency='SUB'
+              decimals={10}
+              precision={2}
+              withMutedDecimals={false}
+              value={finalReward}
+            />
+          </span>
+          <span className='d-flex align-items-center GapMini'>earned</span>
+        </Tooltip>
+      </div>
     </div>
   )
 }
diff --git a/src/components/utils/datahub/active-staking.ts b/src/components/utils/datahub/active-staking.ts
index 9c6151629..e52703b17 100644
--- a/src/components/utils/datahub/active-staking.ts
+++ b/src/components/utils/datahub/active-staking.ts
@@ -87,15 +87,17 @@ export async function getPostRewards(postIds: string[]): Promise<PostRewards[]>
 
   const resultMap = new Map<string, PostRewards>()
   res.activeStakingRewardsByPosts.forEach(item => {
-    const reward = BigInt(item.reward) > 0 ? item.reward : item.draftReward
     resultMap.set(item.persistentPostId, {
       postId: item.persistentPostId,
-      amount: reward,
-      isNotZero: BigInt(reward) > 0,
+      reward: item.reward,
+      draftReward: item.draftReward,
+      isNotZero: BigInt(item.reward) > 0 || BigInt(item.draftReward) > 0,
     })
   })
 
-  return postIds.map(postId => resultMap.get(postId) ?? { postId, amount: '0', isNotZero: false })
+  return postIds.map(
+    postId => resultMap.get(postId) ?? { postId, reward: '0', draftReward: '0', isNotZero: false },
+  )
 }
 
 const GET_ADDRESS_LIKE_COUNT_TO_POSTS = gql`
diff --git a/src/components/utils/datahub/leaderboard.ts b/src/components/utils/datahub/leaderboard.ts
index 8a8ea6db7..9775c1727 100644
--- a/src/components/utils/datahub/leaderboard.ts
+++ b/src/components/utils/datahub/leaderboard.ts
@@ -71,7 +71,17 @@ export async function getTopUsers(): Promise<TopUsers> {
 }
 
 const GET_USER_STATS = gql`
-  query GetUserStats($address: String!) {
+  query GetUserStats($address: String!, $timestamp: String!) {
+    staker: activeStakingAddressRankByRewardsForPeriod(
+      args: { address: $address, period: WEEK, role: STAKER, timestamp: $timestamp }
+    ) {
+      rankIndex
+    }
+    creator: activeStakingAddressRankByRewardsForPeriod(
+      args: { address: $address, period: WEEK, role: CREATOR, timestamp: $timestamp }
+    ) {
+      rankIndex
+    }
     activeStakingAccountActivityMetricsForFixedPeriod(
       args: {
         address: $address
@@ -103,6 +113,14 @@ const GET_USER_STATS = gql`
 export async function getUserStatistics({ address }: { address: string }): Promise<UserStatistics> {
   const res = await datahubQueryRequest<
     {
+      staker: {
+        reward: string
+        rankIndex: number
+      }
+      creator: {
+        reward: string
+        rankIndex: number
+      }
       activeStakingAccountActivityMetricsForFixedPeriod: {
         staker: {
           likedCreators: number
@@ -118,15 +136,22 @@ export async function getUserStatistics({ address }: { address: string }): Promi
         }
       }
     },
-    { address: string }
+    { address: string; timestamp: string }
   >({
     document: GET_USER_STATS,
-    variables: { address },
+    variables: { address, timestamp: getDayAndWeekTimestamp().week.toString() },
   })
 
   return {
     address,
-    ...res.activeStakingAccountActivityMetricsForFixedPeriod,
+    creator: {
+      ...res.activeStakingAccountActivityMetricsForFixedPeriod.creator,
+      rank: res.creator.rankIndex,
+    },
+    staker: {
+      ...res.activeStakingAccountActivityMetricsForFixedPeriod.staker,
+      rank: res.staker.rankIndex,
+    },
   }
 }
 
diff --git a/src/rtk/features/activeStaking/postRewardSlice.ts b/src/rtk/features/activeStaking/postRewardSlice.ts
index d610cc1d2..1bffa1716 100644
--- a/src/rtk/features/activeStaking/postRewardSlice.ts
+++ b/src/rtk/features/activeStaking/postRewardSlice.ts
@@ -5,7 +5,8 @@ import { createSimpleManyFetchWrapper } from 'src/rtk/app/wrappers'
 
 export type PostRewards = {
   postId: string
-  amount: string
+  reward: string
+  draftReward: string
   isNotZero: boolean
 }
 
diff --git a/src/rtk/features/leaderboard/userStatisticsSlice.ts b/src/rtk/features/leaderboard/userStatisticsSlice.ts
index c7b411359..c26c933b5 100644
--- a/src/rtk/features/leaderboard/userStatisticsSlice.ts
+++ b/src/rtk/features/leaderboard/userStatisticsSlice.ts
@@ -10,12 +10,14 @@ export type UserStatistics = {
     likedPosts: number
     earnedByPeriod: string
     earnedTotal: string
+    rank: number
   }
   creator: {
     likesCountByPeriod: number
     stakersWhoLiked: number
     earnedByPeriod: string
     earnedTotal: string
+    rank: number
   }
 }