diff --git a/.gitignore b/.gitignore
index ee5c9d833..a3032528b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -37,3 +37,6 @@ testem.log
 # System Files
 .DS_Store
 Thumbs.db
+
+.local.env
+.env.local
diff --git a/.prettierignore b/.prettierignore
index d0b804da2..eb82b9e9f 100644
--- a/.prettierignore
+++ b/.prettierignore
@@ -2,3 +2,4 @@
 
 /dist
 /coverage
+__generated__
diff --git a/apps/explorer-e2e/cypress.json b/apps/explorer-e2e/cypress.json
index bad6108fe..6f4e8dcc8 100644
--- a/apps/explorer-e2e/cypress.json
+++ b/apps/explorer-e2e/cypress.json
@@ -1,5 +1,5 @@
 {
-  "baseUrl": "http://localhost:4200",
+  "baseUrl": "http://localhost:3000",
   "projectId": "et4snf",
   "fileServerFolder": ".",
   "fixturesFolder": false,
diff --git a/apps/explorer/project.json b/apps/explorer/project.json
index e9a9d4566..c63274f86 100644
--- a/apps/explorer/project.json
+++ b/apps/explorer/project.json
@@ -40,6 +40,7 @@
     "serve": {
       "executor": "@nrwl/web:dev-server",
       "options": {
+        "port": 3000,
         "buildTarget": "explorer:build",
         "hmr": true
       },
@@ -65,16 +66,6 @@
         "passWithNoTests": true
       }
     },
-    "generate": {
-      "builder": "@nrwl/workspace:run-commands",
-      "options": {
-        "commands": [
-          {
-            "command": "npx apollo codegen:generate --config=apps/explorer/apollo.config.js --target=typescript --globalTypesFile=apps/explorer/src/__generated__/globalTypes.ts"
-          }
-        ]
-      }
-    },
     "build-netlify": {
       "builder": "@nrwl/workspace:run-commands",
       "options": {
diff --git a/apps/explorer/src/__generated__/globalTypes.ts b/apps/explorer/src/__generated__/globalTypes.ts
index 95fd90e8d..74aa66291 100644
--- a/apps/explorer/src/__generated__/globalTypes.ts
+++ b/apps/explorer/src/__generated__/globalTypes.ts
@@ -11,92 +11,92 @@
  * The various account types we have (used by collateral)
  */
 export enum AccountType {
-  Bond = 'Bond',
-  FeeInfrastructure = 'FeeInfrastructure',
-  FeeLiquidity = 'FeeLiquidity',
-  General = 'General',
-  GlobalInsurance = 'GlobalInsurance',
-  Insurance = 'Insurance',
-  LockWithdraw = 'LockWithdraw',
-  Margin = 'Margin',
-  Settlement = 'Settlement',
+  Bond = "Bond",
+  FeeInfrastructure = "FeeInfrastructure",
+  FeeLiquidity = "FeeLiquidity",
+  General = "General",
+  GlobalInsurance = "GlobalInsurance",
+  Insurance = "Insurance",
+  LockWithdraw = "LockWithdraw",
+  Margin = "Margin",
+  Settlement = "Settlement",
 }
 
 export enum AuctionTrigger {
-  Batch = 'Batch',
-  Liquidity = 'Liquidity',
-  Opening = 'Opening',
-  Price = 'Price',
-  Unspecified = 'Unspecified',
+  Batch = "Batch",
+  Liquidity = "Liquidity",
+  Opening = "Opening",
+  Price = "Price",
+  Unspecified = "Unspecified",
 }
 
 /**
  * The current state of a market
  */
 export enum MarketState {
-  Active = 'Active',
-  Cancelled = 'Cancelled',
-  Closed = 'Closed',
-  Pending = 'Pending',
-  Proposed = 'Proposed',
-  Rejected = 'Rejected',
-  Settled = 'Settled',
-  Suspended = 'Suspended',
-  TradingTerminated = 'TradingTerminated',
+  Active = "Active",
+  Cancelled = "Cancelled",
+  Closed = "Closed",
+  Pending = "Pending",
+  Proposed = "Proposed",
+  Rejected = "Rejected",
+  Settled = "Settled",
+  Suspended = "Suspended",
+  TradingTerminated = "TradingTerminated",
 }
 
 /**
  * What market trading mode are we in
  */
 export enum MarketTradingMode {
-  BatchAuction = 'BatchAuction',
-  Continuous = 'Continuous',
-  MonitoringAuction = 'MonitoringAuction',
-  OpeningAuction = 'OpeningAuction',
+  BatchAuction = "BatchAuction",
+  Continuous = "Continuous",
+  MonitoringAuction = "MonitoringAuction",
+  OpeningAuction = "OpeningAuction",
 }
 
 export enum NodeStatus {
-  NonValidator = 'NonValidator',
-  Validator = 'Validator',
+  NonValidator = "NonValidator",
+  Validator = "Validator",
 }
 
 /**
  * Reason for the proposal being rejected by the core node
  */
 export enum ProposalRejectionReason {
-  CloseTimeTooLate = 'CloseTimeTooLate',
-  CloseTimeTooSoon = 'CloseTimeTooSoon',
-  CouldNotInstantiateMarket = 'CouldNotInstantiateMarket',
-  EnactTimeTooLate = 'EnactTimeTooLate',
-  EnactTimeTooSoon = 'EnactTimeTooSoon',
-  IncompatibleTimestamps = 'IncompatibleTimestamps',
-  InsufficientTokens = 'InsufficientTokens',
-  InvalidAsset = 'InvalidAsset',
-  InvalidAssetDetails = 'InvalidAssetDetails',
-  InvalidFeeAmount = 'InvalidFeeAmount',
-  InvalidFutureMaturityTimestamp = 'InvalidFutureMaturityTimestamp',
-  InvalidFutureProduct = 'InvalidFutureProduct',
-  InvalidInstrumentSecurity = 'InvalidInstrumentSecurity',
-  InvalidRiskParameter = 'InvalidRiskParameter',
-  InvalidShape = 'InvalidShape',
-  MajorityThresholdNotReached = 'MajorityThresholdNotReached',
-  MarketMissingLiquidityCommitment = 'MarketMissingLiquidityCommitment',
-  MissingBuiltinAssetField = 'MissingBuiltinAssetField',
-  MissingCommitmentAmount = 'MissingCommitmentAmount',
-  MissingERC20ContractAddress = 'MissingERC20ContractAddress',
-  NetworkParameterInvalidKey = 'NetworkParameterInvalidKey',
-  NetworkParameterInvalidValue = 'NetworkParameterInvalidValue',
-  NetworkParameterValidationFailed = 'NetworkParameterValidationFailed',
-  NoProduct = 'NoProduct',
-  NoRiskParameters = 'NoRiskParameters',
-  NoTradingMode = 'NoTradingMode',
-  NodeValidationFailed = 'NodeValidationFailed',
-  OpeningAuctionDurationTooLarge = 'OpeningAuctionDurationTooLarge',
-  OpeningAuctionDurationTooSmall = 'OpeningAuctionDurationTooSmall',
-  ParticipationThresholdNotReached = 'ParticipationThresholdNotReached',
-  ProductMaturityIsPassed = 'ProductMaturityIsPassed',
-  UnsupportedProduct = 'UnsupportedProduct',
-  UnsupportedTradingMode = 'UnsupportedTradingMode',
+  CloseTimeTooLate = "CloseTimeTooLate",
+  CloseTimeTooSoon = "CloseTimeTooSoon",
+  CouldNotInstantiateMarket = "CouldNotInstantiateMarket",
+  EnactTimeTooLate = "EnactTimeTooLate",
+  EnactTimeTooSoon = "EnactTimeTooSoon",
+  IncompatibleTimestamps = "IncompatibleTimestamps",
+  InsufficientTokens = "InsufficientTokens",
+  InvalidAsset = "InvalidAsset",
+  InvalidAssetDetails = "InvalidAssetDetails",
+  InvalidFeeAmount = "InvalidFeeAmount",
+  InvalidFutureMaturityTimestamp = "InvalidFutureMaturityTimestamp",
+  InvalidFutureProduct = "InvalidFutureProduct",
+  InvalidInstrumentSecurity = "InvalidInstrumentSecurity",
+  InvalidRiskParameter = "InvalidRiskParameter",
+  InvalidShape = "InvalidShape",
+  MajorityThresholdNotReached = "MajorityThresholdNotReached",
+  MarketMissingLiquidityCommitment = "MarketMissingLiquidityCommitment",
+  MissingBuiltinAssetField = "MissingBuiltinAssetField",
+  MissingCommitmentAmount = "MissingCommitmentAmount",
+  MissingERC20ContractAddress = "MissingERC20ContractAddress",
+  NetworkParameterInvalidKey = "NetworkParameterInvalidKey",
+  NetworkParameterInvalidValue = "NetworkParameterInvalidValue",
+  NetworkParameterValidationFailed = "NetworkParameterValidationFailed",
+  NoProduct = "NoProduct",
+  NoRiskParameters = "NoRiskParameters",
+  NoTradingMode = "NoTradingMode",
+  NodeValidationFailed = "NodeValidationFailed",
+  OpeningAuctionDurationTooLarge = "OpeningAuctionDurationTooLarge",
+  OpeningAuctionDurationTooSmall = "OpeningAuctionDurationTooSmall",
+  ParticipationThresholdNotReached = "ParticipationThresholdNotReached",
+  ProductMaturityIsPassed = "ProductMaturityIsPassed",
+  UnsupportedProduct = "UnsupportedProduct",
+  UnsupportedTradingMode = "UnsupportedTradingMode",
 }
 
 /**
@@ -107,18 +107,18 @@ export enum ProposalRejectionReason {
  * Proposal can enter Failed state from any other state.
  */
 export enum ProposalState {
-  Declined = 'Declined',
-  Enacted = 'Enacted',
-  Failed = 'Failed',
-  Open = 'Open',
-  Passed = 'Passed',
-  Rejected = 'Rejected',
-  WaitingForNodeVote = 'WaitingForNodeVote',
+  Declined = "Declined",
+  Enacted = "Enacted",
+  Failed = "Failed",
+  Open = "Open",
+  Passed = "Passed",
+  Rejected = "Rejected",
+  WaitingForNodeVote = "WaitingForNodeVote",
 }
 
 export enum VoteValue {
-  No = 'No',
-  Yes = 'Yes',
+  No = "No",
+  Yes = "Yes",
 }
 
 //==============================================================
diff --git a/apps/explorer/src/app/__generated__/globalTypes.ts b/apps/explorer/src/app/__generated__/globalTypes.ts
deleted file mode 100644
index 74aa66291..000000000
--- a/apps/explorer/src/app/__generated__/globalTypes.ts
+++ /dev/null
@@ -1,126 +0,0 @@
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
-//==============================================================
-// START Enums and Input Objects
-//==============================================================
-
-/**
- * The various account types we have (used by collateral)
- */
-export enum AccountType {
-  Bond = "Bond",
-  FeeInfrastructure = "FeeInfrastructure",
-  FeeLiquidity = "FeeLiquidity",
-  General = "General",
-  GlobalInsurance = "GlobalInsurance",
-  Insurance = "Insurance",
-  LockWithdraw = "LockWithdraw",
-  Margin = "Margin",
-  Settlement = "Settlement",
-}
-
-export enum AuctionTrigger {
-  Batch = "Batch",
-  Liquidity = "Liquidity",
-  Opening = "Opening",
-  Price = "Price",
-  Unspecified = "Unspecified",
-}
-
-/**
- * The current state of a market
- */
-export enum MarketState {
-  Active = "Active",
-  Cancelled = "Cancelled",
-  Closed = "Closed",
-  Pending = "Pending",
-  Proposed = "Proposed",
-  Rejected = "Rejected",
-  Settled = "Settled",
-  Suspended = "Suspended",
-  TradingTerminated = "TradingTerminated",
-}
-
-/**
- * What market trading mode are we in
- */
-export enum MarketTradingMode {
-  BatchAuction = "BatchAuction",
-  Continuous = "Continuous",
-  MonitoringAuction = "MonitoringAuction",
-  OpeningAuction = "OpeningAuction",
-}
-
-export enum NodeStatus {
-  NonValidator = "NonValidator",
-  Validator = "Validator",
-}
-
-/**
- * Reason for the proposal being rejected by the core node
- */
-export enum ProposalRejectionReason {
-  CloseTimeTooLate = "CloseTimeTooLate",
-  CloseTimeTooSoon = "CloseTimeTooSoon",
-  CouldNotInstantiateMarket = "CouldNotInstantiateMarket",
-  EnactTimeTooLate = "EnactTimeTooLate",
-  EnactTimeTooSoon = "EnactTimeTooSoon",
-  IncompatibleTimestamps = "IncompatibleTimestamps",
-  InsufficientTokens = "InsufficientTokens",
-  InvalidAsset = "InvalidAsset",
-  InvalidAssetDetails = "InvalidAssetDetails",
-  InvalidFeeAmount = "InvalidFeeAmount",
-  InvalidFutureMaturityTimestamp = "InvalidFutureMaturityTimestamp",
-  InvalidFutureProduct = "InvalidFutureProduct",
-  InvalidInstrumentSecurity = "InvalidInstrumentSecurity",
-  InvalidRiskParameter = "InvalidRiskParameter",
-  InvalidShape = "InvalidShape",
-  MajorityThresholdNotReached = "MajorityThresholdNotReached",
-  MarketMissingLiquidityCommitment = "MarketMissingLiquidityCommitment",
-  MissingBuiltinAssetField = "MissingBuiltinAssetField",
-  MissingCommitmentAmount = "MissingCommitmentAmount",
-  MissingERC20ContractAddress = "MissingERC20ContractAddress",
-  NetworkParameterInvalidKey = "NetworkParameterInvalidKey",
-  NetworkParameterInvalidValue = "NetworkParameterInvalidValue",
-  NetworkParameterValidationFailed = "NetworkParameterValidationFailed",
-  NoProduct = "NoProduct",
-  NoRiskParameters = "NoRiskParameters",
-  NoTradingMode = "NoTradingMode",
-  NodeValidationFailed = "NodeValidationFailed",
-  OpeningAuctionDurationTooLarge = "OpeningAuctionDurationTooLarge",
-  OpeningAuctionDurationTooSmall = "OpeningAuctionDurationTooSmall",
-  ParticipationThresholdNotReached = "ParticipationThresholdNotReached",
-  ProductMaturityIsPassed = "ProductMaturityIsPassed",
-  UnsupportedProduct = "UnsupportedProduct",
-  UnsupportedTradingMode = "UnsupportedTradingMode",
-}
-
-/**
- * Various states a proposal can transition through:
- * Open ->
- * - Passed -> Enacted.
- * - Rejected.
- * Proposal can enter Failed state from any other state.
- */
-export enum ProposalState {
-  Declined = "Declined",
-  Enacted = "Enacted",
-  Failed = "Failed",
-  Open = "Open",
-  Passed = "Passed",
-  Rejected = "Rejected",
-  WaitingForNodeVote = "WaitingForNodeVote",
-}
-
-export enum VoteValue {
-  No = "No",
-  Yes = "Yes",
-}
-
-//==============================================================
-// END Enums and Input Objects
-//==============================================================
diff --git a/apps/explorer/src/app/components/search/index.tsx b/apps/explorer/src/app/components/search/index.tsx
index d1d9d8066..ff6134ea1 100644
--- a/apps/explorer/src/app/components/search/index.tsx
+++ b/apps/explorer/src/app/components/search/index.tsx
@@ -4,7 +4,7 @@ import { useState } from 'react';
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
 import debounce from 'lodash.debounce';
-import { Guess, GuessVariables } from './__generated__/Guess';
+import { Guess, GuessVariables } from '@vegaprotocol/graphql';
 
 const TX_LENGTH = 64;
 
diff --git a/apps/explorer/src/app/routes/assets/index.tsx b/apps/explorer/src/app/routes/assets/index.tsx
index 56001abd7..e7be5892e 100644
--- a/apps/explorer/src/app/routes/assets/index.tsx
+++ b/apps/explorer/src/app/routes/assets/index.tsx
@@ -1,7 +1,7 @@
 import { gql, useQuery } from '@apollo/client';
 import React from 'react';
 import { SyntaxHighlighter } from '../../components/syntax-highlighter';
-import { AssetsQuery } from './__generated__/AssetsQuery';
+import { AssetsQuery } from '@vegaprotocol/graphql';
 
 export const ASSETS_QUERY = gql`
   query AssetsQuery {
@@ -11,7 +11,6 @@ export const ASSETS_QUERY = gql`
       symbol
       totalSupply
       decimals
-      minLpStake
       source {
         ... on ERC20 {
           contractAddress
diff --git a/apps/explorer/src/app/routes/blocks/id/index.tsx b/apps/explorer/src/app/routes/blocks/id/index.tsx
index 700f3af01..5e1b73ffc 100644
--- a/apps/explorer/src/app/routes/blocks/id/index.tsx
+++ b/apps/explorer/src/app/routes/blocks/id/index.tsx
@@ -34,10 +34,7 @@ const Block = () => {
         <TableRow modifier="bordered">
           <TableHeader scope="row">Mined by</TableHeader>
           <TableCell modifier="bordered">
-            <Link
-              className="text-vega-yellow"
-              to={"/validators"}
-            >
+            <Link className="text-vega-yellow" to={'/validators'}>
               {header.proposer_address}
             </Link>
           </TableCell>
diff --git a/apps/explorer/src/app/routes/governance/index.tsx b/apps/explorer/src/app/routes/governance/index.tsx
index d9dc20ddc..9c35a17f5 100644
--- a/apps/explorer/src/app/routes/governance/index.tsx
+++ b/apps/explorer/src/app/routes/governance/index.tsx
@@ -4,7 +4,7 @@ import { SyntaxHighlighter } from '../../components/syntax-highlighter';
 import {
   ProposalsQuery,
   ProposalsQuery_proposals_terms_change,
-} from './__generated__/ProposalsQuery';
+} from '@vegaprotocol/graphql';
 
 export function getProposalName(change: ProposalsQuery_proposals_terms_change) {
   if (change.__typename === 'NewAsset') {
diff --git a/apps/explorer/src/app/routes/markets/index.tsx b/apps/explorer/src/app/routes/markets/index.tsx
index bd79f0177..1fc494e18 100644
--- a/apps/explorer/src/app/routes/markets/index.tsx
+++ b/apps/explorer/src/app/routes/markets/index.tsx
@@ -1,5 +1,5 @@
 import { gql, useQuery } from '@apollo/client';
-import { MarketsQuery } from './__generated__/MarketsQuery';
+import { MarketsQuery } from '@vegaprotocol/graphql';
 
 import React from 'react';
 import { SyntaxHighlighter } from '../../components/syntax-highlighter';
@@ -26,7 +26,6 @@ const MARKETS_QUERY = gql`
           code
           product {
             ... on Future {
-              maturity
               settlementAsset {
                 id
                 name
diff --git a/apps/explorer/src/app/routes/network-parameters/index.tsx b/apps/explorer/src/app/routes/network-parameters/index.tsx
index 22689c61b..46df31664 100644
--- a/apps/explorer/src/app/routes/network-parameters/index.tsx
+++ b/apps/explorer/src/app/routes/network-parameters/index.tsx
@@ -1,5 +1,5 @@
 import { gql, useQuery } from '@apollo/client';
-import { NetworkParametersQuery } from './__generated__/NetworkParametersQuery';
+import { NetworkParametersQuery } from '@vegaprotocol/graphql';
 
 export const NETWORK_PARAMETERS_QUERY = gql`
   query NetworkParametersQuery {
diff --git a/apps/explorer/src/app/routes/parties/id/index.tsx b/apps/explorer/src/app/routes/parties/id/index.tsx
index 6f17b82b0..dd883bdd4 100644
--- a/apps/explorer/src/app/routes/parties/id/index.tsx
+++ b/apps/explorer/src/app/routes/parties/id/index.tsx
@@ -8,7 +8,7 @@ import { TendermintSearchTransactionResponse } from '../tendermint-transaction-r
 import {
   PartyAssetsQuery,
   PartyAssetsQueryVariables,
-} from './__generated__/PartyAssetsQuery';
+} from '@vegaprotocol/graphql';
 
 const PARTY_ASSETS_QUERY = gql`
   query PartyAssetsQuery($partyId: ID!) {
@@ -58,7 +58,7 @@ const Party = () => {
     {
       // Don't cache data for this query, party information can move quite quickly
       fetchPolicy: 'network-only',
-      variables: { partyId: party?.replace('0x', '') },
+      variables: { partyId: party?.replace('0x', '') || '' },
       skip: !party,
     }
   );
diff --git a/apps/explorer/src/app/routes/validators/index.tsx b/apps/explorer/src/app/routes/validators/index.tsx
index ff76b1ed4..d27b85c47 100644
--- a/apps/explorer/src/app/routes/validators/index.tsx
+++ b/apps/explorer/src/app/routes/validators/index.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { DATA_SOURCES } from '../../config';
 import useFetch from '../../hooks/use-fetch';
 import { TendermintValidatorsResponse } from './tendermint-validator-response';
-import { NodesQuery } from './__generated__/NodesQuery';
+import { NodesQuery } from '@vegaprotocol/graphql';
 
 const NODES_QUERY = gql`
   query NodesQuery {
@@ -26,8 +26,6 @@ const NODES_QUERY = gql`
         online
       }
       status
-      score
-      normalisedScore
       name
     }
   }
diff --git a/apps/trading/.eslintrc.json b/apps/trading/.eslintrc.json
index bc7243829..2548ff963 100644
--- a/apps/trading/.eslintrc.json
+++ b/apps/trading/.eslintrc.json
@@ -5,7 +5,7 @@
     "next",
     "next/core-web-vitals"
   ],
-  "ignorePatterns": ["!**/*", "__generated__"],
+  "ignorePatterns": ["!**/*"],
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
diff --git a/apps/trading/__generated__/globalTypes.ts b/apps/trading/__generated__/globalTypes.ts
deleted file mode 100644
index 8d9b7dd7a..000000000
--- a/apps/trading/__generated__/globalTypes.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
-//==============================================================
-// START Enums and Input Objects
-//==============================================================
-
-//==============================================================
-// END Enums and Input Objects
-//==============================================================
diff --git a/apps/trading/apollo.config.js b/apps/trading/apollo.config.js
deleted file mode 100644
index b71577567..000000000
--- a/apps/trading/apollo.config.js
+++ /dev/null
@@ -1,9 +0,0 @@
-module.exports = {
-  client: {
-    service: {
-      name: 'vega',
-      url: process.env.NX_VEGA_URL,
-    },
-    includes: ['{components,lib,pages}/**/*.{ts,tsx,js,jsx,graphql}'],
-  },
-};
diff --git a/apps/trading/components/deal-ticket-container/deal-ticket-container.tsx b/apps/trading/components/deal-ticket-container/deal-ticket-container.tsx
new file mode 100644
index 000000000..2f83b19a7
--- /dev/null
+++ b/apps/trading/components/deal-ticket-container/deal-ticket-container.tsx
@@ -0,0 +1,74 @@
+import { Dialog, Intent } from '@vegaprotocol/ui-toolkit';
+import { DealTicket } from '@vegaprotocol/deal-ticket';
+import { OrderStatus } from '@vegaprotocol/graphql';
+import { useOrderSubmit } from '../../hooks/use-order-submit';
+import { useEffect, useState } from 'react';
+import { VegaTxStatus } from '../../hooks/use-vega-transaction';
+import { OrderDialog } from './order-dialog';
+
+export const DealTicketContainer = ({ market }) => {
+  const [orderDialogOpen, setOrderDialogOpen] = useState(false);
+  const { submit, transaction, finalizedOrder, reset } = useOrderSubmit(market);
+
+  const getDialogIntent = (status: VegaTxStatus) => {
+    if (finalizedOrder) {
+      if (
+        finalizedOrder.status === OrderStatus.Active ||
+        finalizedOrder.status === OrderStatus.Filled ||
+        finalizedOrder.status === OrderStatus.PartiallyFilled
+      ) {
+        return Intent.Success;
+      }
+
+      if (finalizedOrder.status === OrderStatus.Parked) {
+        return Intent.Warning;
+      }
+
+      return Intent.Danger;
+    }
+
+    if (status === VegaTxStatus.Rejected) {
+      return Intent.Danger;
+    }
+
+    return Intent.Progress;
+  };
+
+  useEffect(() => {
+    if (transaction.status !== VegaTxStatus.Default) {
+      setOrderDialogOpen(true);
+    }
+  }, [transaction.status]);
+
+  return (
+    <>
+      <DealTicket
+        market={market}
+        submit={submit}
+        transactionStatus={
+          transaction.status === VegaTxStatus.AwaitingConfirmation ||
+          transaction.status === VegaTxStatus.Pending
+            ? 'pending'
+            : 'default'
+        }
+      />
+      <Dialog
+        open={orderDialogOpen}
+        onChange={(isOpen) => {
+          setOrderDialogOpen(isOpen);
+
+          // If closing reset
+          if (!isOpen) {
+            reset();
+          }
+        }}
+        intent={getDialogIntent(transaction.status)}
+      >
+        <OrderDialog
+          transaction={transaction}
+          finalizedOrder={finalizedOrder}
+        />
+      </Dialog>
+    </>
+  );
+};
diff --git a/apps/trading/components/deal-ticket-container/index.ts b/apps/trading/components/deal-ticket-container/index.ts
new file mode 100644
index 000000000..6d3e9ada5
--- /dev/null
+++ b/apps/trading/components/deal-ticket-container/index.ts
@@ -0,0 +1 @@
+export * from './deal-ticket-container';
diff --git a/apps/trading/components/deal-ticket-container/order-dialog.tsx b/apps/trading/components/deal-ticket-container/order-dialog.tsx
new file mode 100644
index 000000000..09938a2b4
--- /dev/null
+++ b/apps/trading/components/deal-ticket-container/order-dialog.tsx
@@ -0,0 +1,95 @@
+import { Icon, Loader } from '@vegaprotocol/ui-toolkit';
+import { ReactNode } from 'react';
+import {
+  TransactionState,
+  VegaTxStatus,
+} from '../../hooks/use-vega-transaction';
+import { OrderEvent_busEvents_event_Order } from '@vegaprotocol/graphql';
+
+interface OrderDialogProps {
+  transaction: TransactionState;
+  finalizedOrder: OrderEvent_busEvents_event_Order | null;
+}
+
+export const OrderDialog = ({
+  transaction,
+  finalizedOrder,
+}: OrderDialogProps) => {
+  // TODO: When wallets support confirming transactions return UI for 'awaiting confirmation' step
+
+  // Rejected by wallet
+  if (transaction.status === VegaTxStatus.Rejected) {
+    return (
+      <OrderDialogWrapper
+        title="Order rejected by wallet"
+        icon={<Icon name="warning-sign" size={20} />}
+      >
+        {transaction.error && (
+          <pre className="text-ui break-all whitespace-pre-wrap">
+            {JSON.stringify(transaction.error, null, 2)}
+          </pre>
+        )}
+      </OrderDialogWrapper>
+    );
+  }
+
+  // Pending consensus
+  if (!finalizedOrder) {
+    return (
+      <OrderDialogWrapper
+        title="Awaiting network confirmation"
+        icon={<Loader />}
+      >
+        {transaction.hash && (
+          <p className="break-all">Tx hash: {transaction.hash}</p>
+        )}
+      </OrderDialogWrapper>
+    );
+  }
+
+  // Order on network but was rejected
+  if (finalizedOrder.status === 'Rejected') {
+    return (
+      <OrderDialogWrapper
+        title="Order failed"
+        icon={<Icon name="warning-sign" size={20} />}
+      >
+        <p>Reason: {finalizedOrder.rejectionReason}</p>
+      </OrderDialogWrapper>
+    );
+  }
+
+  return (
+    <OrderDialogWrapper
+      title="Order placed"
+      icon={<Icon name="tick" size={20} />}
+    >
+      <p>Status: {finalizedOrder.status}</p>
+      <p>Market: {finalizedOrder.market.name}</p>
+      <p>Amount: {finalizedOrder.size}</p>
+      {finalizedOrder.type === 'Limit' && <p>Price: {finalizedOrder.price}</p>}
+    </OrderDialogWrapper>
+  );
+};
+
+interface OrderDialogWrapperProps {
+  children: ReactNode;
+  icon: ReactNode;
+  title: string;
+}
+
+const OrderDialogWrapper = ({
+  children,
+  icon,
+  title,
+}: OrderDialogWrapperProps) => {
+  return (
+    <div className="flex gap-12 max-w-full">
+      <div className="pt-8 fill-current">{icon}</div>
+      <div className="flex-1">
+        <h1 className="text-h4">{title}</h1>
+        {children}
+      </div>
+    </div>
+  );
+};
diff --git a/apps/trading/components/page-query-container/index.tsx b/apps/trading/components/page-query-container/index.tsx
index f1e7bf9ae..455302743 100644
--- a/apps/trading/components/page-query-container/index.tsx
+++ b/apps/trading/components/page-query-container/index.tsx
@@ -1,7 +1,7 @@
 import { OperationVariables, QueryHookOptions, useQuery } from '@apollo/client';
-import classNames from 'classnames';
 import { DocumentNode } from 'graphql';
 import { ReactNode } from 'react';
+import { Splash } from '@vegaprotocol/ui-toolkit';
 
 interface PageQueryContainerProps<TData, TVariables> {
   query: DocumentNode;
@@ -15,19 +15,13 @@ export const PageQueryContainer = <TData, TVariables = OperationVariables>({
   children,
 }: PageQueryContainerProps<TData, TVariables>) => {
   const { data, loading, error } = useQuery<TData, TVariables>(query, options);
-  const splashClasses = classNames(
-    'w-full h-full',
-    'flex items-center justify-center'
-  );
 
   if (loading || !data) {
-    return <div className={splashClasses}>Loading...</div>;
+    return <Splash>Loading...</Splash>;
   }
 
   if (error) {
-    return (
-      <div className={splashClasses}>Something went wrong: {error.message}</div>
-    );
+    return <Splash>Something went wrong: {error.message}</Splash>;
   }
 
   return <>{children(data)}</>;
diff --git a/apps/trading/hooks/use-markets.ts b/apps/trading/hooks/use-markets.ts
new file mode 100644
index 000000000..c2fd4e570
--- /dev/null
+++ b/apps/trading/hooks/use-markets.ts
@@ -0,0 +1,131 @@
+import { gql, useApolloClient } from '@apollo/client';
+import { singletonHook } from 'react-singleton-hook';
+import {
+  Markets,
+  Markets_markets,
+  MarketDataSub,
+  MarketDataSub_marketData,
+} from '@vegaprotocol/graphql';
+import { useCallback, useEffect, useState } from 'react';
+
+const MARKET_DATA_FRAGMENT = gql`
+  fragment MarketDataFields on MarketData {
+    market {
+      id
+      state
+      tradingMode
+    }
+    bestBidPrice
+    bestOfferPrice
+    markPrice
+  }
+`;
+
+const MARKETS_QUERY = gql`
+  ${MARKET_DATA_FRAGMENT}
+  query Markets {
+    markets {
+      id
+      name
+      decimalPlaces
+      data {
+        ...MarketDataFields
+      }
+      tradableInstrument {
+        instrument {
+          code
+          product {
+            ... on Future {
+              settlementAsset {
+                symbol
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+
+const MARKET_DATA_SUB = gql`
+  ${MARKET_DATA_FRAGMENT}
+  subscription MarketDataSub {
+    marketData {
+      ...MarketDataFields
+    }
+  }
+`;
+
+export const useMarketsImpl = () => {
+  const client = useApolloClient();
+  const [markets, setMarkets] = useState<Markets_markets[]>([]);
+  const [error, setError] = useState<Error | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  const mergeMarketData = useCallback((update: MarketDataSub_marketData) => {
+    setMarkets((curr) => {
+      return curr.map((m) => {
+        if (update.market.id === m.id) {
+          return {
+            ...m,
+            data: update,
+          };
+        }
+
+        return m;
+      });
+    });
+  }, []);
+
+  // Make initial fetch
+  useEffect(() => {
+    const fetchOrders = async () => {
+      setLoading(true);
+
+      try {
+        const res = await client.query<Markets>({
+          query: MARKETS_QUERY,
+        });
+
+        if (!res.data.markets?.length) return;
+
+        setMarkets(res.data.markets);
+      } catch (err) {
+        setError(err);
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchOrders();
+  }, [mergeMarketData, client]);
+
+  // Start subscription
+  useEffect(() => {
+    const sub = client
+      // This data callback will unfortunately be called separately with an update for every market,
+      // perhaps we should batch this somehow...
+      .subscribe<MarketDataSub>({
+        query: MARKET_DATA_SUB,
+      })
+      .subscribe(({ data }) => {
+        mergeMarketData(data.marketData);
+      });
+
+    return () => {
+      if (sub) {
+        sub.unsubscribe();
+      }
+    };
+  }, [client, mergeMarketData]);
+
+  return { markets, error, loading };
+};
+
+const initial = {
+  markets: [],
+  error: null,
+  loading: false,
+};
+
+export const useMarkets = singletonHook(initial, useMarketsImpl);
diff --git a/apps/trading/hooks/use-order-submit.spec.tsx b/apps/trading/hooks/use-order-submit.spec.tsx
new file mode 100644
index 000000000..2bc3e5979
--- /dev/null
+++ b/apps/trading/hooks/use-order-submit.spec.tsx
@@ -0,0 +1,153 @@
+import { MockedProvider } from '@apollo/client/testing';
+import { act, renderHook } from '@testing-library/react-hooks';
+import { Order } from '@vegaprotocol/deal-ticket';
+import {
+  VegaKeyExtended,
+  VegaWalletContext,
+  VegaWalletContextShape,
+} from '@vegaprotocol/wallet';
+import { OrderSide, OrderTimeInForce, OrderType } from '@vegaprotocol/wallet';
+import { ReactNode } from 'react';
+import { useOrderSubmit } from './use-order-submit';
+import { VegaTxStatus } from './use-vega-transaction';
+
+const defaultWalletContext = {
+  keypair: null,
+  keypairs: [],
+  sendTx: jest.fn().mockReturnValue(Promise.resolve(null)),
+  connect: jest.fn(),
+  disconnect: jest.fn(),
+  selectPublicKey: jest.fn(),
+  connector: null,
+};
+
+function setup(
+  context?: Partial<VegaWalletContextShape>,
+  market = { id: 'market-id', decimalPlaces: 2 }
+) {
+  const wrapper = ({ children }: { children: ReactNode }) => (
+    <MockedProvider>
+      <VegaWalletContext.Provider
+        value={{ ...defaultWalletContext, ...context }}
+      >
+        {children}
+      </VegaWalletContext.Provider>
+    </MockedProvider>
+  );
+  return renderHook(() => useOrderSubmit(market), { wrapper });
+}
+
+test('Has the correct default state', () => {
+  const { result } = setup();
+  expect(typeof result.current.submit).toEqual('function');
+  expect(typeof result.current.reset).toEqual('function');
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Default);
+  expect(result.current.transaction.hash).toEqual(null);
+  expect(result.current.transaction.error).toEqual(null);
+});
+
+test('Should not sendTx if no keypair', async () => {
+  const mockSendTx = jest.fn();
+  const { result } = setup({ sendTx: mockSendTx, keypairs: [], keypair: null });
+  await act(async () => {
+    result.current.submit({} as Order);
+  });
+  expect(mockSendTx).not.toHaveBeenCalled();
+});
+
+test('Should not sendTx side is not specified', async () => {
+  const mockSendTx = jest.fn();
+  const keypair = {
+    pub: '0x123',
+  } as VegaKeyExtended;
+  const { result } = setup({
+    sendTx: mockSendTx,
+    keypairs: [keypair],
+    keypair,
+  });
+  await act(async () => {
+    result.current.submit({} as Order);
+  });
+  expect(mockSendTx).not.toHaveBeenCalled();
+});
+
+test('Create an Id if a signature is returned', async () => {
+  const signature =
+    '597a7706491e6523c091bab1e4d655b62c45a224e80f6cd92ac366aa5dd9a070cc7dd3c6919cb07b81334b876c662dd43bdbe5e827c8baa17a089feb654fab0b';
+  const expectedId =
+    '2FE09B0E2E6ED35F8883802629C7D609D3CC2FC9CE3CEC0B7824A0D581BD3747';
+  const successObj = {
+    tx: {
+      inputData: 'input-data',
+      signature: {
+        algo: 'algo',
+        version: 1,
+        value: signature,
+      },
+    },
+    txHash: '0x123',
+  };
+  const mockSendTx = jest.fn().mockReturnValue(Promise.resolve(successObj));
+  const keypair = {
+    pub: '0x123',
+  } as VegaKeyExtended;
+  const { result } = setup({
+    sendTx: mockSendTx,
+    keypairs: [keypair],
+    keypair,
+  });
+  await act(async () => {
+    result.current.submit({
+      type: OrderType.Market,
+      side: OrderSide.Buy,
+      size: '1',
+      timeInForce: OrderTimeInForce.FOK,
+    });
+  });
+  expect(result.current.id).toEqual(expectedId);
+});
+
+test('Should submit a correctly formatted order', async () => {
+  const mockSendTx = jest.fn().mockReturnValue(Promise.resolve({}));
+  const keypair = {
+    pub: '0x123',
+  } as VegaKeyExtended;
+  const market = {
+    id: 'market-id',
+    decimalPlaces: 2,
+  };
+  const { result } = setup(
+    {
+      sendTx: mockSendTx,
+      keypairs: [keypair],
+      keypair,
+    },
+    market
+  );
+
+  const order = {
+    type: OrderType.Limit,
+    size: '10',
+    timeInForce: OrderTimeInForce.GTT,
+    side: OrderSide.Buy,
+    price: '1234567.89',
+    expiration: new Date('2022-01-01'),
+  };
+  await act(async () => {
+    result.current.submit(order);
+  });
+
+  expect(mockSendTx).toHaveBeenCalledWith({
+    pubKey: keypair.pub,
+    propagate: true,
+    orderSubmission: {
+      type: OrderType.Limit,
+      marketId: market.id, // Market provided from hook arugment
+      size: '10',
+      side: OrderSide.Buy,
+      timeInForce: OrderTimeInForce.GTT,
+      price: '123456789', // Decimal removed
+      expiresAt: order.expiration.getTime() + '000000', // Nanoseconds appened
+    },
+  });
+});
diff --git a/apps/trading/hooks/use-order-submit.ts b/apps/trading/hooks/use-order-submit.ts
new file mode 100644
index 000000000..c81a61062
--- /dev/null
+++ b/apps/trading/hooks/use-order-submit.ts
@@ -0,0 +1,157 @@
+import { useCallback, useEffect, useState } from 'react';
+import { gql, useSubscription } from '@apollo/client';
+import { ethers } from 'ethers';
+import { SHA3 } from 'sha3';
+import { Order } from '@vegaprotocol/deal-ticket';
+import { OrderType, useVegaWallet } from '@vegaprotocol/wallet';
+import { useVegaTransaction } from './use-vega-transaction';
+import {
+  OrderEvent,
+  OrderEventVariables,
+  OrderEvent_busEvents_event_Order,
+} from '@vegaprotocol/graphql';
+import { removeDecimal } from '@vegaprotocol/react-helpers';
+
+const ORDER_EVENT_SUB = gql`
+  subscription OrderEvent($partyId: ID!) {
+    busEvents(partyId: $partyId, batchSize: 0, types: [Order]) {
+      eventId
+      block
+      type
+      event {
+        ... on Order {
+          type
+          id
+          status
+          rejectionReason
+          createdAt
+          size
+          price
+          market {
+            name
+          }
+        }
+      }
+    }
+  }
+`;
+
+interface UseOrderSubmitMarket {
+  id: string;
+  decimalPlaces: number;
+}
+
+export const useOrderSubmit = (market: UseOrderSubmitMarket) => {
+  const { keypair } = useVegaWallet();
+  const { send, transaction, reset: resetTransaction } = useVegaTransaction();
+  const [id, setId] = useState('');
+  const [finalizedOrder, setFinalizedOrder] =
+    useState<OrderEvent_busEvents_event_Order | null>(null);
+
+  // Start a subscription looking for the newly created order
+  useSubscription<OrderEvent, OrderEventVariables>(ORDER_EVENT_SUB, {
+    variables: { partyId: keypair?.pub || '' },
+    skip: !id,
+    onSubscriptionData: ({ subscriptionData }) => {
+      if (!subscriptionData.data.busEvents.length) {
+        return;
+      }
+
+      // No types available for the subscription result
+      const matchingOrderEvent = subscriptionData.data.busEvents.find((e) => {
+        if (e.event.__typename !== 'Order') {
+          return false;
+        }
+
+        if (e.event.id === id) {
+          return true;
+        }
+
+        return false;
+      });
+
+      if (
+        matchingOrderEvent &&
+        matchingOrderEvent.event.__typename === 'Order'
+      ) {
+        setFinalizedOrder(matchingOrderEvent.event);
+      }
+    },
+  });
+
+  useEffect(() => {
+    if (finalizedOrder) {
+      resetTransaction();
+    }
+  }, [finalizedOrder, resetTransaction]);
+
+  const submit = useCallback(
+    async (order: Order) => {
+      if (!keypair || !order.side) {
+        return;
+      }
+
+      setFinalizedOrder(null);
+
+      const res = await send({
+        pubKey: keypair.pub,
+        propagate: true,
+        orderSubmission: {
+          marketId: market.id,
+          price:
+            order.type === OrderType.Market
+              ? undefined
+              : removeDecimal(order.price, market.decimalPlaces),
+          size: order.size,
+          type: order.type,
+          side: order.side,
+          timeInForce: order.timeInForce,
+          expiresAt: order.expiration
+            ? // Wallet expects timestamp in nanoseconds, we don't have that level of accuracy so
+              // just append 6 zeroes
+              order.expiration.getTime().toString() + '000000'
+            : undefined,
+        },
+      });
+
+      if (res?.signature) {
+        setId(determineId(res.signature).toUpperCase());
+      }
+    },
+    [market, keypair, send]
+  );
+
+  const reset = useCallback(() => {
+    resetTransaction();
+    setFinalizedOrder(null);
+    setId('');
+  }, [resetTransaction]);
+
+  return {
+    transaction,
+    finalizedOrder,
+    id,
+    submit,
+    reset,
+  };
+};
+
+/**
+ * This function creates an ID in the same way that core does on the backend. This way we
+ * Can match up the newly created order with incoming orders via a subscription
+ */
+export const determineId = (sig: string) => {
+  // Prepend 0x
+  if (sig.slice(0, 2) !== '0x') {
+    sig = '0x' + sig;
+  }
+
+  // Create the ID
+  const hash = new SHA3(256);
+  const bytes = ethers.utils.arrayify(sig);
+  hash.update(Buffer.from(bytes));
+  const id = ethers.utils.hexlify(hash.digest());
+
+  // Remove 0x as core doesn't keep them in the API
+  return id.substring(2);
+};
diff --git a/apps/trading/hooks/use-vega-transaction.spec.tsx b/apps/trading/hooks/use-vega-transaction.spec.tsx
new file mode 100644
index 000000000..5b7be1f4d
--- /dev/null
+++ b/apps/trading/hooks/use-vega-transaction.spec.tsx
@@ -0,0 +1,98 @@
+import { act, renderHook } from '@testing-library/react-hooks';
+import {
+  OrderSubmission,
+  VegaWalletContext,
+  VegaWalletContextShape,
+} from '@vegaprotocol/wallet';
+import { ReactNode } from 'react';
+import { useVegaTransaction, VegaTxStatus } from './use-vega-transaction';
+
+const defaultWalletContext = {
+  keypair: null,
+  keypairs: [],
+  sendTx: jest.fn(),
+  connect: jest.fn(),
+  disconnect: jest.fn(),
+  selectPublicKey: jest.fn(),
+  connector: null,
+};
+
+function setup(context?: Partial<VegaWalletContextShape>) {
+  const wrapper = ({ children }: { children: ReactNode }) => (
+    <VegaWalletContext.Provider value={{ ...defaultWalletContext, ...context }}>
+      {children}
+    </VegaWalletContext.Provider>
+  );
+  return renderHook(() => useVegaTransaction(), { wrapper });
+}
+
+test('Has the correct default state', () => {
+  const { result } = setup();
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Default);
+  expect(result.current.transaction.hash).toEqual(null);
+  expect(result.current.transaction.signature).toEqual(null);
+  expect(result.current.transaction.error).toEqual(null);
+  expect(typeof result.current.reset).toEqual('function');
+  expect(typeof result.current.send).toEqual('function');
+});
+
+test('If provider returns null status should be default', async () => {
+  const mockSendTx = jest.fn().mockReturnValue(Promise.resolve(null));
+  const { result } = setup({ sendTx: mockSendTx });
+  await act(async () => {
+    result.current.send({} as OrderSubmission);
+  });
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Default);
+});
+
+test('Handles a single error', async () => {
+  const errorMessage = 'Oops error!';
+  const mockSendTx = jest
+    .fn()
+    .mockReturnValue(Promise.resolve({ error: errorMessage }));
+  const { result } = setup({ sendTx: mockSendTx });
+  await act(async () => {
+    result.current.send({} as OrderSubmission);
+  });
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Rejected);
+  expect(result.current.transaction.error).toEqual({ error: errorMessage });
+});
+
+test('Handles multiple errors', async () => {
+  const errorObj = {
+    errors: {
+      something: 'Went wrong!',
+    },
+  };
+  const mockSendTx = jest.fn().mockReturnValue(Promise.resolve(errorObj));
+  const { result } = setup({ sendTx: mockSendTx });
+  await act(async () => {
+    result.current.send({} as OrderSubmission);
+  });
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Rejected);
+  expect(result.current.transaction.error).toEqual(errorObj);
+});
+
+test('Returns the signature if successful', async () => {
+  const successObj = {
+    tx: {
+      inputData: 'input-data',
+      signature: {
+        algo: 'algo',
+        version: 1,
+        value: 'signature',
+      },
+    },
+    txHash: '0x123',
+  };
+  const mockSendTx = jest.fn().mockReturnValue(Promise.resolve(successObj));
+  const { result } = setup({ sendTx: mockSendTx });
+  await act(async () => {
+    result.current.send({} as OrderSubmission);
+  });
+  expect(result.current.transaction.status).toEqual(VegaTxStatus.Pending);
+  expect(result.current.transaction.hash).toEqual(successObj.txHash);
+  expect(result.current.transaction.signature).toEqual(
+    successObj.tx.signature.value
+  );
+});
diff --git a/apps/trading/hooks/use-vega-transaction.ts b/apps/trading/hooks/use-vega-transaction.ts
new file mode 100644
index 000000000..6765b8ad5
--- /dev/null
+++ b/apps/trading/hooks/use-vega-transaction.ts
@@ -0,0 +1,89 @@
+import { useCallback, useState } from 'react';
+import { useVegaWallet, SendTxError, Transaction } from '@vegaprotocol/wallet';
+
+export enum VegaTxStatus {
+  Default = 'Default',
+  AwaitingConfirmation = 'AwaitingConfirmation',
+  Rejected = 'Rejected',
+  Pending = 'Pending',
+}
+
+export interface TransactionState {
+  status: VegaTxStatus;
+  error: object | null;
+  hash: string | null;
+  signature: string | null;
+}
+
+export const useVegaTransaction = () => {
+  const { sendTx } = useVegaWallet();
+  const [transaction, _setTransaction] = useState<TransactionState>({
+    status: VegaTxStatus.Default,
+    error: null,
+    hash: null,
+    signature: null,
+  });
+
+  const setTransaction = useCallback((update: Partial<TransactionState>) => {
+    _setTransaction((curr) => ({
+      ...curr,
+      ...update,
+    }));
+  }, []);
+
+  const handleError = useCallback(
+    (error: SendTxError) => {
+      setTransaction({ error, status: VegaTxStatus.Rejected });
+    },
+    [setTransaction]
+  );
+
+  const send = useCallback(
+    async (tx: Transaction) => {
+      setTransaction({
+        error: null,
+        hash: null,
+        signature: null,
+        status: VegaTxStatus.AwaitingConfirmation,
+      });
+
+      const res = await sendTx(tx);
+
+      if (res === null) {
+        setTransaction({ status: VegaTxStatus.Default });
+        return null;
+      }
+
+      if ('error' in res) {
+        handleError(res);
+        return null;
+      } else if ('errors' in res) {
+        handleError(res);
+        return null;
+      } else if (res.tx && res.txHash) {
+        setTransaction({
+          status: VegaTxStatus.Pending,
+          hash: res.txHash,
+          signature: res.tx.signature.value,
+        });
+        return {
+          signature: res.tx.signature?.value,
+        };
+      }
+
+      return null;
+    },
+    [sendTx, handleError, setTransaction]
+  );
+
+  const reset = useCallback(() => {
+    setTransaction({
+      error: null,
+      hash: null,
+      signature: null,
+      status: VegaTxStatus.Default,
+    });
+  }, [setTransaction]);
+
+  return { send, transaction, reset };
+};
diff --git a/apps/trading/lib/apollo-client.ts b/apps/trading/lib/apollo-client.ts
index 2b2ed69bd..134799317 100644
--- a/apps/trading/lib/apollo-client.ts
+++ b/apps/trading/lib/apollo-client.ts
@@ -1,6 +1,15 @@
-import { ApolloClient, from, HttpLink, InMemoryCache } from '@apollo/client';
+import {
+  ApolloClient,
+  split,
+  from,
+  HttpLink,
+  InMemoryCache,
+} from '@apollo/client';
+import { GraphQLWsLink } from '@apollo/client/link/subscriptions';
+import { getMainDefinition } from '@apollo/client/utilities';
 import { onError } from '@apollo/client/link/error';
 import { RetryLink } from '@apollo/client/link/retry';
+import { createClient as createWSClient } from 'graphql-ws';
 
 export function createClient(base?: string) {
   if (!base) {
@@ -14,13 +23,18 @@ export function createClient(base?: string) {
 
   const cache = new InMemoryCache({
     typePolicies: {
-      Query: {},
       Account: {
         keyFields: false,
         fields: {
           balanceFormatted: {},
         },
       },
+      Instrument: {
+        keyFields: false,
+      },
+      MarketData: {
+        keyFields: ['market', ['id']],
+      },
       Node: {
         keyFields: false,
       },
@@ -40,6 +54,28 @@ export function createClient(base?: string) {
     credentials: 'same-origin',
   });
 
+  const wsLink = process.browser
+    ? new GraphQLWsLink(
+        createWSClient({
+          url: urlWS.href,
+        })
+      )
+    : null;
+
+  const splitLink = process.browser
+    ? split(
+        ({ query }) => {
+          const definition = getMainDefinition(query);
+          return (
+            definition.kind === 'OperationDefinition' &&
+            definition.operation === 'subscription'
+          );
+        },
+        wsLink,
+        httpLink
+      )
+    : httpLink;
+
   const errorLink = onError(({ graphQLErrors, networkError }) => {
     console.log(graphQLErrors);
     console.log(networkError);
@@ -47,7 +83,7 @@ export function createClient(base?: string) {
 
   return new ApolloClient({
     connectToDevTools: process.env['NODE_ENV'] === 'development',
-    link: from([errorLink, retryLink, httpLink]),
+    link: from([errorLink, retryLink, splitLink]),
     cache,
   });
 }
diff --git a/apps/trading/pages/_app.page.tsx b/apps/trading/pages/_app.page.tsx
index d4086e7aa..b93d7c834 100644
--- a/apps/trading/pages/_app.page.tsx
+++ b/apps/trading/pages/_app.page.tsx
@@ -5,6 +5,7 @@ import { ThemeContext } from '@vegaprotocol/react-helpers';
 import { VegaConnectDialog, VegaWalletProvider } from '@vegaprotocol/wallet';
 import { Connectors } from '../lib/connectors';
 import { useCallback, useMemo, useState } from 'react';
+import { SingletonHooksContainer } from 'react-singleton-hook';
 import { createClient } from '../lib/apollo-client';
 import { ThemeSwitcher } from '@vegaprotocol/ui-toolkit';
 import { ApolloProvider } from '@apollo/client';
@@ -17,9 +18,7 @@ import './styles.css';
 function VegaTradingApp({ Component, pageProps }: AppProps) {
   const client = useMemo(
     () =>
-      createClient(
-        process.env['NX_VEGA_URL'] || 'https://n03.stagnet2.vega.xyz'
-      ),
+      createClient(process.env['NX_VEGA_URL'] || 'https://lb.testnet.vega.xyz'),
     []
   );
   const [dialogOpen, setDialogOpen] = useState(false);
@@ -36,6 +35,7 @@ function VegaTradingApp({ Component, pageProps }: AppProps) {
     <ThemeContext.Provider value={theme}>
       <ApolloProvider client={client}>
         <VegaWalletProvider>
+          <SingletonHooksContainer />
           <AppLoader>
             <Head>
               <title>Welcome to trading!</title>
diff --git a/apps/trading/pages/index.page.tsx b/apps/trading/pages/index.page.tsx
index 6b5bd7a2b..3377e03af 100644
--- a/apps/trading/pages/index.page.tsx
+++ b/apps/trading/pages/index.page.tsx
@@ -2,6 +2,7 @@ import {
   AgGridDynamic as AgGrid,
   Button,
   Callout,
+  Intent,
 } from '@vegaprotocol/ui-toolkit';
 import { AgGridColumn } from 'ag-grid-react';
 
@@ -15,7 +16,7 @@ export function Index() {
     <div className="m-24">
       <div className="mb-24">
         <Callout
-          intent="help"
+          intent={Intent.Help}
           title="Welcome to Vega Trading App"
           iconName="endorsed"
           headingLevel={1}
diff --git a/apps/trading/pages/markets/[marketId].page.tsx b/apps/trading/pages/markets/[marketId].page.tsx
index c0243490c..aee507c3d 100644
--- a/apps/trading/pages/markets/[marketId].page.tsx
+++ b/apps/trading/pages/markets/[marketId].page.tsx
@@ -1,8 +1,9 @@
 import { gql } from '@apollo/client';
+import { Market, MarketVariables } from '@vegaprotocol/graphql';
+import { Splash } from '@vegaprotocol/ui-toolkit';
 import { useRouter } from 'next/router';
 import React, { useEffect, useState } from 'react';
 import debounce from 'lodash.debounce';
-import { Market, MarketVariables } from './__generated__/Market';
 import { PageQueryContainer } from '../../components/page-query-container';
 import { TradeGrid, TradePanels } from './trade-grid';
 
@@ -12,12 +13,34 @@ const MARKET_QUERY = gql`
     market(id: $marketId) {
       id
       name
+      decimalPlaces
+      state
+      tradingMode
+      tradableInstrument {
+        instrument {
+          product {
+            ... on Future {
+              quoteName
+              settlementAsset {
+                id
+                symbol
+                name
+              }
+            }
+          }
+        }
+      }
       trades {
         id
         price
         size
         createdAt
       }
+      depth {
+        lastTrade {
+          price
+        }
+      }
     }
   }
 `;
@@ -38,15 +61,20 @@ const MarketPage = () => {
           marketId: Array.isArray(marketId) ? marketId[0] : marketId,
         },
         skip: !marketId,
+        fetchPolicy: 'network-only',
       }}
     >
-      {({ market }) =>
-        w > 1050 ? (
+      {({ market }) => {
+        if (!market) {
+          return <Splash>Market not found</Splash>;
+        }
+
+        return w > 960 ? (
           <TradeGrid market={market} />
         ) : (
           <TradePanels market={market} />
-        )
-      }
+        );
+      }}
     </PageQueryContainer>
   );
 };
diff --git a/apps/trading/pages/markets/__generated__/Market.ts b/apps/trading/pages/markets/__generated__/Market.ts
deleted file mode 100644
index 58c8f008b..000000000
--- a/apps/trading/pages/markets/__generated__/Market.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL query operation: Market
-// ====================================================
-
-export interface Market_market_trades {
-  __typename: 'Trade';
-  /**
-   * The hash of the trade data
-   */
-  id: string;
-  /**
-   * The price of the trade (probably initially the passive order price, other determination algorithms are possible though) (uint64)
-   */
-  price: string;
-  /**
-   * The number of contracts trades, will always be <= the remaining size of both orders immediately before the trade (uint64)
-   */
-  size: string;
-  /**
-   * RFC3339Nano time for when the trade occurred
-   */
-  createdAt: string;
-}
-
-export interface Market_market {
-  __typename: 'Market';
-  /**
-   * Market ID
-   */
-  id: string;
-  /**
-   * Market full name
-   */
-  name: string;
-  /**
-   * Trades on a market
-   */
-  trades: Market_market_trades[] | null;
-}
-
-export interface Market {
-  /**
-   * An instrument that is trading on the VEGA network
-   */
-  market: Market_market | null;
-}
-
-export interface MarketVariables {
-  marketId: string;
-}
diff --git a/apps/trading/pages/markets/__generated__/Markets.ts b/apps/trading/pages/markets/__generated__/Markets.ts
deleted file mode 100644
index 1b9efcdf5..000000000
--- a/apps/trading/pages/markets/__generated__/Markets.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL query operation: Markets
-// ====================================================
-
-export interface Markets_markets {
-  __typename: "Market";
-  /**
-   * Market ID
-   */
-  id: string;
-}
-
-export interface Markets {
-  /**
-   * One or more instruments that are trading on the VEGA network
-   */
-  markets: Markets_markets[] | null;
-}
diff --git a/apps/trading/pages/markets/index.page.tsx b/apps/trading/pages/markets/index.page.tsx
index 70e2c3ba8..a930be52c 100644
--- a/apps/trading/pages/markets/index.page.tsx
+++ b/apps/trading/pages/markets/index.page.tsx
@@ -1,40 +1,28 @@
-import { gql } from '@apollo/client';
-import { PageQueryContainer } from '../../components/page-query-container';
-import Link from 'next/link';
+import { Markets } from '@vegaprotocol/graphql';
 import { useRouter } from 'next/router';
-import { Markets } from './__generated__/Markets';
-
-const MARKETS_QUERY = gql`
-  query Markets {
-    markets {
-      id
-    }
-  }
-`;
+import { MarketListTable } from '@vegaprotocol/market-list';
+import { useMarkets } from '../../hooks/use-markets';
+import { Splash } from '@vegaprotocol/ui-toolkit';
 
 const Markets = () => {
-  const { pathname } = useRouter();
+  const { pathname, push } = useRouter();
+  const { markets, error, loading } = useMarkets();
+
+  if (error) {
+    return <Splash>Something went wrong: {error.message}</Splash>;
+  }
+
+  if (loading) {
+    return <Splash>Loading...</Splash>;
+  }
 
   return (
-    <PageQueryContainer<Markets> query={MARKETS_QUERY}>
-      {(data) => (
-        <>
-          <h1>Markets</h1>
-          <ul>
-            {data.markets.map((m) => (
-              <li key={m.id}>
-                <Link
-                  href={`${pathname}/${m.id}?portfolio=orders&trade=orderbook`}
-                  passHref={true}
-                >
-                  <a>View market: {m.id}</a>
-                </Link>
-              </li>
-            ))}
-          </ul>
-        </>
-      )}
-    </PageQueryContainer>
+    <MarketListTable
+      markets={markets}
+      onRowClicked={(id) =>
+        push(`${pathname}/${id}?portfolio=orders&trade=orderbook`)
+      }
+    />
   );
 };
 
diff --git a/apps/trading/pages/markets/trade-grid.tsx b/apps/trading/pages/markets/trade-grid.tsx
index 2ae0e2538..b3b9b4c42 100644
--- a/apps/trading/pages/markets/trade-grid.tsx
+++ b/apps/trading/pages/markets/trade-grid.tsx
@@ -1,9 +1,26 @@
+import { Market_market } from '@vegaprotocol/graphql';
 import classNames from 'classnames';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import { useState, ReactNode } from 'react';
-import { TradingView, TradingViews } from '@vegaprotocol/react-helpers';
-import { Market_market } from './__generated__/Market';
 import { GridTab, GridTabs } from './grid-tabs';
+import { DealTicketContainer } from '../../components/deal-ticket-container';
+
+const Chart = () => <div>TODO: Chart</div>;
+const Orderbook = () => <div>TODO: Orderbook</div>;
+const Orders = () => <div>TODO: Orders</div>;
+const Positions = () => <div>TODO: Positions</div>;
+const Collateral = () => <div>TODO: Collateral</div>;
+
+type TradingView = keyof typeof TradingViews;
+
+const TradingViews = {
+  chart: Chart,
+  ticket: DealTicketContainer,
+  orderbook: Orderbook,
+  orders: Orders,
+  positions: Positions,
+  collateral: Collateral,
+};
 
 interface TradeGridProps {
   market: Market_market;
@@ -25,7 +42,7 @@ export const TradeGrid = ({ market }: TradeGridProps) => {
         <TradingViews.chart />
       </TradeGridChild>
       <TradeGridChild className="row-start-1 row-end-3">
-        <TradingViews.ticket />
+        <TradingViews.ticket market={market} />
       </TradeGridChild>
       <TradeGridChild className="row-start-1 row-end-3">
         <GridTabs group="trade">
@@ -88,7 +105,7 @@ export const TradePanels = ({ market }: TradePanelsProps) => {
       throw new Error(`No component for view: ${view}`);
     }
 
-    return <Component />;
+    return <Component market={market} />;
   };
 
   return (
diff --git a/apps/trading/project.json b/apps/trading/project.json
index fc87faf48..2e9f6071b 100644
--- a/apps/trading/project.json
+++ b/apps/trading/project.json
@@ -48,16 +48,6 @@
       "options": {
         "lintFilePatterns": ["apps/trading/**/*.{ts,tsx,js,jsx}"]
       }
-    },
-    "generate": {
-      "builder": "@nrwl/workspace:run-commands",
-      "options": {
-        "commands": [
-          {
-            "command": "npx apollo client:codegen --config=apps/trading/apollo.config.js --target=typescript --globalTypesFile=apps/trading/__generated__/globalTypes.ts"
-          }
-        ]
-      }
     }
   },
   "tags": []
diff --git a/apps/trading/tsconfig.json b/apps/trading/tsconfig.json
index f7e818fd1..7f521fe09 100644
--- a/apps/trading/tsconfig.json
+++ b/apps/trading/tsconfig.json
@@ -14,5 +14,5 @@
     "incremental": true
   },
   "include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "next-env.d.ts"],
-  "exclude": ["node_modules", "__generated__"]
+  "exclude": ["node_modules"]
 }
diff --git a/libs/deal-ticket/.babelrc b/libs/deal-ticket/.babelrc
new file mode 100644
index 000000000..ccae900be
--- /dev/null
+++ b/libs/deal-ticket/.babelrc
@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "@nrwl/react/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": []
+}
diff --git a/libs/deal-ticket/.eslintrc.json b/libs/deal-ticket/.eslintrc.json
new file mode 100644
index 000000000..734ddacee
--- /dev/null
+++ b/libs/deal-ticket/.eslintrc.json
@@ -0,0 +1,18 @@
+{
+  "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/libs/deal-ticket/README.md b/libs/deal-ticket/README.md
new file mode 100644
index 000000000..8e0882636
--- /dev/null
+++ b/libs/deal-ticket/README.md
@@ -0,0 +1,7 @@
+# deal-ticket
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test deal-ticket` to execute the unit tests via [Jest](https://jestjs.io).
diff --git a/libs/deal-ticket/jest.config.js b/libs/deal-ticket/jest.config.js
new file mode 100644
index 000000000..e194e5637
--- /dev/null
+++ b/libs/deal-ticket/jest.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+  displayName: 'deal-ticket',
+  preset: '../../jest.preset.js',
+  transform: {
+    '^.+\\.[tj]sx?$': 'babel-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../../coverage/libs/deal-ticket',
+};
diff --git a/libs/deal-ticket/package.json b/libs/deal-ticket/package.json
new file mode 100644
index 000000000..b5b50d47e
--- /dev/null
+++ b/libs/deal-ticket/package.json
@@ -0,0 +1,4 @@
+{
+  "name": "@vegaprotocol/deal-ticket",
+  "version": "0.0.1"
+}
diff --git a/libs/deal-ticket/project.json b/libs/deal-ticket/project.json
new file mode 100644
index 000000000..941520f1a
--- /dev/null
+++ b/libs/deal-ticket/project.json
@@ -0,0 +1,43 @@
+{
+  "root": "libs/deal-ticket",
+  "sourceRoot": "libs/deal-ticket/src",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "build": {
+      "executor": "@nrwl/web:rollup",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/libs/deal-ticket",
+        "tsConfig": "libs/deal-ticket/tsconfig.lib.json",
+        "project": "libs/deal-ticket/package.json",
+        "entryFile": "libs/deal-ticket/src/index.ts",
+        "external": ["react/jsx-runtime"],
+        "rollupConfig": "@nrwl/react/plugins/bundle-rollup",
+        "compiler": "babel",
+        "assets": [
+          {
+            "glob": "libs/deal-ticket/README.md",
+            "input": ".",
+            "output": "."
+          }
+        ]
+      }
+    },
+    "lint": {
+      "executor": "@nrwl/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["libs/deal-ticket/**/*.{ts,tsx,js,jsx}"]
+      }
+    },
+    "test": {
+      "executor": "@nrwl/jest:jest",
+      "outputs": ["coverage/libs/deal-ticket"],
+      "options": {
+        "jestConfig": "libs/deal-ticket/jest.config.js",
+        "passWithNoTests": true
+      }
+    }
+  }
+}
diff --git a/libs/deal-ticket/src/button-radio.tsx b/libs/deal-ticket/src/button-radio.tsx
new file mode 100644
index 000000000..a735e8265
--- /dev/null
+++ b/libs/deal-ticket/src/button-radio.tsx
@@ -0,0 +1,38 @@
+import { Button } from '@vegaprotocol/ui-toolkit';
+
+interface ButtonRadioProps {
+  name: string;
+  options: Array<{ value: string; text: string }>;
+  currentOption: string | null;
+  onSelect: (option: string) => void;
+}
+
+export const ButtonRadio = ({
+  name,
+  options,
+  currentOption,
+  onSelect,
+}: ButtonRadioProps) => {
+  return (
+    <div className="flex gap-8">
+      {options.map((option) => {
+        const isSelected = option.value === currentOption;
+        return (
+          <Button
+            onClick={() => onSelect(option.value)}
+            className="flex-1"
+            variant={isSelected ? 'accent' : undefined}
+            data-testid={
+              isSelected
+                ? `${name}-${option.value}-selected`
+                : `${name}-${option.value}`
+            }
+            key={option.value}
+          >
+            {option.text}
+          </Button>
+        );
+      })}
+    </div>
+  );
+};
diff --git a/libs/deal-ticket/src/deal-ticket-limit.tsx b/libs/deal-ticket/src/deal-ticket-limit.tsx
new file mode 100644
index 000000000..b327ccacd
--- /dev/null
+++ b/libs/deal-ticket/src/deal-ticket-limit.tsx
@@ -0,0 +1,78 @@
+import { FormGroup, Input } from '@vegaprotocol/ui-toolkit';
+import { OrderTimeInForce } from '@vegaprotocol/wallet';
+import { TransactionStatus } from './deal-ticket';
+import { Market_market } from '@vegaprotocol/graphql';
+import { ExpirySelector } from './expiry-selector';
+import { SideSelector } from './side-selector';
+import { SubmitButton } from './submit-button';
+import { TimeInForceSelector } from './time-in-force-selector';
+import { TypeSelector } from './type-selector';
+import { Order } from './use-order-state';
+
+interface DealTicketLimitProps {
+  order: Order;
+  updateOrder: (order: Partial<Order>) => void;
+  transactionStatus: TransactionStatus;
+  market: Market_market;
+}
+
+export const DealTicketLimit = ({
+  order,
+  updateOrder,
+  transactionStatus,
+  market,
+}: DealTicketLimitProps) => {
+  return (
+    <>
+      <TypeSelector order={order} onSelect={(type) => updateOrder({ type })} />
+      <SideSelector order={order} onSelect={(side) => updateOrder({ side })} />
+      <div className="flex items-center gap-8">
+        <div className="flex-1">
+          <FormGroup label="Amount">
+            <Input
+              value={order.size}
+              onChange={(e) => updateOrder({ size: e.target.value })}
+              className="w-full"
+              type="number"
+              data-testid="order-size"
+            />
+          </FormGroup>
+        </div>
+        <div>@</div>
+        <div className="flex-1">
+          <FormGroup
+            label={`Price (${market.tradableInstrument.instrument.product.quoteName})`}
+            labelAlign="right"
+          >
+            <Input
+              value={order.price}
+              onChange={(e) => updateOrder({ price: e.target.value })}
+              className="w-full"
+              type="number"
+              data-testid="order-price"
+            />
+          </FormGroup>
+        </div>
+      </div>
+      <TimeInForceSelector
+        order={order}
+        onSelect={(timeInForce) => updateOrder({ timeInForce })}
+      />
+      {order.timeInForce === OrderTimeInForce.GTT && (
+        <ExpirySelector
+          order={order}
+          onSelect={(date) => {
+            if (date) {
+              updateOrder({ expiration: date });
+            }
+          }}
+        />
+      )}
+      <SubmitButton
+        transactionStatus={transactionStatus}
+        market={market}
+        order={order}
+      />
+    </>
+  );
+};
diff --git a/libs/deal-ticket/src/deal-ticket-market.tsx b/libs/deal-ticket/src/deal-ticket-market.tsx
new file mode 100644
index 000000000..3d46e4770
--- /dev/null
+++ b/libs/deal-ticket/src/deal-ticket-market.tsx
@@ -0,0 +1,63 @@
+import { addDecimal } from '@vegaprotocol/react-helpers';
+import { FormGroup, Input } from '@vegaprotocol/ui-toolkit';
+import { Market_market } from '@vegaprotocol/graphql';
+import { TransactionStatus } from './deal-ticket';
+import { SideSelector } from './side-selector';
+import { SubmitButton } from './submit-button';
+import { TimeInForceSelector } from './time-in-force-selector';
+import { TypeSelector } from './type-selector';
+import { Order } from './use-order-state';
+
+interface DealTicketMarketProps {
+  order: Order;
+  updateOrder: (order: Partial<Order>) => void;
+  transactionStatus: TransactionStatus;
+  market: Market_market;
+}
+
+export const DealTicketMarket = ({
+  order,
+  updateOrder,
+  transactionStatus,
+  market,
+}: DealTicketMarketProps) => {
+  return (
+    <>
+      <TypeSelector order={order} onSelect={(type) => updateOrder({ type })} />
+      <SideSelector order={order} onSelect={(side) => updateOrder({ side })} />
+      <div className="flex items-center gap-8">
+        <div className="flex-1">
+          <FormGroup label="Amount">
+            <Input
+              value={order.size}
+              onChange={(e) => updateOrder({ size: e.target.value })}
+              className="w-full"
+              type="number"
+              data-testid="order-size"
+            />
+          </FormGroup>
+        </div>
+        <div className="pt-4">@</div>
+        <div className="flex-1 pt-4" data-testid="last-price">
+          {market.depth.lastTrade ? (
+            <>
+              ~{addDecimal(market.depth.lastTrade.price, market.decimalPlaces)}{' '}
+              {market.tradableInstrument.instrument.product.quoteName}
+            </>
+          ) : (
+            '-'
+          )}
+        </div>
+      </div>
+      <TimeInForceSelector
+        order={order}
+        onSelect={(timeInForce) => updateOrder({ timeInForce })}
+      />
+      <SubmitButton
+        transactionStatus={transactionStatus}
+        market={market}
+        order={order}
+      />
+    </>
+  );
+};
diff --git a/libs/deal-ticket/src/deal-ticket.spec.tsx b/libs/deal-ticket/src/deal-ticket.spec.tsx
new file mode 100644
index 000000000..d259afe5b
--- /dev/null
+++ b/libs/deal-ticket/src/deal-ticket.spec.tsx
@@ -0,0 +1,141 @@
+import '@testing-library/jest-dom';
+import {
+  VegaWalletContext,
+  OrderTimeInForce,
+  OrderType,
+} from '@vegaprotocol/wallet';
+import { addDecimal } from '@vegaprotocol/react-helpers';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { DealTicket, Market } from './deal-ticket';
+import { Order } from './use-order-state';
+
+const order: Order = {
+  type: OrderType.Market,
+  size: '100',
+  timeInForce: OrderTimeInForce.FOK,
+  side: null,
+};
+const market: Market = {
+  id: 'market-id',
+  decimalPlaces: 2,
+  tradingMode: 'Continuous',
+  state: 'Active',
+  tradableInstrument: {
+    instrument: {
+      product: {
+        quoteName: 'quote-name',
+        settlementAsset: {
+          id: 'asset-id',
+          symbol: 'asset-symbol',
+          name: 'asset-name',
+        },
+      },
+    },
+  },
+  depth: {
+    lastTrade: {
+      price: '100',
+    },
+  },
+};
+
+function generateJsx() {
+  return (
+    <VegaWalletContext.Provider value={{} as any}>
+      <DealTicket defaultOrder={order} market={market} />
+    </VegaWalletContext.Provider>
+  );
+}
+
+test('Deal ticket defaults', () => {
+  render(generateJsx());
+
+  // Assert defaults are used
+  expect(
+    screen.getByTestId(`order-type-${order.type}-selected`)
+  ).toBeInTheDocument();
+  expect(
+    screen.queryByTestId('order-side-SIDE_BUY-selected')
+  ).not.toBeInTheDocument();
+  expect(
+    screen.queryByTestId('order-side-SIDE_SELL-selected')
+  ).not.toBeInTheDocument();
+  expect(screen.getByTestId('order-size')).toHaveDisplayValue(order.size);
+  expect(screen.getByTestId('order-tif')).toHaveValue(order.timeInForce);
+
+  // Assert last price is shown
+  expect(screen.getByTestId('last-price')).toHaveTextContent(
+    // eslint-disable-next-line
+    `~${addDecimal(market.depth.lastTrade!.price, market.decimalPlaces)} ${
+      market.tradableInstrument.instrument.product.quoteName
+    }`
+  );
+});
+
+test('Can edit deal ticket', () => {
+  render(generateJsx());
+
+  // Asssert changing values
+  fireEvent.click(screen.getByTestId('order-side-SIDE_BUY'));
+  expect(
+    screen.getByTestId('order-side-SIDE_BUY-selected')
+  ).toBeInTheDocument();
+
+  fireEvent.change(screen.getByTestId('order-size'), {
+    target: { value: '200' },
+  });
+  expect(screen.getByTestId('order-size')).toHaveDisplayValue('200');
+
+  fireEvent.change(screen.getByTestId('order-tif'), {
+    target: { value: OrderTimeInForce.IOC },
+  });
+  expect(screen.getByTestId('order-tif')).toHaveValue(OrderTimeInForce.IOC);
+
+  // Switch to limit order
+  fireEvent.click(screen.getByTestId('order-type-TYPE_LIMIT'));
+
+  // Assert price input shown with default value
+  expect(screen.getByTestId('order-price')).toHaveDisplayValue('0');
+
+  // Check all TIF options shown
+  expect(screen.getByTestId('order-tif').children).toHaveLength(
+    Object.keys(OrderTimeInForce).length
+  );
+});
+
+test('Handles TIF select box dependent on order type', () => {
+  render(generateJsx());
+
+  // Check only IOC and
+  expect(
+    Array.from(screen.getByTestId('order-tif').children).map(
+      (o) => o.textContent
+    )
+  ).toEqual(['IOC', 'FOK']);
+
+  // Switch to limit order and check all TIF options shown
+  fireEvent.click(screen.getByTestId('order-type-TYPE_LIMIT'));
+  expect(screen.getByTestId('order-tif').children).toHaveLength(
+    Object.keys(OrderTimeInForce).length
+  );
+
+  // Change to GTC
+  fireEvent.change(screen.getByTestId('order-tif'), {
+    target: { value: OrderTimeInForce.GTC },
+  });
+  expect(screen.getByTestId('order-tif')).toHaveValue(OrderTimeInForce.GTC);
+
+  // Switch back to market order and TIF should now be IOC
+  fireEvent.click(screen.getByTestId('order-type-TYPE_MARKET'));
+  expect(screen.getByTestId('order-tif')).toHaveValue(OrderTimeInForce.IOC);
+
+  // Switch tif to FOK
+  fireEvent.change(screen.getByTestId('order-tif'), {
+    target: { value: OrderTimeInForce.FOK },
+  });
+  expect(screen.getByTestId('order-tif')).toHaveValue(OrderTimeInForce.FOK);
+
+  // Change back to limit and check we are still on FOK
+  fireEvent.click(screen.getByTestId('order-type-TYPE_LIMIT'));
+  expect(screen.getByTestId('order-tif')).toHaveValue(OrderTimeInForce.FOK);
+});
diff --git a/libs/deal-ticket/src/deal-ticket.tsx b/libs/deal-ticket/src/deal-ticket.tsx
new file mode 100644
index 000000000..a49dbf958
--- /dev/null
+++ b/libs/deal-ticket/src/deal-ticket.tsx
@@ -0,0 +1,69 @@
+import { OrderSide, OrderTimeInForce, OrderType } from '@vegaprotocol/wallet';
+import { Market_market } from '@vegaprotocol/graphql';
+import { FormEvent } from 'react';
+import { Order, useOrderState } from './use-order-state';
+import { DealTicketMarket } from './deal-ticket-market';
+import { DealTicketLimit } from './deal-ticket-limit';
+
+const DEFAULT_ORDER: Order = {
+  type: OrderType.Market,
+  side: OrderSide.Buy,
+  size: '1',
+  timeInForce: OrderTimeInForce.IOC,
+};
+
+// TODO: Consider using a generated type when we have a better solution for
+// sharing the types from GQL
+
+export type TransactionStatus = 'default' | 'pending';
+
+export interface DealTicketProps {
+  market: Market_market;
+  submit: (order: Order) => void;
+  transactionStatus: TransactionStatus;
+  defaultOrder?: Order;
+}
+
+export const DealTicket = ({
+  market,
+  submit,
+  transactionStatus,
+  defaultOrder = DEFAULT_ORDER,
+}: DealTicketProps) => {
+  const [order, updateOrder] = useOrderState(defaultOrder);
+
+  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    submit(order);
+  };
+
+  let ticket = null;
+
+  if (order.type === OrderType.Market) {
+    ticket = (
+      <DealTicketMarket
+        order={order}
+        updateOrder={updateOrder}
+        transactionStatus={transactionStatus}
+        market={market}
+      />
+    );
+  } else if (order.type === OrderType.Limit) {
+    ticket = (
+      <DealTicketLimit
+        order={order}
+        updateOrder={updateOrder}
+        transactionStatus={transactionStatus}
+        market={market}
+      />
+    );
+  } else {
+    throw new Error('Invalid ticket type');
+  }
+
+  return (
+    <form onSubmit={handleSubmit} className="px-4 py-8">
+      {ticket}
+    </form>
+  );
+};
diff --git a/libs/deal-ticket/src/expiry-selector.tsx b/libs/deal-ticket/src/expiry-selector.tsx
new file mode 100644
index 000000000..01f01243d
--- /dev/null
+++ b/libs/deal-ticket/src/expiry-selector.tsx
@@ -0,0 +1,26 @@
+import { FormGroup, Input } from '@vegaprotocol/ui-toolkit';
+import { Order } from './use-order-state';
+import { formatForInput } from '@vegaprotocol/react-helpers';
+
+interface ExpirySelectorProps {
+  order: Order;
+  onSelect: (expiration: Date | null) => void;
+}
+
+export const ExpirySelector = ({ order, onSelect }: ExpirySelectorProps) => {
+  const date = order.expiration ? new Date(order.expiration) : new Date();
+  const dateFormatted = formatForInput(date);
+  const minDate = formatForInput(date);
+  return (
+    <FormGroup label="Expiry time/date" labelFor="expiration">
+      <Input
+        id="expiration"
+        name="expiration"
+        type="datetime-local"
+        value={dateFormatted}
+        onChange={(e) => onSelect(new Date(e.target.value))}
+        min={minDate}
+      />
+    </FormGroup>
+  );
+};
diff --git a/libs/deal-ticket/src/index.ts b/libs/deal-ticket/src/index.ts
new file mode 100644
index 000000000..22bedf9bd
--- /dev/null
+++ b/libs/deal-ticket/src/index.ts
@@ -0,0 +1,2 @@
+export * from './deal-ticket';
+export * from './use-order-state';
diff --git a/libs/deal-ticket/src/side-selector.tsx b/libs/deal-ticket/src/side-selector.tsx
new file mode 100644
index 000000000..029ea318a
--- /dev/null
+++ b/libs/deal-ticket/src/side-selector.tsx
@@ -0,0 +1,25 @@
+import { FormGroup } from '@vegaprotocol/ui-toolkit';
+import { OrderSide } from '@vegaprotocol/wallet';
+import { ButtonRadio } from './button-radio';
+import { Order } from './use-order-state';
+
+interface SideSelectorProps {
+  order: Order;
+  onSelect: (side: OrderSide) => void;
+}
+
+export const SideSelector = ({ order, onSelect }: SideSelectorProps) => {
+  return (
+    <FormGroup label="Direction">
+      <ButtonRadio
+        name="order-side"
+        options={Object.entries(OrderSide).map(([text, value]) => ({
+          text,
+          value,
+        }))}
+        currentOption={order.side}
+        onSelect={(value) => onSelect(value as OrderSide)}
+      />
+    </FormGroup>
+  );
+};
diff --git a/libs/deal-ticket/src/submit-button.tsx b/libs/deal-ticket/src/submit-button.tsx
new file mode 100644
index 000000000..610c78633
--- /dev/null
+++ b/libs/deal-ticket/src/submit-button.tsx
@@ -0,0 +1,78 @@
+import { Button, InputError } from '@vegaprotocol/ui-toolkit';
+import { OrderTimeInForce, OrderType } from '@vegaprotocol/wallet';
+import { Market_market } from '@vegaprotocol/graphql';
+import { useMemo } from 'react';
+import { Order } from './use-order-state';
+import { useVegaWallet } from '@vegaprotocol/wallet';
+import { TransactionStatus } from './deal-ticket';
+
+interface SubmitButtonProps {
+  transactionStatus: TransactionStatus;
+  market: Market_market;
+  order: Order;
+}
+
+export const SubmitButton = ({
+  market,
+  transactionStatus,
+  order,
+}: SubmitButtonProps) => {
+  const { keypair } = useVegaWallet();
+
+  const invalidText = useMemo(() => {
+    if (!keypair) {
+      return 'No public key selected';
+    }
+
+    if (keypair.tainted) {
+      return 'Selected public key has been tainted';
+    }
+
+    // TODO: Change these to use enums from @vegaprotocol/graphql
+    if (market.state !== 'Active') {
+      if (market.state === 'Suspended') {
+        return 'Market is currently suspended';
+      }
+
+      if (market.state === 'Proposed' || market.state === 'Pending') {
+        return 'Market is not active yet';
+      }
+
+      return 'Market is no longer active';
+    }
+
+    if (market.tradingMode !== 'Continuous') {
+      if (order.type === OrderType.Market) {
+        return 'Only limit orders are permitted when market is in auction';
+      }
+
+      if (
+        [
+          OrderTimeInForce.FOK,
+          OrderTimeInForce.IOC,
+          OrderTimeInForce.GFN,
+        ].includes(order.timeInForce)
+      ) {
+        return 'Only GTT, GTC and GFA are permitted when market is in auction';
+      }
+    }
+
+    return '';
+  }, [keypair, market, order]);
+
+  const disabled = transactionStatus === 'pending' || Boolean(invalidText);
+
+  return (
+    <>
+      <Button
+        className="w-full mb-8"
+        variant="primary"
+        type="submit"
+        disabled={disabled}
+      >
+        {transactionStatus === 'pending' ? 'Pending...' : 'Place order'}
+      </Button>
+      {invalidText && <InputError className="mb-8">{invalidText}</InputError>}
+    </>
+  );
+};
diff --git a/libs/deal-ticket/src/time-in-force-selector.tsx b/libs/deal-ticket/src/time-in-force-selector.tsx
new file mode 100644
index 000000000..6c793ea46
--- /dev/null
+++ b/libs/deal-ticket/src/time-in-force-selector.tsx
@@ -0,0 +1,40 @@
+import { FormGroup, Select } from '@vegaprotocol/ui-toolkit';
+import { OrderTimeInForce, OrderType } from '@vegaprotocol/wallet';
+import { Order } from './use-order-state';
+
+interface TimeInForceSelectorProps {
+  order: Order;
+  onSelect: (tif: OrderTimeInForce) => void;
+}
+
+export const TimeInForceSelector = ({
+  order,
+  onSelect,
+}: TimeInForceSelectorProps) => {
+  const options =
+    order.type === OrderType.Limit
+      ? Object.entries(OrderTimeInForce)
+      : Object.entries(OrderTimeInForce).filter(
+          ([key, value]) =>
+            value === OrderTimeInForce.FOK || value === OrderTimeInForce.IOC
+        );
+
+  return (
+    <FormGroup label="Time in force">
+      <Select
+        value={order.timeInForce}
+        onChange={(e) => onSelect(e.target.value as OrderTimeInForce)}
+        className="w-full"
+        data-testid="order-tif"
+      >
+        {options.map(([key, value]) => {
+          return (
+            <option key={key} value={value}>
+              {key}
+            </option>
+          );
+        })}
+      </Select>
+    </FormGroup>
+  );
+};
diff --git a/libs/deal-ticket/src/type-selector.tsx b/libs/deal-ticket/src/type-selector.tsx
new file mode 100644
index 000000000..b3621843a
--- /dev/null
+++ b/libs/deal-ticket/src/type-selector.tsx
@@ -0,0 +1,25 @@
+import { FormGroup } from '@vegaprotocol/ui-toolkit';
+import { OrderType } from '@vegaprotocol/wallet';
+import { ButtonRadio } from './button-radio';
+import { Order } from './use-order-state';
+
+interface TypeSelectorProps {
+  order: Order;
+  onSelect: (type: OrderType) => void;
+}
+
+export const TypeSelector = ({ order, onSelect }: TypeSelectorProps) => {
+  return (
+    <FormGroup label="Order type">
+      <ButtonRadio
+        name="order-type"
+        options={Object.entries(OrderType).map(([text, value]) => ({
+          text,
+          value,
+        }))}
+        currentOption={order.type}
+        onSelect={(value) => onSelect(value as OrderType)}
+      />
+    </FormGroup>
+  );
+};
diff --git a/libs/deal-ticket/src/use-order-state.ts b/libs/deal-ticket/src/use-order-state.ts
new file mode 100644
index 000000000..42545ce01
--- /dev/null
+++ b/libs/deal-ticket/src/use-order-state.ts
@@ -0,0 +1,78 @@
+import { OrderSide, OrderTimeInForce, OrderType } from '@vegaprotocol/wallet';
+import { useState, useCallback } from 'react';
+
+export interface Order {
+  size: string;
+  type: OrderType;
+  timeInForce: OrderTimeInForce;
+  side: OrderSide | null;
+  price?: string;
+  expiration?: Date;
+}
+
+export type UpdateOrder = (order: Partial<Order>) => void;
+
+export const useOrderState = (defaultOrder: Order): [Order, UpdateOrder] => {
+  const [order, setOrder] = useState<Order>(defaultOrder);
+
+  const updateOrder = useCallback((orderUpdate: Partial<Order>) => {
+    setOrder((curr) => {
+      // Type is switching to market so return new market order object with correct defaults
+      if (
+        orderUpdate.type === OrderType.Market &&
+        curr.type !== OrderType.Market
+      ) {
+        // Check if provided TIF or current TIF is valid for a market order and default
+        // to IOC if its not
+
+        const isTifValid = (tif: OrderTimeInForce) => {
+          return tif === OrderTimeInForce.FOK || tif === OrderTimeInForce.IOC;
+        };
+
+        // Default
+        let timeInForce = OrderTimeInForce.IOC;
+
+        if (orderUpdate.timeInForce) {
+          if (isTifValid(orderUpdate.timeInForce)) {
+            timeInForce = orderUpdate.timeInForce;
+          }
+        } else {
+          if (isTifValid(curr.timeInForce)) {
+            timeInForce = curr.timeInForce;
+          }
+        }
+
+        return {
+          type: orderUpdate.type,
+          size: orderUpdate.size || curr.size,
+          side: orderUpdate.side || curr.side,
+          timeInForce,
+          price: undefined,
+          expiration: undefined,
+        };
+      }
+
+      // Type is switching to limit so return new order object with correct defaults
+      if (
+        orderUpdate.type === OrderType.Limit &&
+        curr.type !== OrderType.Limit
+      ) {
+        return {
+          type: orderUpdate.type,
+          size: orderUpdate.size || curr.size,
+          side: orderUpdate.side || curr.side,
+          timeInForce: orderUpdate.timeInForce || curr.timeInForce,
+          price: orderUpdate.price || '0',
+          expiration: orderUpdate.expiration || undefined,
+        };
+      }
+
+      return {
+        ...curr,
+        ...orderUpdate,
+      };
+    });
+  }, []);
+
+  return [order, updateOrder];
+};
diff --git a/libs/deal-ticket/tsconfig.json b/libs/deal-ticket/tsconfig.json
new file mode 100644
index 000000000..4c089585e
--- /dev/null
+++ b/libs/deal-ticket/tsconfig.json
@@ -0,0 +1,25 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "allowJs": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}
diff --git a/libs/deal-ticket/tsconfig.lib.json b/libs/deal-ticket/tsconfig.lib.json
new file mode 100644
index 000000000..252904bb7
--- /dev/null
+++ b/libs/deal-ticket/tsconfig.lib.json
@@ -0,0 +1,22 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": ["node"]
+  },
+  "files": [
+    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nrwl/react/typings/image.d.ts"
+  ],
+  "exclude": [
+    "**/*.spec.ts",
+    "**/*.test.ts",
+    "**/*.spec.tsx",
+    "**/*.test.tsx",
+    "**/*.spec.js",
+    "**/*.test.js",
+    "**/*.spec.jsx",
+    "**/*.test.jsx"
+  ],
+  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
+}
diff --git a/libs/deal-ticket/tsconfig.spec.json b/libs/deal-ticket/tsconfig.spec.json
new file mode 100644
index 000000000..67f149c4c
--- /dev/null
+++ b/libs/deal-ticket/tsconfig.spec.json
@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "include": [
+    "**/*.test.ts",
+    "**/*.spec.ts",
+    "**/*.test.tsx",
+    "**/*.spec.tsx",
+    "**/*.test.js",
+    "**/*.spec.js",
+    "**/*.test.jsx",
+    "**/*.spec.jsx",
+    "**/*.d.ts"
+  ]
+}
diff --git a/libs/graphql/.babelrc b/libs/graphql/.babelrc
new file mode 100644
index 000000000..ccae900be
--- /dev/null
+++ b/libs/graphql/.babelrc
@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "@nrwl/react/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": []
+}
diff --git a/libs/graphql/.eslintrc.json b/libs/graphql/.eslintrc.json
new file mode 100644
index 000000000..db820c5d0
--- /dev/null
+++ b/libs/graphql/.eslintrc.json
@@ -0,0 +1,18 @@
+{
+  "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*", "__generated__"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/libs/graphql/README.md b/libs/graphql/README.md
new file mode 100644
index 000000000..6342967d9
--- /dev/null
+++ b/libs/graphql/README.md
@@ -0,0 +1,7 @@
+# graphql
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test graphql` to execute the unit tests via [Jest](https://jestjs.io).
diff --git a/apps/explorer/apollo.config.js b/libs/graphql/apollo.config.js
similarity index 64%
rename from apps/explorer/apollo.config.js
rename to libs/graphql/apollo.config.js
index 97e1c2c59..0a0c2499e 100644
--- a/apps/explorer/apollo.config.js
+++ b/libs/graphql/apollo.config.js
@@ -4,5 +4,6 @@ module.exports = {
       name: 'vega',
       url: process.env.NX_VEGA_URL,
     },
+    includes: ['../../{apps,lib}/**/*.{ts,tsx,js,jsx,graphql}'],
   },
 };
diff --git a/libs/graphql/jest.config.js b/libs/graphql/jest.config.js
new file mode 100644
index 000000000..51bb43cdc
--- /dev/null
+++ b/libs/graphql/jest.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+  displayName: 'graphql',
+  preset: '../../jest.preset.js',
+  transform: {
+    '^.+\\.[tj]sx?$': 'babel-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../../coverage/libs/graphql',
+};
diff --git a/libs/graphql/package.json b/libs/graphql/package.json
new file mode 100644
index 000000000..d2fdb2ce1
--- /dev/null
+++ b/libs/graphql/package.json
@@ -0,0 +1,4 @@
+{
+  "name": "@vegaprotocol/graphql",
+  "version": "0.0.1"
+}
diff --git a/libs/graphql/project.json b/libs/graphql/project.json
new file mode 100644
index 000000000..071816ba2
--- /dev/null
+++ b/libs/graphql/project.json
@@ -0,0 +1,53 @@
+{
+  "root": "libs/graphql",
+  "sourceRoot": "libs/graphql/src",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "build": {
+      "executor": "@nrwl/web:rollup",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/libs/graphql",
+        "tsConfig": "libs/graphql/tsconfig.lib.json",
+        "project": "libs/graphql/package.json",
+        "entryFile": "libs/graphql/src/index.ts",
+        "external": ["react/jsx-runtime"],
+        "rollupConfig": "@nrwl/react/plugins/bundle-rollup",
+        "compiler": "babel",
+        "assets": [
+          {
+            "glob": "libs/graphql/README.md",
+            "input": ".",
+            "output": "."
+          }
+        ]
+      }
+    },
+    "lint": {
+      "executor": "@nrwl/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["libs/graphql/**/*.{ts,tsx,js,jsx}"]
+      }
+    },
+    "test": {
+      "executor": "@nrwl/jest:jest",
+      "outputs": ["coverage/libs/graphql"],
+      "options": {
+        "jestConfig": "libs/graphql/jest.config.js",
+        "passWithNoTests": true
+      }
+    },
+    "generate": {
+      "builder": "@nrwl/workspace:run-commands",
+      "options": {
+        "commands": [
+          {
+            "command": "npx apollo client:codegen libs/graphql/src/__generated__ --config=libs/graphql/apollo.config.js --target=typescript --globalTypesFile=libs/graphql/src/__generated__/globalTypes.ts --outputFlat"
+          }
+        ]
+      }
+    }
+  }
+}
diff --git a/apps/explorer/src/app/routes/assets/__generated__/AssetsQuery.ts b/libs/graphql/src/__generated__/AssetsQuery.ts
similarity index 81%
rename from apps/explorer/src/app/routes/assets/__generated__/AssetsQuery.ts
rename to libs/graphql/src/__generated__/AssetsQuery.ts
index ae0f80b04..ea9b6f249 100644
--- a/apps/explorer/src/app/routes/assets/__generated__/AssetsQuery.ts
+++ b/libs/graphql/src/__generated__/AssetsQuery.ts
@@ -3,14 +3,14 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import { AccountType } from './../../../../__generated__/globalTypes';
+import { AccountType } from "./globalTypes";
 
 // ====================================================
 // GraphQL query operation: AssetsQuery
 // ====================================================
 
 export interface AssetsQuery_assets_source_ERC20 {
-  __typename: 'ERC20';
+  __typename: "ERC20";
   /**
    * The address of the erc20 contract
    */
@@ -18,19 +18,17 @@ export interface AssetsQuery_assets_source_ERC20 {
 }
 
 export interface AssetsQuery_assets_source_BuiltinAsset {
-  __typename: 'BuiltinAsset';
+  __typename: "BuiltinAsset";
   /**
    * Maximum amount that can be requested by a party through the built-in asset faucet at a time
    */
   maxFaucetAmountMint: string;
 }
 
-export type AssetsQuery_assets_source =
-  | AssetsQuery_assets_source_ERC20
-  | AssetsQuery_assets_source_BuiltinAsset;
+export type AssetsQuery_assets_source = AssetsQuery_assets_source_ERC20 | AssetsQuery_assets_source_BuiltinAsset;
 
 export interface AssetsQuery_assets_infrastructureFeeAccount_market {
-  __typename: 'Market';
+  __typename: "Market";
   /**
    * Market ID
    */
@@ -38,7 +36,7 @@ export interface AssetsQuery_assets_infrastructureFeeAccount_market {
 }
 
 export interface AssetsQuery_assets_infrastructureFeeAccount {
-  __typename: 'Account';
+  __typename: "Account";
   /**
    * Account type (General, Margin, etc)
    */
@@ -54,7 +52,7 @@ export interface AssetsQuery_assets_infrastructureFeeAccount {
 }
 
 export interface AssetsQuery_assets {
-  __typename: 'Asset';
+  __typename: "Asset";
   /**
    * The id of the asset
    */
@@ -75,10 +73,6 @@ export interface AssetsQuery_assets {
    * The precision of the asset
    */
   decimals: number;
-  /**
-   * The min stake to become an lp for any market using this asset for settlement
-   */
-  minLpStake: string;
   /**
    * The origin source of the asset (e.g: an erc20 asset)
    */
diff --git a/apps/explorer/src/app/components/search/__generated__/Guess.ts b/libs/graphql/src/__generated__/Guess.ts
similarity index 93%
rename from apps/explorer/src/app/components/search/__generated__/Guess.ts
rename to libs/graphql/src/__generated__/Guess.ts
index 3f51b12d8..7e096adf3 100644
--- a/apps/explorer/src/app/components/search/__generated__/Guess.ts
+++ b/libs/graphql/src/__generated__/Guess.ts
@@ -8,7 +8,7 @@
 // ====================================================
 
 export interface Guess_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
@@ -16,7 +16,7 @@ export interface Guess_party {
 }
 
 export interface Guess_market {
-  __typename: 'Market';
+  __typename: "Market";
   /**
    * Market ID
    */
diff --git a/libs/graphql/src/__generated__/Market.ts b/libs/graphql/src/__generated__/Market.ts
new file mode 100644
index 000000000..61cf341ce
--- /dev/null
+++ b/libs/graphql/src/__generated__/Market.ts
@@ -0,0 +1,150 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { MarketState, MarketTradingMode } from "./globalTypes";
+
+// ====================================================
+// GraphQL query operation: Market
+// ====================================================
+
+export interface Market_market_tradableInstrument_instrument_product_settlementAsset {
+  __typename: "Asset";
+  /**
+   * The id of the asset
+   */
+  id: string;
+  /**
+   * The symbol of the asset (e.g: GBP)
+   */
+  symbol: string;
+  /**
+   * The full name of the asset (e.g: Great British Pound)
+   */
+  name: string;
+}
+
+export interface Market_market_tradableInstrument_instrument_product {
+  __typename: "Future";
+  /**
+   * String representing the quote (e.g. BTCUSD -> USD is quote)
+   */
+  quoteName: string;
+  /**
+   * The name of the asset (string)
+   */
+  settlementAsset: Market_market_tradableInstrument_instrument_product_settlementAsset;
+}
+
+export interface Market_market_tradableInstrument_instrument {
+  __typename: "Instrument";
+  /**
+   * A reference to or instance of a fully specified product, including all required product parameters for that product (Product union)
+   */
+  product: Market_market_tradableInstrument_instrument_product;
+}
+
+export interface Market_market_tradableInstrument {
+  __typename: "TradableInstrument";
+  /**
+   * An instance of or reference to a fully specified instrument.
+   */
+  instrument: Market_market_tradableInstrument_instrument;
+}
+
+export interface Market_market_trades {
+  __typename: "Trade";
+  /**
+   * The hash of the trade data
+   */
+  id: string;
+  /**
+   * The price of the trade (probably initially the passive order price, other determination algorithms are possible though) (uint64)
+   */
+  price: string;
+  /**
+   * The number of contracts trades, will always be <= the remaining size of both orders immediately before the trade (uint64)
+   */
+  size: string;
+  /**
+   * RFC3339Nano time for when the trade occurred
+   */
+  createdAt: string;
+}
+
+export interface Market_market_depth_lastTrade {
+  __typename: "Trade";
+  /**
+   * The price of the trade (probably initially the passive order price, other determination algorithms are possible though) (uint64)
+   */
+  price: string;
+}
+
+export interface Market_market_depth {
+  __typename: "MarketDepth";
+  /**
+   * Last trade for the given market (if available)
+   */
+  lastTrade: Market_market_depth_lastTrade | null;
+}
+
+export interface Market_market {
+  __typename: "Market";
+  /**
+   * Market ID
+   */
+  id: string;
+  /**
+   * Market full name
+   */
+  name: string;
+  /**
+   * decimalPlaces indicates the number of decimal places that an integer must be shifted by in order to get a correct
+   * number denominated in the currency of the Market. (uint64)
+   * 
+   * Examples:
+   * Currency     Balance  decimalPlaces  Real Balance
+   * GBP              100              0       GBP 100
+   * GBP              100              2       GBP   1.00
+   * GBP              100              4       GBP   0.01
+   * GBP                1              4       GBP   0.0001   (  0.01p  )
+   * 
+   * GBX (pence)      100              0       GBP   1.00     (100p     )
+   * GBX (pence)      100              2       GBP   0.01     (  1p     )
+   * GBX (pence)      100              4       GBP   0.0001   (  0.01p  )
+   * GBX (pence)        1              4       GBP   0.000001 (  0.0001p)
+   */
+  decimalPlaces: number;
+  /**
+   * Current state of the market
+   */
+  state: MarketState;
+  /**
+   * Current mode of execution of the market
+   */
+  tradingMode: MarketTradingMode;
+  /**
+   * An instance of or reference to a tradable instrument.
+   */
+  tradableInstrument: Market_market_tradableInstrument;
+  /**
+   * Trades on a market
+   */
+  trades: Market_market_trades[] | null;
+  /**
+   * Current depth on the order book for this market
+   */
+  depth: Market_market_depth;
+}
+
+export interface Market {
+  /**
+   * An instrument that is trading on the VEGA network
+   */
+  market: Market_market | null;
+}
+
+export interface MarketVariables {
+  marketId: string;
+}
diff --git a/libs/graphql/src/__generated__/MarketDataFields.ts b/libs/graphql/src/__generated__/MarketDataFields.ts
new file mode 100644
index 000000000..eb9675cbe
--- /dev/null
+++ b/libs/graphql/src/__generated__/MarketDataFields.ts
@@ -0,0 +1,46 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { MarketState, MarketTradingMode } from "./globalTypes";
+
+// ====================================================
+// GraphQL fragment: MarketDataFields
+// ====================================================
+
+export interface MarketDataFields_market {
+  __typename: "Market";
+  /**
+   * Market ID
+   */
+  id: string;
+  /**
+   * Current state of the market
+   */
+  state: MarketState;
+  /**
+   * Current mode of execution of the market
+   */
+  tradingMode: MarketTradingMode;
+}
+
+export interface MarketDataFields {
+  __typename: "MarketData";
+  /**
+   * market id of the associated mark price
+   */
+  market: MarketDataFields_market;
+  /**
+   * the highest price level on an order book for buy orders.
+   */
+  bestBidPrice: string;
+  /**
+   * the lowest price level on an order book for offer orders.
+   */
+  bestOfferPrice: string;
+  /**
+   * the mark price (actually an unsigned int)
+   */
+  markPrice: string;
+}
diff --git a/libs/graphql/src/__generated__/MarketDataSub.ts b/libs/graphql/src/__generated__/MarketDataSub.ts
new file mode 100644
index 000000000..9e88d087f
--- /dev/null
+++ b/libs/graphql/src/__generated__/MarketDataSub.ts
@@ -0,0 +1,53 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { MarketState, MarketTradingMode } from "./globalTypes";
+
+// ====================================================
+// GraphQL subscription operation: MarketDataSub
+// ====================================================
+
+export interface MarketDataSub_marketData_market {
+  __typename: "Market";
+  /**
+   * Market ID
+   */
+  id: string;
+  /**
+   * Current state of the market
+   */
+  state: MarketState;
+  /**
+   * Current mode of execution of the market
+   */
+  tradingMode: MarketTradingMode;
+}
+
+export interface MarketDataSub_marketData {
+  __typename: "MarketData";
+  /**
+   * market id of the associated mark price
+   */
+  market: MarketDataSub_marketData_market;
+  /**
+   * the highest price level on an order book for buy orders.
+   */
+  bestBidPrice: string;
+  /**
+   * the lowest price level on an order book for offer orders.
+   */
+  bestOfferPrice: string;
+  /**
+   * the mark price (actually an unsigned int)
+   */
+  markPrice: string;
+}
+
+export interface MarketDataSub {
+  /**
+   * Subscribe to the mark price changes
+   */
+  marketData: MarketDataSub_marketData;
+}
diff --git a/libs/graphql/src/__generated__/Markets.ts b/libs/graphql/src/__generated__/Markets.ts
new file mode 100644
index 000000000..e7b0cd958
--- /dev/null
+++ b/libs/graphql/src/__generated__/Markets.ts
@@ -0,0 +1,126 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { MarketState, MarketTradingMode } from "./globalTypes";
+
+// ====================================================
+// GraphQL query operation: Markets
+// ====================================================
+
+export interface Markets_markets_data_market {
+  __typename: "Market";
+  /**
+   * Market ID
+   */
+  id: string;
+  /**
+   * Current state of the market
+   */
+  state: MarketState;
+  /**
+   * Current mode of execution of the market
+   */
+  tradingMode: MarketTradingMode;
+}
+
+export interface Markets_markets_data {
+  __typename: "MarketData";
+  /**
+   * market id of the associated mark price
+   */
+  market: Markets_markets_data_market;
+  /**
+   * the highest price level on an order book for buy orders.
+   */
+  bestBidPrice: string;
+  /**
+   * the lowest price level on an order book for offer orders.
+   */
+  bestOfferPrice: string;
+  /**
+   * the mark price (actually an unsigned int)
+   */
+  markPrice: string;
+}
+
+export interface Markets_markets_tradableInstrument_instrument_product_settlementAsset {
+  __typename: "Asset";
+  /**
+   * The symbol of the asset (e.g: GBP)
+   */
+  symbol: string;
+}
+
+export interface Markets_markets_tradableInstrument_instrument_product {
+  __typename: "Future";
+  /**
+   * The name of the asset (string)
+   */
+  settlementAsset: Markets_markets_tradableInstrument_instrument_product_settlementAsset;
+}
+
+export interface Markets_markets_tradableInstrument_instrument {
+  __typename: "Instrument";
+  /**
+   * A short non necessarily unique code used to easily describe the instrument (e.g: FX:BTCUSD/DEC18) (string)
+   */
+  code: string;
+  /**
+   * A reference to or instance of a fully specified product, including all required product parameters for that product (Product union)
+   */
+  product: Markets_markets_tradableInstrument_instrument_product;
+}
+
+export interface Markets_markets_tradableInstrument {
+  __typename: "TradableInstrument";
+  /**
+   * An instance of or reference to a fully specified instrument.
+   */
+  instrument: Markets_markets_tradableInstrument_instrument;
+}
+
+export interface Markets_markets {
+  __typename: "Market";
+  /**
+   * Market ID
+   */
+  id: string;
+  /**
+   * Market full name
+   */
+  name: string;
+  /**
+   * decimalPlaces indicates the number of decimal places that an integer must be shifted by in order to get a correct
+   * number denominated in the currency of the Market. (uint64)
+   * 
+   * Examples:
+   * Currency     Balance  decimalPlaces  Real Balance
+   * GBP              100              0       GBP 100
+   * GBP              100              2       GBP   1.00
+   * GBP              100              4       GBP   0.01
+   * GBP                1              4       GBP   0.0001   (  0.01p  )
+   * 
+   * GBX (pence)      100              0       GBP   1.00     (100p     )
+   * GBX (pence)      100              2       GBP   0.01     (  1p     )
+   * GBX (pence)      100              4       GBP   0.0001   (  0.01p  )
+   * GBX (pence)        1              4       GBP   0.000001 (  0.0001p)
+   */
+  decimalPlaces: number;
+  /**
+   * marketData for the given market
+   */
+  data: Markets_markets_data | null;
+  /**
+   * An instance of or reference to a tradable instrument.
+   */
+  tradableInstrument: Markets_markets_tradableInstrument;
+}
+
+export interface Markets {
+  /**
+   * One or more instruments that are trading on the VEGA network
+   */
+  markets: Markets_markets[] | null;
+}
diff --git a/apps/explorer/src/app/routes/markets/__generated__/MarketsQuery.ts b/libs/graphql/src/__generated__/MarketsQuery.ts
similarity index 87%
rename from apps/explorer/src/app/routes/markets/__generated__/MarketsQuery.ts
rename to libs/graphql/src/__generated__/MarketsQuery.ts
index 49f849c78..18707af7a 100644
--- a/apps/explorer/src/app/routes/markets/__generated__/MarketsQuery.ts
+++ b/libs/graphql/src/__generated__/MarketsQuery.ts
@@ -3,19 +3,14 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import {
-  MarketTradingMode,
-  MarketState,
-  AccountType,
-  AuctionTrigger,
-} from './../../../../__generated__/globalTypes';
+import { MarketTradingMode, MarketState, AccountType, AuctionTrigger } from "./globalTypes";
 
 // ====================================================
 // GraphQL query operation: MarketsQuery
 // ====================================================
 
 export interface MarketsQuery_markets_fees_factors {
-  __typename: 'FeeFactors';
+  __typename: "FeeFactors";
   /**
    * The factor applied to calculate MakerFees, a non-negative float
    */
@@ -31,7 +26,7 @@ export interface MarketsQuery_markets_fees_factors {
 }
 
 export interface MarketsQuery_markets_fees {
-  __typename: 'Fees';
+  __typename: "Fees";
   /**
    * The factors used to calculate the different fees
    */
@@ -39,7 +34,7 @@ export interface MarketsQuery_markets_fees {
 }
 
 export interface MarketsQuery_markets_tradableInstrument_instrument_metadata {
-  __typename: 'InstrumentMetadata';
+  __typename: "InstrumentMetadata";
   /**
    * An arbitrary list of tags to associated to associate to the Instrument (string list)
    */
@@ -47,7 +42,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument_metadata {
 }
 
 export interface MarketsQuery_markets_tradableInstrument_instrument_product_settlementAsset_globalRewardPoolAccount {
-  __typename: 'Account';
+  __typename: "Account";
   /**
    * Balance as string - current account balance (approx. as balances can be updated several times per second)
    */
@@ -55,7 +50,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument_product_sett
 }
 
 export interface MarketsQuery_markets_tradableInstrument_instrument_product_settlementAsset {
-  __typename: 'Asset';
+  __typename: "Asset";
   /**
    * The id of the asset
    */
@@ -79,11 +74,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument_product_sett
 }
 
 export interface MarketsQuery_markets_tradableInstrument_instrument_product {
-  __typename: 'Future';
-  /**
-   * RFC3339Nano maturity date of the product
-   */
-  maturity: string;
+  __typename: "Future";
   /**
    * The name of the asset (string)
    */
@@ -91,7 +82,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument_product {
 }
 
 export interface MarketsQuery_markets_tradableInstrument_instrument {
-  __typename: 'Instrument';
+  __typename: "Instrument";
   /**
    * Full and fairly descriptive name for the instrument
    */
@@ -101,7 +92,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument {
    */
   metadata: MarketsQuery_markets_tradableInstrument_instrument_metadata;
   /**
-   * Uniquely identify an instrument accrods all instruments available on Vega (string)
+   * Uniquely identify an instrument across all instruments available on Vega (string)
    */
   id: string;
   /**
@@ -115,7 +106,7 @@ export interface MarketsQuery_markets_tradableInstrument_instrument {
 }
 
 export interface MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRiskModel_params {
-  __typename: 'LogNormalModelParams';
+  __typename: "LogNormalModelParams";
   /**
    * r parameter
    */
@@ -131,7 +122,7 @@ export interface MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRisk
 }
 
 export interface MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRiskModel {
-  __typename: 'LogNormalRiskModel';
+  __typename: "LogNormalRiskModel";
   /**
    * Tau parameter of the risk model
    */
@@ -147,7 +138,7 @@ export interface MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRisk
 }
 
 export interface MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskModel_params {
-  __typename: 'SimpleRiskModelParams';
+  __typename: "SimpleRiskModelParams";
   /**
    * Risk factor for long
    */
@@ -159,19 +150,17 @@ export interface MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskMod
 }
 
 export interface MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskModel {
-  __typename: 'SimpleRiskModel';
+  __typename: "SimpleRiskModel";
   /**
    * Params for the simple risk model
    */
   params: MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskModel_params;
 }
 
-export type MarketsQuery_markets_tradableInstrument_riskModel =
-  | MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRiskModel
-  | MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskModel;
+export type MarketsQuery_markets_tradableInstrument_riskModel = MarketsQuery_markets_tradableInstrument_riskModel_LogNormalRiskModel | MarketsQuery_markets_tradableInstrument_riskModel_SimpleRiskModel;
 
 export interface MarketsQuery_markets_tradableInstrument_marginCalculator_scalingFactors {
-  __typename: 'ScalingFactors';
+  __typename: "ScalingFactors";
   /**
    * the scaling factor that determines the margin level at which Vega has to search for more money
    */
@@ -187,7 +176,7 @@ export interface MarketsQuery_markets_tradableInstrument_marginCalculator_scalin
 }
 
 export interface MarketsQuery_markets_tradableInstrument_marginCalculator {
-  __typename: 'MarginCalculator';
+  __typename: "MarginCalculator";
   /**
    * The scaling factors that will be used for margin calculation
    */
@@ -195,7 +184,7 @@ export interface MarketsQuery_markets_tradableInstrument_marginCalculator {
 }
 
 export interface MarketsQuery_markets_tradableInstrument {
-  __typename: 'TradableInstrument';
+  __typename: "TradableInstrument";
   /**
    * An instance of or reference to a fully specified instrument.
    */
@@ -211,7 +200,7 @@ export interface MarketsQuery_markets_tradableInstrument {
 }
 
 export interface MarketsQuery_markets_openingAuction {
-  __typename: 'AuctionDuration';
+  __typename: "AuctionDuration";
   /**
    * Duration of the auction in seconds
    */
@@ -223,7 +212,7 @@ export interface MarketsQuery_markets_openingAuction {
 }
 
 export interface MarketsQuery_markets_priceMonitoringSettings_parameters_triggers {
-  __typename: 'PriceMonitoringTrigger';
+  __typename: "PriceMonitoringTrigger";
   /**
    * Price monitoring projection horizon τ in seconds (> 0).
    */
@@ -241,17 +230,15 @@ export interface MarketsQuery_markets_priceMonitoringSettings_parameters_trigger
 }
 
 export interface MarketsQuery_markets_priceMonitoringSettings_parameters {
-  __typename: 'PriceMonitoringParameters';
+  __typename: "PriceMonitoringParameters";
   /**
    * The list of triggers for this price monitoring
    */
-  triggers:
-    | MarketsQuery_markets_priceMonitoringSettings_parameters_triggers[]
-    | null;
+  triggers: MarketsQuery_markets_priceMonitoringSettings_parameters_triggers[] | null;
 }
 
 export interface MarketsQuery_markets_priceMonitoringSettings {
-  __typename: 'PriceMonitoringSettings';
+  __typename: "PriceMonitoringSettings";
   /**
    * Specified a set of PriceMonitoringParameters to be use for price monitoring purposes
    */
@@ -263,7 +250,7 @@ export interface MarketsQuery_markets_priceMonitoringSettings {
 }
 
 export interface MarketsQuery_markets_liquidityMonitoringParameters_targetStakeParameters {
-  __typename: 'TargetStakeParameters';
+  __typename: "TargetStakeParameters";
   /**
    * Specifies length of time window expressed in seconds for target stake calculation
    */
@@ -275,7 +262,7 @@ export interface MarketsQuery_markets_liquidityMonitoringParameters_targetStakeP
 }
 
 export interface MarketsQuery_markets_liquidityMonitoringParameters {
-  __typename: 'LiquidityMonitoringParameters';
+  __typename: "LiquidityMonitoringParameters";
   /**
    * Specifies the triggering ratio for entering liquidity auction
    */
@@ -287,7 +274,7 @@ export interface MarketsQuery_markets_liquidityMonitoringParameters {
 }
 
 export interface MarketsQuery_markets_proposal {
-  __typename: 'Proposal';
+  __typename: "Proposal";
   /**
    * Proposal ID that is filled by VEGA once proposal reaches the network
    */
@@ -295,7 +282,7 @@ export interface MarketsQuery_markets_proposal {
 }
 
 export interface MarketsQuery_markets_accounts_asset {
-  __typename: 'Asset';
+  __typename: "Asset";
   /**
    * The id of the asset
    */
@@ -307,7 +294,7 @@ export interface MarketsQuery_markets_accounts_asset {
 }
 
 export interface MarketsQuery_markets_accounts {
-  __typename: 'Account';
+  __typename: "Account";
   /**
    * Asset, the 'currency'
    */
@@ -323,7 +310,7 @@ export interface MarketsQuery_markets_accounts {
 }
 
 export interface MarketsQuery_markets_data_priceMonitoringBounds_trigger {
-  __typename: 'PriceMonitoringTrigger';
+  __typename: "PriceMonitoringTrigger";
   /**
    * Price monitoring auction extension duration in seconds should the price
    * breach it's theoretical level over the specified horizon at the specified
@@ -337,7 +324,7 @@ export interface MarketsQuery_markets_data_priceMonitoringBounds_trigger {
 }
 
 export interface MarketsQuery_markets_data_priceMonitoringBounds {
-  __typename: 'PriceMonitoringBounds';
+  __typename: "PriceMonitoringBounds";
   /**
    * Minimum price that isn't currently breaching the specified price monitoring trigger
    */
@@ -357,7 +344,7 @@ export interface MarketsQuery_markets_data_priceMonitoringBounds {
 }
 
 export interface MarketsQuery_markets_data_liquidityProviderFeeShare_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
@@ -365,7 +352,7 @@ export interface MarketsQuery_markets_data_liquidityProviderFeeShare_party {
 }
 
 export interface MarketsQuery_markets_data_liquidityProviderFeeShare {
-  __typename: 'LiquidityProviderFeeShare';
+  __typename: "LiquidityProviderFeeShare";
   /**
    * The liquidity provider party id
    */
@@ -375,15 +362,15 @@ export interface MarketsQuery_markets_data_liquidityProviderFeeShare {
    */
   equityLikeShare: string;
   /**
-   * the average entry valuation of the liqidity provider for the market
+   * the average entry valuation of the liquidity provider for the market
    */
   averageEntryValuation: string;
 }
 
 export interface MarketsQuery_markets_data {
-  __typename: 'MarketData';
+  __typename: "MarketData";
   /**
-   * the mark price (actually an unsgined int)
+   * the mark price (actually an unsigned int)
    */
   markPrice: string;
   /**
@@ -427,7 +414,7 @@ export interface MarketsQuery_markets_data {
    */
   staticMidPrice: string;
   /**
-   * RFC3339Nano time at which this market price was releavant
+   * RFC3339Nano time at which this market price was relevant
    */
   timestamp: string;
   /**
@@ -469,9 +456,7 @@ export interface MarketsQuery_markets_data {
   /**
    * A list of valid price ranges per associated trigger
    */
-  priceMonitoringBounds:
-    | MarketsQuery_markets_data_priceMonitoringBounds[]
-    | null;
+  priceMonitoringBounds: MarketsQuery_markets_data_priceMonitoringBounds[] | null;
   /**
    * the market value proxy
    */
@@ -479,13 +464,11 @@ export interface MarketsQuery_markets_data {
   /**
    * the equity like share of liquidity fee for each liquidity provider
    */
-  liquidityProviderFeeShare:
-    | MarketsQuery_markets_data_liquidityProviderFeeShare[]
-    | null;
+  liquidityProviderFeeShare: MarketsQuery_markets_data_liquidityProviderFeeShare[] | null;
 }
 
 export interface MarketsQuery_markets {
-  __typename: 'Market';
+  __typename: "Market";
   /**
    * Market ID
    */
@@ -505,14 +488,14 @@ export interface MarketsQuery_markets {
   /**
    * decimalPlaces indicates the number of decimal places that an integer must be shifted by in order to get a correct
    * number denominated in the currency of the Market. (uint64)
-   *
+   * 
    * Examples:
    * Currency     Balance  decimalPlaces  Real Balance
    * GBP              100              0       GBP 100
    * GBP              100              2       GBP   1.00
    * GBP              100              4       GBP   0.01
    * GBP                1              4       GBP   0.0001   (  0.01p  )
-   *
+   * 
    * GBX (pence)      100              0       GBP   1.00     (100p     )
    * GBX (pence)      100              2       GBP   0.01     (  1p     )
    * GBX (pence)      100              4       GBP   0.0001   (  0.01p  )
diff --git a/apps/explorer/src/app/routes/network-parameters/__generated__/NetworkParametersQuery.ts b/libs/graphql/src/__generated__/NetworkParametersQuery.ts
similarity index 100%
rename from apps/explorer/src/app/routes/network-parameters/__generated__/NetworkParametersQuery.ts
rename to libs/graphql/src/__generated__/NetworkParametersQuery.ts
diff --git a/apps/explorer/src/app/routes/validators/__generated__/NodesQuery.ts b/libs/graphql/src/__generated__/NodesQuery.ts
similarity index 90%
rename from apps/explorer/src/app/routes/validators/__generated__/NodesQuery.ts
rename to libs/graphql/src/__generated__/NodesQuery.ts
index e926f6466..0b8079143 100644
--- a/apps/explorer/src/app/routes/validators/__generated__/NodesQuery.ts
+++ b/libs/graphql/src/__generated__/NodesQuery.ts
@@ -3,14 +3,14 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import { NodeStatus } from './../../../../__generated__/globalTypes';
+import { NodeStatus } from "./globalTypes";
 
 // ====================================================
 // GraphQL query operation: NodesQuery
 // ====================================================
 
 export interface NodesQuery_nodes_epochData {
-  __typename: 'EpochData';
+  __typename: "EpochData";
   /**
    * Total number of epochs since node was created
    */
@@ -26,7 +26,7 @@ export interface NodesQuery_nodes_epochData {
 }
 
 export interface NodesQuery_nodes {
-  __typename: 'Node';
+  __typename: "Node";
   /**
    * The node url eg n01.vega.xyz
    */
@@ -71,8 +71,6 @@ export interface NodesQuery_nodes {
   pendingStake: string;
   epochData: NodesQuery_nodes_epochData | null;
   status: NodeStatus;
-  score: string;
-  normalisedScore: string;
 }
 
 export interface NodesQuery {
diff --git a/libs/graphql/src/__generated__/OrderEvent.ts b/libs/graphql/src/__generated__/OrderEvent.ts
new file mode 100644
index 000000000..9d93b9fbf
--- /dev/null
+++ b/libs/graphql/src/__generated__/OrderEvent.ts
@@ -0,0 +1,91 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+import { BusEventType, OrderType, OrderStatus, OrderRejectionReason } from "./globalTypes";
+
+// ====================================================
+// GraphQL subscription operation: OrderEvent
+// ====================================================
+
+export interface OrderEvent_busEvents_event_TimeUpdate {
+  __typename: "TimeUpdate" | "MarketEvent" | "TransferResponses" | "PositionResolution" | "Trade" | "Account" | "Party" | "MarginLevels" | "Proposal" | "Vote" | "MarketData" | "NodeSignature" | "LossSocialization" | "SettlePosition" | "Market" | "Asset" | "MarketTick" | "SettleDistressed" | "AuctionEvent" | "RiskFactor" | "Deposit" | "Withdrawal" | "OracleSpec" | "LiquidityProvision";
+}
+
+export interface OrderEvent_busEvents_event_Order_market {
+  __typename: "Market";
+  /**
+   * Market full name
+   */
+  name: string;
+}
+
+export interface OrderEvent_busEvents_event_Order {
+  __typename: "Order";
+  /**
+   * Type the order type (defaults to PARTY)
+   */
+  type: OrderType | null;
+  /**
+   * Hash of the order data
+   */
+  id: string;
+  /**
+   * The status of an order, for example 'Active'
+   */
+  status: OrderStatus;
+  /**
+   * Reason for the order to be rejected
+   */
+  rejectionReason: OrderRejectionReason | null;
+  /**
+   * RFC3339Nano formatted date and time for when the order was created (timestamp)
+   */
+  createdAt: string;
+  /**
+   * Total number of contracts that may be bought or sold (immutable) (uint64)
+   */
+  size: string;
+  /**
+   * The worst price the order will trade at (e.g. buy for price or less, sell for price or more) (uint64)
+   */
+  price: string;
+  /**
+   * The market the order is trading on (probably stored internally as a hash of the market details)
+   */
+  market: OrderEvent_busEvents_event_Order_market | null;
+}
+
+export type OrderEvent_busEvents_event = OrderEvent_busEvents_event_TimeUpdate | OrderEvent_busEvents_event_Order;
+
+export interface OrderEvent_busEvents {
+  __typename: "BusEvent";
+  /**
+   * the id for this event
+   */
+  eventId: string;
+  /**
+   * the block hash
+   */
+  block: string;
+  /**
+   * the type of event we're dealing with
+   */
+  type: BusEventType;
+  /**
+   * the payload - the wrapped event
+   */
+  event: OrderEvent_busEvents_event;
+}
+
+export interface OrderEvent {
+  /**
+   * Subscribe to event data from the event bus
+   */
+  busEvents: OrderEvent_busEvents[] | null;
+}
+
+export interface OrderEventVariables {
+  partyId: string;
+}
diff --git a/apps/explorer/src/app/routes/parties/id/__generated__/PartyAssetsQuery.ts b/libs/graphql/src/__generated__/PartyAssetsQuery.ts
similarity index 81%
rename from apps/explorer/src/app/routes/parties/id/__generated__/PartyAssetsQuery.ts
rename to libs/graphql/src/__generated__/PartyAssetsQuery.ts
index 0f9807f74..1fe3f42fa 100644
--- a/apps/explorer/src/app/routes/parties/id/__generated__/PartyAssetsQuery.ts
+++ b/libs/graphql/src/__generated__/PartyAssetsQuery.ts
@@ -3,14 +3,14 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import { AccountType } from '../../../../../__generated__/globalTypes';
+import { AccountType } from "./globalTypes";
 
 // ====================================================
 // GraphQL query operation: PartyAssetsQuery
 // ====================================================
 
 export interface PartyAssetsQuery_party_delegations_node {
-  __typename: 'Node';
+  __typename: "Node";
   /**
    * The node url eg n01.vega.xyz
    */
@@ -19,7 +19,7 @@ export interface PartyAssetsQuery_party_delegations_node {
 }
 
 export interface PartyAssetsQuery_party_delegations {
-  __typename: 'Delegation';
+  __typename: "Delegation";
   /**
    * Amount delegated
    */
@@ -35,7 +35,7 @@ export interface PartyAssetsQuery_party_delegations {
 }
 
 export interface PartyAssetsQuery_party_stake {
-  __typename: 'PartyStake';
+  __typename: "PartyStake";
   /**
    * The stake currently available for the party
    */
@@ -43,23 +43,21 @@ export interface PartyAssetsQuery_party_stake {
 }
 
 export interface PartyAssetsQuery_party_accounts_asset_source_BuiltinAsset {
-  __typename: 'BuiltinAsset';
+  __typename: "BuiltinAsset";
 }
 
 export interface PartyAssetsQuery_party_accounts_asset_source_ERC20 {
-  __typename: 'ERC20';
+  __typename: "ERC20";
   /**
    * The address of the erc20 contract
    */
   contractAddress: string;
 }
 
-export type PartyAssetsQuery_party_accounts_asset_source =
-  | PartyAssetsQuery_party_accounts_asset_source_BuiltinAsset
-  | PartyAssetsQuery_party_accounts_asset_source_ERC20;
+export type PartyAssetsQuery_party_accounts_asset_source = PartyAssetsQuery_party_accounts_asset_source_BuiltinAsset | PartyAssetsQuery_party_accounts_asset_source_ERC20;
 
 export interface PartyAssetsQuery_party_accounts_asset {
-  __typename: 'Asset';
+  __typename: "Asset";
   /**
    * The full name of the asset (e.g: Great British Pound)
    */
@@ -83,7 +81,7 @@ export interface PartyAssetsQuery_party_accounts_asset {
 }
 
 export interface PartyAssetsQuery_party_accounts {
-  __typename: 'Account';
+  __typename: "Account";
   /**
    * Asset, the 'currency'
    */
@@ -99,14 +97,14 @@ export interface PartyAssetsQuery_party_accounts {
 }
 
 export interface PartyAssetsQuery_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
   id: string;
   delegations: PartyAssetsQuery_party_delegations[] | null;
   /**
-   * The staking informations for this Party
+   * The staking information for this Party
    */
   stake: PartyAssetsQuery_party_stake;
   /**
@@ -123,5 +121,5 @@ export interface PartyAssetsQuery {
 }
 
 export interface PartyAssetsQueryVariables {
-  partyId: string | undefined;
+  partyId: string;
 }
diff --git a/apps/explorer/src/app/routes/governance/__generated__/ProposalsQuery.ts b/libs/graphql/src/__generated__/ProposalsQuery.ts
similarity index 81%
rename from apps/explorer/src/app/routes/governance/__generated__/ProposalsQuery.ts
rename to libs/graphql/src/__generated__/ProposalsQuery.ts
index c19e3ff2d..f47bef14f 100644
--- a/apps/explorer/src/app/routes/governance/__generated__/ProposalsQuery.ts
+++ b/libs/graphql/src/__generated__/ProposalsQuery.ts
@@ -3,26 +3,26 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import {
-  ProposalState,
-  ProposalRejectionReason,
-  VoteValue,
-} from './../../../../__generated__/globalTypes';
+import { ProposalState, ProposalRejectionReason, VoteValue } from "./globalTypes";
 
 // ====================================================
 // GraphQL query operation: ProposalsQuery
 // ====================================================
 
 export interface ProposalsQuery_proposals_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
   id: string;
 }
 
+export interface ProposalsQuery_proposals_terms_change_NewFreeform {
+  __typename: "NewFreeform";
+}
+
 export interface ProposalsQuery_proposals_terms_change_NewMarket_instrument {
-  __typename: 'InstrumentConfiguration';
+  __typename: "InstrumentConfiguration";
   /**
    * Full and fairly descriptive name for the instrument
    */
@@ -30,7 +30,7 @@ export interface ProposalsQuery_proposals_terms_change_NewMarket_instrument {
 }
 
 export interface ProposalsQuery_proposals_terms_change_NewMarket {
-  __typename: 'NewMarket';
+  __typename: "NewMarket";
   /**
    * New market instrument configuration
    */
@@ -38,12 +38,12 @@ export interface ProposalsQuery_proposals_terms_change_NewMarket {
 }
 
 export interface ProposalsQuery_proposals_terms_change_UpdateMarket {
-  __typename: 'UpdateMarket';
+  __typename: "UpdateMarket";
   marketId: string;
 }
 
 export interface ProposalsQuery_proposals_terms_change_NewAsset_source_BuiltinAsset {
-  __typename: 'BuiltinAsset';
+  __typename: "BuiltinAsset";
   /**
    * Maximum amount that can be requested by a party through the built-in asset faucet at a time
    */
@@ -51,19 +51,17 @@ export interface ProposalsQuery_proposals_terms_change_NewAsset_source_BuiltinAs
 }
 
 export interface ProposalsQuery_proposals_terms_change_NewAsset_source_ERC20 {
-  __typename: 'ERC20';
+  __typename: "ERC20";
   /**
    * The address of the erc20 contract
    */
   contractAddress: string;
 }
 
-export type ProposalsQuery_proposals_terms_change_NewAsset_source =
-  | ProposalsQuery_proposals_terms_change_NewAsset_source_BuiltinAsset
-  | ProposalsQuery_proposals_terms_change_NewAsset_source_ERC20;
+export type ProposalsQuery_proposals_terms_change_NewAsset_source = ProposalsQuery_proposals_terms_change_NewAsset_source_BuiltinAsset | ProposalsQuery_proposals_terms_change_NewAsset_source_ERC20;
 
 export interface ProposalsQuery_proposals_terms_change_NewAsset {
-  __typename: 'NewAsset';
+  __typename: "NewAsset";
   /**
    * The symbol of the asset (e.g: GBP)
    */
@@ -75,7 +73,7 @@ export interface ProposalsQuery_proposals_terms_change_NewAsset {
 }
 
 export interface ProposalsQuery_proposals_terms_change_UpdateNetworkParameter_networkParameter {
-  __typename: 'NetworkParameter';
+  __typename: "NetworkParameter";
   /**
    * The name of the network parameter
    */
@@ -87,18 +85,14 @@ export interface ProposalsQuery_proposals_terms_change_UpdateNetworkParameter_ne
 }
 
 export interface ProposalsQuery_proposals_terms_change_UpdateNetworkParameter {
-  __typename: 'UpdateNetworkParameter';
+  __typename: "UpdateNetworkParameter";
   networkParameter: ProposalsQuery_proposals_terms_change_UpdateNetworkParameter_networkParameter;
 }
 
-export type ProposalsQuery_proposals_terms_change =
-  | ProposalsQuery_proposals_terms_change_NewMarket
-  | ProposalsQuery_proposals_terms_change_UpdateMarket
-  | ProposalsQuery_proposals_terms_change_NewAsset
-  | ProposalsQuery_proposals_terms_change_UpdateNetworkParameter;
+export type ProposalsQuery_proposals_terms_change = ProposalsQuery_proposals_terms_change_NewFreeform | ProposalsQuery_proposals_terms_change_NewMarket | ProposalsQuery_proposals_terms_change_UpdateMarket | ProposalsQuery_proposals_terms_change_NewAsset | ProposalsQuery_proposals_terms_change_UpdateNetworkParameter;
 
 export interface ProposalsQuery_proposals_terms {
-  __typename: 'ProposalTerms';
+  __typename: "ProposalTerms";
   /**
    * RFC3339Nano time and date when voting closes for this proposal.
    * Constrained by "minClose" and "maxClose" network parameters.
@@ -116,7 +110,7 @@ export interface ProposalsQuery_proposals_terms {
 }
 
 export interface ProposalsQuery_proposals_votes_yes_votes_party_stake {
-  __typename: 'PartyStake';
+  __typename: "PartyStake";
   /**
    * The stake currently available for the party
    */
@@ -124,19 +118,19 @@ export interface ProposalsQuery_proposals_votes_yes_votes_party_stake {
 }
 
 export interface ProposalsQuery_proposals_votes_yes_votes_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
   id: string;
   /**
-   * The staking informations for this Party
+   * The staking information for this Party
    */
   stake: ProposalsQuery_proposals_votes_yes_votes_party_stake;
 }
 
 export interface ProposalsQuery_proposals_votes_yes_votes {
-  __typename: 'Vote';
+  __typename: "Vote";
   /**
    * The vote value cast
    */
@@ -152,7 +146,7 @@ export interface ProposalsQuery_proposals_votes_yes_votes {
 }
 
 export interface ProposalsQuery_proposals_votes_yes {
-  __typename: 'ProposalVoteSide';
+  __typename: "ProposalVoteSide";
   /**
    * Total tokens of governance token from the votes casted for this side
    */
@@ -168,7 +162,7 @@ export interface ProposalsQuery_proposals_votes_yes {
 }
 
 export interface ProposalsQuery_proposals_votes_no_votes_party_stake {
-  __typename: 'PartyStake';
+  __typename: "PartyStake";
   /**
    * The stake currently available for the party
    */
@@ -176,19 +170,19 @@ export interface ProposalsQuery_proposals_votes_no_votes_party_stake {
 }
 
 export interface ProposalsQuery_proposals_votes_no_votes_party {
-  __typename: 'Party';
+  __typename: "Party";
   /**
    * Party identifier
    */
   id: string;
   /**
-   * The staking informations for this Party
+   * The staking information for this Party
    */
   stake: ProposalsQuery_proposals_votes_no_votes_party_stake;
 }
 
 export interface ProposalsQuery_proposals_votes_no_votes {
-  __typename: 'Vote';
+  __typename: "Vote";
   /**
    * The vote value cast
    */
@@ -204,7 +198,7 @@ export interface ProposalsQuery_proposals_votes_no_votes {
 }
 
 export interface ProposalsQuery_proposals_votes_no {
-  __typename: 'ProposalVoteSide';
+  __typename: "ProposalVoteSide";
   /**
    * Total tokens of governance token from the votes casted for this side
    */
@@ -220,7 +214,7 @@ export interface ProposalsQuery_proposals_votes_no {
 }
 
 export interface ProposalsQuery_proposals_votes {
-  __typename: 'ProposalVotes';
+  __typename: "ProposalVotes";
   /**
    * Yes votes cast for this proposal
    */
@@ -232,7 +226,7 @@ export interface ProposalsQuery_proposals_votes {
 }
 
 export interface ProposalsQuery_proposals {
-  __typename: 'Proposal';
+  __typename: "Proposal";
   /**
    * Proposal ID that is filled by VEGA once proposal reaches the network
    */
diff --git a/libs/graphql/src/__generated__/globalTypes.ts b/libs/graphql/src/__generated__/globalTypes.ts
new file mode 100644
index 000000000..e4c7a3e64
--- /dev/null
+++ b/libs/graphql/src/__generated__/globalTypes.ts
@@ -0,0 +1,234 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+//==============================================================
+// START Enums and Input Objects
+//==============================================================
+
+/**
+ * The various account types we have (used by collateral)
+ */
+export enum AccountType {
+  Bond = "Bond",
+  External = "External",
+  FeeInfrastructure = "FeeInfrastructure",
+  FeeLiquidity = "FeeLiquidity",
+  FeeMaker = "FeeMaker",
+  General = "General",
+  GlobalInsurance = "GlobalInsurance",
+  GlobalReward = "GlobalReward",
+  Insurance = "Insurance",
+  LockWithdraw = "LockWithdraw",
+  Margin = "Margin",
+  PendingTransfers = "PendingTransfers",
+  RewardLpReceivedFees = "RewardLpReceivedFees",
+  RewardMakerReceivedFees = "RewardMakerReceivedFees",
+  RewardMarketProposers = "RewardMarketProposers",
+  RewardTakerPaidFees = "RewardTakerPaidFees",
+  Settlement = "Settlement",
+}
+
+export enum AuctionTrigger {
+  Batch = "Batch",
+  Liquidity = "Liquidity",
+  Opening = "Opening",
+  Price = "Price",
+  Unspecified = "Unspecified",
+}
+
+export enum BusEventType {
+  Account = "Account",
+  Asset = "Asset",
+  Auction = "Auction",
+  Deposit = "Deposit",
+  LiquidityProvision = "LiquidityProvision",
+  LossSocialization = "LossSocialization",
+  MarginLevels = "MarginLevels",
+  Market = "Market",
+  MarketCreated = "MarketCreated",
+  MarketData = "MarketData",
+  MarketTick = "MarketTick",
+  MarketUpdated = "MarketUpdated",
+  NodeSignature = "NodeSignature",
+  OracleSpec = "OracleSpec",
+  Order = "Order",
+  Party = "Party",
+  PositionResolution = "PositionResolution",
+  Proposal = "Proposal",
+  RiskFactor = "RiskFactor",
+  SettleDistressed = "SettleDistressed",
+  SettlePosition = "SettlePosition",
+  TimeUpdate = "TimeUpdate",
+  Trade = "Trade",
+  TransferResponses = "TransferResponses",
+  Vote = "Vote",
+  Withdrawal = "Withdrawal",
+}
+
+/**
+ * The current state of a market
+ */
+export enum MarketState {
+  Active = "Active",
+  Cancelled = "Cancelled",
+  Closed = "Closed",
+  Pending = "Pending",
+  Proposed = "Proposed",
+  Rejected = "Rejected",
+  Settled = "Settled",
+  Suspended = "Suspended",
+  TradingTerminated = "TradingTerminated",
+}
+
+/**
+ * What market trading mode are we in
+ */
+export enum MarketTradingMode {
+  BatchAuction = "BatchAuction",
+  Continuous = "Continuous",
+  MonitoringAuction = "MonitoringAuction",
+  OpeningAuction = "OpeningAuction",
+}
+
+export enum NodeStatus {
+  NonValidator = "NonValidator",
+  Validator = "Validator",
+}
+
+/**
+ * Reason for the order being rejected by the core node
+ */
+export enum OrderRejectionReason {
+  AmendToGTTWithoutExpiryAt = "AmendToGTTWithoutExpiryAt",
+  CannotAmendFromGFAOrGFN = "CannotAmendFromGFAOrGFN",
+  CannotAmendPeggedOrderDetailsOnNonPeggedOrder = "CannotAmendPeggedOrderDetailsOnNonPeggedOrder",
+  CannotAmendToFOKOrIOC = "CannotAmendToFOKOrIOC",
+  CannotAmendToGFAOrGFN = "CannotAmendToGFAOrGFN",
+  EditNotAllowed = "EditNotAllowed",
+  ExpiryAtBeforeCreatedAt = "ExpiryAtBeforeCreatedAt",
+  FOKOrderDuringAuction = "FOKOrderDuringAuction",
+  GFAOrderDuringContinuousTrading = "GFAOrderDuringContinuousTrading",
+  GFNOrderDuringAuction = "GFNOrderDuringAuction",
+  GTCWithExpiryAtNotValid = "GTCWithExpiryAtNotValid",
+  IOCOrderDuringAuction = "IOCOrderDuringAuction",
+  InsufficientAssetBalance = "InsufficientAssetBalance",
+  InsufficientFundsToPayFees = "InsufficientFundsToPayFees",
+  InternalError = "InternalError",
+  InvalidExpirationTime = "InvalidExpirationTime",
+  InvalidMarketId = "InvalidMarketId",
+  InvalidMarketType = "InvalidMarketType",
+  InvalidOrderId = "InvalidOrderId",
+  InvalidOrderReference = "InvalidOrderReference",
+  InvalidPartyId = "InvalidPartyId",
+  InvalidPersistence = "InvalidPersistence",
+  InvalidRemainingSize = "InvalidRemainingSize",
+  InvalidSize = "InvalidSize",
+  InvalidTimeInForce = "InvalidTimeInForce",
+  InvalidType = "InvalidType",
+  MarginCheckFailed = "MarginCheckFailed",
+  MarketClosed = "MarketClosed",
+  MissingGeneralAccount = "MissingGeneralAccount",
+  NonPersistentOrderExceedsPriceBounds = "NonPersistentOrderExceedsPriceBounds",
+  OrderAmendFailure = "OrderAmendFailure",
+  OrderNotFound = "OrderNotFound",
+  OrderOutOfSequence = "OrderOutOfSequence",
+  OrderRemovalFailure = "OrderRemovalFailure",
+  PeggedOrderBuyCannotReferenceBestAskPrice = "PeggedOrderBuyCannotReferenceBestAskPrice",
+  PeggedOrderMustBeGTTOrGTC = "PeggedOrderMustBeGTTOrGTC",
+  PeggedOrderMustBeLimitOrder = "PeggedOrderMustBeLimitOrder",
+  PeggedOrderOffsetMustBeGreaterOrEqualToZero = "PeggedOrderOffsetMustBeGreaterOrEqualToZero",
+  PeggedOrderOffsetMustBeGreaterThanZero = "PeggedOrderOffsetMustBeGreaterThanZero",
+  PeggedOrderSellCannotReferenceBestBidPrice = "PeggedOrderSellCannotReferenceBestBidPrice",
+  PeggedOrderWithoutReferencePrice = "PeggedOrderWithoutReferencePrice",
+  SelfTrading = "SelfTrading",
+  TimeFailure = "TimeFailure",
+  UnableToAmendPeggedOrderPrice = "UnableToAmendPeggedOrderPrice",
+  UnableToRepricePeggedOrder = "UnableToRepricePeggedOrder",
+}
+
+/**
+ * Valid order statuses, these determine several states for an order that cannot be expressed with other fields in Order.
+ */
+export enum OrderStatus {
+  Active = "Active",
+  Cancelled = "Cancelled",
+  Expired = "Expired",
+  Filled = "Filled",
+  Parked = "Parked",
+  PartiallyFilled = "PartiallyFilled",
+  Rejected = "Rejected",
+  Stopped = "Stopped",
+}
+
+export enum OrderType {
+  Limit = "Limit",
+  Market = "Market",
+  Network = "Network",
+}
+
+/**
+ * Reason for the proposal being rejected by the core node
+ */
+export enum ProposalRejectionReason {
+  CloseTimeTooLate = "CloseTimeTooLate",
+  CloseTimeTooSoon = "CloseTimeTooSoon",
+  CouldNotInstantiateMarket = "CouldNotInstantiateMarket",
+  EnactTimeTooLate = "EnactTimeTooLate",
+  EnactTimeTooSoon = "EnactTimeTooSoon",
+  IncompatibleTimestamps = "IncompatibleTimestamps",
+  InsufficientTokens = "InsufficientTokens",
+  InvalidAsset = "InvalidAsset",
+  InvalidAssetDetails = "InvalidAssetDetails",
+  InvalidFeeAmount = "InvalidFeeAmount",
+  InvalidFutureMaturityTimestamp = "InvalidFutureMaturityTimestamp",
+  InvalidFutureProduct = "InvalidFutureProduct",
+  InvalidInstrumentSecurity = "InvalidInstrumentSecurity",
+  InvalidRiskParameter = "InvalidRiskParameter",
+  InvalidShape = "InvalidShape",
+  MajorityThresholdNotReached = "MajorityThresholdNotReached",
+  MarketMissingLiquidityCommitment = "MarketMissingLiquidityCommitment",
+  MissingBuiltinAssetField = "MissingBuiltinAssetField",
+  MissingCommitmentAmount = "MissingCommitmentAmount",
+  MissingERC20ContractAddress = "MissingERC20ContractAddress",
+  NetworkParameterInvalidKey = "NetworkParameterInvalidKey",
+  NetworkParameterInvalidValue = "NetworkParameterInvalidValue",
+  NetworkParameterValidationFailed = "NetworkParameterValidationFailed",
+  NoProduct = "NoProduct",
+  NoRiskParameters = "NoRiskParameters",
+  NoTradingMode = "NoTradingMode",
+  NodeValidationFailed = "NodeValidationFailed",
+  OpeningAuctionDurationTooLarge = "OpeningAuctionDurationTooLarge",
+  OpeningAuctionDurationTooSmall = "OpeningAuctionDurationTooSmall",
+  ParticipationThresholdNotReached = "ParticipationThresholdNotReached",
+  ProductMaturityIsPassed = "ProductMaturityIsPassed",
+  UnsupportedProduct = "UnsupportedProduct",
+  UnsupportedTradingMode = "UnsupportedTradingMode",
+}
+
+/**
+ * Various states a proposal can transition through:
+ * Open ->
+ * - Passed -> Enacted.
+ * - Rejected.
+ * Proposal can enter Failed state from any other state.
+ */
+export enum ProposalState {
+  Declined = "Declined",
+  Enacted = "Enacted",
+  Failed = "Failed",
+  Open = "Open",
+  Passed = "Passed",
+  Rejected = "Rejected",
+  WaitingForNodeVote = "WaitingForNodeVote",
+}
+
+export enum VoteValue {
+  No = "No",
+  Yes = "Yes",
+}
+
+//==============================================================
+// END Enums and Input Objects
+//==============================================================
diff --git a/libs/graphql/src/index.ts b/libs/graphql/src/index.ts
new file mode 100644
index 000000000..3e7077947
--- /dev/null
+++ b/libs/graphql/src/index.ts
@@ -0,0 +1,13 @@
+export * from './__generated__/AssetsQuery';
+export * from './__generated__/globalTypes';
+export * from './__generated__/Guess';
+export * from './__generated__/Market';
+export * from './__generated__/Markets';
+export * from './__generated__/MarketsQuery';
+export * from './__generated__/MarketDataSub';
+export * from './__generated__/MarketDataFields';
+export * from './__generated__/NetworkParametersQuery';
+export * from './__generated__/NodesQuery';
+export * from './__generated__/OrderEvent';
+export * from './__generated__/PartyAssetsQuery';
+export * from './__generated__/ProposalsQuery';
diff --git a/libs/graphql/tsconfig.json b/libs/graphql/tsconfig.json
new file mode 100644
index 000000000..4c089585e
--- /dev/null
+++ b/libs/graphql/tsconfig.json
@@ -0,0 +1,25 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "allowJs": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}
diff --git a/libs/graphql/tsconfig.lib.json b/libs/graphql/tsconfig.lib.json
new file mode 100644
index 000000000..252904bb7
--- /dev/null
+++ b/libs/graphql/tsconfig.lib.json
@@ -0,0 +1,22 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": ["node"]
+  },
+  "files": [
+    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nrwl/react/typings/image.d.ts"
+  ],
+  "exclude": [
+    "**/*.spec.ts",
+    "**/*.test.ts",
+    "**/*.spec.tsx",
+    "**/*.test.tsx",
+    "**/*.spec.js",
+    "**/*.test.js",
+    "**/*.spec.jsx",
+    "**/*.test.jsx"
+  ],
+  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
+}
diff --git a/libs/graphql/tsconfig.spec.json b/libs/graphql/tsconfig.spec.json
new file mode 100644
index 000000000..67f149c4c
--- /dev/null
+++ b/libs/graphql/tsconfig.spec.json
@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "include": [
+    "**/*.test.ts",
+    "**/*.spec.ts",
+    "**/*.test.tsx",
+    "**/*.spec.tsx",
+    "**/*.test.js",
+    "**/*.spec.js",
+    "**/*.test.jsx",
+    "**/*.spec.jsx",
+    "**/*.d.ts"
+  ]
+}
diff --git a/libs/market-list/.babelrc b/libs/market-list/.babelrc
new file mode 100644
index 000000000..ccae900be
--- /dev/null
+++ b/libs/market-list/.babelrc
@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "@nrwl/react/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": []
+}
diff --git a/libs/market-list/.eslintrc.json b/libs/market-list/.eslintrc.json
new file mode 100644
index 000000000..734ddacee
--- /dev/null
+++ b/libs/market-list/.eslintrc.json
@@ -0,0 +1,18 @@
+{
+  "extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/libs/market-list/README.md b/libs/market-list/README.md
new file mode 100644
index 000000000..129c47d2b
--- /dev/null
+++ b/libs/market-list/README.md
@@ -0,0 +1,7 @@
+# market-list
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test market-list` to execute the unit tests via [Jest](https://jestjs.io).
diff --git a/libs/market-list/jest.config.js b/libs/market-list/jest.config.js
new file mode 100644
index 000000000..a5c40cc3b
--- /dev/null
+++ b/libs/market-list/jest.config.js
@@ -0,0 +1,9 @@
+module.exports = {
+  displayName: 'market-list',
+  preset: '../../jest.preset.js',
+  transform: {
+    '^.+\\.[tj]sx?$': 'babel-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../../coverage/libs/market-list',
+};
diff --git a/libs/market-list/package.json b/libs/market-list/package.json
new file mode 100644
index 000000000..3dd740a11
--- /dev/null
+++ b/libs/market-list/package.json
@@ -0,0 +1,4 @@
+{
+  "name": "@vegaprotocol/market-list",
+  "version": "0.0.1"
+}
diff --git a/libs/market-list/project.json b/libs/market-list/project.json
new file mode 100644
index 000000000..cbd8cd093
--- /dev/null
+++ b/libs/market-list/project.json
@@ -0,0 +1,43 @@
+{
+  "root": "libs/market-list",
+  "sourceRoot": "libs/market-list/src",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "build": {
+      "executor": "@nrwl/web:rollup",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/libs/market-list",
+        "tsConfig": "libs/market-list/tsconfig.lib.json",
+        "project": "libs/market-list/package.json",
+        "entryFile": "libs/market-list/src/index.ts",
+        "external": ["react/jsx-runtime"],
+        "rollupConfig": "@nrwl/react/plugins/bundle-rollup",
+        "compiler": "babel",
+        "assets": [
+          {
+            "glob": "libs/market-list/README.md",
+            "input": ".",
+            "output": "."
+          }
+        ]
+      }
+    },
+    "lint": {
+      "executor": "@nrwl/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["libs/market-list/**/*.{ts,tsx,js,jsx}"]
+      }
+    },
+    "test": {
+      "executor": "@nrwl/jest:jest",
+      "outputs": ["coverage/libs/market-list"],
+      "options": {
+        "jestConfig": "libs/market-list/jest.config.js",
+        "passWithNoTests": true
+      }
+    }
+  }
+}
diff --git a/libs/market-list/src/index.ts b/libs/market-list/src/index.ts
new file mode 100644
index 000000000..a681b7d24
--- /dev/null
+++ b/libs/market-list/src/index.ts
@@ -0,0 +1 @@
+export * from './lib/market-list-table';
diff --git a/libs/market-list/src/lib/market-list-table.spec.tsx b/libs/market-list/src/lib/market-list-table.spec.tsx
new file mode 100644
index 000000000..1989c52d2
--- /dev/null
+++ b/libs/market-list/src/lib/market-list-table.spec.tsx
@@ -0,0 +1,14 @@
+import { render } from '@testing-library/react';
+import { MockedProvider } from '@apollo/react-testing';
+import MarketListTable from './market-list-table';
+
+describe('MarketListTable', () => {
+  it('should render successfully', () => {
+    const { baseElement } = render(
+      <MockedProvider>
+        <MarketListTable width={100} height={100} />
+      </MockedProvider>
+    );
+    expect(baseElement).toBeTruthy();
+  });
+});
diff --git a/libs/market-list/src/lib/market-list-table.tsx b/libs/market-list/src/lib/market-list-table.tsx
new file mode 100644
index 000000000..70afd331e
--- /dev/null
+++ b/libs/market-list/src/lib/market-list-table.tsx
@@ -0,0 +1,88 @@
+import type { GridApi, ValueFormatterParams } from 'ag-grid-community';
+import {
+  PriceCell,
+  formatNumber,
+  useApplyGridTransaction,
+} from '@vegaprotocol/react-helpers';
+import { AgGridDynamic as AgGrid } from '@vegaprotocol/ui-toolkit';
+import { Markets_markets } from '@vegaprotocol/graphql';
+import { AgGridColumn } from 'ag-grid-react';
+import { useRef, useState } from 'react';
+
+interface MarketListTableProps {
+  markets: Markets_markets[];
+  onRowClicked: (marketId: string) => void;
+}
+
+export const MarketListTable = ({
+  markets,
+  onRowClicked,
+}: MarketListTableProps) => {
+  const [initialMarkets] = useState(markets);
+  const gridApi = useRef<GridApi | null>(null);
+  useApplyGridTransaction(markets, gridApi.current);
+
+  return (
+    <AgGrid
+      style={{ width: '100%', height: '100%' }}
+      overlayNoRowsTemplate="No markets"
+      rowData={initialMarkets}
+      getRowNodeId={(data) => data.id}
+      defaultColDef={{
+        flex: 1,
+        resizable: true,
+      }}
+      onGridReady={(params) => {
+        gridApi.current = params.api;
+      }}
+      onRowClicked={({ data }) => onRowClicked(data.id)}
+      components={{ PriceCell }}
+    >
+      <AgGridColumn
+        headerName="Market"
+        field="tradableInstrument.instrument.code"
+      />
+      <AgGridColumn
+        headerName="Settlement asset"
+        field="tradableInstrument.instrument.product.settlementAsset.symbol"
+      />
+      <AgGridColumn
+        headerName="State"
+        field="data"
+        valueFormatter={({ value }: ValueFormatterParams) =>
+          `${value.market.state} (${value.market.tradingMode})`
+        }
+      />
+      <AgGridColumn
+        headerName="Best bid"
+        field="data.bestBidPrice"
+        type="rightAligned"
+        cellRenderer="PriceCell"
+        valueFormatter={({ value, data }: ValueFormatterParams) =>
+          formatNumber(value, data.decimalPlaces)
+        }
+      />
+      <AgGridColumn
+        headerName="Best offer"
+        field="data.bestOfferPrice"
+        type="rightAligned"
+        valueFormatter={({ value, data }: ValueFormatterParams) =>
+          formatNumber(value, data.decimalPlaces)
+        }
+        cellRenderer="PriceCell"
+      />
+      <AgGridColumn
+        headerName="Mark price"
+        field="data.markPrice"
+        type="rightAligned"
+        cellRenderer="PriceCell"
+        valueFormatter={({ value, data }: ValueFormatterParams) =>
+          formatNumber(value, data.decimalPlaces)
+        }
+      />
+      <AgGridColumn headerName="Description" field="name" />
+    </AgGrid>
+  );
+};
+
+export default MarketListTable;
diff --git a/libs/market-list/src/lib/summary-cell.tsx b/libs/market-list/src/lib/summary-cell.tsx
new file mode 100644
index 000000000..1d558ee9d
--- /dev/null
+++ b/libs/market-list/src/lib/summary-cell.tsx
@@ -0,0 +1,29 @@
+import * as React from 'react';
+
+/*
+import { useMarketOverview } from '../../../../hooks/use-market-overview'
+import { colorByMarketMovement } from '../../../../lib/vega-colours'
+import { Sparkline } from '../../components/sparkline'
+import { VEGA_TABLE_CLASSES } from '../../components/vega-table'
+*/
+
+export interface SummaryCellProps {
+  value: string; // marketId
+}
+
+export const SummaryCellView = ({ value }: SummaryCellProps) => {
+  // const { sparkline, change, bullish } = useMarketOverview(value)
+  // const color = colorByMarketMovement(bullish)
+
+  return (
+    <>
+      {/* <Sparkline data={sparkline} style={{ marginRight: 4 }} />*/}
+      <span>{'change'}</span>
+    </>
+  );
+};
+
+SummaryCellView.displayName = 'SummaryCellView';
+
+export const SummaryCell = React.memo(SummaryCellView);
+SummaryCell.displayName = 'SummaryCell';
diff --git a/libs/market-list/tsconfig.json b/libs/market-list/tsconfig.json
new file mode 100644
index 000000000..4c089585e
--- /dev/null
+++ b/libs/market-list/tsconfig.json
@@ -0,0 +1,25 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "allowJs": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}
diff --git a/libs/market-list/tsconfig.lib.json b/libs/market-list/tsconfig.lib.json
new file mode 100644
index 000000000..252904bb7
--- /dev/null
+++ b/libs/market-list/tsconfig.lib.json
@@ -0,0 +1,22 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": ["node"]
+  },
+  "files": [
+    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nrwl/react/typings/image.d.ts"
+  ],
+  "exclude": [
+    "**/*.spec.ts",
+    "**/*.test.ts",
+    "**/*.spec.tsx",
+    "**/*.test.tsx",
+    "**/*.spec.js",
+    "**/*.test.js",
+    "**/*.spec.jsx",
+    "**/*.test.jsx"
+  ],
+  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
+}
diff --git a/libs/market-list/tsconfig.spec.json b/libs/market-list/tsconfig.spec.json
new file mode 100644
index 000000000..67f149c4c
--- /dev/null
+++ b/libs/market-list/tsconfig.spec.json
@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "include": [
+    "**/*.test.ts",
+    "**/*.spec.ts",
+    "**/*.test.tsx",
+    "**/*.spec.tsx",
+    "**/*.test.js",
+    "**/*.spec.js",
+    "**/*.test.jsx",
+    "**/*.spec.jsx",
+    "**/*.d.ts"
+  ]
+}
diff --git a/libs/react-helpers/src/hooks/use-apply-grid-transaction.ts b/libs/react-helpers/src/hooks/use-apply-grid-transaction.ts
new file mode 100644
index 000000000..4eda7be25
--- /dev/null
+++ b/libs/react-helpers/src/hooks/use-apply-grid-transaction.ts
@@ -0,0 +1,33 @@
+import { GridApi } from 'ag-grid-community';
+import { useEffect } from 'react';
+
+export const useApplyGridTransaction = <T extends { id: string }>(
+  data: T[],
+  gridApi: GridApi | null
+) => {
+  useEffect(() => {
+    if (!gridApi) return;
+
+    const update: T[] = [];
+    const add: T[] = [];
+
+    // split into updates and adds
+    data.forEach((d) => {
+      if (!gridApi) return;
+
+      const rowNode = gridApi.getRowNode(d.id);
+
+      if (rowNode) {
+        update.push(d);
+      } else {
+        add.push(d);
+      }
+    });
+
+    gridApi.applyTransaction({
+      update,
+      add,
+      addIndex: 0,
+    });
+  }, [data, gridApi]);
+};
diff --git a/libs/react-helpers/src/index.ts b/libs/react-helpers/src/index.ts
index 61504ca1d..17009c30a 100644
--- a/libs/react-helpers/src/index.ts
+++ b/libs/react-helpers/src/index.ts
@@ -1,3 +1,8 @@
 export * from './lib/context';
+export * from './lib/datetime';
+export * from './lib/decimals';
+export * from './lib/format';
+export * from './lib/grid-cells';
 export * from './lib/storage';
-export * from './lib/trading';
+
+export * from './hooks/use-apply-grid-transaction';
diff --git a/libs/react-helpers/src/lib/datetime/datetime.ts b/libs/react-helpers/src/lib/datetime/datetime.ts
new file mode 100644
index 000000000..e792f8968
--- /dev/null
+++ b/libs/react-helpers/src/lib/datetime/datetime.ts
@@ -0,0 +1,13 @@
+/** Returns date in a format suitable for input[type=date] elements */
+export const formatForInput = (date: Date) => {
+  const padZero = (num: number) => num.toString().padStart(2, '0');
+
+  const year = date.getFullYear();
+  const month = padZero(date.getMonth() + 1);
+  const day = padZero(date.getDate());
+  const hours = padZero(date.getHours());
+  const minutes = padZero(date.getMinutes());
+  const secs = padZero(date.getSeconds());
+
+  return `${year}-${month}-${day}T${hours}:${minutes}:${secs}`;
+};
diff --git a/libs/react-helpers/src/lib/datetime/index.ts b/libs/react-helpers/src/lib/datetime/index.ts
new file mode 100644
index 000000000..bb1c9cca2
--- /dev/null
+++ b/libs/react-helpers/src/lib/datetime/index.ts
@@ -0,0 +1 @@
+export * from './datetime';
diff --git a/libs/react-helpers/src/lib/decimals/index.ts b/libs/react-helpers/src/lib/decimals/index.ts
new file mode 100644
index 000000000..bedea9595
--- /dev/null
+++ b/libs/react-helpers/src/lib/decimals/index.ts
@@ -0,0 +1,12 @@
+import { BigNumber } from 'bignumber.js';
+
+export function addDecimal(value: string, decimals: number): string {
+  if (!decimals) return value;
+  return new BigNumber(value || 0)
+    .dividedBy(Math.pow(10, decimals))
+    .toFixed(decimals);
+}
+export function removeDecimal(value: string, decimals: number): string {
+  if (!decimals) return value;
+  return new BigNumber(value || 0).times(Math.pow(10, decimals)).toFixed(0);
+}
diff --git a/libs/react-helpers/src/lib/format/format.ts b/libs/react-helpers/src/lib/format/format.ts
new file mode 100644
index 000000000..cd0478c81
--- /dev/null
+++ b/libs/react-helpers/src/lib/format/format.ts
@@ -0,0 +1,54 @@
+import once from 'lodash.once';
+import memoize from 'lodash.memoize';
+import { addDecimal } from '../decimals';
+
+const getUserLocale = () => 'default';
+
+export const splitAt = (index: number) => (x: string) =>
+  [x.slice(0, index), x.slice(index)];
+
+export const getTimeFormat = once(
+  () =>
+    new Intl.DateTimeFormat(getUserLocale(), {
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric',
+    })
+);
+
+export const getDateFormat = once(
+  () =>
+    new Intl.DateTimeFormat(getUserLocale(), {
+      year: 'numeric',
+      month: 'numeric',
+      day: 'numeric',
+    })
+);
+
+export const getDateTimeFormat = once(
+  () =>
+    new Intl.DateTimeFormat(getUserLocale(), {
+      year: 'numeric',
+      month: 'numeric',
+      day: 'numeric',
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric',
+    })
+);
+
+// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat
+export const getNumberFormat = memoize(
+  (minimumFractionDigits: number) =>
+    new Intl.NumberFormat(getUserLocale(), { minimumFractionDigits })
+);
+
+export const getRelativeTimeFormat = once(
+  () => new Intl.RelativeTimeFormat(getUserLocale())
+);
+
+export const formatNumber = (rawValue: string, decimalPlaces: number) => {
+  const x = addDecimal(rawValue, decimalPlaces);
+
+  return getNumberFormat(decimalPlaces).format(Number(x));
+};
diff --git a/libs/react-helpers/src/lib/format/index.ts b/libs/react-helpers/src/lib/format/index.ts
new file mode 100644
index 000000000..16c5b2b50
--- /dev/null
+++ b/libs/react-helpers/src/lib/format/index.ts
@@ -0,0 +1 @@
+export * from './format';
diff --git a/libs/react-helpers/src/lib/grid-cells/flash-cell.tsx b/libs/react-helpers/src/lib/grid-cells/flash-cell.tsx
new file mode 100644
index 000000000..ce7db8c6b
--- /dev/null
+++ b/libs/react-helpers/src/lib/grid-cells/flash-cell.tsx
@@ -0,0 +1,98 @@
+/**
+ * A component that will display a number, and when it is updated will use animation to
+ * highlight the direction of change. This defaults to red for downwards, and green for
+ * upwards.
+ *
+ * @author Matt <matt@vega.xyz>
+ * @author Edd <edd@vega.xyz>
+ * @author John <john.walley@mulberryhousesoftware.com>
+ */
+
+import { memo, useRef, useEffect } from 'react';
+import { theme } from '@vegaprotocol/tailwindcss-config';
+import { splitAt } from '../format';
+
+const FLASH_DURATION = 800; // Duration of flash animation in milliseconds
+
+export interface FlashCellProps {
+  /**
+   * The string representation of value. It can be formatted in bespoke ways,
+   * so we can't simply convert value
+   */
+  children: string;
+  /** The numeric representation of 'children' */
+  value: number;
+}
+
+/**
+ * Given two strings, finds the index first character that has changed in string 2
+ *
+ * Used by <FlashCell /> to highlight substrings to highlight the portion of a number that has changed
+ * From: https://stackoverflow.com/questions/32858626/detect-position-of-first-difference-in-2-strings
+ *
+ * @param a String to diff
+ * @param b Second string to diff
+ * @return number Index of first different character, or -1
+ */
+export function findFirstDiffPos(a: string, b: string): number {
+  let i = 0;
+  if (a === b) return -1;
+  if (!a || !b) return -1;
+
+  while (a[i] === b[i]) i++;
+  return i;
+}
+
+/**
+ * Get value from previous render
+ */
+function usePrevious<T>(value: T): T | undefined {
+  const ref = useRef<T | undefined>();
+
+  useEffect(() => {
+    ref.current = value;
+  }, [value]);
+
+  return ref.current;
+}
+
+export const FlashCell = memo(({ children, value }: FlashCellProps) => {
+  const ref = useRef<HTMLSpanElement | null>(null);
+  const previousLabel = usePrevious(children);
+  const previousValue = usePrevious(value);
+
+  const indexOfChange = previousLabel
+    ? findFirstDiffPos(previousLabel, children)
+    : 0;
+
+  const splitText = splitAt(indexOfChange)(children);
+
+  if (indexOfChange !== -1 && previousValue !== undefined) {
+    if (value < previousValue) {
+      ref.current?.animate(
+        [
+          { color: theme.colors.vega.pink },
+          { color: theme.colors.vega.pink, offset: 0.8 },
+          { color: 'inherit' },
+        ],
+        FLASH_DURATION
+      );
+    } else if (value > previousValue) {
+      ref.current?.animate(
+        [
+          { color: theme.colors.vega.green },
+          { color: theme.colors.vega.green, offset: 0.8 },
+          { color: 'inherit' },
+        ],
+        FLASH_DURATION
+      );
+    }
+  }
+
+  return (
+    <span data-testid="flash-cell">
+      {splitText[0]}
+      <span ref={ref}>{splitText[1]}</span>
+    </span>
+  );
+});
diff --git a/libs/react-helpers/src/lib/grid-cells/index.tsx b/libs/react-helpers/src/lib/grid-cells/index.tsx
new file mode 100644
index 000000000..aa17139a9
--- /dev/null
+++ b/libs/react-helpers/src/lib/grid-cells/index.tsx
@@ -0,0 +1,2 @@
+export * from './flash-cell';
+export * from './price-cell';
diff --git a/libs/react-helpers/src/lib/grid-cells/price-cell.tsx b/libs/react-helpers/src/lib/grid-cells/price-cell.tsx
new file mode 100644
index 000000000..27daa50d1
--- /dev/null
+++ b/libs/react-helpers/src/lib/grid-cells/price-cell.tsx
@@ -0,0 +1,19 @@
+import { FlashCell } from './flash-cell';
+
+export interface IPriceCellProps {
+  value: number | bigint | null | undefined;
+  valueFormatted: string;
+}
+
+export const PriceCell = ({ value, valueFormatted }: IPriceCellProps) => {
+  if (!value || isNaN(Number(value))) return <span>-</span>;
+  return (
+    <span className="font-mono">
+      <FlashCell value={Number(value)} data-testid="price">
+        {valueFormatted}
+      </FlashCell>
+    </span>
+  );
+};
+
+PriceCell.displayName = 'PriceCell';
diff --git a/libs/react-helpers/src/lib/trading/index.tsx b/libs/react-helpers/src/lib/trading/index.tsx
deleted file mode 100644
index ad460b543..000000000
--- a/libs/react-helpers/src/lib/trading/index.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-export const Chart = () => <div>TODO: Chart</div>;
-export const Ticket = () => <div>TODO: Ticket</div>;
-export const Orderbook = () => <div>TODO: Orderbook</div>;
-export const Orders = () => <div>TODO: Orders</div>;
-export const Positions = () => <div>TODO: Positions</div>;
-export const Collateral = () => <div>TODO: Collateral</div>;
-
-export type TradingView = keyof typeof TradingViews;
-
-export const TradingViews = {
-  chart: Chart,
-  ticket: Ticket,
-  orderbook: Orderbook,
-  orders: Orders,
-  positions: Positions,
-  collateral: Collateral,
-};
diff --git a/libs/tailwindcss-config/src/theme.js b/libs/tailwindcss-config/src/theme.js
index b5f47045a..2602a06f8 100644
--- a/libs/tailwindcss-config/src/theme.js
+++ b/libs/tailwindcss-config/src/theme.js
@@ -150,11 +150,9 @@ module.exports = {
     'ui-small': ['10px', '16px'],
   },
 
-  extend: {
-    boxShadow: {
-      callout: '5px 5px 0 1px rgba(255, 255, 255, 0.05)',
-      focus: '0px 0px 0px 1px #FFFFFF, 0px 0px 3px 2px #FFE600',
-      'focus-dark': '0px 0px 0px 1px #000000, 0px 0px 3px 2px #FFE600',
-    },
+  boxShadow: {
+    callout: '5px 5px 0 1px rgba(255, 255, 255, 0.05)',
+    focus: '0px 0px 0px 1px #FFFFFF, 0px 0px 3px 2px #FFE600',
+    'focus-dark': '0px 0px 0px 1px #000000, 0px 0px 3px 2px #FFE600',
   },
 };
diff --git a/libs/ui-toolkit/.storybook/preview.js b/libs/ui-toolkit/.storybook/preview.js
index 6258bc80b..6d8a1840c 100644
--- a/libs/ui-toolkit/.storybook/preview.js
+++ b/libs/ui-toolkit/.storybook/preview.js
@@ -18,12 +18,22 @@ export const decorators = [
       </div>
     ) : (
       <div className="text-body">
-        <div className="dark bg-black p-16">
+        <StoryWrapper className="dark bg-black">
           <Story />
-        </div>
-        <div className="p-16">
+        </StoryWrapper>
+        <StoryWrapper>
           <Story />
-        </div>
+        </StoryWrapper>
       </div>
     ),
 ];
+
+const StoryWrapper = ({ children, className }) => (
+  <div className={className}>
+    <div className="p-16">
+      <div className="dark:bg-black dark:text-white-60 bg-white text-black-60">
+        {children}
+      </div>
+    </div>
+  </div>
+);
diff --git a/libs/ui-toolkit/src/components/button/button.tsx b/libs/ui-toolkit/src/components/button/button.tsx
index 6402fa382..e53d0fef0 100644
--- a/libs/ui-toolkit/src/components/button/button.tsx
+++ b/libs/ui-toolkit/src/components/button/button.tsx
@@ -128,6 +128,7 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
   (
     {
       variant = 'primary',
+      type = 'button',
       children,
       className,
       prependIconName,
@@ -137,7 +138,12 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
     ref
   ) => {
     return (
-      <button ref={ref} className={getClassName(className, variant)} {...props}>
+      <button
+        ref={ref}
+        className={getClassName(className, variant)}
+        type={type}
+        {...props}
+      >
         {getContent(children, prependIconName, appendIconName)}
       </button>
     );
diff --git a/libs/ui-toolkit/src/components/callout/callout.stories.tsx b/libs/ui-toolkit/src/components/callout/callout.stories.tsx
index 1c5da802e..249c84ea1 100644
--- a/libs/ui-toolkit/src/components/callout/callout.stories.tsx
+++ b/libs/ui-toolkit/src/components/callout/callout.stories.tsx
@@ -3,6 +3,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 
 import { Callout } from './callout';
 import { Button } from '../button';
+import { Intent } from '../../utils/intent';
 
 export default {
   title: 'Callout',
@@ -20,43 +21,43 @@ Default.args = {
 
 export const Danger = Template.bind({});
 Danger.args = {
-  intent: 'danger',
+  intent: Intent.Danger,
   children: 'Content',
 };
 
 export const Warning = Template.bind({});
 Warning.args = {
-  intent: 'warning',
+  intent: Intent.Warning,
   children: 'Content',
 };
 
 export const Prompt = Template.bind({});
 Prompt.args = {
-  intent: 'prompt',
+  intent: Intent.Prompt,
   children: 'Content',
 };
 
 export const Progress = Template.bind({});
 Progress.args = {
-  intent: 'progress',
+  intent: Intent.Progress,
   children: 'Content',
 };
 
 export const Success = Template.bind({});
 Success.args = {
-  intent: 'success',
+  intent: Intent.Success,
   children: 'Content',
 };
 
 export const Help = Template.bind({});
 Help.args = {
-  intent: 'help',
+  intent: Intent.Help,
   children: 'Content',
 };
 
 export const IconAndContent = Template.bind({});
 IconAndContent.args = {
-  intent: 'help',
+  intent: Intent.Help,
   title: 'This is what this thing does',
   iconName: 'endorsed',
   children: (
diff --git a/libs/ui-toolkit/src/components/callout/callout.test.tsx b/libs/ui-toolkit/src/components/callout/callout.test.tsx
index 561052ee1..303f9f0bd 100644
--- a/libs/ui-toolkit/src/components/callout/callout.test.tsx
+++ b/libs/ui-toolkit/src/components/callout/callout.test.tsx
@@ -1,6 +1,7 @@
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { Callout } from '.';
+import { Intent } from '../../utils/intent';
 
 test('It renders content within callout', () => {
   render(<Callout>Content</Callout>);
@@ -15,25 +16,17 @@ test('It renders title and icon', () => {
   expect(screen.getByText('title')).toBeInTheDocument();
 });
 
-const intents = ['danger', 'warning', 'prompt', 'success', 'help'] as [
-  'danger',
-  'warning',
-  'prompt',
-  'success',
-  'help'
-];
+const intents = Object.values(Intent).filter((i) => i !== Intent.Progress);
 
-intents.map((intent) =>
-  test(`Applies class for ${intent}`, () => {
-    render(<Callout intent={intent} />);
-    expect(screen.getByTestId('callout')).toHaveClass(
-      `shadow-intent-${intent}`
-    );
-  })
-);
+test.each(intents)('Applies class for %s', (intent) => {
+  render(<Callout intent={intent} />);
+  expect(screen.getByTestId('callout')).toHaveClass(
+    `shadow-intent-${intent.toLowerCase()}`
+  );
+});
 
 test(`Applies class for progress`, () => {
-  render(<Callout intent="progress" />);
+  render(<Callout intent={Intent.Progress} />);
   expect(screen.getByTestId('callout')).toHaveClass(
     'shadow-black',
     'dark:shadow-white'
diff --git a/libs/ui-toolkit/src/components/callout/callout.tsx b/libs/ui-toolkit/src/components/callout/callout.tsx
index 815e44e45..ef25176a0 100644
--- a/libs/ui-toolkit/src/components/callout/callout.tsx
+++ b/libs/ui-toolkit/src/components/callout/callout.tsx
@@ -1,10 +1,11 @@
 import classNames from 'classnames';
+import { getIntentShadow, Intent } from '../../utils/intent';
 import { Icon, IconName } from '../icon';
 
 export interface CalloutProps {
   children?: React.ReactNode;
   title?: React.ReactElement | string;
-  intent?: 'danger' | 'warning' | 'prompt' | 'progress' | 'success' | 'help';
+  intent?: Intent;
   iconName?: IconName;
   headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
 }
@@ -12,25 +13,19 @@ export interface CalloutProps {
 export function Callout({
   children,
   title,
-  intent = 'help',
+  intent = Intent.Help,
   iconName,
   headingLevel,
 }: CalloutProps) {
   const className = classNames(
-    'shadow-callout',
     'border',
     'border-black',
     'dark:border-white',
     'text-body-large',
     'dark:text-white',
     'p-8',
+    getIntentShadow(intent),
     {
-      'shadow-intent-danger': intent === 'danger',
-      'shadow-intent-warning': intent === 'warning',
-      'shadow-intent-prompt': intent === 'prompt',
-      'shadow-black dark:shadow-white': intent === 'progress',
-      'shadow-intent-success': intent === 'success',
-      'shadow-intent-help': intent === 'help',
       flex: !!iconName,
     }
   );
diff --git a/libs/ui-toolkit/src/components/dialog/dialog.stories.tsx b/libs/ui-toolkit/src/components/dialog/dialog.stories.tsx
new file mode 100644
index 000000000..97ec9cc31
--- /dev/null
+++ b/libs/ui-toolkit/src/components/dialog/dialog.stories.tsx
@@ -0,0 +1,56 @@
+import React, { useState } from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+
+import { Dialog } from './dialog';
+import { Button } from '../button';
+import { Intent } from '../../utils/intent';
+
+export default {
+  title: 'Dialog',
+  component: Dialog,
+} as ComponentMeta<typeof Dialog>;
+
+const Template: ComponentStory<typeof Dialog> = (args) => {
+  const [open, setOpen] = useState(args.open);
+  return (
+    <div>
+      <Button onClick={() => setOpen(true)}>Open dialog</Button>
+      <Dialog {...args} open={open} setOpen={setOpen} />
+    </div>
+  );
+};
+
+export const Default = Template.bind({});
+Default.args = {
+  open: false,
+  title: 'Title',
+  setOpen: () => undefined,
+  children: <p>Some content</p>,
+};
+
+export const Danger = Template.bind({});
+Danger.args = {
+  open: false,
+  title: 'Danger',
+  setOpen: () => undefined,
+  children: <p>Some content</p>,
+  intent: Intent.Danger,
+};
+
+export const Success = Template.bind({});
+Success.args = {
+  open: false,
+  title: 'Success',
+  setOpen: () => undefined,
+  children: <p>Some content</p>,
+  intent: Intent.Success,
+};
+
+export const Warning = Template.bind({});
+Warning.args = {
+  open: false,
+  title: 'Warning',
+  setOpen: () => undefined,
+  children: <p>Some content</p>,
+  intent: Intent.Warning,
+};
diff --git a/libs/ui-toolkit/src/components/dialog/dialog.tsx b/libs/ui-toolkit/src/components/dialog/dialog.tsx
new file mode 100644
index 000000000..79727c523
--- /dev/null
+++ b/libs/ui-toolkit/src/components/dialog/dialog.tsx
@@ -0,0 +1,43 @@
+import * as DialogPrimitives from '@radix-ui/react-dialog';
+import classNames from 'classnames';
+import { ReactNode } from 'react';
+import { getIntentShadow, Intent } from '../../utils/intent';
+import { Icon } from '../icon';
+
+interface DialogProps {
+  children: ReactNode;
+  open: boolean;
+  onChange: (isOpen: boolean) => void;
+  title?: string;
+  intent?: Intent;
+}
+
+export function Dialog({
+  children,
+  open,
+  onChange,
+  title,
+  intent,
+}: DialogProps) {
+  const contentClasses = classNames(
+    // Positions the modal in the center of screen
+    'fixed w-[520px] px-28 py-24 top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]',
+    // Need to apply background and text colors again as content is rendered in a portal
+    'dark:bg-black dark:text-white-95 bg-white text-black-95',
+    getIntentShadow(intent)
+  );
+  return (
+    <DialogPrimitives.Root open={open} onOpenChange={(x) => onChange(x)}>
+      <DialogPrimitives.Portal>
+        <DialogPrimitives.Overlay className="fixed inset-0 bg-black/50 dark:bg-white/15" />
+        <DialogPrimitives.Content className={contentClasses}>
+          <DialogPrimitives.Close className="p-12 absolute top-0 right-0">
+            <Icon name="cross" />
+          </DialogPrimitives.Close>
+          {title && <h1 className="text-h5 mb-12">{title}</h1>}
+          {children}
+        </DialogPrimitives.Content>
+      </DialogPrimitives.Portal>
+    </DialogPrimitives.Root>
+  );
+}
diff --git a/libs/ui-toolkit/src/components/dialog/index.ts b/libs/ui-toolkit/src/components/dialog/index.ts
new file mode 100644
index 000000000..20da8e550
--- /dev/null
+++ b/libs/ui-toolkit/src/components/dialog/index.ts
@@ -0,0 +1 @@
+export * from './dialog';
diff --git a/libs/ui-toolkit/src/components/dialog/index.tsx b/libs/ui-toolkit/src/components/dialog/index.tsx
deleted file mode 100644
index a966995b8..000000000
--- a/libs/ui-toolkit/src/components/dialog/index.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import * as DialogPrimitives from '@radix-ui/react-dialog';
-import { ReactNode } from 'react';
-
-interface DialogProps {
-  children: ReactNode;
-  open: boolean;
-  setOpen: (isOpen: boolean) => void;
-  title?: string;
-}
-
-export function Dialog({ children, open, setOpen, title }: DialogProps) {
-  return (
-    <DialogPrimitives.Root open={open} onOpenChange={(x) => setOpen(x)}>
-      <DialogPrimitives.Portal>
-        <DialogPrimitives.Overlay className="fixed inset-0 bg-black/40 dark:bg-white/15" />
-        <DialogPrimitives.Content className="fixed w-[500px] p-28 dark:bg-black dark:text-white-60 bg-white text-black-60 top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]">
-          {title && <h1 className="text-h5 mb-12">{title}</h1>}
-          {children}
-        </DialogPrimitives.Content>
-      </DialogPrimitives.Portal>
-    </DialogPrimitives.Root>
-  );
-}
diff --git a/libs/ui-toolkit/src/components/form-group/index.tsx b/libs/ui-toolkit/src/components/form-group/index.tsx
index 72972b6aa..2a7d13074 100644
--- a/libs/ui-toolkit/src/components/form-group/index.tsx
+++ b/libs/ui-toolkit/src/components/form-group/index.tsx
@@ -1,16 +1,26 @@
+import classNames from 'classnames';
 import { ReactNode } from 'react';
 
 interface FormGroupProps {
   children: ReactNode;
-  label: string;
-  labelFor: string;
+  label?: string;
+  labelFor?: string;
+  labelAlign?: 'left' | 'right';
 }
 
-export const FormGroup = ({ children, label, labelFor }: FormGroupProps) => {
+export const FormGroup = ({
+  children,
+  label,
+  labelFor,
+  labelAlign = 'left',
+}: FormGroupProps) => {
+  const labelClasses = classNames('block text-ui mb-4', {
+    'text-right': labelAlign === 'right',
+  });
   return (
-    <div className="mb-12">
+    <div className="mb-20">
       {label && (
-        <label className="block text-ui" htmlFor={labelFor}>
+        <label className={labelClasses} htmlFor={labelFor}>
           {label}
         </label>
       )}
diff --git a/libs/ui-toolkit/src/components/loader/index.ts b/libs/ui-toolkit/src/components/loader/index.ts
new file mode 100644
index 000000000..3f3b9e663
--- /dev/null
+++ b/libs/ui-toolkit/src/components/loader/index.ts
@@ -0,0 +1 @@
+export * from './loader';
diff --git a/libs/ui-toolkit/src/components/loader/loader.tsx b/libs/ui-toolkit/src/components/loader/loader.tsx
new file mode 100644
index 000000000..85b7a2975
--- /dev/null
+++ b/libs/ui-toolkit/src/components/loader/loader.tsx
@@ -0,0 +1,29 @@
+import { useEffect, useState } from 'react';
+
+export const Loader = () => {
+  const [, forceRender] = useState(false);
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      forceRender((x) => !x);
+    }, 100);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  return (
+    <span className="flex flex-wrap w-[15px] h-[15px]">
+      {new Array(9).fill(null).map((_, i) => {
+        return (
+          <span
+            key={i}
+            className="block w-[5px] h-[5px] bg-black dark:bg-white"
+            style={{
+              opacity: Math.random() > 0.5 ? 1 : 0,
+            }}
+          />
+        );
+      })}
+    </span>
+  );
+};
diff --git a/libs/ui-toolkit/src/components/splash/index.ts b/libs/ui-toolkit/src/components/splash/index.ts
new file mode 100644
index 000000000..6843152e2
--- /dev/null
+++ b/libs/ui-toolkit/src/components/splash/index.ts
@@ -0,0 +1 @@
+export * from './splash';
diff --git a/libs/ui-toolkit/src/components/splash/splash.stories.tsx b/libs/ui-toolkit/src/components/splash/splash.stories.tsx
new file mode 100644
index 000000000..a1e9ec77c
--- /dev/null
+++ b/libs/ui-toolkit/src/components/splash/splash.stories.tsx
@@ -0,0 +1,14 @@
+import { Story, ComponentMeta } from '@storybook/react';
+import { Splash, SplashProps } from './splash';
+
+export default {
+  component: Splash,
+  title: 'Splash',
+} as ComponentMeta<typeof Splash>;
+
+const Template: Story<SplashProps> = (args) => <Splash {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  children: <>Some center text to be used as splash screen content!</>,
+};
diff --git a/libs/ui-toolkit/src/components/splash/splash.tsx b/libs/ui-toolkit/src/components/splash/splash.tsx
new file mode 100644
index 000000000..671405d70
--- /dev/null
+++ b/libs/ui-toolkit/src/components/splash/splash.tsx
@@ -0,0 +1,14 @@
+import classNames from 'classnames';
+import { ReactNode } from 'react';
+
+export interface SplashProps {
+  children: ReactNode;
+}
+
+export const Splash = ({ children }: SplashProps) => {
+  const splashClasses = classNames(
+    'w-full h-full',
+    'flex items-center justify-center'
+  );
+  return <div className={splashClasses}>{children}</div>;
+};
diff --git a/libs/ui-toolkit/src/index.ts b/libs/ui-toolkit/src/index.ts
index 362df2bf6..638072c6b 100644
--- a/libs/ui-toolkit/src/index.ts
+++ b/libs/ui-toolkit/src/index.ts
@@ -1,5 +1,6 @@
 import * as EthereumUtils from './utils/web3';
 
+// Components
 export { AgGridLazy, AgGridDynamic } from './components/ag-grid';
 export { Button, AnchorButton } from './components/button';
 export { Callout } from './components/callout';
@@ -10,7 +11,12 @@ export { Icon } from './components/icon';
 export { Input } from './components/input';
 export { InputError } from './components/input-error';
 export { Lozenge } from './components/lozenge';
+export { Loader } from './components/loader';
 export { Select } from './components/select';
+export { Splash } from './components/splash';
 export { TextArea } from './components/text-area';
 export { ThemeSwitcher } from './components/theme-switcher';
-export { Dialog } from './components/dialog';
+export { Dialog } from './components/dialog/dialog';
+
+// Utils
+export * from './utils/intent';
diff --git a/libs/ui-toolkit/src/utils/intent.ts b/libs/ui-toolkit/src/utils/intent.ts
new file mode 100644
index 000000000..f63ca4385
--- /dev/null
+++ b/libs/ui-toolkit/src/utils/intent.ts
@@ -0,0 +1,21 @@
+import classNames from 'classnames';
+
+export enum Intent {
+  Danger = 'danger',
+  Warning = 'warning',
+  Prompt = 'prompt',
+  Progress = 'progress',
+  Success = 'success',
+  Help = 'help',
+}
+
+export const getIntentShadow = (intent?: Intent) => {
+  return classNames('shadow-callout', {
+    'shadow-intent-danger': intent === Intent.Danger,
+    'shadow-intent-warning': intent === Intent.Warning,
+    'shadow-intent-prompt': intent === Intent.Prompt,
+    'shadow-black dark:shadow-white': intent === Intent.Progress,
+    'shadow-intent-success': intent === Intent.Success,
+    'shadow-intent-help': intent === Intent.Help,
+  });
+};
diff --git a/libs/wallet/src/connect-dialog.tsx b/libs/wallet/src/connect-dialog.tsx
index 269520cf2..7b4e8656b 100644
--- a/libs/wallet/src/connect-dialog.tsx
+++ b/libs/wallet/src/connect-dialog.tsx
@@ -47,7 +47,7 @@ export function VegaConnectDialog({
   return (
     <Dialog
       open={dialogOpen}
-      setOpen={setDialogOpen}
+      onChange={setDialogOpen}
       title="Connect to your Vega Wallet"
     >
       {selectedConnector instanceof RestConnector ? (
diff --git a/libs/wallet/src/connectors/index.ts b/libs/wallet/src/connectors/index.ts
index 82af4e021..aa738f25a 100644
--- a/libs/wallet/src/connectors/index.ts
+++ b/libs/wallet/src/connectors/index.ts
@@ -5,6 +5,14 @@ import {
 } from '@vegaprotocol/vegawallet-service-api-client';
 export { RestConnector } from './rest-connector';
 
+type ErrorResponse =
+  | {
+      error: string;
+    }
+  | {
+      errors: object;
+    };
+
 export interface VegaConnector {
   /** Description of how to use this connector */
   description: string;
@@ -16,5 +24,7 @@ export interface VegaConnector {
   disconnect(): Promise<void>;
 
   /** Send a TX to the network. Only support order submission for now */
-  sendTx: (body: OrderSubmissionBody) => Promise<TransactionResponse | null>;
+  sendTx: (
+    body: OrderSubmissionBody
+  ) => Promise<TransactionResponse | ErrorResponse>;
 }
diff --git a/libs/wallet/src/connectors/rest-connector.ts b/libs/wallet/src/connectors/rest-connector.ts
index 41b93a13a..686d28535 100644
--- a/libs/wallet/src/connectors/rest-connector.ts
+++ b/libs/wallet/src/connectors/rest-connector.ts
@@ -86,7 +86,31 @@ export class RestConnector implements VegaConnector {
   }
 
   async sendTx(body: OrderSubmissionBody) {
-    return await this.service.commandSyncPost(body);
+    try {
+      const res = await this.service.commandSyncPost(body);
+      return res;
+    } catch (err) {
+      return this.handleSendTxError(err);
+    }
+  }
+
+  private handleSendTxError(err: unknown) {
+    if (typeof err === 'object' && err && 'body' in err) {
+      try {
+        // @ts-ignore Not sure why TS can't infer that 'body' does indeed exist on object
+        const parsedError = JSON.parse(err.body);
+        return parsedError;
+      } catch {
+        // Unexpected response
+        return {
+          error: 'Something went wrong',
+        };
+      }
+    } else {
+      return {
+        error: 'Something went wrong',
+      };
+    }
   }
 
   private setConfig(cfg: RestConnectorConfig) {
diff --git a/libs/wallet/src/context.ts b/libs/wallet/src/context.ts
index 99d954d00..3f66df95f 100644
--- a/libs/wallet/src/context.ts
+++ b/libs/wallet/src/context.ts
@@ -1,10 +1,18 @@
 import {
   VegaKey,
-  OrderSubmissionBody,
   TransactionResponse,
 } from '@vegaprotocol/vegawallet-service-api-client';
 import { createContext } from 'react';
 import { VegaConnector } from './connectors';
+import { Transaction } from './types';
+
+export type SendTxError =
+  | {
+      error: string;
+    }
+  | {
+      errors: object;
+    };
 
 export interface VegaKeyExtended extends VegaKey {
   name: string;
@@ -30,7 +38,9 @@ export interface VegaWalletContextShape {
   connector: VegaConnector | null;
 
   /** Send a transaction to the network, only order submissions for now */
-  sendTx: (body: OrderSubmissionBody) => Promise<TransactionResponse | null>;
+  sendTx: (
+    tx: Transaction
+  ) => Promise<TransactionResponse | SendTxError> | null;
 }
 
 export const VegaWalletContext = createContext<
diff --git a/libs/wallet/src/index.ts b/libs/wallet/src/index.ts
index 337406c98..0e4c016fa 100644
--- a/libs/wallet/src/index.ts
+++ b/libs/wallet/src/index.ts
@@ -4,3 +4,4 @@ export * from './hooks';
 export * from './connect-dialog';
 export * from './connectors';
 export * from './storage-keys';
+export * from './types';
diff --git a/libs/wallet/src/provider.test.tsx b/libs/wallet/src/provider.test.tsx
index 9b3727d4e..132d82698 100644
--- a/libs/wallet/src/provider.test.tsx
+++ b/libs/wallet/src/provider.test.tsx
@@ -50,7 +50,7 @@ const generateJSX = () => (
   </VegaWalletProvider>
 );
 
-test('Renders children', async () => {
+test('Can connect, disconnect and retrieve keypairs', async () => {
   const mockKeypairs = [{ pub: 'public key 1' }, { pub: 'public key 2' }];
   localStorage.setItem(WALLET_KEY, mockKeypairs[0].pub);
   jest
diff --git a/libs/wallet/src/provider.tsx b/libs/wallet/src/provider.tsx
index 90ff94952..0f4953c21 100644
--- a/libs/wallet/src/provider.tsx
+++ b/libs/wallet/src/provider.tsx
@@ -66,17 +66,12 @@ export const VegaWalletProvider = ({ children }: VegaWalletProviderProps) => {
     }
   }, []);
 
-  const sendTx = useCallback(async (body: OrderSubmissionBody) => {
+  const sendTx = useCallback((body: OrderSubmissionBody) => {
     if (!connector.current) {
       return null;
     }
 
-    try {
-      return connector.current.sendTx(body);
-    } catch (err) {
-      console.error(err);
-      return null;
-    }
+    return connector.current.sendTx(body);
   }, []);
 
   // Current selected keypair derived from publicKey state
diff --git a/libs/wallet/src/types.ts b/libs/wallet/src/types.ts
new file mode 100644
index 000000000..2d12f0207
--- /dev/null
+++ b/libs/wallet/src/types.ts
@@ -0,0 +1,36 @@
+export enum OrderType {
+  Market = 'TYPE_MARKET',
+  Limit = 'TYPE_LIMIT',
+}
+
+export enum OrderSide {
+  Buy = 'SIDE_BUY',
+  Sell = 'SIDE_SELL',
+}
+
+export enum OrderTimeInForce {
+  GTC = 'TIME_IN_FORCE_GTC',
+  GTT = 'TIME_IN_FORCE_GTT',
+  IOC = 'TIME_IN_FORCE_IOC',
+  FOK = 'TIME_IN_FORCE_FOK',
+  GFN = 'TIME_IN_FORCE_GFN',
+  GFA = 'TIME_IN_FORCE_GFA',
+}
+
+export interface OrderSubmission {
+  pubKey: string;
+  propagate: boolean;
+  orderSubmission: {
+    marketId: string;
+    size: string;
+    type: OrderType;
+    side: OrderSide;
+    timeInForce: OrderTimeInForce;
+    price?: string;
+    expiresAt?: string;
+    reference?: string;
+  };
+}
+
+// Will make Transaction a union type as other transactions are added
+export type Transaction = OrderSubmission;
diff --git a/package.json b/package.json
index 1cf9b813e..818aab10e 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
   "private": true,
   "dependencies": {
     "@apollo/client": "^3.5.8",
+    "@apollo/react-testing": "^4.0.0",
     "@blueprintjs/icons": "^3.32.0",
     "@nrwl/next": "13.8.1",
     "@radix-ui/react-dialog": "^0.1.5",
@@ -26,21 +27,28 @@
     "ag-grid-react": "^27.0.1",
     "apollo": "^2.33.9",
     "autoprefixer": "^10.4.2",
+    "bignumber.js": "^9.0.2",
     "classnames": "^2.3.1",
     "core-js": "^3.6.5",
     "env-cmd": "^10.1.0",
+    "ethers": "^5.6.0",
     "graphql": "^15.7.2",
+    "graphql-ws": "^5.6.3",
     "lodash.debounce": "^4.0.8",
+    "lodash.memoize": "^4.1.2",
+    "lodash.once": "^4.1.1",
     "next": "12.0.7",
     "nx": "^13.8.3",
     "postcss": "^8.4.6",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-hook-form": "^7.27.0",
+    "react-singleton-hook": "^3.2.3",
     "react-syntax-highlighter": "^15.4.5",
     "react-use-websocket": "^3.0.0",
     "react-virtualized-auto-sizer": "^1.0.6",
     "regenerator-runtime": "0.13.7",
+    "sha3": "^2.1.4",
     "tailwindcss": "^3.0.23",
     "tslib": "^2.0.0",
     "uuid": "^8.3.2"
@@ -70,6 +78,8 @@
     "@testing-library/react-hooks": "7.0.2",
     "@types/classnames": "^2.3.1",
     "@types/jest": "27.0.2",
+    "@types/lodash.memoize": "^4.1.6",
+    "@types/lodash.once": "^4.1.6",
     "@types/node": "16.11.7",
     "@types/prismjs": "^1.26.0",
     "@types/react": "17.0.30",
diff --git a/tsconfig.base.json b/tsconfig.base.json
index 646567318..40946e97c 100644
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -15,6 +15,9 @@
     "skipDefaultLibCheck": true,
     "baseUrl": ".",
     "paths": {
+      "@vegaprotocol/deal-ticket": ["libs/deal-ticket/src/index.ts"],
+      "@vegaprotocol/graphql": ["libs/graphql/src/index.ts"],
+      "@vegaprotocol/market-list": ["libs/market-list/src/index.ts"],
       "@vegaprotocol/react-helpers": ["libs/react-helpers/src/index.ts"],
       "@vegaprotocol/tailwindcss-config": [
         "libs/tailwindcss-config/src/index.js"
diff --git a/workspace.json b/workspace.json
index d9027b157..c9dcf01bb 100644
--- a/workspace.json
+++ b/workspace.json
@@ -1,8 +1,11 @@
 {
   "version": 2,
   "projects": {
+    "deal-ticket": "libs/deal-ticket",
     "explorer": "apps/explorer",
     "explorer-e2e": "apps/explorer-e2e",
+    "graphql": "libs/graphql",
+    "market-list": "libs/market-list",
     "react-helpers": "libs/react-helpers",
     "tailwindcss-config": "libs/tailwindcss-config",
     "trading": "apps/trading",
diff --git a/yarn.lock b/yarn.lock
index caf1fb3b4..b18e6114d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9,7 +9,7 @@
   dependencies:
     "@jridgewell/trace-mapping" "^0.3.0"
 
-"@apollo/client@^3.5.8":
+"@apollo/client@^3.5.8", "@apollo/client@latest":
   version "3.5.10"
   resolved "https://registry.yarnpkg.com/@apollo/client/-/client-3.5.10.tgz#43463108a6e07ae602cca0afc420805a19339a71"
   integrity sha512-tL3iSpFe9Oldq7gYikZK1dcYxp1c01nlSwtsMz75382HcI6fvQXyFXUCJTTK3wgO2/ckaBvRGw7VqjFREdVoRw==
@@ -35,6 +35,13 @@
     apollo-graphql "^0.9.3"
     lodash.xorby "^4.7.0"
 
+"@apollo/react-testing@^4.0.0":
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/@apollo/react-testing/-/react-testing-4.0.0.tgz#9fd1991584510c2ac051d986547ceccbc9c0a30a"
+  integrity sha512-P7Z/flUHpRRZYc3FkIqxZH9XD3FuP2Sgks1IXqGq2Zb7qI0aaTfVeRsLYmZNUcFOh2pTHxs0NXgPnH1VfYOpig==
+  dependencies:
+    "@apollo/client" latest
+
 "@apollographql/apollo-tools@^0.5.2":
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/@apollographql/apollo-tools/-/apollo-tools-0.5.2.tgz#01750a655731a198c3634ee819c463254a7c7767"
@@ -1496,6 +1503,346 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
+"@ethersproject/abi@5.6.0", "@ethersproject/abi@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/abi/-/abi-5.6.0.tgz#ea07cbc1eec2374d32485679c12408005895e9f3"
+  integrity sha512-AhVByTwdXCc2YQ20v300w6KVHle9g2OFc28ZAFCPnJyEpkv1xKXjZcSTgWOlv1i+0dqlgF8RCF2Rn2KC1t+1Vg==
+  dependencies:
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/hash" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+
+"@ethersproject/abstract-provider@5.6.0", "@ethersproject/abstract-provider@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/abstract-provider/-/abstract-provider-5.6.0.tgz#0c4ac7054650dbd9c476cf5907f588bbb6ef3061"
+  integrity sha512-oPMFlKLN+g+y7a79cLK3WiLcjWFnZQtXWgnLAbHZcN3s7L4v90UHpTOrLk+m3yr0gt+/h9STTM6zrr7PM8uoRw==
+  dependencies:
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/networks" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+    "@ethersproject/web" "^5.6.0"
+
+"@ethersproject/abstract-signer@5.6.0", "@ethersproject/abstract-signer@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/abstract-signer/-/abstract-signer-5.6.0.tgz#9cd7ae9211c2b123a3b29bf47aab17d4d016e3e7"
+  integrity sha512-WOqnG0NJKtI8n0wWZPReHtaLkDByPL67tn4nBaDAhmVq8sjHTPbCdz4DRhVu/cfTOvfy9w3iq5QZ7BX7zw56BQ==
+  dependencies:
+    "@ethersproject/abstract-provider" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+
+"@ethersproject/address@5.6.0", "@ethersproject/address@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/address/-/address-5.6.0.tgz#13c49836d73e7885fc148ad633afad729da25012"
+  integrity sha512-6nvhYXjbXsHPS+30sHZ+U4VMagFC/9zAk6Gd/h3S21YW4+yfb0WfRtaAIZ4kfM4rrVwqiy284LP0GtL5HXGLxQ==
+  dependencies:
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/rlp" "^5.6.0"
+
+"@ethersproject/base64@5.6.0", "@ethersproject/base64@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/base64/-/base64-5.6.0.tgz#a12c4da2a6fb86d88563216b0282308fc15907c9"
+  integrity sha512-2Neq8wxJ9xHxCF9TUgmKeSh9BXJ6OAxWfeGWvbauPh8FuHEjamgHilllx8KkSd5ErxyHIX7Xv3Fkcud2kY9ezw==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+
+"@ethersproject/basex@5.6.0", "@ethersproject/basex@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/basex/-/basex-5.6.0.tgz#9ea7209bf0a1c3ddc2a90f180c3a7f0d7d2e8a69"
+  integrity sha512-qN4T+hQd/Md32MoJpc69rOwLYRUXwjTlhHDIeUkUmiN/JyWkkLLMoG0TqvSQKNqZOMgN5stbUYN6ILC+eD7MEQ==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+
+"@ethersproject/bignumber@5.6.0", "@ethersproject/bignumber@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/bignumber/-/bignumber-5.6.0.tgz#116c81b075c57fa765a8f3822648cf718a8a0e26"
+  integrity sha512-VziMaXIUHQlHJmkv1dlcd6GY2PmT0khtAqaMctCIDogxkrarMzA9L94KN1NeXqqOfFD6r0sJT3vCTOFSmZ07DA==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    bn.js "^4.11.9"
+
+"@ethersproject/bytes@5.6.0", "@ethersproject/bytes@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/bytes/-/bytes-5.6.0.tgz#81652f2a0e04533575befadce555213c11d8aa20"
+  integrity sha512-3hJPlYemb9V4VLfJF5BfN0+55vltPZSHU3QKUyP9M3Y2TcajbiRrz65UG+xVHOzBereB1b9mn7r12o177xgN7w==
+  dependencies:
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/constants@5.6.0", "@ethersproject/constants@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/constants/-/constants-5.6.0.tgz#55e3eb0918584d3acc0688e9958b0cedef297088"
+  integrity sha512-SrdaJx2bK0WQl23nSpV/b1aq293Lh0sUaZT/yYKPDKn4tlAbkH96SPJwIhwSwTsoQQZxuh1jnqsKwyymoiBdWA==
+  dependencies:
+    "@ethersproject/bignumber" "^5.6.0"
+
+"@ethersproject/contracts@5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/contracts/-/contracts-5.6.0.tgz#60f2cfc7addd99a865c6c8cfbbcec76297386067"
+  integrity sha512-74Ge7iqTDom0NX+mux8KbRUeJgu1eHZ3iv6utv++sLJG80FVuU9HnHeKVPfjd9s3woFhaFoQGf3B3iH/FrQmgw==
+  dependencies:
+    "@ethersproject/abi" "^5.6.0"
+    "@ethersproject/abstract-provider" "^5.6.0"
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+
+"@ethersproject/hash@5.6.0", "@ethersproject/hash@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/hash/-/hash-5.6.0.tgz#d24446a5263e02492f9808baa99b6e2b4c3429a2"
+  integrity sha512-fFd+k9gtczqlr0/BruWLAu7UAOas1uRRJvOR84uDf4lNZ+bTkGl366qvniUZHKtlqxBRU65MkOobkmvmpHU+jA==
+  dependencies:
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+
+"@ethersproject/hdnode@5.6.0", "@ethersproject/hdnode@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/hdnode/-/hdnode-5.6.0.tgz#9dcbe8d629bbbcf144f2cae476337fe92d320998"
+  integrity sha512-61g3Jp3nwDqJcL/p4nugSyLrpl/+ChXIOtCEM8UDmWeB3JCAt5FoLdOMXQc3WWkc0oM2C0aAn6GFqqMcS/mHTw==
+  dependencies:
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/basex" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/pbkdf2" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/sha2" "^5.6.0"
+    "@ethersproject/signing-key" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+    "@ethersproject/wordlists" "^5.6.0"
+
+"@ethersproject/json-wallets@5.6.0", "@ethersproject/json-wallets@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/json-wallets/-/json-wallets-5.6.0.tgz#4c2fc27f17e36c583e7a252fb938bc46f98891e5"
+  integrity sha512-fmh86jViB9r0ibWXTQipxpAGMiuxoqUf78oqJDlCAJXgnJF024hOOX7qVgqsjtbeoxmcLwpPsXNU0WEe/16qPQ==
+  dependencies:
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/hdnode" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/pbkdf2" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/random" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+    aes-js "3.0.0"
+    scrypt-js "3.0.1"
+
+"@ethersproject/keccak256@5.6.0", "@ethersproject/keccak256@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/keccak256/-/keccak256-5.6.0.tgz#fea4bb47dbf8f131c2e1774a1cecbfeb9d606459"
+  integrity sha512-tk56BJ96mdj/ksi7HWZVWGjCq0WVl/QvfhFQNeL8fxhBlGoP+L80uDCiQcpJPd+2XxkivS3lwRm3E0CXTfol0w==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    js-sha3 "0.8.0"
+
+"@ethersproject/logger@5.6.0", "@ethersproject/logger@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/logger/-/logger-5.6.0.tgz#d7db1bfcc22fd2e4ab574cba0bb6ad779a9a3e7a"
+  integrity sha512-BiBWllUROH9w+P21RzoxJKzqoqpkyM1pRnEKG69bulE9TSQD8SAIvTQqIMZmmCO8pUNkgLP1wndX1gKghSpBmg==
+
+"@ethersproject/networks@5.6.0", "@ethersproject/networks@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/networks/-/networks-5.6.0.tgz#486d03fff29b4b6b5414d47a232ded09fe10de5e"
+  integrity sha512-DaVzgyThzHgSDLuURhvkp4oviGoGe9iTZW4jMEORHDRCgSZ9K9THGFKqL+qGXqPAYLEgZTf5z2w56mRrPR1MjQ==
+  dependencies:
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/pbkdf2@5.6.0", "@ethersproject/pbkdf2@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/pbkdf2/-/pbkdf2-5.6.0.tgz#04fcc2d7c6bff88393f5b4237d906a192426685a"
+  integrity sha512-Wu1AxTgJo3T3H6MIu/eejLFok9TYoSdgwRr5oGY1LTLfmGesDoSx05pemsbrPT2gG4cQME+baTSCp5sEo2erZQ==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/sha2" "^5.6.0"
+
+"@ethersproject/properties@5.6.0", "@ethersproject/properties@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/properties/-/properties-5.6.0.tgz#38904651713bc6bdd5bdd1b0a4287ecda920fa04"
+  integrity sha512-szoOkHskajKePTJSZ46uHUWWkbv7TzP2ypdEK6jGMqJaEt2sb0jCgfBo0gH0m2HBpRixMuJ6TBRaQCF7a9DoCg==
+  dependencies:
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/providers@5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/providers/-/providers-5.6.0.tgz#08ec8e2666771e3a347e66c8f664a2af97366534"
+  integrity sha512-6+5PKXTWAttJWFWF8+xCDTCa2/dtq9BNrdKQHGl0IyIOwj99vM6OeThmIRcsIAzIOb8m0XS6w+1KFZwrf3j9nw==
+  dependencies:
+    "@ethersproject/abstract-provider" "^5.6.0"
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/basex" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/hash" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/networks" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/random" "^5.6.0"
+    "@ethersproject/rlp" "^5.6.0"
+    "@ethersproject/sha2" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+    "@ethersproject/web" "^5.6.0"
+    bech32 "1.1.4"
+    ws "7.4.6"
+
+"@ethersproject/random@5.6.0", "@ethersproject/random@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/random/-/random-5.6.0.tgz#1505d1ab6a250e0ee92f436850fa3314b2cb5ae6"
+  integrity sha512-si0PLcLjq+NG/XHSZz90asNf+YfKEqJGVdxoEkSukzbnBgC8rydbgbUgBbBGLeHN4kAJwUFEKsu3sCXT93YMsw==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/rlp@5.6.0", "@ethersproject/rlp@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/rlp/-/rlp-5.6.0.tgz#55a7be01c6f5e64d6e6e7edb6061aa120962a717"
+  integrity sha512-dz9WR1xpcTL+9DtOT/aDO+YyxSSdO8YIS0jyZwHHSlAmnxA6cKU3TrTd4Xc/bHayctxTgGLYNuVVoiXE4tTq1g==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/sha2@5.6.0", "@ethersproject/sha2@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/sha2/-/sha2-5.6.0.tgz#364c4c11cc753bda36f31f001628706ebadb64d9"
+  integrity sha512-1tNWCPFLu1n3JM9t4/kytz35DkuF9MxqkGGEHNauEbaARdm2fafnOyw1s0tIQDPKF/7bkP1u3dbrmjpn5CelyA==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    hash.js "1.1.7"
+
+"@ethersproject/signing-key@5.6.0", "@ethersproject/signing-key@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/signing-key/-/signing-key-5.6.0.tgz#4f02e3fb09e22b71e2e1d6dc4bcb5dafa69ce042"
+  integrity sha512-S+njkhowmLeUu/r7ir8n78OUKx63kBdMCPssePS89So1TH4hZqnWFsThEd/GiXYp9qMxVrydf7KdM9MTGPFukA==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    bn.js "^4.11.9"
+    elliptic "6.5.4"
+    hash.js "1.1.7"
+
+"@ethersproject/solidity@5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/solidity/-/solidity-5.6.0.tgz#64657362a596bf7f5630bdc921c07dd78df06dc3"
+  integrity sha512-YwF52vTNd50kjDzqKaoNNbC/r9kMDPq3YzDWmsjFTRBcIF1y4JCQJ8gB30wsTfHbaxgxelI5BfxQSxD/PbJOww==
+  dependencies:
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/sha2" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+
+"@ethersproject/strings@5.6.0", "@ethersproject/strings@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/strings/-/strings-5.6.0.tgz#9891b26709153d996bf1303d39a7f4bc047878fd"
+  integrity sha512-uv10vTtLTZqrJuqBZR862ZQjTIa724wGPWQqZrofaPI/kUsf53TBG0I0D+hQ1qyNtllbNzaW+PDPHHUI6/65Mg==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/transactions@5.6.0", "@ethersproject/transactions@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/transactions/-/transactions-5.6.0.tgz#4b594d73a868ef6e1529a2f8f94a785e6791ae4e"
+  integrity sha512-4HX+VOhNjXHZyGzER6E/LVI2i6lf9ejYeWD6l4g50AdmimyuStKc39kvKf1bXWQMg7QNVh+uC7dYwtaZ02IXeg==
+  dependencies:
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/rlp" "^5.6.0"
+    "@ethersproject/signing-key" "^5.6.0"
+
+"@ethersproject/units@5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/units/-/units-5.6.0.tgz#e5cbb1906988f5740254a21b9ded6bd51e826d9c"
+  integrity sha512-tig9x0Qmh8qbo1w8/6tmtyrm/QQRviBh389EQ+d8fP4wDsBrJBf08oZfoiz1/uenKK9M78yAP4PoR7SsVoTjsw==
+  dependencies:
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/constants" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+
+"@ethersproject/wallet@5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/wallet/-/wallet-5.6.0.tgz#33d11a806d783864208f348709a5a3badac8e22a"
+  integrity sha512-qMlSdOSTyp0MBeE+r7SUhr1jjDlC1zAXB8VD84hCnpijPQiSNbxr6GdiLXxpUs8UKzkDiNYYC5DRI3MZr+n+tg==
+  dependencies:
+    "@ethersproject/abstract-provider" "^5.6.0"
+    "@ethersproject/abstract-signer" "^5.6.0"
+    "@ethersproject/address" "^5.6.0"
+    "@ethersproject/bignumber" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/hash" "^5.6.0"
+    "@ethersproject/hdnode" "^5.6.0"
+    "@ethersproject/json-wallets" "^5.6.0"
+    "@ethersproject/keccak256" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/random" "^5.6.0"
+    "@ethersproject/signing-key" "^5.6.0"
+    "@ethersproject/transactions" "^5.6.0"
+    "@ethersproject/wordlists" "^5.6.0"
+
+"@ethersproject/web@5.6.0", "@ethersproject/web@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/web/-/web-5.6.0.tgz#4bf8b3cbc17055027e1a5dd3c357e37474eaaeb8"
+  integrity sha512-G/XHj0hV1FxI2teHRfCGvfBUHFmU+YOSbCxlAMqJklxSa7QMiHFQfAxvwY2PFqgvdkxEKwRNr/eCjfAPEm2Ctg==
+  dependencies:
+    "@ethersproject/base64" "^5.6.0"
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+
+"@ethersproject/wordlists@5.6.0", "@ethersproject/wordlists@^5.6.0":
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/@ethersproject/wordlists/-/wordlists-5.6.0.tgz#79e62c5276e091d8575f6930ba01a29218ded032"
+  integrity sha512-q0bxNBfIX3fUuAo9OmjlEYxP40IB8ABgb7HjEZCL5IKubzV3j30CWi2rqQbjTS2HfoyQbfINoKcTVWP4ejwR7Q==
+  dependencies:
+    "@ethersproject/bytes" "^5.6.0"
+    "@ethersproject/hash" "^5.6.0"
+    "@ethersproject/logger" "^5.6.0"
+    "@ethersproject/properties" "^5.6.0"
+    "@ethersproject/strings" "^5.6.0"
+
 "@gar/promisify@^1.0.1":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.3.tgz#555193ab2e3bb3b6adc3d551c9c030d9e860daf6"
@@ -4765,6 +5112,25 @@
   resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
   integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
 
+"@types/lodash.memoize@^4.1.6":
+  version "4.1.6"
+  resolved "https://registry.yarnpkg.com/@types/lodash.memoize/-/lodash.memoize-4.1.6.tgz#3221f981790a415cab1a239f25c17efd8b604c23"
+  integrity sha512-mYxjKiKzRadRJVClLKxS4wb3Iy9kzwJ1CkbyKiadVxejnswnRByyofmPMscFKscmYpl36BEEhCMPuWhA1R/1ZQ==
+  dependencies:
+    "@types/lodash" "*"
+
+"@types/lodash.once@^4.1.6":
+  version "4.1.6"
+  resolved "https://registry.yarnpkg.com/@types/lodash.once/-/lodash.once-4.1.6.tgz#f6ea46e3426bc3494b72a45e65efed440103b967"
+  integrity sha512-kawTe2cBNZ5OI4CvTJT9cs8wacGZK4BoakKAGASl/jH3LxflMTuy82wN2U5klYsxYjrABkNWmzgO33volt7urQ==
+  dependencies:
+    "@types/lodash" "*"
+
+"@types/lodash@*":
+  version "4.14.180"
+  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.180.tgz#4ab7c9ddfc92ec4a887886483bc14c79fb380670"
+  integrity sha512-XOKXa1KIxtNXgASAnwj7cnttJxS4fksBRywK/9LzRV5YxrF80BXZIGeQSuoESQ/VkUj30Ae0+YcuHc15wJCB2g==
+
 "@types/mdast@^3.0.0":
   version "3.0.10"
   resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.10.tgz#4724244a82a4598884cbbe9bcfd73dff927ee8af"
@@ -4893,7 +5259,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@>=16.9.0":
+"@types/react@*":
   version "17.0.39"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.39.tgz#d0f4cde092502a6db00a1cded6e6bf2abb7633ce"
   integrity sha512-UVavlfAxDd/AgAacMa60Azl7ygyQNRwC/DsHZmKgNvPmRR5p70AJ5Q9EAmL2NWOJmeV+vVUI4IAP7GZrN8h8Ug==
@@ -4911,6 +5277,15 @@
     "@types/scheduler" "*"
     csstype "^3.0.2"
 
+"@types/react@>=16.9.0":
+  version "17.0.40"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.40.tgz#dc010cee6254d5239a138083f3799a16638e6bad"
+  integrity sha512-UrXhD/JyLH+W70nNSufXqMZNuUD2cXHu6UjCllC6pmOQgBX4SGXOH8fjRka0O0Ee0HrFxapDD8Bwn81Kmiz6jQ==
+  dependencies:
+    "@types/prop-types" "*"
+    "@types/scheduler" "*"
+    csstype "^3.0.2"
+
 "@types/resolve@1.17.1":
   version "1.17.1"
   resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.17.1.tgz#3afd6ad8967c77e4376c598a82ddd58f46ec45d6"
@@ -5589,6 +5964,11 @@ address@^1.0.1:
   resolved "https://registry.yarnpkg.com/address/-/address-1.1.2.tgz#bf1116c9c758c51b7a933d296b72c221ed9428b6"
   integrity sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==
 
+aes-js@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-3.0.0.tgz#e21df10ad6c2053295bcbb8dab40b09dbea87e4d"
+  integrity sha1-4h3xCtbCBTKVvLuNq0Cwnb6ofk0=
+
 ag-grid-community@^27.0.1:
   version "27.0.1"
   resolved "https://registry.yarnpkg.com/ag-grid-community/-/ag-grid-community-27.0.1.tgz#7ce5c000d321ba2c22447837e793b1d8366f4cdb"
@@ -6692,6 +7072,11 @@ bcrypt-pbkdf@^1.0.0:
   dependencies:
     tweetnacl "^0.14.3"
 
+bech32@1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/bech32/-/bech32-1.1.4.tgz#e38c9f37bf179b8eb16ae3a772b40c356d4832e9"
+  integrity sha512-s0IrSOzLlbvX7yp4WBfPITzpAU8sqQcpsmwXDiKwrG4r491vwCO/XpejasRNl0piBMe/DvP4Tz0mIS/X1DPJBQ==
+
 becke-ch--regex--s0-0-v1--base--pl--lib@^1.2.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/becke-ch--regex--s0-0-v1--base--pl--lib/-/becke-ch--regex--s0-0-v1--base--pl--lib-1.4.0.tgz#429ceebbfa5f7e936e78d73fbdc7da7162b20e20"
@@ -6709,6 +7094,11 @@ big.js@^5.2.2:
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
   integrity sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==
 
+bignumber.js@^9.0.2:
+  version "9.0.2"
+  resolved "https://registry.yarnpkg.com/bignumber.js/-/bignumber.js-9.0.2.tgz#71c6c6bed38de64e24a65ebe16cfcf23ae693673"
+  integrity sha512-GAcQvbpsM0pUb0zw1EI0KhQEZ+lRwR5fYaAp3vPOYuP7aDvGy6cVN6XHLauvF8SOga2y0dcLcjt3iQDTSEliyw==
+
 binary-extensions@^1.0.0:
   version "1.13.1"
   resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-1.13.1.tgz#598afe54755b2868a5330d2aff9d4ebb53209b65"
@@ -7096,6 +7486,14 @@ buffer@5.6.0:
     base64-js "^1.0.2"
     ieee754 "^1.1.4"
 
+buffer@6.0.3:
+  version "6.0.3"
+  resolved "https://registry.yarnpkg.com/buffer/-/buffer-6.0.3.tgz#2ace578459cc8fbe2a70aaa8f52ee63b6a74c6c6"
+  integrity sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==
+  dependencies:
+    base64-js "^1.3.1"
+    ieee754 "^1.2.1"
+
 buffer@^4.3.0:
   version "4.9.2"
   resolved "https://registry.yarnpkg.com/buffer/-/buffer-4.9.2.tgz#230ead344002988644841ab0244af8c44bbe3ef8"
@@ -9235,7 +9633,7 @@ element-resize-detector@^1.2.2:
   dependencies:
     batch-processor "1.0.0"
 
-elliptic@^6.5.3:
+elliptic@6.5.4, elliptic@^6.5.3:
   version "6.5.4"
   resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.4.tgz#da37cebd31e79a1367e941b592ed1fbebd58abbb"
   integrity sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==
@@ -9893,6 +10291,42 @@ etag@1.8.1, etag@~1.8.1:
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
   integrity sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=
 
+ethers@^5.6.0:
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/ethers/-/ethers-5.6.0.tgz#924eb965dc03963fad0a09ce687efdf49aca3b45"
+  integrity sha512-00FP71jt6bW3ndO5DhgH9mLIZhoCGnAKFLu8qig5KmV03ubEChKf2ilB3g6fX512tTYo+tSMDJ5WpCJWdBHkBQ==
+  dependencies:
+    "@ethersproject/abi" "5.6.0"
+    "@ethersproject/abstract-provider" "5.6.0"
+    "@ethersproject/abstract-signer" "5.6.0"
+    "@ethersproject/address" "5.6.0"
+    "@ethersproject/base64" "5.6.0"
+    "@ethersproject/basex" "5.6.0"
+    "@ethersproject/bignumber" "5.6.0"
+    "@ethersproject/bytes" "5.6.0"
+    "@ethersproject/constants" "5.6.0"
+    "@ethersproject/contracts" "5.6.0"
+    "@ethersproject/hash" "5.6.0"
+    "@ethersproject/hdnode" "5.6.0"
+    "@ethersproject/json-wallets" "5.6.0"
+    "@ethersproject/keccak256" "5.6.0"
+    "@ethersproject/logger" "5.6.0"
+    "@ethersproject/networks" "5.6.0"
+    "@ethersproject/pbkdf2" "5.6.0"
+    "@ethersproject/properties" "5.6.0"
+    "@ethersproject/providers" "5.6.0"
+    "@ethersproject/random" "5.6.0"
+    "@ethersproject/rlp" "5.6.0"
+    "@ethersproject/sha2" "5.6.0"
+    "@ethersproject/signing-key" "5.6.0"
+    "@ethersproject/solidity" "5.6.0"
+    "@ethersproject/strings" "5.6.0"
+    "@ethersproject/transactions" "5.6.0"
+    "@ethersproject/units" "5.6.0"
+    "@ethersproject/wallet" "5.6.0"
+    "@ethersproject/web" "5.6.0"
+    "@ethersproject/wordlists" "5.6.0"
+
 eventemitter2@^6.4.3:
   version "6.4.5"
   resolved "https://registry.yarnpkg.com/eventemitter2/-/eventemitter2-6.4.5.tgz#97380f758ae24ac15df8353e0cc27f8b95644655"
@@ -11026,6 +11460,11 @@ graphql-tag@^2.10.1, graphql-tag@^2.12.3:
   dependencies:
     tslib "^2.1.0"
 
+graphql-ws@^5.6.3:
+  version "5.6.3"
+  resolved "https://registry.yarnpkg.com/graphql-ws/-/graphql-ws-5.6.3.tgz#32321594a7b744755df992f24afccc84143b4b7d"
+  integrity sha512-ZolWOi6bzI35ovGROCZROB9nDbwZiJdIsaPdzW/jkICCGNb3qL/33IONY/yQiBa+Je2uA11HfY4Uxse4+/ePYA==
+
 "graphql@14.0.2 - 14.2.0 || ^14.3.1 || ^15.0.0", graphql@15.8.0, graphql@^15.7.2:
   version "15.8.0"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-15.8.0.tgz#33410e96b012fa3bdb1091cc99a94769db212b38"
@@ -11151,7 +11590,7 @@ hash-base@^3.0.0:
     readable-stream "^3.6.0"
     safe-buffer "^5.2.0"
 
-hash.js@^1.0.0, hash.js@^1.0.3:
+hash.js@1.1.7, hash.js@^1.0.0, hash.js@^1.0.3:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.7.tgz#0babca538e8d4ee4a0f8988d68866537a003cf42"
   integrity sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==
@@ -11573,7 +12012,7 @@ identity-obj-proxy@3.0.0:
   dependencies:
     harmony-reflect "^1.4.6"
 
-ieee754@^1.1.13, ieee754@^1.1.4:
+ieee754@^1.1.13, ieee754@^1.1.4, ieee754@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"
   integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==
@@ -12900,6 +13339,11 @@ jest@27.2.3:
     import-local "^3.0.2"
     jest-cli "^27.2.3"
 
+js-sha3@0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/js-sha3/-/js-sha3-0.8.0.tgz#b9b7a5da73afad7dedd0f8c463954cbde6818840"
+  integrity sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==
+
 js-string-escape@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/js-string-escape/-/js-string-escape-1.0.1.tgz#e2625badbc0d67c7533e9edc1068c587ae4137ef"
@@ -16044,6 +16488,11 @@ react-shallow-renderer@^16.13.1:
     object-assign "^4.1.1"
     react-is "^16.12.0 || ^17.0.0"
 
+react-singleton-hook@^3.2.3:
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/react-singleton-hook/-/react-singleton-hook-3.2.3.tgz#1765e67b1910fd163cdcd186a840af82b60ca17e"
+  integrity sha512-DYJ70V8IVUZznygmRYYF+hxwLkGPLrCCTAD1Je7sZYXquE9HpAJqBVeEgb2XIZwxWUw97PN2ho5J/+63YwdKaA==
+
 react-sizeme@^3.0.1:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/react-sizeme/-/react-sizeme-3.0.2.tgz#4a2f167905ba8f8b8d932a9e35164e459f9020e4"
@@ -16836,6 +17285,11 @@ schema-utils@^4.0.0:
     ajv-formats "^2.1.1"
     ajv-keywords "^5.0.0"
 
+scrypt-js@3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/scrypt-js/-/scrypt-js-3.0.1.tgz#d314a57c2aef69d1ad98a138a21fe9eafa9ee312"
+  integrity sha512-cdwTTnqPu0Hyvf5in5asVdZocVDTNRmR7XEcJuIzMjJeSHybHl7vpB66AzwTaIg6CLSbtjcxc8fqcySfnTkccA==
+
 secure-compare@3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/secure-compare/-/secure-compare-3.0.1.tgz#f1a0329b308b221fae37b9974f3d578d0ca999e3"
@@ -17030,6 +17484,13 @@ sha.js@^2.4.0, sha.js@^2.4.11, sha.js@^2.4.8, sha.js@~2.4.4:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
+sha3@^2.1.4:
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/sha3/-/sha3-2.1.4.tgz#000fac0fe7c2feac1f48a25e7a31b52a6492cc8f"
+  integrity sha512-S8cNxbyb0UGUM2VhRD4Poe5N58gJnJsLJ5vC7FYWGUmGhcsj4++WaIOBFVDxlG0W3To6xBuiRh+i0Qp2oNCOtg==
+  dependencies:
+    buffer "6.0.3"
+
 shallow-clone@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3"
@@ -19637,6 +20098,11 @@ write-file-atomic@^3.0.0:
     signal-exit "^3.0.2"
     typedarray-to-buffer "^3.1.5"
 
+ws@7.4.6:
+  version "7.4.6"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-7.4.6.tgz#5654ca8ecdeee47c33a9a4bf6d28e2be2980377c"
+  integrity sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==
+
 ws@^7.4.6:
   version "7.5.7"
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.7.tgz#9e0ac77ee50af70d58326ecff7e85eb3fa375e67"