add back fee discounts table

components/FeeDiscountsTable.tsx

@@ -0,0 +1,40 @@
+import { percentFormat } from '../utils/index'
+import useSrmAccount from '../hooks/useSrmAccount'
+import { SRM_DECIMALS } from '@project-serum/serum/lib/token-instructions'
+
+const FeeDiscountsTable = () => {
+  const { totalSrm, rates } = useSrmAccount()
+
+  return (
+    <div
+      className={`flex flex-col items-center bg-th-bkg-1 py-6 mt-4 rounded-md`}
+    >
+      <div
+        className={`flex flex-col sm:flex-row justify-between text-th-fgd-4 text-center`}
+      >
+        <div className="px-4">
+          <div>Total SRM in Mango</div>
+          <div className="text-th-fgd-1 text-lg font-semibold">
+            {totalSrm.toLocaleString(undefined, {
+              maximumFractionDigits: SRM_DECIMALS,
+            })}
+          </div>
+        </div>
+        <div className="px-4 mt-4 sm:mt-0">
+          <div>Maker Fee</div>
+          <div className="text-th-fgd-1 text-lg font-semibold">
+            {rates ? percentFormat.format(rates.maker) : null}
+          </div>
+        </div>
+        <div className="px-4 mt-4 sm:mt-0">
+          <div>Taker Fee</div>
+          <div className="text-th-fgd-1 text-lg font-semibold">
+            {rates ? percentFormat.format(rates.taker) : null}
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default FeeDiscountsTable

components/UserInfo.tsx

@@ -3,8 +3,9 @@ import FloatingElement from './FloatingElement'
 import OpenOrdersTable from './OpenOrdersTable'
 import BalancesTable from './BalancesTable'
 import TradeHistoryTable from './TradeHistoryTable'
+import FeeDiscountsTable from './FeeDiscountsTable'
 
-const TABS = ['Open Orders', 'Balances', 'Trade History']
+const TABS = ['Open Orders', 'Balances', 'Trade History', 'Fee Discounts']
 
 const UserInfoTabs = ({ activeTab, setActiveTab }) => {
   const handleTabChange = (tabName) => {
@@ -63,6 +64,8 @@ const TabContent = ({ activeTab }) => {
       return <BalancesTable />
     case 'Trade History':
       return <TradeHistoryTable />
+    case 'Fee Discounts':
+      return <FeeDiscountsTable />
     default:
       return <OpenOrdersTable />
   }