feat(Network): added Kovan support

Author: zachdt

src/components/Wallet/Network.tsx

@@ -6,6 +6,13 @@ export interface NetworkProps {
 }
 
 export const Network: React.FC<NetworkProps> = ({ id }) => {
+  if (id === 42) {
+    return (
+      <StyledKovan>
+        <h4>Kovan</h4>
+      </StyledKovan>
+    )
+  }
   if (id === 3) {
     return (
       <StyledRopsten>
@@ -23,6 +30,11 @@ export const Network: React.FC<NetworkProps> = ({ id }) => {
   return null
 }
 
+const StyledKovan = styled.div`
+  align-items: center;
+  color: purple;
+`
+
 const StyledRink = styled.div`
   align-items: center;
   color: ${(props) => props.theme.color.orange[500]};

src/pages/liquidity/index.tsx

@@ -119,8 +119,13 @@ const Liquidity = ({ icons }) => {
       </>
     )
   }
-  if (!(chainId === 4 || chainId === 1) && active) {
-    return <Text>Switch to Rinkeby or Mainnet Networks</Text>
+  if (!(chainId === 42 || chainId === 4 || chainId === 1) && active) {
+    return (
+      <>
+        <Spacer />
+        <Text>Switch to Rinkeby, Kovan, or Mainnet Networks</Text>
+      </>
+    )
   }
   if (
     !MetaMaskOnboarding.isMetaMaskInstalled() ||

src/pages/markets/[...id].tsx

@@ -148,8 +148,13 @@ const Market = ({ market, data }) => {
       </>
     )
   }
-  if (!(chainId === 4 || chainId === 1) && active) {
-    return <Text>Switch to Rinkeby or Mainnet Networks</Text>
+  if (!(chainId === 42 || chainId === 4 || chainId === 1) && active) {
+    return (
+      <>
+        <Spacer />
+        <Text>Switch to Rinkeby, Kovan, or Mainnet Networks</Text>
+      </>
+    )
   }
   if (
     !MetaMaskOnboarding.isMetaMaskInstalled() ||