Fix warnings

src/App.js

@@ -3,11 +3,10 @@ import './App.less';
 import { ConnectionProvider } from './utils/connection';
 import { MarketProvider } from './utils/markets';
 import { WalletProvider } from './utils/wallet';
-import TradePage from './pages/TradePage';
-import BasicLayout from './components/BasicLayout';
 import { GlobalStyle } from './global_style';
 import { Spin } from 'antd';
 import ErrorBoundary from './components/ErrorBoundary';
+import { Routes } from './routes';
 
 export default function App() {
   return (
@@ -17,11 +16,9 @@ export default function App() {
         <ConnectionProvider>
           <MarketProvider>
             <WalletProvider>
-              <BasicLayout>
+              <Suspense fallback={() => <Spin size="large" />}>
-                <Suspense fallback={() => <Spin size="large" />}>
+                <Routes />
-                  <TradePage />
+              </Suspense>
-                </Suspense>
-              </BasicLayout>
             </WalletProvider>
           </MarketProvider>
         </ConnectionProvider>

src/pages/TradePage.jsx

@@ -8,7 +8,6 @@ import { useMarket, useMarketsList } from '../utils/markets';
 import TradeForm from '../components/TradeForm';
 import { useLocalStorageState } from '../utils/utils';
 import TradesTable from '../components/TradesTable';
-import { InfoCircleOutlined } from '@ant-design/icons';
 
 const { Option } = Select;
 
@@ -39,7 +38,6 @@ export default function TradePage() {
     'submittedPassword5',
     false,
   );
-  const [marketInfoVisible, setMarketInfoVisible] = useState(false);
   const [password, setPassword] = useState('password');
   const [dimensions, setDimensions] = useState({
     height: window.innerHeight,
@@ -107,10 +105,6 @@ export default function TradePage() {
       <Wrapper>
         <Row>
           <Col>
-            <InfoCircleOutlined
-              style={{ marginLeft: 12 }}
-              onClick={() => setMarketInfoVisible(true)}
-            />
             <Select
               bordered={false}
               onSelect={setMarketName}

src/routes.js

@@ -4,7 +4,7 @@ import OpenOrdersPage from './pages/OpenOrdersPage';
 import React from 'react';
 import { Layout } from 'antd';
 import TopBar from './components/TopBar';
-import CustomFooter from './components/Footer';
+import { CustomFooter } from './components/Footer';
 import BalancesPage from './pages/BalancesPage';
 
 const { Header, Content } = Layout;

src/utils/markets.js

@@ -731,11 +731,11 @@ export function useOpenOrderAccountBalancesForAllMarkets() {
           openOrdersAccount?.quoteTokenFree &&
           market.baseSplSizeToNumber(openOrdersAccount.quoteTokenFree);
         openOrderAccountBalances.push({
+          market: marketName,
           coin: baseCurrency,
           key: baseCurrency,
           orders: inOrdersBase,
           unsettled: unsettledBase,
-          market: market,
           openOrdersAccount: openOrdersAccount,
           baseCurrencyAccount: baseCurrencyAccounts && baseCurrencyAccounts[0],
           quoteCurrencyAccount:
@@ -747,7 +747,6 @@ export function useOpenOrderAccountBalancesForAllMarkets() {
           key: quoteCurrency,
           orders: inOrdersQuote,
           unsettled: unsettledQuote,
-          market: market,
           openOrdersAccount: openOrdersAccount,
           baseCurrencyAccount: baseCurrencyAccounts && baseCurrencyAccounts[0],
           quoteCurrencyAccount: