Refactor contexts out of components subdir

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@project-serum/swap-ui",
-  "version": "0.1.0-alpha.5",
+  "version": "0.1.0-alpha.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "homepage": ".",

src/swap/components/Info.tsx

@@ -8,10 +8,10 @@ import {
 import { Info } from "@material-ui/icons";
 import PopupState, { bindTrigger, bindPopover } from "material-ui-popup-state";
 import { PublicKey } from "@solana/web3.js";
-import { useTokenMap } from "./context/TokenList";
-import { useSwapContext, useSwapFair } from "./context/Swap";
-import { useMint } from "./context/Mint";
-import { useRoute, useMarketName, useFair } from "./context/Dex";
+import { useTokenMap } from "../context/TokenList";
+import { useSwapContext, useSwapFair } from "../context/Swap";
+import { useMint } from "../context/Mint";
+import { useRoute, useMarketName, useFair } from "../context/Dex";
 
 const useStyles = makeStyles((theme) => ({
   infoLabel: {

src/swap/components/Settings.tsx

@@ -30,11 +30,11 @@ import {
 import { ToggleButton } from "@material-ui/lab";
 import { SettingsOutlined as Settings, Close } from "@material-ui/icons";
 import PopupState, { bindTrigger, bindPopover } from "material-ui-popup-state";
-import { useSwapContext, useSwapFair } from "./context/Swap";
-import { useMarket, useOpenOrders, useDexContext } from "./context/Dex";
-import { useTokenMap } from "./context/TokenList";
-import { useMint } from "./context/Mint";
-import { useOwnedTokenAccount } from "./context/Token";
+import { useSwapContext, useSwapFair } from "../context/Swap";
+import { useMarket, useOpenOrders, useDexContext } from "../context/Dex";
+import { useTokenMap } from "../context/TokenList";
+import { useMint } from "../context/Mint";
+import { useOwnedTokenAccount } from "../context/Token";
 
 const useStyles = makeStyles((theme) => ({
   tab: {

src/swap/components/Swap.tsx

@@ -1,8 +1,6 @@
 import { useState } from "react";
 import { PublicKey } from "@solana/web3.js";
-import { TokenListContainer } from "@solana/spl-token-registry";
-import { BN, Provider } from "@project-serum/anchor";
-import { Swap as SwapClient } from "@project-serum/swap";
+import { BN } from "@project-serum/anchor";
 import {
   makeStyles,
   Card,
@@ -12,23 +10,21 @@ import {
   TextField,
 } from "@material-ui/core";
 import { ExpandMore } from "@material-ui/icons";
-import { SwapContextProvider, useSwapContext } from "./context/Swap";
+import { useSwapContext } from "../context/Swap";
 import {
-  DexContextProvider,
   useDexContext,
   useOpenOrders,
   useRouteVerbose,
   useMarket,
-} from "./context/Dex";
-import { MintContextProvider, useMint } from "./context/Mint";
+} from "../context/Dex";
+import { useMint } from "../context/Mint";
 import {
-  TokenListContextProvider,
   useTokenMap,
   useTokenListContext,
   SPL_REGISTRY_SOLLET_TAG,
   SPL_REGISTRY_WORM_TAG,
-} from "./context/TokenList";
-import { TokenContextProvider, useOwnedTokenAccount } from "./context/Token";
+} from "../context/TokenList";
+import { useOwnedTokenAccount } from "../context/Token";
 import TokenDialog from "./TokenDialog";
 import { SettingsButton } from "./Settings";
 import { InfoLabel } from "./Info";
@@ -61,45 +57,7 @@ const useStyles = makeStyles(() => ({
   },
 }));
 
-export default function Swap({
-  style,
-  provider,
-  tokenList,
-  fromMint,
-  toMint,
-  fromAmount,
-  toAmount,
-}: {
-  provider: Provider;
-  tokenList: TokenListContainer;
-  fromMint?: PublicKey;
-  toMint?: PublicKey;
-  fromAmount?: number;
-  toAmount?: number;
-  style?: any;
-}) {
-  const swapClient = new SwapClient(provider, tokenList);
-  return (
-    <TokenListContextProvider tokenList={tokenList}>
-      <MintContextProvider provider={provider}>
-        <TokenContextProvider provider={provider}>
-          <DexContextProvider swapClient={swapClient}>
-            <SwapContextProvider
-              fromMint={fromMint}
-              toMint={toMint}
-              fromAmount={fromAmount}
-              toAmount={toAmount}
-            >
-              <SwapCard style={style} />
-            </SwapContextProvider>
-          </DexContextProvider>
-        </TokenContextProvider>
-      </MintContextProvider>
-    </TokenListContextProvider>
-  );
-}
-
-function SwapCard({ style }: { style?: any }) {
+export default function SwapCard({ style }: { style?: any }) {
   const styles = useStyles();
   return (
     <div style={style}>

src/swap/components/TokenDialog.tsx

@@ -15,7 +15,7 @@ import {
   Tab,
 } from "@material-ui/core";
 import { TokenIcon } from "./Swap";
-import { useSwappableTokens } from "./context/TokenList";
+import { useSwappableTokens } from "../context/TokenList";
 
 const useStyles = makeStyles(() => ({
   dialogContent: {

src/swap/context/Dex.tsx

@@ -18,7 +18,7 @@ import {
   WORM_USDC_MARKET,
   WORM_USDT_MARKET,
   WORM_MARKET_BASE,
-} from "../../utils/pubkeys";
+} from "../utils/pubkeys";
 import { useTokenMap, useTokenListContext } from "./TokenList";
 import { fetchSolletInfo, requestWormholeSwapMarketIfNeeded } from "./Sollet";
 

src/swap/context/Swap.tsx

@@ -1,7 +1,7 @@
 import React, { useContext, useState } from "react";
 import * as assert from "assert";
 import { PublicKey } from "@solana/web3.js";
-import { SRM_MINT, USDC_MINT } from "../../utils/pubkeys";
+import { SRM_MINT, USDC_MINT } from "../utils/pubkeys";
 import { useFairRoute } from "./Dex";
 
 const DEFAULT_SLIPPAGE_PERCENT = 0.5;

src/swap/context/Token.tsx

@@ -1,7 +1,7 @@
 import React, { useContext, useState, useEffect } from "react";
 import { PublicKey } from "@solana/web3.js";
 import { AccountInfo as TokenAccount } from "@solana/spl-token";
-import { getOwnedTokenAccounts } from "../../utils/tokens";
+import { getOwnedTokenAccounts } from "../utils/tokens";
 
 const _TokenContext = React.createContext<TokenContext | null>(null);
 

src/swap/context/TokenList.tsx

@@ -1,6 +1,6 @@
 import React, { useContext, useMemo } from "react";
 import { TokenInfo } from "@solana/spl-token-registry";
-import { USDC_MINT, USDT_MINT } from "../../utils/pubkeys";
+import { USDC_MINT, USDT_MINT } from "../utils/pubkeys";
 
 type TokenListContext = {
   tokenMap: Map<string, TokenInfo>;

src/swap/index.ts

@@ -1,5 +0,0 @@
-// The swap module exports a single `Swap` component that can be embedded into
-// applications.
-
-import Swap from "./components/Swap";
-export default Swap;

src/swap/index.tsx

@@ -0,0 +1,50 @@
+import { PublicKey } from "@solana/web3.js";
+import { TokenListContainer } from "@solana/spl-token-registry";
+import { Provider } from "@project-serum/anchor";
+import { Swap as SwapClient } from "@project-serum/swap";
+import { SwapContextProvider } from "./context/Swap";
+import { DexContextProvider } from "./context/Dex";
+import { MintContextProvider } from "./context/Mint";
+import { TokenListContextProvider } from "./context/TokenList";
+import { TokenContextProvider } from "./context/Token";
+import SwapCard from "./components/Swap";
+
+// The swap module exports a single `Swap` component that can be embedded into
+// applications.
+export default function Swap({
+  style,
+  provider,
+  tokenList,
+  fromMint,
+  toMint,
+  fromAmount,
+  toAmount,
+}: {
+  provider: Provider;
+  tokenList: TokenListContainer;
+  fromMint?: PublicKey;
+  toMint?: PublicKey;
+  fromAmount?: number;
+  toAmount?: number;
+  style?: any;
+}) {
+  const swapClient = new SwapClient(provider, tokenList);
+  return (
+    <TokenListContextProvider tokenList={tokenList}>
+      <MintContextProvider provider={provider}>
+        <TokenContextProvider provider={provider}>
+          <DexContextProvider swapClient={swapClient}>
+            <SwapContextProvider
+              fromMint={fromMint}
+              toMint={toMint}
+              fromAmount={fromAmount}
+              toAmount={toAmount}
+            >
+              <SwapCard style={style} />
+            </SwapContextProvider>
+          </DexContextProvider>
+        </TokenContextProvider>
+      </MintContextProvider>
+    </TokenListContextProvider>
+  );
+}