diff --git a/apps/web/public/images/pool/lockCAKEbenefit.png b/apps/web/public/images/pool/lockCAKEbenefit.png
new file mode 100644
index 0000000000000..b5e8a2289c05c
Binary files /dev/null and b/apps/web/public/images/pool/lockCAKEbenefit.png differ
diff --git a/apps/web/public/images/pool/lockcaketooltip.png b/apps/web/public/images/pool/lockcaketooltip.png
new file mode 100644
index 0000000000000..c0c1933a53c5f
Binary files /dev/null and b/apps/web/public/images/pool/lockcaketooltip.png differ
diff --git a/apps/web/src/config/abi/revenueSharingPool.ts b/apps/web/src/config/abi/revenueSharingPool.ts
new file mode 100644
index 0000000000000..9abfe092feb62
--- /dev/null
+++ b/apps/web/src/config/abi/revenueSharingPool.ts
@@ -0,0 +1,243 @@
+export const revenueSharingPoolABI = [
+  { inputs: [], stateMutability: 'nonpayable', type: 'constructor' },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: false, internalType: 'uint256', name: '_timestamp', type: 'uint256' },
+      { indexed: false, internalType: 'uint256', name: '_tokens', type: 'uint256' },
+    ],
+    name: 'LogCheckpointToken',
+    type: 'event',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: true, internalType: 'address', name: '_recipient', type: 'address' },
+      { indexed: false, internalType: 'uint256', name: '_amount', type: 'uint256' },
+      { indexed: false, internalType: 'uint256', name: '_claimEpoch', type: 'uint256' },
+      { indexed: false, internalType: 'uint256', name: '_maxEpoch', type: 'uint256' },
+    ],
+    name: 'LogClaimed',
+    type: 'event',
+  },
+  {
+    anonymous: false,
+    inputs: [{ indexed: false, internalType: 'uint256', name: '_amount', type: 'uint256' }],
+    name: 'LogFeed',
+    type: 'event',
+  },
+  { anonymous: false, inputs: [], name: 'LogKilled', type: 'event' },
+  {
+    anonymous: false,
+    inputs: [{ indexed: false, internalType: 'bool', name: '_toggleFlag', type: 'bool' }],
+    name: 'LogSetCanCheckpointToken',
+    type: 'event',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: true, internalType: 'address', name: '_caller', type: 'address' },
+      { indexed: true, internalType: 'address', name: '_address', type: 'address' },
+      { indexed: false, internalType: 'bool', name: '_ok', type: 'bool' },
+    ],
+    name: 'LogSetWhitelistedCheckpointCallers',
+    type: 'event',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: true, internalType: 'address', name: 'previousOwner', type: 'address' },
+      { indexed: true, internalType: 'address', name: 'newOwner', type: 'address' },
+    ],
+    name: 'OwnershipTransferred',
+    type: 'event',
+  },
+  {
+    inputs: [],
+    name: 'TOKEN_CHECKPOINT_DEADLINE',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'VCake',
+    outputs: [{ internalType: 'address', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'WEEK',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'address', name: '_user', type: 'address' },
+      { internalType: 'uint256', name: '_timestamp', type: 'uint256' },
+    ],
+    name: 'balanceOfAt',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'canCheckpointToken',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  { inputs: [], name: 'checkpointToken', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  { inputs: [], name: 'checkpointTotalSupply', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  {
+    inputs: [{ internalType: 'address', name: '_user', type: 'address' }],
+    name: 'claim',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address[]', name: '_users', type: 'address[]' }],
+    name: 'claimMany',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'emergencyReturn',
+    outputs: [{ internalType: 'address', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '_amount', type: 'uint256' }],
+    name: 'feed',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'uint256', name: '_timestamp', type: 'uint256' },
+      { internalType: 'uint256', name: '_amount', type: 'uint256' },
+    ],
+    name: 'injectReward',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'isKilled',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  { inputs: [], name: 'kill', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  {
+    inputs: [],
+    name: 'lastTokenBalance',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'lastTokenTimestamp',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'owner',
+    outputs: [{ internalType: 'address', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  { inputs: [], name: 'renounceOwnership', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  {
+    inputs: [],
+    name: 'rewardToken',
+    outputs: [{ internalType: 'contract IERC20', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'bool', name: '_newCanCheckpointToken', type: 'bool' }],
+    name: 'setCanCheckpointToken',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'address[]', name: '_callers', type: 'address[]' },
+      { internalType: 'bool', name: '_ok', type: 'bool' },
+    ],
+    name: 'setWhitelistedCheckpointCallers',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'startWeekCursor',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    name: 'tokensPerWeek',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    name: 'totalSupplyAt',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: 'newOwner', type: 'address' }],
+    name: 'transferOwnership',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'userEpochOf',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'weekCursor',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'weekCursorOf',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'whitelistedCheckpointCallers',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+] as const
diff --git a/apps/web/src/config/abi/vCake.ts b/apps/web/src/config/abi/vCake.ts
new file mode 100644
index 0000000000000..98527c241c604
--- /dev/null
+++ b/apps/web/src/config/abi/vCake.ts
@@ -0,0 +1,210 @@
+export const vCakeABI = [
+  {
+    inputs: [
+      { internalType: 'contract ICakePool', name: '_cakePool', type: 'address' },
+      { internalType: 'contract IMasterChefV2', name: '_masterchefV2', type: 'address' },
+      { internalType: 'uint256', name: '_pid', type: 'uint256' },
+    ],
+    stateMutability: 'nonpayable',
+    type: 'constructor',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      { indexed: true, internalType: 'address', name: 'user', type: 'address' },
+      { indexed: false, internalType: 'uint256', name: 'lockedAmount', type: 'uint256' },
+    ],
+    name: 'Sync',
+    type: 'event',
+  },
+  {
+    inputs: [],
+    name: 'CakePool',
+    outputs: [{ internalType: 'contract ICakePool', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'CakePoolPID',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'DURATION_FACTOR_OVERDUE',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'MULTIPLIER',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'MasterchefV2',
+    outputs: [{ internalType: 'contract IMasterChefV2', name: '', type: 'address' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'PRECISION_FACTOR',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'UNLOCK_FREE_DURATION',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'WEEK',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '_user', type: 'address' }],
+    name: 'balanceOf',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'address', name: '_user', type: 'address' },
+      { internalType: 'uint256', name: '_blockNumber', type: 'uint256' },
+    ],
+    name: 'balanceOfAt',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  { inputs: [], name: 'checkpoint', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  {
+    inputs: [],
+    name: 'decimals',
+    outputs: [{ internalType: 'uint8', name: '', type: 'uint8' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'address', name: '_user', type: 'address' },
+      { internalType: 'uint256', name: '_amount', type: 'uint256' },
+      { internalType: 'uint256', name: '_lockDuration', type: 'uint256' },
+    ],
+    name: 'deposit',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'epoch',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'initialization',
+    outputs: [{ internalType: 'bool', name: '', type: 'bool' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'name',
+    outputs: [{ internalType: 'string', name: '', type: 'string' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    name: 'pointHistory',
+    outputs: [
+      { internalType: 'int128', name: 'bias', type: 'int128' },
+      { internalType: 'int128', name: 'slope', type: 'int128' },
+      { internalType: 'uint256', name: 'timestamp', type: 'uint256' },
+      { internalType: 'uint256', name: 'blockNumber', type: 'uint256' },
+    ],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    name: 'slopeChanges',
+    outputs: [{ internalType: 'int128', name: '', type: 'int128' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [],
+    name: 'symbol',
+    outputs: [{ internalType: 'string', name: '', type: 'string' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  { inputs: [], name: 'syncFromCakePool', outputs: [], stateMutability: 'nonpayable', type: 'function' },
+  {
+    inputs: [],
+    name: 'totalSupply',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'uint256', name: '_blockNumber', type: 'uint256' }],
+    name: 'totalSupplyAt',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'userPointEpoch',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [
+      { internalType: 'address', name: '', type: 'address' },
+      { internalType: 'uint256', name: '', type: 'uint256' },
+    ],
+    name: 'userPointHistory',
+    outputs: [
+      { internalType: 'int128', name: 'bias', type: 'int128' },
+      { internalType: 'int128', name: 'slope', type: 'int128' },
+      { internalType: 'uint256', name: 'timestamp', type: 'uint256' },
+      { internalType: 'uint256', name: 'blockNumber', type: 'uint256' },
+    ],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '', type: 'address' }],
+    name: 'userPrevLockedAmount',
+    outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    inputs: [{ internalType: 'address', name: '_user', type: 'address' }],
+    name: 'withdraw',
+    outputs: [],
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+] as const
diff --git a/apps/web/src/config/constants/contracts.ts b/apps/web/src/config/constants/contracts.ts
index 3fe8fd97f5169..7a9a056a32858 100644
--- a/apps/web/src/config/constants/contracts.ts
+++ b/apps/web/src/config/constants/contracts.ts
@@ -226,4 +226,14 @@ export default {
     56: '0x549d484F493b778A5c70638E30Fc6Dc6B2Dcc4c0',
     97: '0x',
   },
+  vCake: {
+    1: '0x',
+    56: '0xa3b8321173Cf3DdF37Ce3e7548203Fc25d86402F',
+    97: '0x5DD37E97716A8b358BCbc731516F36FFff978454',
+  },
+  revenueSharingPool: {
+    1: '0x',
+    56: '0xCD5d1935e9bfa4905f9f007C97aB1f1763dC1607',
+    97: '0xd2d1DD41700d9132d3286e0FcD8D6E1D8E5052F5',
+  },
 } as const satisfies Record<string, Record<number, `0x${string}`>>
diff --git a/apps/web/src/hooks/useContract.ts b/apps/web/src/hooks/useContract.ts
index f0effed0a1f7a..6280ad8111618 100644
--- a/apps/web/src/hooks/useContract.ts
+++ b/apps/web/src/hooks/useContract.ts
@@ -46,6 +46,8 @@ import {
   getV3AirdropContract,
   getV3MigratorContract,
   getTradingRewardTopTradesContract,
+  getVCakeContract,
+  getRevenueSharingPoolContract,
 } from 'utils/contractHelpers'
 
 import { ChainId, WNATIVE, pancakePairV2ABI } from '@pancakeswap/sdk'
@@ -392,3 +394,15 @@ export const useTradingRewardTopTraderContract = ({ chainId: chainId_ }: { chain
   const { data: signer } = useWalletClient()
   return useMemo(() => getTradingRewardTopTradesContract(signer, chainId_ ?? chainId), [signer, chainId_, chainId])
 }
+
+export const useVCakeContract = ({ chainId: chainId_ }: { chainId?: ChainId } = {}) => {
+  const { chainId } = useActiveChainId()
+  const { data: signer } = useWalletClient()
+  return useMemo(() => getVCakeContract(signer, chainId_ ?? chainId), [signer, chainId_, chainId])
+}
+
+export const useRevenueSharingPoolContract = ({ chainId: chainId_ }: { chainId?: ChainId } = {}) => {
+  const { chainId } = useActiveChainId()
+  const { data: signer } = useWalletClient()
+  return useMemo(() => getRevenueSharingPoolContract(signer, chainId_ ?? chainId), [signer, chainId_, chainId])
+}
diff --git a/apps/web/src/utils/addressHelpers.ts b/apps/web/src/utils/addressHelpers.ts
index 667cac02f9887..366b87f512fa7 100644
--- a/apps/web/src/utils/addressHelpers.ts
+++ b/apps/web/src/utils/addressHelpers.ts
@@ -140,3 +140,11 @@ export const getAffiliateProgramAddress = (chainId?: number) => {
 export const getTradingRewardTopTradesAddress = (chainId?: number) => {
   return getAddressFromMap(addresses.tradingRewardTopTrades, chainId)
 }
+
+export const getVCakeAddress = (chainId?: number) => {
+  return getAddressFromMap(addresses.vCake, chainId)
+}
+
+export const getRevenueSharingPoolAddress = (chainId?: number) => {
+  return getAddressFromMap(addresses.revenueSharingPool, chainId)
+}
diff --git a/apps/web/src/utils/contractHelpers.ts b/apps/web/src/utils/contractHelpers.ts
index 5f999d6f3bc64..a94a0ca850f44 100644
--- a/apps/web/src/utils/contractHelpers.ts
+++ b/apps/web/src/utils/contractHelpers.ts
@@ -32,6 +32,8 @@ import {
   getV3MigratorAddress,
   getAffiliateProgramAddress,
   getTradingRewardTopTradesAddress,
+  getVCakeAddress,
+  getRevenueSharingPoolAddress,
 } from 'utils/addressHelpers'
 
 // ABI
@@ -78,6 +80,8 @@ import { tradingCompetitionMoboxABI } from 'config/abi/tradingCompetitionMobox'
 import { tradingRewardABI } from 'config/abi/tradingReward'
 import { v3AirdropABI } from 'config/abi/v3Airdrop'
 import { v3MigratorABI } from 'config/abi/v3Migrator'
+import { vCakeABI } from 'config/abi/vCake'
+import { revenueSharingPoolABI } from 'config/abi/revenueSharingPool'
 import { getViemClients, viemClients } from 'utils/viem'
 import { Abi, PublicClient, WalletClient, getContract as viemGetContract } from 'viem'
 import { Address, erc20ABI, erc721ABI } from 'wagmi'
@@ -388,3 +392,21 @@ export const getTradingRewardTopTradesContract = (signer?: WalletClient, chainId
     chainId,
   })
 }
+
+export const getVCakeContract = (signer?: WalletClient, chainId?: number) => {
+  return getContract({
+    abi: vCakeABI,
+    address: getVCakeAddress(chainId),
+    signer,
+    chainId,
+  })
+}
+
+export const getRevenueSharingPoolContract = (signer?: WalletClient, chainId?: number) => {
+  return getContract({
+    abi: revenueSharingPoolABI,
+    address: getRevenueSharingPoolAddress(chainId),
+    signer,
+    chainId,
+  })
+}
diff --git a/apps/web/src/views/Farms/components/FarmCard/V3/FarmV3Card.tsx b/apps/web/src/views/Farms/components/FarmCard/V3/FarmV3Card.tsx
index f8ea8db973b02..d4434ce38fe92 100644
--- a/apps/web/src/views/Farms/components/FarmCard/V3/FarmV3Card.tsx
+++ b/apps/web/src/views/Farms/components/FarmCard/V3/FarmV3Card.tsx
@@ -58,12 +58,7 @@ interface FarmCardProps {
   account?: string
 }
 
-export const FarmV3Card: React.FC<React.PropsWithChildren<FarmCardProps>> = ({
-  farm,
-  removed,
-  // cakePrice,
-  account,
-}) => {
+export const FarmV3Card: React.FC<React.PropsWithChildren<FarmCardProps>> = ({ farm, removed, account }) => {
   const { t } = useTranslation()
   const { chainId } = useActiveChainId()
   const [showExpandableSection, setShowExpandableSection] = useState(false)
diff --git a/apps/web/src/views/Pools/components/CakeVaultCard/index.tsx b/apps/web/src/views/Pools/components/CakeVaultCard/index.tsx
index d1b2b722c1f1a..ec955ee922d52 100644
--- a/apps/web/src/views/Pools/components/CakeVaultCard/index.tsx
+++ b/apps/web/src/views/Pools/components/CakeVaultCard/index.tsx
@@ -1,4 +1,16 @@
-import { Box, CardBody, CardProps, Flex, Text, TokenPairImage, FlexGap, Skeleton, Pool } from '@pancakeswap/uikit'
+import {
+  Box,
+  CardBody,
+  CardProps,
+  Button,
+  Flex,
+  Text,
+  TokenPairImage,
+  FlexGap,
+  Skeleton,
+  Pool,
+  useModal,
+} from '@pancakeswap/uikit'
 import { useAccount } from 'wagmi'
 import ConnectWalletButton from 'components/ConnectWalletButton'
 import { vaultPoolConfig } from 'config/constants/pools'
@@ -7,6 +19,9 @@ import { useVaultPoolByKey } from 'state/pools/hooks'
 import { VaultKey, DeserializedLockedCakeVault, DeserializedCakeVault } from 'state/types'
 import styled from 'styled-components'
 import { Token } from '@pancakeswap/sdk'
+import BenefitsModal from 'views/Pools/components/RevenueSharing/BenefitsModal'
+import { getVaultPosition, VaultPosition } from 'utils/cakePool'
+import useVCake from 'views/Pools/hooks/useVCake'
 
 import CardFooter from '../PoolCard/CardFooter'
 import { VaultPositionTagWithLabel } from '../Vault/VaultPositionTag'
@@ -50,7 +65,15 @@ export const CakeVaultDetail: React.FC<React.PropsWithChildren<CakeVaultDetailPr
   defaultFooterExpanded,
 }) => {
   const { t } = useTranslation()
+  const { isInitialization } = useVCake()
+  const [onPresentViewBenefitsModal] = useModal(
+    <BenefitsModal pool={pool} userData={(vaultPool as DeserializedLockedCakeVault)?.userData} />,
+    true,
+    false,
+    'revenueModal',
+  )
 
+  const vaultPosition = getVaultPosition(vaultPool.userData)
   const isLocked = (vaultPool as DeserializedLockedCakeVault)?.userData?.locked
 
   if (!pool) {
@@ -61,15 +84,22 @@ export const CakeVaultDetail: React.FC<React.PropsWithChildren<CakeVaultDetailPr
     <>
       <StyledCardBody isLoading={isLoading}>
         {account && pool.vaultKey === VaultKey.CakeVault && (
-          <VaultPositionTagWithLabel userData={(vaultPool as DeserializedLockedCakeVault).userData} />
+          <VaultPositionTagWithLabel userData={(vaultPool as DeserializedLockedCakeVault)?.userData} />
         )}
         {account && pool.vaultKey === VaultKey.CakeVault && isLocked ? (
-          <LockedStakingApy
-            userData={(vaultPool as DeserializedLockedCakeVault).userData}
-            showICake={showICake}
-            pool={pool}
-            account={account}
-          />
+          <>
+            <LockedStakingApy
+              userData={(vaultPool as DeserializedLockedCakeVault).userData}
+              showICake={showICake}
+              pool={pool}
+              account={account}
+            />
+            {vaultPosition === VaultPosition.Locked && isInitialization && !showICake && (
+              <Button mt="16px" width="100%" variant="secondary" onClick={onPresentViewBenefitsModal}>
+                {t('View Benefits')}
+              </Button>
+            )}
+          </>
         ) : (
           <>
             <StakingApy pool={pool} />
diff --git a/apps/web/src/views/Pools/components/LockedPool/Common/LockedActions.tsx b/apps/web/src/views/Pools/components/LockedPool/Common/LockedActions.tsx
index 8faedfc2fafb2..34dfcf58aceea 100644
--- a/apps/web/src/views/Pools/components/LockedPool/Common/LockedActions.tsx
+++ b/apps/web/src/views/Pools/components/LockedPool/Common/LockedActions.tsx
@@ -1,5 +1,5 @@
 import { useMemo } from 'react'
-import { Flex, Box } from '@pancakeswap/uikit'
+import { Flex, Box, ButtonProps } from '@pancakeswap/uikit'
 import BigNumber from 'bignumber.js'
 import { getVaultPosition, VaultPosition } from 'utils/cakePool'
 import { BIG_ZERO } from '@pancakeswap/utils/bigNumber'
@@ -10,7 +10,7 @@ import ExtendButton from '../Buttons/ExtendDurationButton'
 import AfterLockedActions from './AfterLockedActions'
 import { LockedActionsPropsType } from '../types'
 
-const LockedActions: React.FC<React.PropsWithChildren<LockedActionsPropsType>> = ({
+const LockedActions: React.FC<React.PropsWithChildren<LockedActionsPropsType & ButtonProps>> = ({
   userShares,
   locked,
   lockEndTime,
@@ -19,6 +19,7 @@ const LockedActions: React.FC<React.PropsWithChildren<LockedActionsPropsType>> =
   stakingTokenBalance,
   stakingTokenPrice,
   lockedAmount,
+  variant,
 }) => {
   const position = useMemo(
     () =>
@@ -42,6 +43,7 @@ const LockedActions: React.FC<React.PropsWithChildren<LockedActionsPropsType>> =
       <Flex>
         <Box width="100%" mr="4px">
           <AddCakeButton
+            variant={variant || 'primary'}
             lockEndTime={lockEndTime}
             lockStartTime={lockStartTime}
             currentLockedAmount={lockedAmount}
@@ -53,6 +55,7 @@ const LockedActions: React.FC<React.PropsWithChildren<LockedActionsPropsType>> =
         </Box>
         <Box width="100%" ml="4px">
           <ExtendButton
+            variant={variant || 'primary'}
             lockEndTime={lockEndTime}
             lockStartTime={lockStartTime}
             stakingToken={stakingToken}
diff --git a/apps/web/src/views/Pools/components/LockedPool/LockedStaking.tsx b/apps/web/src/views/Pools/components/LockedPool/LockedStaking.tsx
new file mode 100644
index 0000000000000..4d92643a81a68
--- /dev/null
+++ b/apps/web/src/views/Pools/components/LockedPool/LockedStaking.tsx
@@ -0,0 +1,139 @@
+import styled from 'styled-components'
+import { useMemo } from 'react'
+import { getVaultPosition, VaultPosition } from 'utils/cakePool'
+
+import { Flex, Text, Box, useTooltip, HelpIcon, BalanceWithLoading, Pool, ButtonVariant } from '@pancakeswap/uikit'
+import { useTranslation } from '@pancakeswap/localization'
+import { Token } from '@pancakeswap/sdk'
+import { getBalanceNumber } from '@pancakeswap/utils/formatBalance'
+import { DeserializedLockedVaultUser } from 'state/types'
+import LockedActions from './Common/LockedActions'
+import useUserDataInVaultPresenter from './hooks/useUserDataInVaultPresenter'
+import OriginalLockedInfo from '../OriginalLockedInfo'
+
+const HelpIconWrapper = styled.div`
+  align-self: center;
+`
+
+interface LockedStakingProps {
+  buttonVariant?: ButtonVariant
+  pool: Pool.DeserializedPool<Token>
+  userData: DeserializedLockedVaultUser
+}
+
+const LockedStaking: React.FC<React.PropsWithChildren<LockedStakingProps>> = ({ buttonVariant, pool, userData }) => {
+  const { t } = useTranslation()
+
+  const position = useMemo(
+    () =>
+      getVaultPosition({
+        userShares: userData?.userShares,
+        locked: userData?.locked,
+        lockEndTime: userData?.lockEndTime,
+      }),
+    [userData],
+  )
+
+  const stakingToken = pool?.stakingToken
+  const stakingTokenPrice = pool?.stakingTokenPrice
+  const stakingTokenBalance = pool?.userData?.stakingTokenBalance
+
+  const currentLockedAmountAsBigNumber = useMemo(() => {
+    return userData?.balance?.cakeAsBigNumber
+  }, [userData?.balance?.cakeAsBigNumber])
+
+  const currentLockedAmount = getBalanceNumber(currentLockedAmountAsBigNumber)
+
+  const usdValueStaked = useMemo(
+    () =>
+      stakingToken && stakingTokenPrice
+        ? getBalanceNumber(userData?.balance?.cakeAsBigNumber.multipliedBy(stakingTokenPrice), stakingToken?.decimals)
+        : null,
+    [userData?.balance?.cakeAsBigNumber, stakingTokenPrice, stakingToken],
+  )
+
+  const { lockEndDate, remainingTime, burnStartTime } = useUserDataInVaultPresenter({
+    lockStartTime: userData?.lockStartTime,
+    lockEndTime: userData?.lockEndTime,
+    burnStartTime: userData?.burnStartTime,
+  })
+
+  const {
+    targetRef: tagTargetRefOfLocked,
+    tooltip: tagTooltipOfLocked,
+    tooltipVisible: tagTooltipVisibleOfLocked,
+  } = useTooltip(<OriginalLockedInfo pool={pool} />, {
+    placement: 'bottom',
+  })
+
+  const tooltipContentOfBurn = t(
+    'After Burning starts at %burnStartTime%. You need to renew your fix-term position, to initiate a new lock or convert your staking position to flexible before it starts. Otherwise all the rewards will be burned within the next 90 days.',
+    { burnStartTime },
+  )
+  const {
+    targetRef: tagTargetRefOfBurn,
+    tooltip: tagTooltipOfBurn,
+    tooltipVisible: tagTooltipVisibleOfBurn,
+  } = useTooltip(tooltipContentOfBurn, {
+    placement: 'bottom',
+  })
+
+  return (
+    <Box>
+      <Flex justifyContent="space-between" mb="16px">
+        <Box>
+          <Text color="textSubtle" textTransform="uppercase" bold fontSize="12px">
+            {t('CAKE locked')}
+          </Text>
+          <Flex>
+            <BalanceWithLoading color="text" bold fontSize="16px" value={currentLockedAmount} decimals={5} />
+            {tagTooltipVisibleOfLocked && tagTooltipOfLocked}
+            <HelpIconWrapper ref={tagTargetRefOfLocked}>
+              <HelpIcon ml="4px" mt="2px" width="20px" height="20px" color="textSubtle" />
+            </HelpIconWrapper>
+          </Flex>
+          <BalanceWithLoading
+            value={usdValueStaked}
+            fontSize="12px"
+            color="textSubtle"
+            decimals={2}
+            prefix="~"
+            unit=" USD"
+          />
+        </Box>
+        <Box>
+          <Text color="textSubtle" textTransform="uppercase" bold fontSize="12px">
+            {t('Unlocks In')}
+          </Text>
+          <Flex>
+            <Text color={position >= VaultPosition.LockedEnd ? '#D67E0A' : 'text'} bold fontSize="16px">
+              {position >= VaultPosition.LockedEnd ? t('Unlocked') : remainingTime}
+            </Text>
+            {tagTooltipVisibleOfBurn && tagTooltipOfBurn}
+            <span ref={tagTargetRefOfBurn}>
+              <HelpIcon ml="4px" mt="2px" width="20px" height="20px" color="textSubtle" />
+            </span>
+          </Flex>
+          <Text color={position >= VaultPosition.LockedEnd ? '#D67E0A' : 'text'} fontSize="12px">
+            {t('On %date%', { date: lockEndDate })}
+          </Text>
+        </Box>
+      </Flex>
+      <Box mb="16px">
+        <LockedActions
+          userShares={userData?.userShares}
+          locked={userData?.locked}
+          lockEndTime={userData?.lockEndTime}
+          lockStartTime={userData?.lockStartTime}
+          stakingToken={stakingToken}
+          stakingTokenBalance={stakingTokenBalance}
+          stakingTokenPrice={pool?.stakingTokenPrice}
+          lockedAmount={currentLockedAmountAsBigNumber}
+          variant={buttonVariant}
+        />
+      </Box>
+    </Box>
+  )
+}
+
+export default LockedStaking
diff --git a/apps/web/src/views/Pools/components/LockedPool/LockedStakingApy.tsx b/apps/web/src/views/Pools/components/LockedPool/LockedStakingApy.tsx
index 7218a95117929..fed750e6450e2 100644
--- a/apps/web/src/views/Pools/components/LockedPool/LockedStakingApy.tsx
+++ b/apps/web/src/views/Pools/components/LockedPool/LockedStakingApy.tsx
@@ -1,8 +1,6 @@
-import styled from 'styled-components'
 import { useMemo, memo } from 'react'
 import { getVaultPosition, VaultPosition } from 'utils/cakePool'
-
-import { Flex, Text, Box, TooltipText, useTooltip, HelpIcon, BalanceWithLoading, Pool } from '@pancakeswap/uikit'
+import { Flex, Text, TooltipText, useTooltip, BalanceWithLoading, Pool } from '@pancakeswap/uikit'
 import { LightGreyCard } from 'components/Card'
 import { useTranslation } from '@pancakeswap/localization'
 import { useVaultApy } from 'hooks/useVaultApy'
@@ -11,7 +9,6 @@ import { Token } from '@pancakeswap/sdk'
 import isUndefinedOrNull from '@pancakeswap/utils/isUndefinedOrNull'
 import { getBalanceNumber, getFullDisplayBalance } from '@pancakeswap/utils/formatBalance'
 import BurningCountDown from './Common/BurningCountDown'
-import LockedActions from './Common/LockedActions'
 import YieldBoostRow from './Common/YieldBoostRow'
 import LockDurationRow from './Common/LockDurationRow'
 import IfoCakeRow from './Common/IfoCakeRow'
@@ -19,11 +16,7 @@ import useUserDataInVaultPresenter from './hooks/useUserDataInVaultPresenter'
 import { LockedStakingApyPropsType } from './types'
 import LockedAprTooltipContent from './Common/LockedAprTooltipContent'
 import AutoEarningsBreakdown from '../AutoEarningsBreakdown'
-import OriginalLockedInfo from '../OriginalLockedInfo'
-
-const HelpIconWrapper = styled.div`
-  align-self: center;
-`
+import LockedStaking from './LockedStaking'
 
 interface LockedStakingApyProps extends LockedStakingApyPropsType {
   showICake?: boolean
@@ -48,26 +41,7 @@ const LockedStakingApy: React.FC<React.PropsWithChildren<LockedStakingApyProps>>
     [userData],
   )
 
-  const stakingToken = pool?.stakingToken
-  const stakingTokenPrice = pool?.stakingTokenPrice
-  const stakingTokenBalance = pool?.userData?.stakingTokenBalance
-
-  const currentLockedAmountAsBigNumber = userData?.balance?.cakeAsBigNumber
-
-  const currentLockedAmount = useMemo(
-    () => getBalanceNumber(currentLockedAmountAsBigNumber),
-    [currentLockedAmountAsBigNumber],
-  )
-
-  const usdValueStaked = useMemo(
-    () =>
-      stakingToken && stakingTokenPrice
-        ? getBalanceNumber(currentLockedAmountAsBigNumber.multipliedBy(stakingTokenPrice), stakingToken?.decimals)
-        : null,
-    [currentLockedAmountAsBigNumber, stakingTokenPrice, stakingToken],
-  )
-
-  const { weekDuration, lockEndDate, secondDuration, remainingTime, burnStartTime } = useUserDataInVaultPresenter({
+  const { weekDuration, secondDuration } = useUserDataInVaultPresenter({
     lockStartTime: userData?.lockStartTime,
     lockEndTime: userData?.lockEndTime,
     burnStartTime: userData?.burnStartTime,
@@ -77,8 +51,8 @@ const LockedStakingApy: React.FC<React.PropsWithChildren<LockedStakingApyProps>>
 
   // earningTokenBalance includes overdue fee if any
   const earningTokenBalance = useMemo(() => {
-    return getBalanceNumber(currentLockedAmountAsBigNumber.minus(userData?.cakeAtLastUserAction))
-  }, [currentLockedAmountAsBigNumber, userData?.cakeAtLastUserAction])
+    return getBalanceNumber(userData?.balance?.cakeAsBigNumber.minus(userData?.cakeAtLastUserAction))
+  }, [userData?.balance?.cakeAsBigNumber, userData?.cakeAtLastUserAction])
 
   const boostedYieldAmount = useMemo(() => {
     return getFullDisplayBalance(userData?.cakeAtLastUserAction, 18, 5)
@@ -87,28 +61,8 @@ const LockedStakingApy: React.FC<React.PropsWithChildren<LockedStakingApyProps>>
   const tooltipContent = <LockedAprTooltipContent boostedYieldAmount={boostedYieldAmount} />
   const { targetRef, tooltip, tooltipVisible } = useTooltip(tooltipContent, { placement: 'bottom-start' })
 
-  const tooltipContentOfBurn = t(
-    'After Burning starts at %burnStartTime%. You need to renew your fix-term position, to initiate a new lock or convert your staking position to flexible before it starts. Otherwise all the rewards will be burned within the next 90 days.',
-    { burnStartTime },
-  )
-  const {
-    targetRef: tagTargetRefOfBurn,
-    tooltip: tagTooltipOfBurn,
-    tooltipVisible: tagTooltipVisibleOfBurn,
-  } = useTooltip(tooltipContentOfBurn, {
-    placement: 'bottom',
-  })
-
   const originalLockedAmount = getBalanceNumber(userData?.lockedAmount)
 
-  const {
-    targetRef: tagTargetRefOfLocked,
-    tooltip: tagTooltipOfLocked,
-    tooltipVisible: tagTooltipVisibleOfLocked,
-  } = useTooltip(<OriginalLockedInfo pool={pool} />, {
-    placement: 'bottom',
-  })
-
   const {
     targetRef: tagTargetRefOfRecentProfit,
     tooltip: tagTooltipOfRecentProfit,
@@ -119,57 +73,7 @@ const LockedStakingApy: React.FC<React.PropsWithChildren<LockedStakingApyProps>>
 
   return (
     <LightGreyCard>
-      <Flex justifyContent="space-between" mb="16px">
-        <Box>
-          <Text color="textSubtle" textTransform="uppercase" bold fontSize="12px">
-            {t('CAKE locked')}
-          </Text>
-          <Flex>
-            <BalanceWithLoading color="text" bold fontSize="16px" value={currentLockedAmount} decimals={5} />
-            {tagTooltipVisibleOfLocked && tagTooltipOfLocked}
-            <HelpIconWrapper ref={tagTargetRefOfLocked}>
-              <HelpIcon ml="4px" mt="2px" width="20px" height="20px" color="textSubtle" />
-            </HelpIconWrapper>
-          </Flex>
-          <BalanceWithLoading
-            value={usdValueStaked}
-            fontSize="12px"
-            color="textSubtle"
-            decimals={2}
-            prefix="~"
-            unit=" USD"
-          />
-        </Box>
-        <Box>
-          <Text color="textSubtle" textTransform="uppercase" bold fontSize="12px">
-            {t('Unlocks In')}
-          </Text>
-          <Flex>
-            <Text color={position >= VaultPosition.LockedEnd ? '#D67E0A' : 'text'} bold fontSize="16px">
-              {position >= VaultPosition.LockedEnd ? t('Unlocked') : remainingTime}
-            </Text>
-            {tagTooltipVisibleOfBurn && tagTooltipOfBurn}
-            <span ref={tagTargetRefOfBurn}>
-              <HelpIcon ml="4px" mt="2px" width="20px" height="20px" color="textSubtle" />
-            </span>
-          </Flex>
-          <Text color={position >= VaultPosition.LockedEnd ? '#D67E0A' : 'text'} fontSize="12px">
-            {t('On %date%', { date: lockEndDate })}
-          </Text>
-        </Box>
-      </Flex>
-      <Box mb="16px">
-        <LockedActions
-          userShares={userData?.userShares}
-          locked={userData?.locked}
-          lockEndTime={userData?.lockEndTime}
-          lockStartTime={userData?.lockStartTime}
-          stakingToken={stakingToken}
-          stakingTokenBalance={stakingTokenBalance}
-          stakingTokenPrice={pool?.stakingTokenPrice}
-          lockedAmount={currentLockedAmountAsBigNumber}
-        />
-      </Box>
+      <LockedStaking pool={pool} userData={userData} />
       <Divider />
       {![VaultPosition.LockedEnd, VaultPosition.AfterBurning].includes(position) && (
         <Flex alignItems="center" justifyContent="space-between">
diff --git a/apps/web/src/views/Pools/components/PoolsTable/ActionPanel/AutoHarvest.tsx b/apps/web/src/views/Pools/components/PoolsTable/ActionPanel/AutoHarvest.tsx
index b36cd089ec251..d22d48b418fcb 100644
--- a/apps/web/src/views/Pools/components/PoolsTable/ActionPanel/AutoHarvest.tsx
+++ b/apps/web/src/views/Pools/components/PoolsTable/ActionPanel/AutoHarvest.tsx
@@ -10,6 +10,8 @@ import {
   Pool,
   useTooltip,
   HelpIcon,
+  Button,
+  useModal,
 } from '@pancakeswap/uikit'
 import { useAccount } from 'wagmi'
 import { getCakeVaultEarnings } from 'views/Pools/helpers'
@@ -19,6 +21,8 @@ import { VaultKey, DeserializedLockedCakeVault } from 'state/types'
 import { getVaultPosition, VaultPosition } from 'utils/cakePool'
 import { useVaultApy } from 'hooks/useVaultApy'
 import { Token } from '@pancakeswap/sdk'
+import BenefitsModal from 'views/Pools/components/RevenueSharing/BenefitsModal'
+import useVCake from 'views/Pools/hooks/useVCake'
 
 import { ActionContainer, ActionTitles, ActionContent, RowActionContainer } from './styles'
 import UnstakingFeeCountdownRow from '../../CakeVaultCard/UnstakingFeeCountdownRow'
@@ -36,6 +40,7 @@ interface AutoHarvestActionProps {
 const AutoHarvestAction: React.FunctionComponent<React.PropsWithChildren<AutoHarvestActionProps>> = ({ pool }) => {
   const { t } = useTranslation()
   const { address: account } = useAccount()
+  const { isInitialization } = useVCake()
   const { isMobile } = useMatchBreakpoints()
 
   const { earningTokenPrice, vaultKey, userDataLoaded } = pool
@@ -76,6 +81,13 @@ const AutoHarvestAction: React.FunctionComponent<React.PropsWithChildren<AutoHar
     placement: 'bottom',
   })
 
+  const [onPresentViewBenefitsModal] = useModal(
+    <BenefitsModal pool={pool} userData={(vaultData as DeserializedLockedCakeVault)?.userData} />,
+    true,
+    false,
+    'revenueModal',
+  )
+
   const actionTitle = (
     <Text fontSize="12px" bold color="secondary" as="span" textTransform="uppercase">
       {t('Recent CAKE profit')}
@@ -105,76 +117,85 @@ const AutoHarvestAction: React.FunctionComponent<React.PropsWithChildren<AutoHar
   }
 
   return (
-    <RowActionContainer justifyContent="space-between">
-      <Box width="100%">
-        <ActionTitles>{actionTitle}</ActionTitles>
-        <ActionContent>
-          <Flex flex="1" flexDirection="column" alignSelf="flex-start">
-            <>
-              {hasAutoEarnings ? (
-                <>
-                  <Flex>
-                    <BalanceWithLoading lineHeight="1" bold fontSize="20px" decimals={5} value={autoCakeToDisplay} />
-                    {tagTooltipVisibleOfRecentProfit && tagTooltipOfRecentProfit}
-                    <HelpIconWrapper ref={tagTargetRefOfRecentProfit}>
-                      <HelpIcon ml="4px" color="textSubtle" />
-                    </HelpIconWrapper>
-                  </Flex>
-                  {Number.isFinite(earningTokenPrice) && earningTokenPrice > 0 && (
-                    <BalanceWithLoading
-                      display="inline"
-                      fontSize="12px"
-                      color="textSubtle"
-                      decimals={2}
-                      prefix="~"
-                      value={autoUsdToDisplay}
-                      unit=" USD"
-                    />
-                  )}
-                </>
-              ) : (
-                <>
-                  <Heading color="textDisabled">0</Heading>
-                  <Text fontSize="12px" color="textDisabled">
-                    0 USD
-                  </Text>
-                </>
-              )}
-            </>
-          </Flex>
-          <Flex flex="1.3" flexDirection="column" alignSelf="flex-start" alignItems="flex-start">
-            {[VaultPosition.Flexible, VaultPosition.None].includes(vaultPosition) && (
-              <UnstakingFeeCountdownRow vaultKey={vaultKey} isTableVariant />
-            )}
-            {/* IFO credit here */}
-          </Flex>
-        </ActionContent>
-      </Box>
-      {!isMobile && vaultKey === VaultKey.CakeVault && (vaultData as DeserializedLockedCakeVault).userData.locked && (
-        <Box minWidth="123px">
-          <ActionTitles>
-            <Text fontSize="12px" bold color="secondary" as="span" textTransform="uppercase">
-              {t('Yield boost')}
-            </Text>
-          </ActionTitles>
+    <RowActionContainer style={{ flexDirection: 'column' }}>
+      <Flex justifyContent="space-between">
+        <Box width="100%">
+          <ActionTitles>{actionTitle}</ActionTitles>
           <ActionContent>
             <Flex flex="1" flexDirection="column" alignSelf="flex-start">
-              <BalanceWithLoading
-                color="text"
-                lineHeight="1"
-                bold
-                fontSize="20px"
-                value={boostFactor ? boostFactor?.toString() : '0'}
-                decimals={2}
-                unit="x"
-              />
-              <Text fontSize="12px" color="textSubtle">
-                {t('Lock for %duration%', { duration: weekDuration })}
-              </Text>
+              <>
+                {hasAutoEarnings ? (
+                  <>
+                    <Flex>
+                      <BalanceWithLoading lineHeight="1" bold fontSize="20px" decimals={5} value={autoCakeToDisplay} />
+                      {tagTooltipVisibleOfRecentProfit && tagTooltipOfRecentProfit}
+                      <HelpIconWrapper ref={tagTargetRefOfRecentProfit}>
+                        <HelpIcon ml="4px" color="textSubtle" />
+                      </HelpIconWrapper>
+                    </Flex>
+                    {Number.isFinite(earningTokenPrice) && earningTokenPrice > 0 && (
+                      <BalanceWithLoading
+                        display="inline"
+                        fontSize="12px"
+                        color="textSubtle"
+                        decimals={2}
+                        prefix="~"
+                        value={autoUsdToDisplay}
+                        unit=" USD"
+                      />
+                    )}
+                  </>
+                ) : (
+                  <>
+                    <Heading color="textDisabled">0</Heading>
+                    <Text fontSize="12px" color="textDisabled">
+                      0 USD
+                    </Text>
+                  </>
+                )}
+              </>
+            </Flex>
+            <Flex flex="1.3" flexDirection="column" alignSelf="flex-start" alignItems="flex-start">
+              {[VaultPosition.Flexible, VaultPosition.None].includes(vaultPosition) && (
+                <UnstakingFeeCountdownRow vaultKey={vaultKey} isTableVariant />
+              )}
             </Flex>
           </ActionContent>
         </Box>
-      )}
+        {!isMobile && vaultKey === VaultKey.CakeVault && (vaultData as DeserializedLockedCakeVault).userData.locked && (
+          <Box minWidth="123px">
+            <ActionTitles>
+              <Text fontSize="12px" bold color="secondary" as="span" textTransform="uppercase">
+                {t('Yield boost')}
+              </Text>
+            </ActionTitles>
+            <ActionContent>
+              <Flex flex="1" flexDirection="column" alignSelf="flex-start">
+                <BalanceWithLoading
+                  color="text"
+                  lineHeight="1"
+                  bold
+                  fontSize="20px"
+                  value={boostFactor ? boostFactor?.toString() : '0'}
+                  decimals={2}
+                  unit="x"
+                />
+                <Text fontSize="12px" color="textSubtle">
+                  {t('Lock for %duration%', { duration: weekDuration })}
+                </Text>
+              </Flex>
+            </ActionContent>
+          </Box>
+        )}
+      </Flex>
+      {vaultKey === VaultKey.CakeVault &&
+        (vaultData as DeserializedLockedCakeVault).userData.locked &&
+        vaultPosition === VaultPosition.Locked &&
+        isInitialization && (
+          <Button mt="16px" width="100%" variant="secondary" onClick={onPresentViewBenefitsModal}>
+            {t('View Benefits')}
+          </Button>
+        )}
     </RowActionContainer>
   )
 }
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsText.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsText.tsx
new file mode 100644
index 0000000000000..64b320d9b9d8a
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsText.tsx
@@ -0,0 +1,28 @@
+import { ReactElement } from 'react'
+import { Flex, Text } from '@pancakeswap/uikit'
+import BenefitsTooltipsText from 'views/Pools/components/RevenueSharing/BenefitsModal/BenefitsTooltipsText'
+
+interface BenefitsTextProps {
+  title: string
+  value: string
+  icon: ReactElement
+  tooltipComponent?: ReactElement
+}
+
+const BenefitsText: React.FC<React.PropsWithChildren<BenefitsTextProps>> = ({
+  title,
+  value,
+  icon,
+  tooltipComponent,
+}) => {
+  return (
+    <Flex mt="8px" flexDirection="row" alignItems="center">
+      <Flex mr="auto">
+        <BenefitsTooltipsText title={title} icon={icon} tooltipComponent={tooltipComponent} />
+      </Flex>
+      <Text bold>{value}</Text>
+    </Flex>
+  )
+}
+
+export default BenefitsText
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsTooltipsText.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsTooltipsText.tsx
new file mode 100644
index 0000000000000..15867d0eef6b6
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/BenefitsTooltipsText.tsx
@@ -0,0 +1,35 @@
+import { ReactElement } from 'react'
+import { Flex, TooltipText, useTooltip, useMatchBreakpoints } from '@pancakeswap/uikit'
+
+interface BenefitsTooltipsTextProps {
+  title: string
+  icon?: ReactElement
+  tooltipComponent?: ReactElement
+}
+
+const BenefitsTooltipsText: React.FC<React.PropsWithChildren<BenefitsTooltipsTextProps>> = ({
+  title,
+  icon,
+  tooltipComponent,
+}) => {
+  const { isMobile } = useMatchBreakpoints()
+
+  const { targetRef, tooltipVisible, tooltip } = useTooltip(<>{tooltipComponent}</>, {
+    placement: 'bottom',
+    ...(isMobile && { hideTimeout: 2000 }),
+  })
+
+  return (
+    <>
+      <Flex ref={targetRef} mr="auto">
+        {icon}
+        <TooltipText color="textSubtle" fontSize="14px">
+          {title}
+        </TooltipText>
+      </Flex>
+      {tooltipVisible && tooltip}
+    </>
+  )
+}
+
+export default BenefitsTooltipsText
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/ClaimButton.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/ClaimButton.tsx
new file mode 100644
index 0000000000000..adf5fd8b987cd
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/ClaimButton.tsx
@@ -0,0 +1,53 @@
+import { useCallback, useMemo } from 'react'
+import BigNumber from 'bignumber.js'
+import { useTranslation } from '@pancakeswap/localization'
+import { Button, useToast } from '@pancakeswap/uikit'
+import useCatchTxError from 'hooks/useCatchTxError'
+import { useRevenueSharingPoolContract } from 'hooks/useContract'
+import { ToastDescriptionWithTx } from 'components/Toast'
+import useAccountActiveChain from 'hooks/useAccountActiveChain'
+
+interface ClaimButtonProps {
+  availableClaim: string
+  onDismiss?: () => void
+}
+
+const ClaimButton: React.FunctionComponent<React.PropsWithChildren<ClaimButtonProps>> = ({
+  availableClaim,
+  onDismiss,
+}) => {
+  const { t } = useTranslation()
+  const { toastSuccess } = useToast()
+  const { chainId, account } = useAccountActiveChain()
+  const contract = useRevenueSharingPoolContract({ chainId })
+  const { fetchWithCatchTxError, loading: isPending } = useCatchTxError()
+
+  const isReady = useMemo(() => new BigNumber(availableClaim).gt(0) && !isPending, [availableClaim, isPending])
+
+  const handleClaim = useCallback(async () => {
+    try {
+      const receipt = await fetchWithCatchTxError(() => contract.write.claim([account], { account, chainId }))
+
+      if (receipt?.status) {
+        toastSuccess(
+          t('Success!'),
+          <ToastDescriptionWithTx txHash={receipt.transactionHash}>
+            {t('You have successfully claimed your rewards.')}
+          </ToastDescriptionWithTx>,
+        )
+
+        onDismiss?.()
+      }
+    } catch (error) {
+      console.error('[ERROR] Submit Revenue Claim Button', error)
+    }
+  }, [account, chainId, contract, fetchWithCatchTxError, onDismiss, t, toastSuccess])
+
+  return (
+    <Button mt="24px" width="100%" variant="subtle" disabled={!isReady} onClick={handleClaim}>
+      {t('Claim')}
+    </Button>
+  )
+}
+
+export default ClaimButton
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/LockedBenefits.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/LockedBenefits.tsx
new file mode 100644
index 0000000000000..a2766b1aaf5ff
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/LockedBenefits.tsx
@@ -0,0 +1,113 @@
+import { useMemo } from 'react'
+import { useTranslation } from '@pancakeswap/localization'
+import { Box, Flex, Text, Card, ICakeIcon, BCakeIcon, VCakeIcon, NextLinkFromReactRouter } from '@pancakeswap/uikit'
+import Image from 'next/image'
+import BigNumber from 'bignumber.js'
+import BenefitsText from 'views/Pools/components/RevenueSharing/BenefitsModal/BenefitsText'
+import useCakeBenefits from 'components/Menu/UserMenu/hooks/useCakeBenefits'
+import { useVaultApy } from 'hooks/useVaultApy'
+import { VaultKey, DeserializedLockedCakeVault } from 'state/types'
+import { useVaultPoolByKey } from 'state/pools/hooks'
+import useUserDataInVaultPresenter from 'views/Pools/components/LockedPool/hooks/useUserDataInVaultPresenter'
+
+const LockedBenefits = () => {
+  const { t } = useTranslation()
+  const { data: cakeBenefits } = useCakeBenefits()
+  const { getLockedApy, getBoostFactor } = useVaultApy()
+  const { userData } = useVaultPoolByKey(VaultKey.CakeVault) as DeserializedLockedCakeVault
+  const { secondDuration } = useUserDataInVaultPresenter({
+    lockStartTime: userData?.lockStartTime ?? '0',
+    lockEndTime: userData?.lockEndTime ?? '0',
+  })
+
+  const lockedApy = useMemo(() => getLockedApy(secondDuration), [getLockedApy, secondDuration])
+  const boostFactor = useMemo(() => getBoostFactor(secondDuration), [getBoostFactor, secondDuration])
+  const delApy = useMemo(() => new BigNumber(lockedApy).div(boostFactor).toNumber(), [lockedApy, boostFactor])
+
+  const iCakeTooltipComponent = () => (
+    <>
+      <Text>
+        {t('iCAKE allows you to participate in the IFO public sales and commit up to %iCake% amount of CAKE.', {
+          iCake: cakeBenefits?.iCake,
+        })}
+      </Text>
+      <NextLinkFromReactRouter to="/ifo">
+        <Text bold color="primary">
+          {t('Learn More')}
+        </Text>
+      </NextLinkFromReactRouter>
+    </>
+  )
+
+  const bCakeTooltipComponent = () => (
+    <>
+      <Text>{t('bCAKE allows you to boost your yield in PancakeSwap Farms by up to 2x.')}</Text>
+      <NextLinkFromReactRouter to="/farms">
+        <Text bold color="primary">
+          {t('Learn More')}
+        </Text>
+      </NextLinkFromReactRouter>
+    </>
+  )
+
+  const vCakeTooltipComponent = () => (
+    <>
+      <Text>
+        {t('vCAKE boosts your voting power to %totalScore% in the PancakeSwap voting governance.', {
+          totalScore: cakeBenefits?.vCake?.totalScore,
+        })}
+      </Text>
+      <NextLinkFromReactRouter to="/voting">
+        <Text bold color="primary">
+          {t('Learn More')}
+        </Text>
+      </NextLinkFromReactRouter>
+    </>
+  )
+
+  return (
+    <Box position="relative">
+      <Box position="absolute" right="20px" top="-55px" zIndex={1}>
+        <Image width={73} height={84} alt="lockCAKEbenefit" src="/images/pool/lockCAKEbenefit.png" />
+      </Box>
+      <Card mb="24px">
+        <Box padding={16}>
+          <Text fontSize={12} bold color="secondary" textTransform="uppercase">
+            {t('locked benefits')}
+          </Text>
+          <Box mt="8px">
+            <Flex mt="8px" flexDirection="row" alignItems="center">
+              <Text color="textSubtle" fontSize="14px" mr="auto">
+                {t('CAKE Yield')}
+              </Text>
+              <Text style={{ display: 'inline-block' }} color="success" bold>
+                {`${Number(lockedApy).toFixed(2)}%`}
+              </Text>
+              <Text ml="2px" as="del" bold>{`${Number(delApy).toFixed(2)}%`}</Text>
+            </Flex>
+            <BenefitsText
+              title="iCAKE"
+              value={cakeBenefits?.iCake}
+              tooltipComponent={iCakeTooltipComponent()}
+              icon={<ICakeIcon width={24} height={24} mr="8px" />}
+            />
+            <BenefitsText
+              title="bCAKE"
+              value={t('Up to %boostMultiplier%x', { boostMultiplier: 2 })}
+              tooltipComponent={bCakeTooltipComponent()}
+              icon={<BCakeIcon width={24} height={24} mr="8px" />}
+            />
+            <BenefitsText
+              title="vCAKE"
+              value={cakeBenefits?.vCake?.vaultScore}
+              tooltipComponent={vCakeTooltipComponent()}
+              icon={<VCakeIcon width={24} height={24} mr="8px" />}
+            />
+          </Box>
+        </Box>
+      </Card>
+    </Box>
+  )
+}
+
+export default LockedBenefits
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/RevenueSharing.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/RevenueSharing.tsx
new file mode 100644
index 0000000000000..bc61e9a879d80
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/RevenueSharing.tsx
@@ -0,0 +1,194 @@
+import { useMemo } from 'react'
+import BigNumber from 'bignumber.js'
+import { useTranslation } from '@pancakeswap/localization'
+import { usePriceCakeUSD } from 'state/farms/hooks'
+import {
+  Box,
+  Flex,
+  Text,
+  Card,
+  LinkExternal,
+  Message,
+  MessageText,
+  WarningIcon,
+  Balance,
+  NextLinkFromReactRouter,
+} from '@pancakeswap/uikit'
+import { ONE_WEEK_DEFAULT } from '@pancakeswap/pools'
+import { useVaultPoolByKey } from 'state/pools/hooks'
+import { timeFormat } from 'views/TradingReward/utils/timeFormat'
+import useRevenueSharingPool from 'views/Pools/hooks/useRevenueSharingPool'
+import { getBalanceAmount } from '@pancakeswap/utils/formatBalance'
+import { distanceToNowStrict } from 'utils/timeHelper'
+import { VaultKey, DeserializedLockedCakeVault } from 'state/types'
+import ClaimButton from 'views/Pools/components/RevenueSharing/BenefitsModal/ClaimButton'
+import BenefitsTooltipsText from 'views/Pools/components/RevenueSharing/BenefitsModal/BenefitsTooltipsText'
+
+interface RevenueSharingProps {
+  onDismiss?: () => void
+}
+
+const RevenueSharing: React.FunctionComponent<React.PropsWithChildren<RevenueSharingProps>> = ({ onDismiss }) => {
+  const {
+    t,
+    currentLanguage: { locale },
+  } = useTranslation()
+  const cakePriceBusd = usePriceCakeUSD()
+  const { userData } = useVaultPoolByKey(VaultKey.CakeVault) as DeserializedLockedCakeVault
+
+  const { balanceOfAt, totalSupplyAt, nextDistributionTimestamp, lastTokenTimestamp, availableClaim } =
+    useRevenueSharingPool()
+  const yourShare = useMemo(() => getBalanceAmount(new BigNumber(balanceOfAt)).toNumber(), [balanceOfAt])
+  const yourSharePercentage = useMemo(
+    () => new BigNumber(balanceOfAt).div(totalSupplyAt).times(100).toNumber() || 0,
+    [balanceOfAt, totalSupplyAt],
+  )
+
+  const availableCake = useMemo(() => getBalanceAmount(new BigNumber(availableClaim)).toNumber(), [availableClaim])
+  const availableCakeUsdValue = useMemo(
+    () => new BigNumber(availableCake).times(cakePriceBusd).toNumber(),
+    [availableCake, cakePriceBusd],
+  )
+
+  const showExpireSoonWarning = useMemo(() => {
+    const endTime = new BigNumber(nextDistributionTimestamp).plus(ONE_WEEK_DEFAULT)
+    return new BigNumber(userData?.lockEndTime ?? '0').lt(endTime)
+  }, [nextDistributionTimestamp, userData?.lockEndTime])
+
+  const showNoCakeAmountWarning = useMemo(
+    () => new BigNumber(userData?.lockedAmount ?? '0').lte(0),
+    [userData?.lockedAmount],
+  )
+
+  return (
+    <Card isActive mb={['24px', '24px', '24px', '0']}>
+      <Box padding={16}>
+        <Text fontSize={12} bold color="secondary" textTransform="uppercase">
+          {t('revenue sharing')}
+        </Text>
+        <Box mt="8px">
+          <Flex mt="8px" flexDirection="row" alignItems="center">
+            <BenefitsTooltipsText
+              title={t('Your shares')}
+              tooltipComponent={
+                <>
+                  <Text>
+                    {t('The virtual shares you currently own and the % against the whole revenue sharing pool.')}
+                  </Text>
+                  <Text m="4px 0">
+                    {t(
+                      'Please note that after locking or updating, your shares will only update upon revenue distributions.',
+                    )}
+                  </Text>
+                  <NextLinkFromReactRouter
+                    target="_blank"
+                    to="https://docs.pancakeswap.finance/products/revenue-sharing/faq#50b7c683-feb0-47f6-809f-39c1a0976bb5"
+                  >
+                    <Text bold color="primary">
+                      {t('Learn More')}
+                    </Text>
+                  </NextLinkFromReactRouter>
+                </>
+              }
+            />
+            <Box>
+              {yourShare === 0 ? (
+                <Text bold color="failure">
+                  0
+                </Text>
+              ) : (
+                <>
+                  {yourShare <= 0.01 ? (
+                    <Text as="span" bold>{`< 0.01`}</Text>
+                  ) : (
+                    <Balance display="inline-block" bold value={yourShare} decimals={2} />
+                  )}
+                  {yourSharePercentage <= 0.01 ? (
+                    <Text as="span" ml="4px">{`(< 0.01%)`}</Text>
+                  ) : (
+                    <Balance
+                      display="inline-block"
+                      prefix="("
+                      unit="%)"
+                      ml="4px"
+                      value={yourSharePercentage}
+                      decimals={2}
+                    />
+                  )}
+                </>
+              )}
+            </Box>
+          </Flex>
+
+          <Flex mt="8px" flexDirection="row" alignItems="center">
+            <BenefitsTooltipsText
+              title={t('Next distribution')}
+              tooltipComponent={
+                <Text>{t('Time remaining until the next revenue distribution and share updates.')}</Text>
+              }
+            />
+            <Text color={showExpireSoonWarning ? 'failure' : 'text'} bold>
+              {t('in %day%', { day: distanceToNowStrict(nextDistributionTimestamp * 1000) })}
+            </Text>
+          </Flex>
+          {showExpireSoonWarning && (
+            <Message variant="danger" padding="8px" mt="8px" icon={<WarningIcon color="failure" />}>
+              <MessageText lineHeight="120%">
+                <Text fontSize="14px" color="failure">
+                  {t(
+                    'Your fixed-term staking position will have less than 1 week in remaining duration upon the next distribution.',
+                  )}
+                </Text>
+                <Text fontSize="14px" color="failure" mt="4px">
+                  {t('Extend your stakings to receive shares in the next distribution.')}
+                </Text>
+              </MessageText>
+            </Message>
+          )}
+
+          <Flex mt="8px" flexDirection="row" alignItems="center">
+            <BenefitsTooltipsText
+              title={t('Last distribution')}
+              tooltipComponent={<Text>{t('The time of the last revenue distribution and shares update.')}</Text>}
+            />
+            <Text bold>{timeFormat(locale, lastTokenTimestamp)}</Text>
+          </Flex>
+
+          <Flex mt="8px" flexDirection="row" alignItems="center">
+            <BenefitsTooltipsText
+              title={t('Available for claiming')}
+              tooltipComponent={<Text>{t('Amount of revenue available for claiming in CAKE.')}</Text>}
+            />
+            <Box>
+              <Balance unit=" CAKE" bold value={availableCake} decimals={2} />
+              <Balance
+                ml="4px"
+                color="textSubtle"
+                fontSize={12}
+                textAlign="right"
+                lineHeight="110%"
+                prefix="(~ $"
+                unit=")"
+                value={availableCakeUsdValue}
+                decimals={2}
+              />
+            </Box>
+          </Flex>
+        </Box>
+        {showNoCakeAmountWarning && (
+          <Message variant="danger" padding="8px" mt="8px" icon={<WarningIcon color="failure" />}>
+            <MessageText lineHeight="120%">
+              {t('You need to update your staking in order to start earning from protocol revenue sharing.')}
+            </MessageText>
+          </Message>
+        )}
+        <ClaimButton availableClaim={availableClaim} onDismiss={onDismiss} />
+        <LinkExternal external m="8px auto auto auto" href="https://docs.pancakeswap.finance/products/revenue-sharing">
+          {t('Learn More')}
+        </LinkExternal>
+      </Box>
+    </Card>
+  )
+}
+
+export default RevenueSharing
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/SharingPoolNameCell.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/SharingPoolNameCell.tsx
new file mode 100644
index 0000000000000..0e0a3c1e35e50
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/SharingPoolNameCell.tsx
@@ -0,0 +1,57 @@
+import { useMemo } from 'react'
+import { useTranslation } from '@pancakeswap/localization'
+import { Text, Flex, LogoRoundIcon, Box, Balance, Pool } from '@pancakeswap/uikit'
+import { getBalanceNumber } from '@pancakeswap/utils/formatBalance'
+import { useVaultPoolByKey, usePoolsWithVault } from 'state/pools/hooks'
+import { VaultKey, DeserializedLockedCakeVault } from 'state/types'
+import { Token } from '@pancakeswap/sdk'
+
+const SharingPoolNameCell = () => {
+  const { t } = useTranslation()
+  const { userData } = useVaultPoolByKey(VaultKey.CakeVault) as DeserializedLockedCakeVault
+  const { pools } = usePoolsWithVault()
+
+  const cakePool = useMemo(
+    () => pools.find((pool) => pool.userData && pool.sousId === 0),
+    [pools],
+  ) as Pool.DeserializedPool<Token>
+  const stakingToken = cakePool?.stakingToken
+  const stakingTokenPrice = cakePool?.stakingTokenPrice
+
+  const currentLockedAmountNumber = useMemo(
+    () => userData?.balance?.cakeAsNumberBalance,
+    [userData?.balance?.cakeAsNumberBalance],
+  )
+
+  const usdValueStaked = useMemo(
+    () =>
+      stakingToken && stakingTokenPrice
+        ? getBalanceNumber(userData?.balance?.cakeAsBigNumber.multipliedBy(stakingTokenPrice), stakingToken?.decimals)
+        : null,
+    [userData?.balance?.cakeAsBigNumber, stakingTokenPrice, stakingToken],
+  )
+
+  return (
+    <Flex mb="16px">
+      <LogoRoundIcon mr="8px" width={43} height={43} style={{ minWidth: 43 }} />
+      <Box>
+        <Text fontSize={12} color="secondary" bold lineHeight="110%" textTransform="uppercase">
+          {t('CAKE locked')}
+        </Text>
+        <Balance bold decimals={2} fontSize={20} lineHeight="110%" value={currentLockedAmountNumber} />
+        <Balance
+          bold
+          prefix="~ "
+          decimals={2}
+          fontSize={12}
+          fontWeight={400}
+          lineHeight="110%"
+          color="textSubtle"
+          value={usdValueStaked}
+        />
+      </Box>
+    </Flex>
+  )
+}
+
+export default SharingPoolNameCell
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/index.tsx b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/index.tsx
new file mode 100644
index 0000000000000..e6fe95d08b8fa
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/BenefitsModal/index.tsx
@@ -0,0 +1,99 @@
+import styled from 'styled-components'
+import { useTranslation } from '@pancakeswap/localization'
+import { AtomBox } from '@pancakeswap/ui'
+import {
+  ModalContainer,
+  ModalCloseButton,
+  Text,
+  RowBetween,
+  ModalBody,
+  Flex,
+  ModalActions,
+  AutoColumn,
+  Pool,
+} from '@pancakeswap/uikit'
+import { useAccount } from 'wagmi'
+import LockedBenefits from 'views/Pools/components/RevenueSharing/BenefitsModal/LockedBenefits'
+import RevenueSharing from 'views/Pools/components/RevenueSharing/BenefitsModal/RevenueSharing'
+import SharingPoolNameCell from 'views/Pools/components/RevenueSharing/BenefitsModal/SharingPoolNameCell'
+import { Token } from '@pancakeswap/sdk'
+import LockedActions from 'views/Pools/components/LockedPool/Common/LockedActions'
+import { DeserializedLockedVaultUser } from 'state/types'
+
+const Container = styled(ModalContainer)`
+  width: 100%;
+  overflow: hidden;
+  max-height: 90vh;
+
+  ${({ theme }) => theme.mediaQueries.md} {
+    width: 375px;
+  }
+`
+
+const ScrollableContainer = styled(Flex)`
+  flex-direction: column;
+  height: auto;
+  ${({ theme }) => theme.mediaQueries.xs} {
+    max-height: 100vh;
+  }
+  ${({ theme }) => theme.mediaQueries.md} {
+    max-height: none;
+  }
+`
+
+interface BenefitsModalProps {
+  pool: Pool.DeserializedPool<Token>
+  userData: DeserializedLockedVaultUser
+  onDismiss?: () => void
+}
+
+const BenefitsModal: React.FunctionComponent<React.PropsWithChildren<BenefitsModalProps>> = ({
+  pool,
+  userData,
+  onDismiss,
+}) => {
+  const { t } = useTranslation()
+
+  useAccount({
+    onConnect: ({ connector }) => {
+      connector?.addListener('change', () => onDismiss?.())
+    },
+    onDisconnect: () => onDismiss?.(),
+  })
+
+  return (
+    <Container>
+      <AtomBox bg="gradientBubblegum" py="24px">
+        <RowBetween flexWrap="nowrap" px="24px">
+          <Text fontSize={20} bold>
+            {t('Locked CAKE Benefits')}
+          </Text>
+          <ModalCloseButton onDismiss={onDismiss} />
+        </RowBetween>
+        <ModalBody mt="16px" width="100%" style={{ maxHeight: 'calc(100vh - 260px)' }}>
+          <ScrollableContainer px="24px">
+            <SharingPoolNameCell />
+            <LockedBenefits />
+            <RevenueSharing onDismiss={onDismiss} />
+          </ScrollableContainer>
+        </ModalBody>
+        <AutoColumn px="24px" gap="16px">
+          <ModalActions>
+            <LockedActions
+              userShares={userData?.userShares}
+              locked={userData?.locked}
+              lockEndTime={userData?.lockEndTime}
+              lockStartTime={userData?.lockStartTime}
+              stakingToken={pool?.stakingToken}
+              stakingTokenPrice={pool?.stakingTokenPrice}
+              stakingTokenBalance={pool?.userData?.stakingTokenBalance}
+              lockedAmount={userData?.balance?.cakeAsBigNumber}
+            />
+          </ModalActions>
+        </AutoColumn>
+      </AtomBox>
+    </Container>
+  )
+}
+
+export default BenefitsModal
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/JoinButton.tsx b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/JoinButton.tsx
new file mode 100644
index 0000000000000..6a09bea50ef8d
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/JoinButton.tsx
@@ -0,0 +1,47 @@
+import { useCallback } from 'react'
+import { Button, useToast } from '@pancakeswap/uikit'
+import { useTranslation } from '@pancakeswap/localization'
+import useCatchTxError from 'hooks/useCatchTxError'
+import { useVCakeContract } from 'hooks/useContract'
+import { ToastDescriptionWithTx } from 'components/Toast'
+import useAccountActiveChain from 'hooks/useAccountActiveChain'
+
+interface JoinButtonProps {
+  refresh?: () => void
+  onDismiss?: () => void
+}
+
+const JoinButton: React.FunctionComponent<React.PropsWithChildren<JoinButtonProps>> = ({ refresh, onDismiss }) => {
+  const { t } = useTranslation()
+  const { toastSuccess } = useToast()
+  const { chainId } = useAccountActiveChain()
+  const vCakeContract = useVCakeContract({ chainId })
+  const { fetchWithCatchTxError, loading: isPending } = useCatchTxError()
+
+  const handleJoinButton = useCallback(async () => {
+    try {
+      const receipt = await fetchWithCatchTxError(() => vCakeContract.write.syncFromCakePool([]))
+
+      if (receipt?.status) {
+        toastSuccess(
+          t('Success!'),
+          <ToastDescriptionWithTx txHash={receipt.transactionHash}>
+            {t('Joined Revenue Sharing Pool.')}
+          </ToastDescriptionWithTx>,
+        )
+        await refresh?.()
+        onDismiss?.()
+      }
+    } catch (error) {
+      console.error('[ERROR] Submit vCake syncFromCakePool', error)
+    }
+  }, [fetchWithCatchTxError, onDismiss, refresh, t, toastSuccess, vCakeContract.write])
+
+  return (
+    <Button width="100%" m="24px 0 8px 0" disabled={isPending} onClick={handleJoinButton}>
+      {t('Update Staking Position')}
+    </Button>
+  )
+}
+
+export default JoinButton
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/VCakeModal.tsx b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/VCakeModal.tsx
new file mode 100644
index 0000000000000..74d699c3e2176
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/VCakeModal.tsx
@@ -0,0 +1,48 @@
+import { useEffect, useState } from 'react'
+import { ModalV2 } from '@pancakeswap/uikit'
+import { ChainId } from '@pancakeswap/sdk'
+import { useAccount } from 'wagmi'
+import useAccountActiveChain from 'hooks/useAccountActiveChain'
+import useVCake from 'views/Pools/hooks/useVCake'
+import JoinRevenueModal from 'views/Pools/components/RevenueSharing/JoinRevenueModal'
+import useCakeBenefits from 'components/Menu/UserMenu/hooks/useCakeBenefits'
+import { VaultPosition } from 'utils/cakePool'
+import { FetchStatus } from 'config/constants/types'
+
+const VCakeModal = () => {
+  const { account, chainId } = useAccountActiveChain()
+  const { isInitialization, refresh } = useVCake()
+  const [open, setOpen] = useState(false)
+  const { data: cakeBenefits, status: cakeBenefitsFetchStatus } = useCakeBenefits()
+
+  useEffect(() => {
+    if (
+      account &&
+      chainId === ChainId.BSC &&
+      isInitialization === false &&
+      cakeBenefitsFetchStatus === FetchStatus.Fetched &&
+      cakeBenefits?.lockPosition === VaultPosition.Locked
+    ) {
+      setOpen(true)
+    }
+  }, [account, cakeBenefits?.lockPosition, cakeBenefitsFetchStatus, chainId, isInitialization])
+
+  useAccount({
+    onConnect: ({ connector }) => {
+      connector?.addListener('change', () => closeModal())
+    },
+    onDisconnect: () => closeModal(),
+  })
+
+  const closeModal = () => {
+    setOpen(false)
+  }
+
+  return (
+    <ModalV2 isOpen={open} onDismiss={() => closeModal()}>
+      <JoinRevenueModal refresh={refresh} onDismiss={() => closeModal()} />
+    </ModalV2>
+  )
+}
+
+export default VCakeModal
diff --git a/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/index.tsx b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/index.tsx
new file mode 100644
index 0000000000000..ae201f877d11a
--- /dev/null
+++ b/apps/web/src/views/Pools/components/RevenueSharing/JoinRevenueModal/index.tsx
@@ -0,0 +1,126 @@
+import { useMemo } from 'react'
+import styled from 'styled-components'
+import { Modal, Text, Card, Flex, Box, LinkExternal, useMatchBreakpoints, Pool } from '@pancakeswap/uikit'
+import Image from 'next/image'
+import useTheme from 'hooks/useTheme'
+import { Token } from '@pancakeswap/sdk'
+import { useTranslation } from '@pancakeswap/localization'
+import JoinButton from 'views/Pools/components/RevenueSharing/JoinRevenueModal/JoinButton'
+import { useVaultPoolByKey, usePoolsWithVault } from 'state/pools/hooks'
+import { VaultKey, DeserializedLockedCakeVault } from 'state/types'
+import LockedStaking from 'views/Pools/components/LockedPool/LockedStaking'
+
+interface JoinRevenueModalProps {
+  refresh?: () => void
+  onDismiss?: () => void
+}
+
+const TooltipContainer = styled(Box)`
+  position: relative;
+  padding: 16px;
+  max-width: 264px;
+  margin: 0 0 10px 10px;
+  height: fit-content;
+  border-radius: 16px;
+  background-color: ${({ theme }) => (theme.isDark ? '#FFFFFF' : '#27262c')};
+
+  ${Text} {
+    color: ${({ theme }) => (theme.isDark ? '#280D5F' : '#F4EEFF')};
+  }
+
+  &:before {
+    content: '';
+    position: absolute;
+    bottom: 25%;
+    right: -6px;
+    width: 0;
+    height: 0;
+    border-top: 10px solid transparent;
+    border-bottom: 10px solid transparent;
+    border-left: ${({ theme }) => (theme.isDark ? '10px solid #FFFFFF' : '10px solid #27262c')};
+  }
+
+  ${({ theme }) => theme.mediaQueries.sm} {
+    margin: 0 0 0 10px;
+  }
+`
+
+const InlineLink = styled(LinkExternal)`
+  display: inline-flex;
+  margin: 0 4px;
+
+  svg {
+    width: 16px;
+  }
+`
+
+const JoinRevenueModal: React.FunctionComponent<React.PropsWithChildren<JoinRevenueModalProps>> = ({
+  refresh,
+  onDismiss,
+}) => {
+  const { t } = useTranslation()
+  const { theme } = useTheme()
+  const { isMobile } = useMatchBreakpoints()
+
+  const { pools } = usePoolsWithVault()
+  const cakePool = useMemo(
+    () => pools.find((pool) => pool.userData && pool.sousId === 0),
+    [pools],
+  ) as Pool.DeserializedPool<Token>
+
+  const vaultPool = useVaultPoolByKey(VaultKey.CakeVault) as DeserializedLockedCakeVault
+
+  return (
+    <Modal
+      title={t('Join revenue sharing')}
+      width={['100%', '100%', '100%', '454px']}
+      headerBackground={theme.colors.gradientCardHeader}
+      onDismiss={onDismiss}
+    >
+      <Box padding="0 13px">
+        <Flex position="relative" zIndex="1" bottom="-5px" m={['auto', 'auto', 'auto', '0 0 0 auto']}>
+          <TooltipContainer>
+            <Text fontSize={['14px', '14px', '14px', '16px']} lineHeight="110%">
+              {
+                'Update your CAKE staking position to join the revenue sharing program for weekly revenue sharing distributions! '
+              }
+            </Text>
+          </TooltipContainer>
+          <Image
+            alt="lockCakeTooltip"
+            width={isMobile ? 100 : 122}
+            height={isMobile ? 100 : 122}
+            style={{
+              marginTop: 'auto',
+              maxWidth: isMobile ? '100px' : '122px',
+              maxHeight: isMobile ? '100px' : '122px',
+            }}
+            src="/images/pool/lockcaketooltip.png"
+          />
+        </Flex>
+        {!vaultPool?.userData?.isLoading && (
+          <Card>
+            <Box padding="16px 16px 0 16px">
+              <LockedStaking buttonVariant="secondary" pool={cakePool} userData={vaultPool?.userData} />
+            </Box>
+          </Card>
+        )}
+        <JoinButton refresh={refresh} onDismiss={onDismiss} />
+        <Box>
+          <Text as="span" fontSize={12} color="textSubtle">
+            {t('Once updated, you need to wait a full distribution cycle to start claiming rewards.')}
+          </Text>
+          <InlineLink
+            fontSize={12}
+            href="https://docs.pancakeswap.finance/products/revenue-sharing/faq#cae64522-4729-43a2-8fa8-6bbd2567dcea"
+            external
+          >
+            {t('Learn More')}
+          </InlineLink>
+        </Box>
+      </Box>
+    </Modal>
+  )
+}
+
+export default JoinRevenueModal
diff --git a/apps/web/src/views/Pools/hooks/useRevenueSharingPool.ts b/apps/web/src/views/Pools/hooks/useRevenueSharingPool.ts
new file mode 100644
index 0000000000000..8c64237b83cb1
--- /dev/null
+++ b/apps/web/src/views/Pools/hooks/useRevenueSharingPool.ts
@@ -0,0 +1,87 @@
+import useSWR from 'swr'
+import useAccountActiveChain from 'hooks/useAccountActiveChain'
+import { publicClient } from 'utils/wagmi'
+import { useRevenueSharingPoolContract } from 'hooks/useContract'
+import { getRevenueSharingPoolAddress } from 'utils/addressHelpers'
+import { Address } from 'viem'
+import { revenueSharingPoolABI } from 'config/abi/revenueSharingPool'
+import { ONE_WEEK_DEFAULT } from '@pancakeswap/pools'
+import BigNumber from 'bignumber.js'
+import { useInitialBlockTimestamp } from 'state/block/hooks'
+
+interface RevenueSharingPool {
+  balanceOfAt: string
+  totalSupplyAt: string
+  nextDistributionTimestamp: number
+  lastTokenTimestamp: number
+  availableClaim: string
+}
+
+const initialData: RevenueSharingPool = {
+  balanceOfAt: '0',
+  totalSupplyAt: '0',
+  nextDistributionTimestamp: 0,
+  lastTokenTimestamp: 0,
+  availableClaim: '0',
+}
+
+const useRevenueSharingPool = (): RevenueSharingPool => {
+  const { account, chainId } = useAccountActiveChain()
+  const contract = useRevenueSharingPoolContract({ chainId })
+  const contractAddress = getRevenueSharingPoolAddress(chainId)
+  const blockTimestamp = useInitialBlockTimestamp()
+
+  const { data } = useSWR(account && chainId && ['/revenue-sharing-pool', account, chainId], async () => {
+    try {
+      const now = Math.floor(blockTimestamp / ONE_WEEK_DEFAULT) * ONE_WEEK_DEFAULT
+      const revenueCalls = [
+        {
+          functionName: 'balanceOfAt',
+          address: contractAddress as Address,
+          abi: revenueSharingPoolABI,
+          args: [account, now],
+        },
+        {
+          functionName: 'totalSupplyAt',
+          address: contractAddress as Address,
+          abi: revenueSharingPoolABI,
+          args: [now],
+        },
+        {
+          functionName: 'lastTokenTimestamp',
+          address: contractAddress as Address,
+          abi: revenueSharingPoolABI,
+          args: [],
+        },
+      ]
+
+      const client = publicClient({ chainId })
+      const [revenueResult, claimResult] = await Promise.all([
+        client.multicall({
+          contracts: revenueCalls,
+          allowFailure: true,
+        }),
+        contract.simulate.claim([account]),
+      ])
+
+      const nextDistributionTimestamp = new BigNumber(revenueResult[2].result.toString())
+        .plus(ONE_WEEK_DEFAULT)
+        .toNumber()
+
+      return {
+        balanceOfAt: revenueResult[0].result.toString(),
+        totalSupplyAt: revenueResult[1].result.toString(),
+        nextDistributionTimestamp,
+        lastTokenTimestamp: Number(revenueResult[2].result.toString()),
+        availableClaim: claimResult.result.toString(),
+      }
+    } catch (error) {
+      console.error('[ERROR] Fetching Revenue Sharing Pool', error)
+      return initialData
+    }
+  })
+
+  return data ?? initialData
+}
+
+export default useRevenueSharingPool
diff --git a/apps/web/src/views/Pools/hooks/useVCake.tsx b/apps/web/src/views/Pools/hooks/useVCake.tsx
new file mode 100644
index 0000000000000..f3c328debb00b
--- /dev/null
+++ b/apps/web/src/views/Pools/hooks/useVCake.tsx
@@ -0,0 +1,34 @@
+import useSWR from 'swr'
+import { ChainId } from '@pancakeswap/sdk'
+import useAccountActiveChain from 'hooks/useAccountActiveChain'
+import { useVCakeContract } from 'hooks/useContract'
+
+interface UseVCake {
+  isInitialization: null | boolean
+  refresh: () => void
+}
+
+const useVCake = (): UseVCake => {
+  const { account, chainId } = useAccountActiveChain()
+  const vCakeContract = useVCakeContract({ chainId })
+
+  const { data, mutate } = useSWR(
+    account && chainId === ChainId.BSC && ['/v-cake-initialization', account, chainId],
+    async () => {
+      try {
+        const initialization = await vCakeContract.read.initialization([account])
+        return initialization
+      } catch (error) {
+        console.error('[ERROR] Fetching vCake initialization', error)
+        return null
+      }
+    },
+  )
+
+  return {
+    isInitialization: data,
+    refresh: mutate,
+  }
+}
+
+export default useVCake
diff --git a/apps/web/src/views/Pools/index.tsx b/apps/web/src/views/Pools/index.tsx
index f61235e2c0163..a566ff938d289 100644
--- a/apps/web/src/views/Pools/index.tsx
+++ b/apps/web/src/views/Pools/index.tsx
@@ -10,6 +10,7 @@ import { ChainId, Token } from '@pancakeswap/sdk'
 import { TokenPairImage } from 'components/TokenImage'
 import { useActiveChainId } from 'hooks/useActiveChainId'
 import { V3SubgraphHealthIndicator } from 'components/SubgraphHealthIndicator'
+import VCakeModal from 'views/Pools/components/RevenueSharing/JoinRevenueModal/VCakeModal'
 
 import CardActions from './components/PoolCard/CardActions'
 import AprRow from './components/PoolCard/AprRow'
@@ -46,6 +47,7 @@ const Pools: React.FC<React.PropsWithChildren> = () => {
 
   return (
     <>
+      <VCakeModal />
       <PageHeader>
         <Flex justifyContent="space-between" flexDirection={['column', null, null, 'row']}>
           <Flex flex="1" flexDirection="column" mr={['8px', 0]}>
diff --git a/packages/localization/src/config/translations.json b/packages/localization/src/config/translations.json
index 73a13f9fb89df..f5a296adf07ba 100644
--- a/packages/localization/src/config/translations.json
+++ b/packages/localization/src/config/translations.json
@@ -2613,5 +2613,26 @@
   "Swap and Provide Liquidity on zkSync Era Now": "Swap and Provide Liquidity on zkSync Era Now",
   "PancakeSwap Now Live on zkSync Era!": "PancakeSwap Now Live on zkSync Era!",
   "Zksync Lormips LIVE!": "Zksync Lormips LIVE!",
-  "Claim Your NFT": "Claim Your NFT"
+  "Claim Your NFT": "Claim Your NFT",
+  "View Benefits": "View Benefits",
+  "locked benefits": "locked benefits",
+  "CAKE Yield": "CAKE Yield",
+  "revenue sharing": "revenue sharing",
+  "Your shares": "Your shares",
+  "Next distribution": "Next distribution",
+  "in %day%": "in %day%",
+  "Last distribution": "Last distribution",
+  "You need to update your staking in order to start earning from protocol revenue sharing.": "You need to update your staking in order to start earning from protocol revenue sharing.",
+  "Locked CAKE Benefits": "Locked CAKE Benefits",
+  "Joined Revenue Sharing Pool.": "Joined Revenue Sharing Pool.",
+  "Update Staking Position": "Update Staking Position",
+  "Join revenue sharing": "Join revenue sharing",
+  "Once updated, you need to wait a full distribution cycle to start claiming rewards.": "Once updated, you need to wait a full distribution cycle to start claiming rewards.",
+  "The virtual shares you currently own and the % against the whole revenue sharing pool.": "The virtual shares you currently own and the % against the whole revenue sharing pool.",
+  "Please note that after locking or updating, your shares will only update upon revenue distributions.": "Please note that after locking or updating, your shares will only update upon revenue distributions.",
+  "Time remaining until the next revenue distribution and share updates.": "Time remaining until the next revenue distribution and share updates.",
+  "The time of the last revenue distribution and shares update.": "The time of the last revenue distribution and shares update.",
+  "Amount of revenue available for claiming in CAKE.": "Amount of revenue available for claiming in CAKE.",
+  "Extend your stakings to receive shares in the next distribution.": "Extend your stakings to receive shares in the next distribution.",
+  "Your fixed-term staking position will have less than 1 week in remaining duration upon the next distribution.": "Your fixed-term staking position will have less than 1 week in remaining duration upon the next distribution."
 }
diff --git a/packages/uikit/src/components/Svg/Icons/BCake.tsx b/packages/uikit/src/components/Svg/Icons/BCake.tsx
new file mode 100644
index 0000000000000..9331488c5982a
--- /dev/null
+++ b/packages/uikit/src/components/Svg/Icons/BCake.tsx
@@ -0,0 +1,26 @@
+import React from "react";
+import { useTheme } from "styled-components";
+import Svg from "../Svg";
+import { SvgProps } from "../types";
+
+const Icon: React.FC<React.PropsWithChildren<SvgProps>> = (props) => {
+  const theme = useTheme();
+  const primaryColor = theme.isDark ? "#372F47" : "#EEEAF4";
+  const secondaryColor = theme.isDark ? "#B8ADD2" : "#7A6EAA";
+
+  return (
+    <Svg viewBox="0 0 24 24" {...props}>
+      <circle cx="12" cy="12" r="12" fill={primaryColor} />
+      <path
+        d="M12.9023 18.5358C12.5947 18.79 12.1475 18.6559 11.9912 18.2889L11.2409 16.5267C12.2516 16.1535 13.198 15.6516 14.0736 15.066C14.0736 15.066 14.3143 16.4198 14.0159 17.1971C13.8234 17.6983 13.317 18.1932 12.9023 18.5358ZM7.46821 12.7559L5.71151 12.0087C5.34217 11.8516 5.2091 11.4009 5.46753 11.0939C5.8131 10.6833 6.30926 10.1845 6.80856 9.99345C7.58256 9.69734 8.92963 9.92466 8.92963 9.92466C8.34377 10.7998 7.84161 11.7457 7.46821 12.7559ZM17.7497 6.25043C17.7497 6.25043 14.5629 4.88562 10.919 8.52832C9.50905 9.93753 8.66567 11.4883 8.11844 12.846C7.93818 13.3286 8.0605 13.8563 8.41459 14.2166L9.78589 15.5808C10.14 15.9411 10.6679 16.057 11.1507 15.8768C12.7722 15.2589 14.2444 14.3049 15.4706 13.0777C19.1145 9.43562 17.7497 6.25043 17.7497 6.25043ZM13.198 10.7998C12.6959 10.2979 12.6959 9.48066 13.198 8.97875C13.7002 8.47684 14.5178 8.47684 15.02 8.97875C15.5157 9.48066 15.5221 10.2979 15.02 10.7998C14.5178 11.3017 13.7002 11.3017 13.198 10.7998Z"
+        fill={secondaryColor}
+      />
+      <path
+        d="M8.02787 14.9887C7.7864 14.7473 7.45181 14.5904 7.12483 14.6888C6.37557 14.9144 5.82983 15.6094 5.82983 16.4318L5.82983 18.2517H7.65074C8.47355 18.2517 9.1689 17.7063 9.39456 16.9574C9.49304 16.6306 9.336 16.2962 9.09453 16.0548L8.02787 14.9887Z"
+        fill={secondaryColor}
+      />
+    </Svg>
+  );
+};
+
+export default Icon;
diff --git a/packages/uikit/src/components/Svg/Icons/ICake.tsx b/packages/uikit/src/components/Svg/Icons/ICake.tsx
new file mode 100644
index 0000000000000..4fa35d6859275
--- /dev/null
+++ b/packages/uikit/src/components/Svg/Icons/ICake.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+import { useTheme } from "styled-components";
+import Svg from "../Svg";
+import { SvgProps } from "../types";
+
+const Icon: React.FC<React.PropsWithChildren<SvgProps>> = (props) => {
+  const theme = useTheme();
+  const primaryColor = theme.isDark ? "#372F47" : "#EEEAF4";
+  const secondaryColor = theme.isDark ? "#B8ADD2" : "#7A6EAA";
+
+  return (
+    <Svg viewBox="0 0 24 24" {...props}>
+      <circle cx="12" cy="12" r="12" fill={primaryColor} />
+      <g clipPath="url(#clip0_42_1080)">
+        <path
+          d="M18.6 9.92667L17.9 7.01333C17.7533 6.41333 17.2333 6 16.6267 6H15.1533H13.8133H12.6667H11.3333H10.1867H8.84H7.36667C6.76667 6 6.24 6.42 6.1 7.01333L5.4 9.92667C5.24 10.6067 5.38667 11.3 5.81334 11.8467C5.86667 11.92 5.94 11.9733 6 12.04V16.6667C6 17.4 6.6 18 7.33334 18H16.6667C17.4 18 18 17.4 18 16.6667V12.04C18.06 11.98 18.1333 11.92 18.1867 11.8533C18.6133 11.3067 18.7667 10.6067 18.6 9.92667ZM8.68 7.33333L8.29334 10.5733C8.24 11.0067 7.89334 11.3333 7.48667 11.3333C7.16 11.3333 6.95334 11.14 6.86667 11.02C6.69334 10.8 6.63334 10.5133 6.7 10.24L7.36667 7.33333H8.68ZM16.6067 7.32667L17.3067 10.24C17.3733 10.52 17.3133 10.8 17.14 11.02C17.0467 11.14 16.8467 11.3333 16.5133 11.3333C16.1067 11.3333 15.7533 11.0067 15.7067 10.5733L15.32 7.33333L16.6067 7.32667ZM14.34 10.3467C14.3733 10.6067 14.2933 10.8667 14.12 11.06C13.9667 11.2333 13.7533 11.3333 13.48 11.3333C13.0333 11.3333 12.6667 10.94 12.6667 10.46V7.33333H13.9733L14.34 10.3467ZM11.3333 10.46C11.3333 10.94 10.9667 11.3333 10.4733 11.3333C10.2467 11.3333 10.04 11.2333 9.88 11.06C9.71334 10.8667 9.63334 10.6067 9.66 10.3467L10.0267 7.33333H11.3333V10.46ZM16 16.6667H8C7.63334 16.6667 7.33334 16.3667 7.33334 16V12.6467C7.38667 12.6533 7.43334 12.6667 7.48667 12.6667C8.06667 12.6667 8.59334 12.4267 8.98 12.0333C9.38 12.4333 9.91334 12.6667 10.52 12.6667C11.1 12.6667 11.62 12.4267 12.0067 12.0467C12.4 12.4267 12.9333 12.6667 13.5333 12.6667C14.0933 12.6667 14.6267 12.4333 15.0267 12.0333C15.4133 12.4267 15.94 12.6667 16.52 12.6667C16.5733 12.6667 16.62 12.6533 16.6733 12.6467V16C16.6667 16.3667 16.3667 16.6667 16 16.6667Z"
+          fill={secondaryColor}
+        />
+      </g>
+    </Svg>
+  );
+};
+
+export default Icon;
diff --git a/packages/uikit/src/components/Svg/Icons/VCake.tsx b/packages/uikit/src/components/Svg/Icons/VCake.tsx
new file mode 100644
index 0000000000000..a0c5a7bd50cd8
--- /dev/null
+++ b/packages/uikit/src/components/Svg/Icons/VCake.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+import { useTheme } from "styled-components";
+import Svg from "../Svg";
+import { SvgProps } from "../types";
+
+const Icon: React.FC<React.PropsWithChildren<SvgProps>> = (props) => {
+  const theme = useTheme();
+  const primaryColor = theme.isDark ? "#372F47" : "#EEEAF4";
+  const secondaryColor = theme.isDark ? "#B8ADD2" : "#7A6EAA";
+
+  return (
+    <Svg viewBox="0 0 24 24" {...props}>
+      <circle cx="12" cy="12" r="12" fill={primaryColor} />
+      <g clipPath="url(#clip0_42_1099)">
+        <path
+          d="M11.56 14.0134C11.82 14.2734 12.24 14.2734 12.5 14.0134L16.74 9.77336C17 9.51336 17 9.09336 16.74 8.83336L13.44 5.53336C13.1867 5.26669 12.7667 5.26669 12.5067 5.52669L8.26 9.77336C8 10.0334 8 10.4534 8.26 10.7134L11.56 14.0134ZM12.9733 6.94003L15.3333 9.30003L12.0333 12.6L9.67333 10.24L12.9733 6.94003ZM17.6067 14.2734L16.1933 12.86C16.0733 12.74 15.9 12.6667 15.7267 12.6667H15.5467L14.2133 14H15.4867L16.6667 15.3334H7.33333L8.52 14H9.88667L8.55333 12.6667H8.27333C8.09333 12.6667 7.92667 12.74 7.8 12.86L6.38667 14.2734C6.14 14.5267 6 14.8667 6 15.22V17.3334C6 18.0667 6.6 18.6667 7.33333 18.6667H16.6667C17.4 18.6667 18 18.0734 18 17.3334V15.22C18 14.8667 17.86 14.5267 17.6067 14.2734Z"
+          fill={secondaryColor}
+        />
+      </g>
+    </Svg>
+  );
+};
+
+export default Icon;
diff --git a/packages/uikit/src/components/Svg/index.tsx b/packages/uikit/src/components/Svg/index.tsx
index 686ab74839729..3184f3d8b8b26 100644
--- a/packages/uikit/src/components/Svg/index.tsx
+++ b/packages/uikit/src/components/Svg/index.tsx
@@ -174,4 +174,7 @@ export { default as ZoomInIcon } from "./Icons/ZoomIn";
 export { default as ZoomOutIcon } from "./Icons/ZoomOut";
 export { default as EthChainIcon } from "./Icons/EthChain";
 export { default as PancakeProtectorIcon } from "./Icons/PancakeProtector";
+export { default as ICakeIcon } from "./Icons/ICake";
+export { default as BCakeIcon } from "./Icons/BCake";
+export { default as VCakeIcon } from "./Icons/VCake";
 export type { SvgProps } from "./types";