From ae87286ed93f40e374737ca6e3d8aa806ea7d461 Mon Sep 17 00:00:00 2001 From: Ahmed Ibrahim Date: Wed, 11 Jan 2023 12:55:06 +0200 Subject: [PATCH 1/5] Remove wallet dropdown & quick access feature --- .../app/api/localStorage/index.js | 2 - .../add-wallet/wallet-list/star.inline.svg | 6 -- .../add-wallet/wallet-list/stared.inline.svg | 6 -- .../topbar/NavDropdownContentRevamp.js | 45 --------- .../topbar/NavDropdownContentRevamp.scss | 32 ------- .../components/topbar/NavDropdownRevamp.js | 64 ------------- .../components/topbar/NavDropdownRevamp.scss | 26 ------ .../components/topbar/NavDropdownRowRevamp.js | 73 --------------- .../topbar/NavDropdownRowRevamp.scss | 38 -------- .../topbar/NavWalletDetailsRevamp.js | 5 +- .../components/topbar/NoWalletsAccessList.js | 42 --------- .../topbar/NoWalletsAccessList.scss | 28 ------ .../topbar/QuickAccessListHeader.js | 49 ---------- .../topbar/QuickAccessWalletCard.js | 91 ------------------- .../topbar/QuickAccessWalletCard.scss | 62 ------------- .../topbar/QuickAccessWalletsList.js | 33 ------- .../topbar/QuickAccessWalletsList.scss | 9 -- .../app/components/topbar/WalletCard.js | 31 ------- .../app/components/topbar/WalletCard.scss | 18 ---- .../app/components/topbar/WalletListDialog.js | 25 ----- .../app/containers/NavBarContainerRevamp.js | 67 +------------- .../categories/RemoveWalletDialogContainer.js | 3 +- .../app/i18n/locales/en-US.json | 4 - .../app/stores/toplevel/ProfileStore.js | 2 +- 24 files changed, 7 insertions(+), 754 deletions(-) delete mode 100644 packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/star.inline.svg delete mode 100644 packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/stared.inline.svg delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.js delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.scss delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.js delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.scss delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.js delete mode 100644 packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.scss delete mode 100644 packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.js delete mode 100644 packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.scss delete mode 100644 packages/yoroi-extension/app/components/topbar/QuickAccessListHeader.js delete mode 100644 packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.js delete mode 100644 packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.scss delete mode 100644 packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.js delete mode 100644 packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.scss diff --git a/packages/yoroi-extension/app/api/localStorage/index.js b/packages/yoroi-extension/app/api/localStorage/index.js index 691a431d12..61a38ad860 100644 --- a/packages/yoroi-extension/app/api/localStorage/index.js +++ b/packages/yoroi-extension/app/api/localStorage/index.js @@ -46,7 +46,6 @@ export type SetCustomUserThemeRequest = {| export type WalletsNavigation = {| ergo: number[], cardano: number[], - quickAccess: number[], |} /** @@ -286,7 +285,6 @@ export default class LocalStorageApi { if(Array.isArray(result)) return { cardano: [], ergo: [], - quickAccess: [], } return result diff --git a/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/star.inline.svg b/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/star.inline.svg deleted file mode 100644 index 56462429f6..0000000000 --- a/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/star.inline.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - \ No newline at end of file diff --git a/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/stared.inline.svg b/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/stared.inline.svg deleted file mode 100644 index 43a43becfb..0000000000 --- a/packages/yoroi-extension/app/assets/images/add-wallet/wallet-list/stared.inline.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - \ No newline at end of file diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.js b/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.js deleted file mode 100644 index 8539546f85..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.js +++ /dev/null @@ -1,45 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import styles from './NavDropdownContentRevamp.scss'; -import { intlShape } from 'react-intl'; -import type { $npm$ReactIntl$IntlFormat } from 'react-intl'; -import globalMessages from '../../i18n/global-messages'; -import { Button } from '@mui/material'; - -type Props = {| - +openWalletInfoDialog: void => void, - +contentComponents?: ?Node, - +walletsCount?: number, -|}; - -@observer -export default class NavDropdownContentRevamp extends Component { - static contextTypes: {| intl: $npm$ReactIntl$IntlFormat |} = { - intl: intlShape.isRequired, - }; - static defaultProps: {| contentComponents: void, walletsCount: void |} = { - contentComponents: undefined, - walletsCount: undefined, - }; - - render(): Node { - const { contentComponents, walletsCount, openWalletInfoDialog } = this.props; - const { intl } = this.context; - - return ( -
-
- {contentComponents} -
- -
-
-
- ); - } -} diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.scss b/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.scss deleted file mode 100644 index dff7f62386..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownContentRevamp.scss +++ /dev/null @@ -1,32 +0,0 @@ -.wrapper { - position: absolute; - padding-top: 33px; - top: 30px; - width: 100%; - right: 0; - z-index: 1; -} - -.card { - overflow: hidden; - - border-radius: 8px; - background-color: #FFF; - width: 100%; - border: 1px solid #eaedf2; - box-shadow: 0 10px 30px 0 rgba(24, 26, 30, 0.12); -} - -.footer { - border-top: 1px solid #dce0e9; - display: flex; - justify-content: center; - button { - padding: 20px 0; - color: var(--yoroi-palette-secondary-300); - text-transform: uppercase; - font-size: 14px; - text-align: center; - font-weight: 500; - } -} diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.js b/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.js deleted file mode 100644 index 72fab3e5f0..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.js +++ /dev/null @@ -1,64 +0,0 @@ -// @flow -import React, { Component } from 'react'; -import type { Node, ElementRef } from 'react'; -import { observer } from 'mobx-react'; -import styles from './NavDropdownRevamp.scss'; - -import NavDropdownContentRevamp from './NavDropdownContentRevamp'; - -type Props = {| - +headerComponent?: ?Node, - +contentComponents?: ?Node, - +walletsCount?: number, - +openWalletInfoDialog: void => void, -|}; - -type State = {| - isExpanded: boolean, -|}; - -@observer -export default class NavDropdownRevamp extends Component { - static defaultProps: {| contentComponents: void, headerComponent: void, walletsCount: void |} = { - headerComponent: undefined, - contentComponents: undefined, - walletsCount: undefined, - }; - - state: State = { - isExpanded: false, - }; - - buttonRef: ?ElementRef<*>; - - constructor(props: Props) { - super(props); - this.buttonRef = React.createRef(); - } - - toggleExpansion: void => void = () => { - this.setState(prevState => ({ isExpanded: !prevState.isExpanded })); - }; - - render(): Node { - const { headerComponent, contentComponents, walletsCount, openWalletInfoDialog } = this.props; - const { isExpanded } = this.state; - - return ( -
-
{headerComponent}
- {isExpanded ? ( - - ) : null} -
- ); - } -} diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.scss b/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.scss deleted file mode 100644 index d19f2fba91..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownRevamp.scss +++ /dev/null @@ -1,26 +0,0 @@ -.wrapper { - position: relative; - display: flex; - align-items: center; -} -.wrapperHovered { - border: 1px solid #eaedf2; - border-radius: 8px; -} -.icon { - width: 20px; - margin-right: 20px; - height: 20px; -} -.component { - flex: 1; -} - -.toggle { - margin-left: auto; - transition: background-color 0.4s; - &:hover { - cursor: pointer; - background-color: #ededed; - } -} diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.js b/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.js deleted file mode 100644 index f88e3f83bf..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.js +++ /dev/null @@ -1,73 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import { intlShape } from 'react-intl'; -import classnames from 'classnames'; -import styles from './NavDropdownRowRevamp.scss'; -import type { $npm$ReactIntl$IntlFormat } from 'react-intl'; - -type Props = {| - +title?: string, - +plateComponent?: ?Node, - +detailComponent: ?Node, - /** - * null -> never synced - * undefined -> don't display sync info - */ - +syncTime?: void | null | string, - +isCurrentWallet?: boolean, - +onSelect?: void => void, -|}; - -@observer -export default class NavDropdownRowRevamp extends Component { - static contextTypes: {| intl: $npm$ReactIntl$IntlFormat |} = { - intl: intlShape.isRequired, - }; - - static defaultProps: {| - isCurrentWallet: boolean, - onSelect: void, - plateComponent: void, - syncTime: void, - title: void, - |} = { - title: undefined, - plateComponent: undefined, - syncTime: undefined, - onSelect: undefined, - isCurrentWallet: false, - }; - - render(): Node { - const { title, plateComponent, isCurrentWallet } = this.props; - - const wrapperClassname = classnames( - styles.wrapper, - isCurrentWallet !== null && isCurrentWallet === true && styles.currentWrapper, - plateComponent === undefined && title !== undefined && styles.titleWrapper - ); - - const titleSection = this.getHead(); - return
{titleSection}
; - } - - getHead: void => Node = () => { - if (this.props.plateComponent != null && this.props.onSelect != null) { - if (this.props.isCurrentWallet !== true) { - return ( - - ); - } - return
{this.props.plateComponent}
; - } - return ( -
-

{this.props.title}

-
- ); - }; -} diff --git a/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.scss b/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.scss deleted file mode 100644 index b3e4537ad5..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NavDropdownRowRevamp.scss +++ /dev/null @@ -1,38 +0,0 @@ -.wrapper { - padding: 20px 20px 20px 30px; - display: flex; - background-color: var(--yoroi-palette-common-white); -} - -.titleWrapper { - padding: 24px 100px 40px 40px; -} - -.title { - color: var(--yoroi-palette-gray-600); - font-size: 18px; - font-weight: 500; - line-height: 22px; - text-align: left; -} - -.currentWrapper { - background-color: var(--yoroi-palette-gray-50); -} - -.head { - min-width: 300px; -} -button { - &:hover { - cursor: pointer; - } -} - -.details { - flex: 1; -} - -.syncLabel { - color: var(--yoroi-palette-gray-600); -} diff --git a/packages/yoroi-extension/app/components/topbar/NavWalletDetailsRevamp.js b/packages/yoroi-extension/app/components/topbar/NavWalletDetailsRevamp.js index 7df79ff5af..da63bcf6a9 100644 --- a/packages/yoroi-extension/app/components/topbar/NavWalletDetailsRevamp.js +++ b/packages/yoroi-extension/app/components/topbar/NavWalletDetailsRevamp.js @@ -87,6 +87,7 @@ export default class NavWalletDetailsRevamp extends Component { plate, unitOfAccountSetting, getCurrentPrice, + openWalletInfoDialog } = this.props; const totalAmount = this.getTotalAmount(); @@ -97,7 +98,7 @@ export default class NavWalletDetailsRevamp extends Component { return (
-
+
-
+ diff --git a/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.js b/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.js deleted file mode 100644 index 1f293a585f..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.js +++ /dev/null @@ -1,42 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import { defineMessages, intlShape } from 'react-intl'; -import type { $npm$ReactIntl$IntlFormat } from 'react-intl'; -import styles from './NoWalletsAccessList.scss'; -import QuickAccessListheader from './QuickAccessListHeader'; - -const messages = defineMessages({ - noWallets: { - id: 'wallet.nav.noWalletsAccessList.noWallets', - defaultMessage: '!!!No wallets added to this list yet', - }, - goToWallets: { - id: 'wallet.nav.noWalletsAccessList.goToWallets', - defaultMessage: '!!!Go to all my wallets and star those you use most often', - }, -}); - -type Props = {||}; - -@observer -export default class NoWalletsAccessList extends Component { - static contextTypes: {| intl: $npm$ReactIntl$IntlFormat |} = { - intl: intlShape.isRequired, - }; - - render(): Node { - const { intl } = this.context; - - return ( -
- -
-

{intl.formatMessage(messages.noWallets)}

-

{intl.formatMessage(messages.goToWallets)}

-
-
- ); - } -} diff --git a/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.scss b/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.scss deleted file mode 100644 index 127f3e8018..0000000000 --- a/packages/yoroi-extension/app/components/topbar/NoWalletsAccessList.scss +++ /dev/null @@ -1,28 +0,0 @@ -@import '../../themes/mixins/loading-spinner'; - -.wrapper { - flex: 1; - display: flex; - flex-direction: column; - justify-content: center; - padding: 40px 36px; - text-align: center; -} - -.content { - padding: 60px 0; -} - -.noWallets { - color: var(--yoroi-palette-gray-600); - font-size: 1rem; - margin-bottom: 4px; - color: inherit; - line-height: 22px; -} -.goToWallets { - color: var(--yoroi-palette-gray-600); - font-size: 12px; - line-height: 20px; - color: inherit; -} diff --git a/packages/yoroi-extension/app/components/topbar/QuickAccessListHeader.js b/packages/yoroi-extension/app/components/topbar/QuickAccessListHeader.js deleted file mode 100644 index 02ae57f3c0..0000000000 --- a/packages/yoroi-extension/app/components/topbar/QuickAccessListHeader.js +++ /dev/null @@ -1,49 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import { defineMessages, intlShape } from 'react-intl'; -import type { $npm$ReactIntl$IntlFormat } from 'react-intl'; -import { ReactComponent as StarIcon } from '../../assets/images/add-wallet/wallet-list/stared.inline.svg'; -import { Box } from '@mui/system'; -import { Typography } from '@mui/material'; - -const messages = defineMessages({ - quickAccess: { - id: 'wallet.nav.noWalletsAccessList.quickAccess', - defaultMessage: '!!!Quick access wallets', - }, -}); - -type Props = {||}; - -@observer -export default class QuickAccessListheader extends Component { - static contextTypes: {| intl: $npm$ReactIntl$IntlFormat |} = { - intl: intlShape.isRequired, - }; - - render(): Node { - const { intl } = this.context; - - return ( - svg': { marginRight: '8px' } - }} - > - - {intl.formatMessage(messages.quickAccess)} - - - ); - } -} diff --git a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.js b/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.js deleted file mode 100644 index 65348748bc..0000000000 --- a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.js +++ /dev/null @@ -1,91 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import { intlShape } from 'react-intl'; -import type { $npm$ReactIntl$IntlFormat } from 'react-intl'; -import styles from './QuickAccessWalletCard.scss' -import { getType } from '../../utils/walletInfo'; -import { constructPlate } from './WalletCard'; -import { MultiToken } from '../../api/common/lib/MultiToken'; -import AmountDisplay from '../common/AmountDisplay'; -import type { WalletChecksum } from '@emurgo/cip4-js'; -import type { ConceptualWallet } from '../../api/ada/lib/storage/models/ConceptualWallet'; -import type { TokenLookupKey } from '../../api/common/lib/MultiToken'; -import type { TokenRow } from '../../api/ada/lib/storage/database/primitives/tables'; -import type { UnitOfAccountSettingType } from '../../types/unitOfAccountType'; - -type Props = {| - +plate: null | WalletChecksum, - +wallet: {| - conceptualWallet: ConceptualWallet, - conceptualWalletName: string, - |}, - +rewards: null | void | MultiToken, - +shouldHideBalance: boolean, - +walletAmount: null | MultiToken, - +getTokenInfo: ($ReadOnly>) => $ReadOnly, - +unitOfAccountSetting: UnitOfAccountSettingType, - +getCurrentPrice: (from: string, to: string) => ?string, -|} - -@observer -export default class QuickAccessWalletCard extends Component { - static contextTypes: {| intl: $npm$ReactIntl$IntlFormat |} = { - intl: intlShape.isRequired, - }; - - render(): Node { - const { intl } = this.context; - const { - shouldHideBalance, - unitOfAccountSetting, - getCurrentPrice, - } = this.props; - - const [, iconComponent] = this.props.plate - ? constructPlate(this.props.plate, 0, styles.main) - : []; - - const typeText = [getType(this.props.wallet.conceptualWallet)] - .filter(text => text != null) - .map(text => intl.formatMessage(text)) - .join(' - '); - const totalAmount = this.getTotalAmount(); - - return ( -
-
-
{this.props.wallet.conceptualWalletName}
- {' ยท '} -
{typeText}
-
-
-
{iconComponent}
-
-
- -
-
-
-
- ) - } - - getTotalAmount: void => null | MultiToken = () => { - if (this.props.rewards === undefined) { - return this.props.walletAmount; - } - if (this.props.rewards === null || this.props.walletAmount === null) { - return null; - } - return this.props.rewards.joinAddCopy(this.props.walletAmount); - }; -} diff --git a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.scss b/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.scss deleted file mode 100644 index d74e3eb71a..0000000000 --- a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletCard.scss +++ /dev/null @@ -1,62 +0,0 @@ -@import '../../themes/mixins/loading-spinner'; - -.component { - margin-top: 20px; - - .header { - display: flex; - color: var(--yoroi-palette-gray-900); - font-size: 14px; - letter-spacing: 0; - line-height: 22px; - margin-bottom: 8px; - - .name { - margin-right: 4px; - } - - .type { - margin-left: 4px; - } - } - - .body { - display: flex; - align-items: center; - margin-top: 0px; - - .isLoading { - position: relative; - display: flex; - align-items: center; - justify-content: center; - margin-left: 15px; - } - - .amount { - margin-left: 12px; - flex: 1; - - & > p:nth-child(2) { - margin-top: 5px; - } - } - - .fixedAmount { - margin-left: 12px; - color: var(--yoroi-palette-gray-600); - font-size: 14px; - letter-spacing: 0; - line-height: 22px; - } - } -} - -.main { - flex: 1; - canvas { - width: 32px !important; - height: 32px !important; - border-radius: 50%; - } -} \ No newline at end of file diff --git a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.js b/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.js deleted file mode 100644 index dcaa05700f..0000000000 --- a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.js +++ /dev/null @@ -1,33 +0,0 @@ -// @flow -import { Component } from 'react'; -import type { Node } from 'react'; -import { observer } from 'mobx-react'; -import QuickAccessListheader from './QuickAccessListHeader'; -import styles from './QuickAccessWalletsList.scss' -import QuickAccessWalletCard from './QuickAccessWalletCard'; -import type { UnitOfAccountSettingType } from '../../types/unitOfAccountType'; - -type Props = {| - +wallets: Array, - +unitOfAccountSetting: UnitOfAccountSettingType, - +getCurrentPrice: (from: string, to: string) => ?string, -|} -@observer -export default class QuickAccessWalletsList extends Component { - render(): Node { - return ( -
- -
- {this.props.wallets.map(wallet => ( - - ))} -
-
- ) - } -} diff --git a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.scss b/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.scss deleted file mode 100644 index e3281ff76d..0000000000 --- a/packages/yoroi-extension/app/components/topbar/QuickAccessWalletsList.scss +++ /dev/null @@ -1,9 +0,0 @@ -.component { - padding: 40px 24px 24px 24px; - height: 330px; - overflow: auto; - - .walletsList { - margin-top: 20px; - } -} \ No newline at end of file diff --git a/packages/yoroi-extension/app/components/topbar/WalletCard.js b/packages/yoroi-extension/app/components/topbar/WalletCard.js index 3420ef1ad8..1daac160d1 100644 --- a/packages/yoroi-extension/app/components/topbar/WalletCard.js +++ b/packages/yoroi-extension/app/components/topbar/WalletCard.js @@ -18,12 +18,8 @@ import { import type { TokenLookupKey } from '../../api/common/lib/MultiToken'; import type { TokenRow } from '../../api/ada/lib/storage/database/primitives/tables'; import { ReactComponent as DragIcon } from '../../assets/images/add-wallet/wallet-list/drag.inline.svg'; -import { ReactComponent as StarIcon } from '../../assets/images/add-wallet/wallet-list/star.inline.svg'; -import { ReactComponent as StaredIcon } from '../../assets/images/add-wallet/wallet-list/stared.inline.svg'; - import { Draggable } from 'react-beautiful-dnd'; import type { UnitOfAccountSettingType } from '../../types/unitOfAccountType'; -import { Tooltip, Typography } from '@mui/material'; import AmountDisplay from '../common/AmountDisplay'; import { PublicDeriver } from '../../api/ada/lib/storage/models/PublicDeriver'; @@ -32,10 +28,6 @@ const messages = defineMessages({ id: 'wallet.topbar.dialog.tokenTypes', defaultMessage: '!!!Token types', }, - quickAccessTooltip: { - id: 'wallet.topbar.dialog.quickAccess', - defaultMessage: '!!!Add to quick acceess wallets list', - } }); type Props = {| @@ -55,8 +47,6 @@ type Props = {| +idx: number, +unitOfAccountSetting: UnitOfAccountSettingType, +getCurrentPrice: (from: string, to: string) => ?string, - +toggleQuickAccess: string => void, - +isInQuickAccess: boolean, |}; type State = {| +isActionsShow: boolean |}; @@ -195,28 +185,7 @@ export default class WalletCard extends Component {
- {!this.props.isInQuickAccess && - - {intl.formatMessage(messages.quickAccessTooltip)} - - } - placement="bottom-end" - > - - } - {this.props.isInQuickAccess && - } )} diff --git a/packages/yoroi-extension/app/components/topbar/WalletCard.scss b/packages/yoroi-extension/app/components/topbar/WalletCard.scss index 8fe353752d..f2934dabff 100644 --- a/packages/yoroi-extension/app/components/topbar/WalletCard.scss +++ b/packages/yoroi-extension/app/components/topbar/WalletCard.scss @@ -101,24 +101,6 @@ } } -.quickAccessToggle { - svg { - max-width: 24px; - max-height: 24px; - color: var(--yoroi-palette-gray-600); - } - - width: 40px; - height: 40px; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - &:hover { - background: #eaedf2; - } -} - .showActions { opacity: 1; } diff --git a/packages/yoroi-extension/app/components/topbar/WalletListDialog.js b/packages/yoroi-extension/app/components/topbar/WalletListDialog.js index 8b756646a2..44a7fdada4 100644 --- a/packages/yoroi-extension/app/components/topbar/WalletListDialog.js +++ b/packages/yoroi-extension/app/components/topbar/WalletListDialog.js @@ -123,30 +123,11 @@ export default class WalletListDialog extends Component { await this.props.updateSortedWalletList({ ergo: ergoWalletsId, cardano: cardanoWalletsId, - quickAccess: this.props.walletsNavigation.quickAccess || [], }); } ); } - toggleQuickAccess: number => Promise = async (walletId) => { - if(!walletId || typeof walletId !== 'number') throw new Error('Invalid wallet id.') - const currentQuickAccessList = this.props.walletsNavigation.quickAccess - let updatedQuickAccessList = [...currentQuickAccessList]; - // Remove wallet - if(currentQuickAccessList.indexOf(walletId) !== -1) { - updatedQuickAccessList = updatedQuickAccessList.filter(id => id !== walletId) - } else { - // Add wallet - updatedQuickAccessList.push(walletId) - } - - await this.props.updateSortedWalletList({ - ...this.props.walletsNavigation, - quickAccess: updatedQuickAccessList - }); - } - onDragEnd: (network: 'ergo' | 'cardano' ,result:Object) => any = async (network, result) => { const { destination, source } = result; if (!destination || destination.index === source.index) { @@ -169,7 +150,6 @@ export default class WalletListDialog extends Component { await this.props.updateSortedWalletList({ ergo: this.state.ergoWalletsIdx, cardano: this.state.cardanoWalletsIdx, - quickAccess: this.props.walletsNavigation.quickAccess || [], }); } ); @@ -201,7 +181,6 @@ export default class WalletListDialog extends Component { getCurrentPrice, } = this.props; - const quickAccessList = new Set(this.props.walletsNavigation.quickAccess) const walletsTotal = this.renderWalletsTotal(); return ( @@ -248,8 +227,6 @@ export default class WalletListDialog extends Component { this.setState({ selectedWallet: wallet.wallet })} isCurrentWallet={this.isCurrentWallet(wallet.wallet, 'local')} {...wallet} @@ -281,8 +258,6 @@ export default class WalletListDialog extends Component { this.setState({ selectedWallet: wallet.wallet })} isCurrentWallet={this.isCurrentWallet(wallet.wallet, 'local')} {...wallet} diff --git a/packages/yoroi-extension/app/containers/NavBarContainerRevamp.js b/packages/yoroi-extension/app/containers/NavBarContainerRevamp.js index 37cf4db245..5c00ca097b 100644 --- a/packages/yoroi-extension/app/containers/NavBarContainerRevamp.js +++ b/packages/yoroi-extension/app/containers/NavBarContainerRevamp.js @@ -5,8 +5,6 @@ import type { Node } from 'react'; import { observer } from 'mobx-react'; import type { InjectedOrGenerated } from '../types/injectedPropsType'; import NavBarRevamp from '../components/topbar/NavBarRevamp'; -import NoWalletsDropdown from '../components/topbar/NoWalletsDropdown'; -import NavDropdownRevamp from '../components/topbar/NavDropdownRevamp'; import { ROUTES } from '../routes-config'; import { ConceptualWallet } from '../api/ada/lib/storage/models/ConceptualWallet/index'; import { asGetPublicKey } from '../api/ada/lib/storage/models/PublicDeriver/traits'; @@ -23,13 +21,11 @@ import BuySellDialog from '../components/buySell/BuySellDialog'; import { genLookupOrFail, getTokenName } from '../stores/stateless/tokenHelpers'; import NavWalletDetailsRevamp from '../components/topbar/NavWalletDetailsRevamp'; import BuySellAdaButton from '../components/topbar/BuySellAdaButton'; -import NoWalletsAccessList from '../components/topbar/NoWalletsAccessList'; import WalletListDialog from '../components/topbar/WalletListDialog'; import { networks, isErgo } from '../api/ada/lib/storage/database/prepackaged/networks'; import { addressToDisplayString } from '../api/ada/lib/storage/bridge/utils'; import { getReceiveAddress } from '../stores/stateless/addressStores'; import type { UnitOfAccountSettingType } from '../types/unitOfAccountType'; -import QuickAccessWalletsList from '../components/topbar/QuickAccessWalletsList' import type { WalletsNavigation } from '../api/localStorage'; export type GeneratedData = typeof NavBarContainerRevamp.prototype.generated; @@ -65,22 +61,12 @@ export default class NavBarContainerRevamp extends Component { render(): Node { const { stores } = this.generated; const { profile } = stores; - const walletsStore = stores.wallets; - const wallets = this.generated.stores.wallets.publicDerivers; const DropdownHead = () => { const publicDeriver = walletsStore.selected; - if (publicDeriver == null) { - // TODO: Remove style since for now, we don't have a selected wallet by default - return ( -
- -
- ); - } + if (publicDeriver == null) return null; const parent = publicDeriver.getParent(); - const settingsCache = this.generated.stores.walletSettings.getConceptualWalletSettingsCache( parent ); @@ -108,55 +94,6 @@ export default class NavBarContainerRevamp extends Component { )} unitOfAccountSetting={profile.unitOfAccount} getCurrentPrice={this.generated.stores.coinPriceStore.getCurrentPrice} - /> - ); - }; - - const QuickAccessList = () => { - const quickAccessWallets = this.generated.stores.profile.walletsNavigation.quickAccess - if (!quickAccessWallets || quickAccessWallets.length === 0) return - - const publicDerivers = this.generated.stores.wallets.publicDerivers; - const walletsMap = [] - publicDerivers.forEach(wallet => { - const parent = wallet.getParent(); - const id = wallet.getPublicDeriverId() - if (quickAccessWallets.indexOf(id) === -1) return - const walletTxRequests = this.generated.stores.transactions.getTxRequests(wallet); - const balance = walletTxRequests.requests.getBalanceRequest.result || null; - const settingsCache = this.generated.stores.walletSettings.getConceptualWalletSettingsCache( - parent - ); - const withPubKey = asGetPublicKey(wallet); - const plate = - withPubKey == null - ? null - : this.generated.stores.wallets.getPublicKeyCache(withPubKey).plate; - walletsMap.push({ - walletAmount: balance, - getTokenInfo: genLookupOrFail(this.generated.stores.tokenInfoStore.tokenInfo), - wallet: settingsCache, - shouldHideBalance: this.generated.stores.profile.shouldHideBalance, - plate, - rewards: this.getRewardBalance(wallet), - }) - }) - - return ( - - ) - } - - const DropdownComponent = () => { - return ( - } - contentComponents={} - walletsCount={wallets.length} openWalletInfoDialog={() => { this.generated.actions.dialogs.open.trigger({ dialog: WalletListDialog }); }} @@ -170,7 +107,7 @@ export default class NavBarContainerRevamp extends Component { } + walletDetails={} buyButton={ diff --git a/packages/yoroi-extension/app/containers/settings/categories/RemoveWalletDialogContainer.js b/packages/yoroi-extension/app/containers/settings/categories/RemoveWalletDialogContainer.js index eed5c51322..2daf762c56 100644 --- a/packages/yoroi-extension/app/containers/settings/categories/RemoveWalletDialogContainer.js +++ b/packages/yoroi-extension/app/containers/settings/categories/RemoveWalletDialogContainer.js @@ -62,9 +62,9 @@ class RemoveWalletDialogContainer extends Component { removeWalletRevamp: void => Promise = async () => { const settingsActions = this.generated.actions.walletSettings; - const selectedWalletId = this.props.publicDeriver?.getPublicDeriverId(); const walletsNavigation = this.generated.stores.profile.walletsNavigation; + if (this.props.publicDeriver) { const walletType = getWalletType(this.props.publicDeriver) const newWalletsNavigation = { @@ -73,7 +73,6 @@ class RemoveWalletDialogContainer extends Component { [walletType]: walletsNavigation[walletType].filter( walletId => walletId !== selectedWalletId ), - quickAccess: walletsNavigation.quickAccess.filter(walletId => walletId !== selectedWalletId) } await this.generated.actions.profile.updateSortedWalletList.trigger(newWalletsNavigation); trackRemoveWallet(); diff --git a/packages/yoroi-extension/app/i18n/locales/en-US.json b/packages/yoroi-extension/app/i18n/locales/en-US.json index 6437951904..859a7abb8e 100644 --- a/packages/yoroi-extension/app/i18n/locales/en-US.json +++ b/packages/yoroi-extension/app/i18n/locales/en-US.json @@ -640,9 +640,6 @@ "wallet.nav.allWalletsLabel": "All wallets", "wallet.nav.changeWallet": "Change wallet", "wallet.nav.backButton": "Back to my wallets", - "wallet.nav.noWalletsAccessList.goToWallets": "Go to all my wallets and star those you use most often", - "wallet.nav.noWalletsAccessList.noWallets": "No wallets added to this list yet", - "wallet.nav.noWalletsAccessList.quickAccess": "Quick access wallets", "wallet.nav.type.ledger": "Ledger wallet", "wallet.nav.type.paper": "Paper wallet", "wallet.nav.type.standard": "Standard wallet", @@ -856,7 +853,6 @@ "wallet.topbar.dialog.totalBalance": "Total Balance", "wallet.topbar.dialog.ergo": "Ergo, ERG", "wallet.topbar.dialog.cardano": "Cardano, ADA", - "wallet.topbar.dialog.quickAccess": "Add to quick acceess wallets list", "wallet.transaction.address.from": "From address", "wallet.transaction.address.to": "To address", "wallet.transaction.address.type": "Address Type", diff --git a/packages/yoroi-extension/app/stores/toplevel/ProfileStore.js b/packages/yoroi-extension/app/stores/toplevel/ProfileStore.js index d741b2b85c..e2791246da 100644 --- a/packages/yoroi-extension/app/stores/toplevel/ProfileStore.js +++ b/packages/yoroi-extension/app/stores/toplevel/ProfileStore.js @@ -254,7 +254,7 @@ export default class ProfileStore extends BaseProfileStore Promise = async () => { await this.getWalletsNavigationRequest.execute(); From 5c62c4f382acfddf30503e3233c96b1c9bc8bfda Mon Sep 17 00:00:00 2001 From: Thomas Bereczky Date: Tue, 24 Jan 2023 15:12:24 +0100 Subject: [PATCH 2/5] Sonarqube workflow --- .github/workflows/sonarqube.yml | 26 ++++++++++++++++++++++++++ sonar-project.properties | 5 +++++ 2 files changed, 31 insertions(+) create mode 100644 .github/workflows/sonarqube.yml create mode 100644 sonar-project.properties diff --git a/.github/workflows/sonarqube.yml b/.github/workflows/sonarqube.yml new file mode 100644 index 0000000000..8b10a65e52 --- /dev/null +++ b/.github/workflows/sonarqube.yml @@ -0,0 +1,26 @@ +name: SonarQube Checks + +on: + # Trigger analysis when pushing to your main branches, and when creating a pull request. + push: + branches: + - main + - master + - develop + - 'releases/**' + pull_request: + types: [opened, synchronize, reopened] + +jobs: + sonarqube: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + with: + # Disabling shallow clone is recommended for improving relevancy of reporting + fetch-depth: 0 + - name: SonarQube Scan + uses: sonarsource/sonarqube-scan-action@master + env: + SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }} + SONAR_HOST_URL: ${{ secrets.SONAR_HOST_URL }} diff --git a/sonar-project.properties b/sonar-project.properties new file mode 100644 index 0000000000..a86c5f48d5 --- /dev/null +++ b/sonar-project.properties @@ -0,0 +1,5 @@ +sonar.projectKey=Emurgo_yoroi-frontend_AYXkHIRHWigj-SXq5ncX + +# relative paths to source directories. More details and properties are described +# in https://docs.sonarqube.org/latest/project-administration/narrowing-the-focus/ +sonar.sources=. From e2c7a8cb08550532e89f971510684ec139d5f7c4 Mon Sep 17 00:00:00 2001 From: Ahmed Ibrahim Date: Tue, 9 Aug 2022 14:25:36 +0200 Subject: [PATCH 3/5] Load zendesk into an iframe --- .../app/components/widgets/Support.js | 81 ++++++++++++------- 1 file changed, 53 insertions(+), 28 deletions(-) diff --git a/packages/yoroi-extension/app/components/widgets/Support.js b/packages/yoroi-extension/app/components/widgets/Support.js index 3d9ad333e2..9b17bad8ae 100644 --- a/packages/yoroi-extension/app/components/widgets/Support.js +++ b/packages/yoroi-extension/app/components/widgets/Support.js @@ -3,51 +3,76 @@ import { Component } from 'react'; import type { Node } from 'react'; import { ReactComponent as SupportIcon } from '../../assets/images/support.inline.svg'; import { IconButton } from '@mui/material'; +import { Box } from '@mui/system'; +import environment from '../../environment'; type Props = {||} +type State = {| + open: boolean, +|} +export default class Support extends Component { -export default class Support extends Component { + state: State = { + open: false, + } + + messageHandler: any => void = (event) => { + if (event.origin === 'null') { + return + } - loadScript(src: string, id: string): void { - const script = document.createElement('script') - script.src = src - script.id = id - document.body?.appendChild(script) + const eventType = event.data; + if (eventType === 'close') { + this.setState({ open: false }) + } } componentDidMount() { - this.loadScript('https://static.zdassets.com/ekr/snippet.js?key=68b95d72-6354-4343-8a64-427979a6f5d6', 'ze-snippet'); - - const interval = setInterval(()=>{ - if (typeof window.zE !== 'undefined' && typeof window.zE.hide === 'function') { - window.zE.hide() - if (interval) { - clearInterval(interval) - } - } - }, 500); + window.addEventListener('message', this.messageHandler, false); + } + + componentWillUnmount() { + window.removeEventListener('message', this.messageHandler); } - openChatBoxSupport(){ - if (typeof window.zE !== 'undefined') { - window.zE.activate() - } + getUrl(): string | null { + if (!environment.userAgentInfo.isExtension()) return null; + const agent = environment.userAgentInfo.isFirefox() ? 'firefox' : 'chrome' + return `https://emurgo.github.io/yoroi-support/?source=${agent}&extensionId=${window.location.hostname}`; } render(): Node { - return ( + const { open } = this.state; + + const url = this.getUrl(); + if (url === null) return null; + + return ( + + {open === false && this.setState({ open: true })} > - - ) + } +