diff --git a/i18n/locales/en/common.json b/i18n/locales/en/common.json index 57eab252e3..5e451cdd02 100644 --- a/i18n/locales/en/common.json +++ b/i18n/locales/en/common.json @@ -39,7 +39,6 @@ "Amount": "Amount", "Amount (LSK)": "Amount (LSK)", "Amount of transaction": "Amount of transaction", - "Amount of trasaction": "Amount of trasaction", "Amount transfered": "Amount transfered", "An error occoured while rendering this page": "An error occoured while rendering this page", "An error occurred while creating the transaction.": "An error occurred while creating the transaction.", @@ -50,6 +49,7 @@ "Are you certain of your choice?": "Are you certain of your choice?", "Auto-logout": "Auto-logout", "Back": "Back", + "Back to wallet": "Back to wallet", "Backup your Passphrase": "Backup your Passphrase", "Balance": "Balance", "Become a delegate": "Become a delegate", @@ -210,6 +210,7 @@ "Invalid address": "Invalid address", "Invalid amount": "Invalid amount", "Is Blockchain Secure?": "Is Blockchain Secure?", + "Is the problem presisting?": "Is the problem presisting?", "It is highly recommended to delete the PDF and remove it from your trash after printing.": "It is highly recommended to delete the PDF and remove it from your trash after printing.", "It is recommended that you initialize your Lisk ID.": "It is recommended that you initialize your Lisk ID.", "It will cost you only the usual {{fee}} LSK transaction fee.": "It will cost you only the usual {{fee}} LSK transaction fee.", @@ -341,6 +342,7 @@ "Remove from bookmarks": "Remove from bookmarks", "Removed Votes": "Removed Votes", "Report the error via E-Mail": "Report the error via E-Mail", + "Report the error via email": "Report the error via email", "Request": "Request", "Request LSK": "Request LSK", "Requested amount": "Requested amount", @@ -573,5 +575,7 @@ "{{length}} extra characters": "{{length}} extra characters", "{{length}} out of {{maxLength}} characters left": "{{length}} out of {{maxLength}} characters left", "{{length}} out of {{total}} characters left": "{{length}} out of {{total}} characters left", + "{{paragraph}}": "{{paragraph}}", + "{{title}}": "{{title}}", "{{title}} has been added to your Dashboard.": "{{title}} has been added to your Dashboard." } diff --git a/jest.config.js b/jest.config.js index d1006b03c5..9b42e3b7ee 100644 --- a/jest.config.js +++ b/jest.config.js @@ -145,6 +145,7 @@ module.exports = { globals: { PRODUCTION: true, TEST: true, + VERSION: '', }, coverageReporters: [ 'text', diff --git a/src/assets/images/icons-v2/transactionError.svg b/src/assets/images/icons-v2/transactionError.svg new file mode 100644 index 0000000000..566400790b --- /dev/null +++ b/src/assets/images/icons-v2/transactionError.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/assets/images/icons-v2/transactionSuccess.svg b/src/assets/images/icons-v2/transactionSuccess.svg new file mode 100644 index 0000000000..d6d8689d3d --- /dev/null +++ b/src/assets/images/icons-v2/transactionSuccess.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/components/app/variablesV2.css b/src/components/app/variablesV2.css index d55e9f3579..27e87647d5 100644 --- a/src/components/app/variablesV2.css +++ b/src/components/app/variablesV2.css @@ -46,6 +46,7 @@ or "warn/action" ineastd of "red/green" --font-size-h5: 20px; --font-size-h6: 16px; --font-size-small: 10px; + --font-size-large: 24px; --heading-font: 'gilroy', 'Open Sans', sans-serif; --content-font: 'gilroy-regular', 'Open Sans', sans-serif; --font-weight-normal: 400; @@ -60,6 +61,7 @@ or "warn/action" ineastd of "red/green" --button-font-size-s: 12px; --footnote-font-size: 12px; --font-size-title: 18px; + --font-size-small-secondary: 13px; /************************* Sizes diff --git a/src/components/bookmarkV2/bookmark.css b/src/components/bookmarkV2/bookmark.css index 21a7a87427..6df6fa9219 100644 --- a/src/components/bookmarkV2/bookmark.css +++ b/src/components/bookmarkV2/bookmark.css @@ -35,10 +35,16 @@ box-shadow: var(--box-shadow-search); flex-direction: column; justify-content: center; - align-items: center; + align-items: flex-start; z-index: 3; max-height: 176px; - overflow: scroll; + overflow: hidden; + + & > div:first-child { + overflow: auto; + max-height: 176px; + width: calc(100% + 20px); + } } .status { diff --git a/src/components/bookmarkV2/index.js b/src/components/bookmarkV2/index.js index bcf6b6bc19..d6b6ef5778 100644 --- a/src/components/bookmarkV2/index.js +++ b/src/components/bookmarkV2/index.js @@ -8,6 +8,7 @@ import styles from './bookmark.css'; // eslint-disable-next-line complexity class Bookmark extends React.Component { + // eslint-disable-next-line max-statements constructor(props) { super(props); @@ -17,6 +18,7 @@ class Bookmark extends React.Component { }; this.loaderTimeout = null; + this.listContainerRef = null; this.onHandleKeyPress = this.onHandleKeyPress.bind(this); this.getFilterList = this.getFilterList.bind(this); @@ -24,6 +26,7 @@ class Bookmark extends React.Component { this.onKeyPressEnter = this.onKeyPressEnter.bind(this); this.onChange = this.onChange.bind(this); this.onSelectedAccount = this.onSelectedAccount.bind(this); + this.resetListIndex = this.resetListIndex.bind(this); } getFilterList() { @@ -35,21 +38,37 @@ class Bookmark extends React.Component { account.address.toLowerCase().includes(recipient.value.toLowerCase())); } + resetListIndex() { + this.setState({ dropdownIndex: 0 }); + } + onSelectedAccount(account) { this.setState({ isLoading: false }); + this.resetListIndex(); this.props.onSelectedAccount(account); } onKeyPressDownOrUp(action) { + const rowHeight = 44; const { dropdownIndex } = this.state; const accountsLength = this.getFilterList().length; // istanbul ignore else - if (action === 'down' && dropdownIndex < accountsLength - 1) this.setState({ dropdownIndex: dropdownIndex + 1 }); - + if (action === 'down' && dropdownIndex < accountsLength - 1) { + if (dropdownIndex + 1 >= 4) { + this.listContainerRef.scrollTop = this.listContainerRef.scrollTop + rowHeight; + } + this.setState({ dropdownIndex: dropdownIndex + 1 }); + } // istanbul ignore else - if (action === 'up' && dropdownIndex > 0) this.setState({ dropdownIndex: this.state.dropdownIndex - 1 }); + if (action === 'up' && dropdownIndex > 0) { + this.listContainerRef.scrollTop = this.listContainerRef.scrollTop > 0 + && (dropdownIndex - 1) * rowHeight < this.listContainerRef.scrollTop + ? this.listContainerRef.scrollTop - rowHeight + : this.listContainerRef.scrollTop; + this.setState({ dropdownIndex: dropdownIndex - 1 }); + } } onKeyPressEnter() { @@ -86,6 +105,8 @@ class Bookmark extends React.Component { if (this.getFilterList().length === 0) this.setState({ isLoading: false }); this.props.validateBookmark(); }, 300); + + if (e && e.target && e.target.value === '') this.resetListIndex(); this.props.onChange(e); } @@ -96,9 +117,7 @@ class Bookmark extends React.Component { placeholder, showSuggestions, } = this.props; - const { dropdownIndex } = this.state; - const showAccountVisual = recipient.address.length && !recipient.error; const selectedAccount = recipient.selected ? recipient.title : recipient.value; @@ -131,7 +150,8 @@ class Bookmark extends React.Component { { showSuggestions && recipient.value !== '' ?
-
: null } diff --git a/src/components/customRoute/customRoute.js b/src/components/customRoute/customRoute.js index 730056941f..c2475f84b0 100644 --- a/src/components/customRoute/customRoute.js +++ b/src/components/customRoute/customRoute.js @@ -16,7 +16,7 @@ const CustomRoute = ({ Piwik.tracking(rest.history, settings); return ((isPrivate && isAuthenticated) || !isPrivate ? -
+
diff --git a/src/components/offlineWrapper/offlineWrapper.css b/src/components/offlineWrapper/offlineWrapper.css index 1731ed7ccf..a1e8feaf74 100644 --- a/src/components/offlineWrapper/offlineWrapper.css +++ b/src/components/offlineWrapper/offlineWrapper.css @@ -2,7 +2,3 @@ opacity: 0.5; pointer-events: none; } - -.setHeight { - height: 100%; -} diff --git a/src/components/sendV2/form/form.js b/src/components/sendV2/form/form.js index ae9d52a4c2..6b21680c6b 100644 --- a/src/components/sendV2/form/form.js +++ b/src/components/sendV2/form/form.js @@ -305,7 +305,7 @@ class Form extends React.Component {