diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json index 3b3542259..c586d9da7 100644 --- a/public/locales/en/translations.json +++ b/public/locales/en/translations.json @@ -308,6 +308,10 @@ "title": "Movements" }, "nodata": "No related data in this time range. You can try another time range.", + "no_merchant": { + "title": "This section is only available for ", + "link": "merchant accounts" + }, "orders": { "title": "Orders" }, @@ -443,7 +447,7 @@ "status": { "success": "{{topic}} Success at {{time}}", "warn": "{{topic}}", - "fail": "{{topic}} fail {{detail}}", + "fail": "{{topic}} fail: {{detail}}", "noid": "dev: the status action should contain the id param", "request": { "error": "{{topic}} request fail {{detail}}" diff --git a/src/components/Invoices/Invoices.container.js b/src/components/Invoices/Invoices.container.js index 77b1d1ea5..17f38596b 100644 --- a/src/components/Invoices/Invoices.container.js +++ b/src/components/Invoices/Invoices.container.js @@ -14,6 +14,7 @@ import { import { getFullTime, getTimeOffset } from 'state/base/selectors' import { getEntries, + getIsMerchant, getPageLoading, getDataReceived, getExistingCoins, @@ -29,6 +30,7 @@ import Invoices from './Invoices' const mapStateToProps = state => ({ getFullTime: getFullTime(state), timeOffset: getTimeOffset(state), + isMerchant: getIsMerchant(state), pageLoading: getPageLoading(state), dataReceived: getDataReceived(state), existingCoins: getExistingCoins(state), diff --git a/src/components/Invoices/Invoices.js b/src/components/Invoices/Invoices.js index 5f353cdca..70f0e814c 100644 --- a/src/components/Invoices/Invoices.js +++ b/src/components/Invoices/Invoices.js @@ -13,6 +13,7 @@ import NoData from 'ui/NoData' import Loading from 'ui/Loading' import DataTable from 'ui/DataTable' import TimeRange from 'ui/TimeRange' +import NoMerchant from 'ui/NoMerchant' import Pagination from 'ui/Pagination' import ColumnsFilter from 'ui/ColumnsFilter' import RefreshButton from 'ui/RefreshButton' @@ -52,6 +53,7 @@ class Invoices extends PureComponent { id: PropTypes.string.isRequired, width: PropTypes.number.isRequired, })), + dataReceived: PropTypes.bool.isRequired, entries: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired, amount: PropTypes.number.isRequired, @@ -68,7 +70,7 @@ class Invoices extends PureComponent { })).isRequired, existingCoins: PropTypes.arrayOf(PropTypes.string), getFullTime: PropTypes.func.isRequired, - dataReceived: PropTypes.bool.isRequired, + isMerchant: PropTypes.bool.isRequired, pageLoading: PropTypes.bool.isRequired, refresh: PropTypes.func.isRequired, t: PropTypes.func.isRequired, @@ -102,6 +104,7 @@ class Invoices extends PureComponent { refresh, columns, timeOffset, + isMerchant, getFullTime, pageLoading, columnsWidth, @@ -121,6 +124,8 @@ class Invoices extends PureComponent { let showContent if (!dataReceived && pageLoading) { showContent = + } else if (!isMerchant) { + showContent = } else if (!entries.length) { showContent = } else { diff --git a/src/state/invoices/actions.js b/src/state/invoices/actions.js index 8aaf3d98a..5d8181fce 100644 --- a/src/state/invoices/actions.js +++ b/src/state/invoices/actions.js @@ -86,6 +86,13 @@ export function clearTargetSymbols() { } } +export function setMerchantStatus(status) { + return { + type: types.SET_MERCHANT, + payload: status, + } +} + export default { addTargetSymbol, clearTargetSymbols, @@ -93,6 +100,7 @@ export default { fetchInvoices, refresh, removeTargetSymbol, + setMerchantStatus, setTargetSymbols, updateInvoices, } diff --git a/src/state/invoices/constants.js b/src/state/invoices/constants.js index e19662b14..ad17f5618 100644 --- a/src/state/invoices/constants.js +++ b/src/state/invoices/constants.js @@ -7,4 +7,5 @@ export default { REMOVE_SYMBOL: 'BITFINEX/INVOICES/SYMBOL/REMOVE', CLEAR_SYMBOLS: 'BITFINEX/INVOICES/SYMBOL/CLEAR', UPDATE_INVOICES: 'BITFINEX/INVOICES/UPDATE', + SET_MERCHANT: 'BITFINEX/INVOICES/MERCHANT/SET', } diff --git a/src/state/invoices/reducer.js b/src/state/invoices/reducer.js index 83d87e2cb..bac436ff2 100644 --- a/src/state/invoices/reducer.js +++ b/src/state/invoices/reducer.js @@ -11,6 +11,7 @@ import { updateInvoices } from './utils' const initialState = { ...baseSymbolState, + isMerchant: true, } export function invoicesReducer(state = initialState, action) { @@ -60,6 +61,11 @@ export function invoicesReducer(state = initialState, action) { existingCoins: state.existingCoins, targetCategory: state.targetCategory, } + case types.SET_MERCHANT: + return { + ...state, + isMerchant: payload, + } case timeRangeTypes.SET_TIME_RANGE: return { ...initialState, diff --git a/src/state/invoices/saga.js b/src/state/invoices/saga.js index f92469b8f..4dad7ad69 100644 --- a/src/state/invoices/saga.js +++ b/src/state/invoices/saga.js @@ -58,11 +58,21 @@ function* fetchInvoices() { yield put(updatePagination(TYPE, result)) if (error) { - yield put(actions.fetchFail({ - id: 'status.fail', - topic: 'invoices.title', - detail: JSON.stringify(error), - })) + const { code, message } = error + if (code === 409) { + yield put(actions.setMerchantStatus(false)) + yield put(actions.fetchFail({ + id: 'status.fail', + topic: 'invoices.title', + detail: message, + })) + } else { + yield put(actions.fetchFail({ + id: 'status.fail', + topic: 'invoices.title', + detail: JSON.stringify(error), + })) + } } } catch (fail) { yield put(actions.fetchFail({ diff --git a/src/state/invoices/selectors.js b/src/state/invoices/selectors.js index 64427dd84..5c4e470ab 100644 --- a/src/state/invoices/selectors.js +++ b/src/state/invoices/selectors.js @@ -5,12 +5,14 @@ export const getTargetSymbols = state => getInvoices(state).targetSymbols export const getDataReceived = state => getInvoices(state).dataReceived export const getEntries = state => getInvoices(state).entries export const getPageLoading = state => getInvoices(state).pageLoading +export const getIsMerchant = state => getInvoices(state).isMerchant export default { getDataReceived, getEntries, getExistingCoins, getInvoices, + getIsMerchant, getPageLoading, getTargetSymbols, } diff --git a/src/ui/NoMerchant/NoMerchant.js b/src/ui/NoMerchant/NoMerchant.js new file mode 100644 index 000000000..1ab34efdd --- /dev/null +++ b/src/ui/NoMerchant/NoMerchant.js @@ -0,0 +1,30 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { withTranslation } from 'react-i18next' + +import Icon from 'icons' + +const NoMerchant = ({ t }) => ( +
+
+ + <> + {t('no_merchant.title')} + + {t('no_merchant.link')} + + . + +
+
+) + +NoMerchant.propTypes = { + t: PropTypes.func.isRequired, +} + +export default withTranslation('translations')(NoMerchant) diff --git a/src/ui/NoMerchant/_NoMerchant.scss b/src/ui/NoMerchant/_NoMerchant.scss new file mode 100644 index 000000000..b80c2b43c --- /dev/null +++ b/src/ui/NoMerchant/_NoMerchant.scss @@ -0,0 +1,31 @@ +.no_merchant { + position: relative; + + &-wrapper { + width: fit-content; + height: fit-content; + margin: 180px auto 0 auto; + text-align: center; + + svg { + display: block; + margin: 0 auto 38px auto; + } + } +} + +@media screen and (min-width: 2560px) { + .no_merchant { + &-wrapper { + margin: 262px auto 0 auto; + } + } +} + +@media screen and (max-width: 390px) { + .no_merchant { + &-wrapper { + margin: 40px auto 0 auto; + } + } +} diff --git a/src/ui/NoMerchant/index.js b/src/ui/NoMerchant/index.js new file mode 100644 index 000000000..98236bd51 --- /dev/null +++ b/src/ui/NoMerchant/index.js @@ -0,0 +1 @@ +export { default } from './NoMerchant' diff --git a/src/ui/_index.scss b/src/ui/_index.scss index d09b71213..c2f2802c9 100644 --- a/src/ui/_index.scss +++ b/src/ui/_index.scss @@ -14,6 +14,7 @@ @import "./NavMenu/_NavMenu.scss"; @import "./NavSwitcher/_NavSwitcher.scss"; @import "./NoData/_NoData.scss"; +@import "./NoMerchant/_NoMerchant.scss"; @import "./Pagination/_Pagination.scss"; @import "./PlatformLogo/_PlatformLogo.scss"; @import "./QueryButton/_QueryButton.scss";