diff --git a/.github/workflows/deploy-production-with-staging-api.yml b/.github/workflows/deploy-production-with-staging-api.yml
index 35f5a6988..c16da1b56 100644
--- a/.github/workflows/deploy-production-with-staging-api.yml
+++ b/.github/workflows/deploy-production-with-staging-api.yml
@@ -1,4 +1,4 @@
-name: deploy-production
+name: deploy-production-with-staging-config
on:
push:
tags: [d*]
diff --git a/.github/workflows/deploy-staging.yml b/.github/workflows/deploy-staging.yml
index d695797ff..932e00070 100644
--- a/.github/workflows/deploy-staging.yml
+++ b/.github/workflows/deploy-staging.yml
@@ -1,4 +1,4 @@
-name: Deploy
+name: Deploy-staging
# Run on every commit
on:
diff --git a/.prettierrc.js b/.prettierrc.js
index 654c2932f..23b9430b2 100644
--- a/.prettierrc.js
+++ b/.prettierrc.js
@@ -4,6 +4,7 @@ module.exports = {
semi: false,
bracketSpacing: true,
trailingComma: "all",
+ endOfLine: "auto",
overrides: [
{
files: "*.sol",
diff --git a/package.json b/package.json
index 7c2845576..488a8f60a 100644
--- a/package.json
+++ b/package.json
@@ -64,6 +64,7 @@
},
"dependencies": {
"@amcharts/amcharts4": "^4.10.13",
+ "@anxolin/walletconnect-connector": "6.1.9",
"@babel/helper-define-map": "^7.12.13",
"@babel/helper-regex": "^7.10.5",
"@ethersproject/address": "^5.0.0-beta.134",
@@ -93,12 +94,13 @@
"@web3-react/injected-connector": "^6.0.7",
"@web3-react/network-connector": "^6.1.9",
"@web3-react/portis-connector": "^6.1.9",
- "@anxolin/walletconnect-connector": "6.1.9",
"@web3-react/walletlink-connector": "^6.1.9",
"ajv": "^6.12.3",
"copy-to-clipboard": "^3.2.0",
"cross-env": "^7.0.2",
+ "csstype": "^3.0.8",
"cypress": "^4.5.0",
+ "decimal.js": "^10.2.1",
"i18next": "^15.0.9",
"i18next-browser-languagedetector": "^3.0.1",
"i18next-xhr-backend": "^2.0.1",
@@ -107,14 +109,16 @@
"jazzicon": "^1.5.0",
"levenary": "^1.1.1",
"lodash.flatmap": "^4.5.0",
+ "lodash.round": "^4.0.4",
"logdown": "^3.3.1",
"modali": "^1.2.0",
"numbro": "^2.3.2",
- "polished": "^3.3.2",
+ "polished": "^3.7.1",
"qrcode.react": "^0.9.3",
"qs": "^6.9.4",
"react": "^16.13.1",
"react-copy-to-clipboard": "^5.0.3",
+ "react-custom-scrollbars": "^4.2.1",
"react-device-detect": "^1.6.2",
"react-dom": "^16.13.1",
"react-feather": "^2.0.8",
@@ -128,7 +132,7 @@
"react-scripts": "^4.0.1",
"react-spring": "^8.0.27",
"react-table": "^7.6.3",
- "react-tooltip": "^4.2.14",
+ "react-tooltip": "^4.2.19",
"react-use-gesture": "^6.0.14",
"react-window": "^1.8.5",
"rebass": "^4.0.7",
diff --git a/src/components/auction/AuctionBody/index.tsx b/src/components/auction/AuctionBody/index.tsx
index 05c5ab224..9676ea112 100644
--- a/src/components/auction/AuctionBody/index.tsx
+++ b/src/components/auction/AuctionBody/index.tsx
@@ -5,29 +5,45 @@ import { AuctionState, DerivedAuctionInfo } from '../../../state/orderPlacement/
import { AuctionIdentifier } from '../../../state/orderPlacement/reducer'
import { PageTitle } from '../../pureStyledComponents/PageTitle'
import { AuctionNotStarted } from '../AuctionNotStarted'
-import { AuctionPending } from '../AuctionPending'
import Claimer from '../Claimer'
import OrderPlacement from '../OrderPlacement'
-import { OrderBook } from '../Orderbook'
+import { OrderBookContainer } from '../OrderbookContainer'
import OrdersTable from '../OrdersTable'
-const SectionTitle = styled(PageTitle)`
- margin-bottom: 16px;
- margin-top: 0;
-`
-
const Grid = styled.div`
display: grid;
grid-template-columns: 1fr;
row-gap: 20px;
margin: 0 0 40px;
- @media (min-width: ${({ theme }) => theme.themeBreakPoints.md}) {
+ @media (min-width: ${({ theme }) => theme.themeBreakPoints.xxl}) {
column-gap: 18px;
grid-template-columns: 1fr 1fr;
}
`
+const GridCol = styled.div`
+ display: flex;
+ flex-direction: column;
+ max-width: 100%;
+ justify-content: flex-end;
+ @media (max-width: ${({ theme }) => theme.themeBreakPoints.xxl}) {
+ overflow-x: auto;
+ }
+`
+
+const Wrap = styled.div`
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 16px;
+`
+
+const SectionTitle = styled(PageTitle)`
+ margin-bottom: 0;
+ margin-top: 0;
+`
+
interface AuctionBodyProps {
auctionIdentifier: AuctionIdentifier
derivedAuctionInfo: DerivedAuctionInfo
@@ -46,36 +62,33 @@ const AuctionBody = (props: AuctionBodyProps) => {
return (
<>
- {auctionStarted && (
-
- {(auctionState === AuctionState.ORDER_PLACING ||
- auctionState === AuctionState.ORDER_PLACING_AND_CANCELING) &&
- 'Place Order'}
- {auctionState === AuctionState.CLAIMING && 'Claim Proceeds'}
-
- )}
{auctionStarted && (
- {(auctionState === AuctionState.ORDER_PLACING ||
- auctionState === AuctionState.ORDER_PLACING_AND_CANCELING) && (
-
- )}
- {auctionState === AuctionState.CLAIMING && (
-
+
+ Place Order
+
+ {(auctionState === AuctionState.ORDER_PLACING ||
+ auctionState === AuctionState.ORDER_PLACING_AND_CANCELING) && (
+
+ )}
+ {auctionState === AuctionState.CLAIMING && (
+
+ )}
+
+
+
- )}
- {auctionState === AuctionState.PRICE_SUBMISSION && (
- Auction closed. Pending on-chain price-calculation.
- )}
-
+
)}
{auctionState === AuctionState.NOT_YET_STARTED && }
diff --git a/src/components/auction/AuctionDetails/index.tsx b/src/components/auction/AuctionDetails/index.tsx
index fb5e4025e..d0011a2bc 100644
--- a/src/components/auction/AuctionDetails/index.tsx
+++ b/src/components/auction/AuctionDetails/index.tsx
@@ -31,7 +31,8 @@ import { ExtraDetailsItem, Props as ExtraDetailsItemProps } from '../ExtraDetail
const DETAILS_HEIGHT = '120px'
const Wrapper = styled.div`
- margin: 0 0 30px;
+ margin: 0 0 32px;
+ min-height: ${TIMER_SIZE};
position: relative;
`
@@ -265,7 +266,8 @@ const AuctionDetails = (props: Props) => {
onInvertPrices()
}
}
- }, [derivedAuctionInfo?.auctioningToken, onInvertPrices, showPriceInverted])
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [derivedAuctionInfo?.auctioningToken, onInvertPrices])
const biddingTokenAddress = useMemo(
() => getExplorerLink(chainId, derivedAuctionInfo?.biddingToken?.address, 'address'),
@@ -493,10 +495,7 @@ const AuctionDetails = (props: Props) => {
itemKey={
<>
Total auctioned
-
+
>
}
itemValue={
@@ -529,10 +528,7 @@ const AuctionDetails = (props: Props) => {
itemKey={
<>
Bidding with
-
+
>
}
itemValue={
@@ -563,7 +559,6 @@ const AuctionDetails = (props: Props) => {
<>
{titlePrice}
{
itemKey={
<>
{showPriceInverted ? `Max Sell Price` : `Min Sell Price`}
-
+
>
}
itemValue={
@@ -612,7 +604,6 @@ const AuctionDetails = (props: Props) => {
{extraDetails.map((item, index) => (