diff --git a/src/components/FeesField/GenericContainer.js b/src/components/FeesField/GenericContainer.js index 164888c5..aa4a857d 100644 --- a/src/components/FeesField/GenericContainer.js +++ b/src/components/FeesField/GenericContainer.js @@ -7,11 +7,15 @@ import LabelWithExternalIcon from 'components/base/LabelWithExternalIcon' import { translate } from 'react-i18next' import { openURL } from 'helpers/linking' import { urls } from 'config/support' +import { track } from 'analytics/segment' export default translate()(({ children, t }: { children: React$Node, t: * }) => ( openURL(urls.feesMoreInfo)} + onClick={() => { + openURL(urls.feesMoreInfo) + track('Send Flow Fees Help Requested') + }} label={t('app:send.steps.amount.fees')} /> diff --git a/src/components/Onboarding/steps/Analytics.js b/src/components/Onboarding/steps/Analytics.js index 1b78af73..71f1d1f6 100644 --- a/src/components/Onboarding/steps/Analytics.js +++ b/src/components/Onboarding/steps/Analytics.js @@ -6,13 +6,13 @@ import { connect } from 'react-redux' import { saveSettings } from 'actions/settings' import Box from 'components/base/Box' import Switch from 'components/base/Switch' +import FakeLink from 'components/base/FakeLink' import TrackPage from 'analytics/TrackPage' import Track from 'analytics/Track' import { openModal } from 'reducers/modals' import { MODAL_SHARE_ANALYTICS, MODAL_TECHNICAL_DATA } from 'config/constants' import ShareAnalytics from '../../modals/ShareAnalytics' import TechnicalData from '../../modals/TechnicalData' -import FakeLink from '../../base/FakeLink' import { Title, Description, FixedTopContainer, StepContainerInner } from '../helperComponents' import OnboardingFooter from '../OnboardingFooter' diff --git a/src/components/RecipientAddress/index.js b/src/components/RecipientAddress/index.js index f96205c3..598190e0 100644 --- a/src/components/RecipientAddress/index.js +++ b/src/components/RecipientAddress/index.js @@ -11,6 +11,7 @@ import { radii } from 'styles/theme' import QRCodeCameraPickerCanvas from 'components/QRCodeCameraPickerCanvas' import Box from 'components/base/Box' import Input from 'components/base/Input' +import { track } from 'analytics/segment' import IconQrCode from 'icons/QrCode' @@ -64,10 +65,13 @@ class RecipientAddress extends PureComponent { qrReaderOpened: false, } - handleClickQrCode = () => + handleClickQrCode = () => { + const { qrReaderOpened } = this.state this.setState(prev => ({ qrReaderOpened: !prev.qrReaderOpened, })) + !qrReaderOpened ? track('Send Flow QR Code Opened') : track('Send Flow QR Code Closed') + } handleOnPick = (code: string) => { const { address, ...rest } = decodeURIScheme(code) diff --git a/src/components/SettingsPage/ReleaseNotesButton.js b/src/components/SettingsPage/ReleaseNotesButton.js index d6864d05..336d8e52 100644 --- a/src/components/SettingsPage/ReleaseNotesButton.js +++ b/src/components/SettingsPage/ReleaseNotesButton.js @@ -32,7 +32,7 @@ class ReleaseNotesButton extends PureComponent { openModal(MODAL_RELEASES_NOTES, version) }} > - {t('app:settings.about.releaseNotesBtn')} + {t('app:settings.help.releaseNotesBtn')} ) } diff --git a/src/components/SettingsPage/SettingsSection.js b/src/components/SettingsPage/SettingsSection.js index 03d9678c..de34dee1 100644 --- a/src/components/SettingsPage/SettingsSection.js +++ b/src/components/SettingsPage/SettingsSection.js @@ -24,8 +24,8 @@ const RoundIconContainer = styled(Box).attrs({ bg: p => rgba(p.theme.colors.wallet, 0.2), color: 'wallet', })` - height: 30px; - width: 30px; + height: 34px; + width: 34px; border-radius: 50%; ` diff --git a/src/components/SettingsPage/index.js b/src/components/SettingsPage/index.js index 51faedbf..dd8ed640 100644 --- a/src/components/SettingsPage/index.js +++ b/src/components/SettingsPage/index.js @@ -13,6 +13,7 @@ import Pills from 'components/base/Pills' import Box from 'components/base/Box' import SectionDisplay from './sections/Display' import SectionCurrencies from './sections/Currencies' +import SectionHelp from './sections/Help' import SectionAbout from './sections/About' import SectionTools from './sections/Tools' @@ -52,6 +53,11 @@ class SettingsPage extends PureComponent { label: props.t('app:settings.tabs.about'), value: SectionAbout, }, + { + key: 'help', + label: props.t('app:settings.tabs.help'), + value: SectionHelp, + }, ] if (EXPERIMENTAL_TOOLS_SETTINGS) { diff --git a/src/components/SettingsPage/sections/About.js b/src/components/SettingsPage/sections/About.js index 4e89356e..14592b54 100644 --- a/src/components/SettingsPage/sections/About.js +++ b/src/components/SettingsPage/sections/About.js @@ -2,15 +2,13 @@ import React, { PureComponent } from 'react' import { translate } from 'react-i18next' + import type { T } from 'types/common' + import TrackPage from 'analytics/TrackPage' -import IconHelp from 'icons/Help' -import resolveLogsDirectory from 'helpers/resolveLogsDirectory' import { urls } from 'config/support' +import IconLoader from 'icons/Loader' -import ExportLogsBtn from 'components/ExportLogsBtn' -import CleanButton from '../CleanButton' -import ResetButton from '../ResetButton' import ReleaseNotesButton from '../ReleaseNotesButton' import AboutRowItem from '../AboutRowItem' @@ -25,7 +23,7 @@ type Props = { t: T, } -class SectionAbout extends PureComponent { +class SectionHelp extends PureComponent { render() { const { t } = this.props const version = __APP_VERSION__ @@ -35,44 +33,19 @@ class SectionAbout extends PureComponent {
} + icon={} title={t('app:settings.tabs.about')} desc={t('app:settings.about.desc')} /> - + - - - - - - - - - - - - @@ -81,4 +54,4 @@ class SectionAbout extends PureComponent { } } -export default translate()(SectionAbout) +export default translate()(SectionHelp) diff --git a/src/components/SettingsPage/sections/Help.js b/src/components/SettingsPage/sections/Help.js new file mode 100644 index 00000000..cfd1ceb6 --- /dev/null +++ b/src/components/SettingsPage/sections/Help.js @@ -0,0 +1,72 @@ +// @flow + +import React, { PureComponent } from 'react' +import { translate } from 'react-i18next' +import type { T } from 'types/common' +import TrackPage from 'analytics/TrackPage' +import IconHelp from 'icons/Help' +import resolveLogsDirectory from 'helpers/resolveLogsDirectory' +import { urls } from 'config/support' + +import ExportLogsBtn from 'components/ExportLogsBtn' +import CleanButton from '../CleanButton' +import ResetButton from '../ResetButton' +import AboutRowItem from '../AboutRowItem' + +import { + SettingsSection as Section, + SettingsSectionHeader as Header, + SettingsSectionBody as Body, + SettingsSectionRow as Row, +} from '../SettingsSection' + +type Props = { + t: T, +} + +class SectionHelp extends PureComponent { + render() { + const { t } = this.props + + return ( +
+ + +
} + title={t('app:settings.tabs.help')} + desc={t('app:settings.help.desc')} + /> + + + + + + + + + + + + + + +
+ ) + } +} + +export default translate()(SectionHelp) diff --git a/src/components/base/LabelWithExternalIcon.js b/src/components/base/LabelWithExternalIcon.js index 68d83a4d..8251dbf2 100644 --- a/src/components/base/LabelWithExternalIcon.js +++ b/src/components/base/LabelWithExternalIcon.js @@ -8,7 +8,7 @@ import Box from 'components/base/Box' import IconExternalLink from 'icons/ExternalLink' // can add more dynamic options if needed -export function LabelWithExternalIcon({ onClick, label }: { onClick: () => void, label: string }) { +export function LabelWithExternalIcon({ onClick, label }: { onClick: ?() => void, label: string }) { return ( {label} diff --git a/src/components/modals/AddAccounts/steps/03-step-import.js b/src/components/modals/AddAccounts/steps/03-step-import.js index b74046fa..1142c7e4 100644 --- a/src/components/modals/AddAccounts/steps/03-step-import.js +++ b/src/components/modals/AddAccounts/steps/03-step-import.js @@ -70,10 +70,21 @@ class StepImport extends PureComponent { const { t } = this.props let { name } = account + const isLegacy = name.indexOf('legacy') !== -1 + const isUnsplit = name.indexOf('unsplit') !== -1 + if (name === 'New Account') { name = t('app:addAccounts.newAccount') - } else if (name.indexOf('legacy') !== -1) { - name = t('app:addAccounts.legacyAccount', { accountName: name.replace(' (legacy)', '') }) + } else if (isLegacy) { + if (isUnsplit) { + name = t('app:addAccounts.legacyUnsplitAccount', { + accountName: name.replace(' (legacy)', '').replace(' (unsplit)', ''), + }) + } else { + name = t('app:addAccounts.legacyAccount', { accountName: name.replace(' (legacy)', '') }) + } + } else if (isUnsplit) { + name = t('app:addAccounts.unsplitAccount', { accountName: name.replace(' (unsplit)', '') }) } return { diff --git a/src/components/modals/Send/fields/RecipientField.js b/src/components/modals/Send/fields/RecipientField.js index c7df23ba..1313d0aa 100644 --- a/src/components/modals/Send/fields/RecipientField.js +++ b/src/components/modals/Send/fields/RecipientField.js @@ -8,6 +8,7 @@ import { urls } from 'config/support' import Box from 'components/base/Box' import LabelWithExternalIcon from 'components/base/LabelWithExternalIcon' import RecipientAddress from 'components/RecipientAddress' +import { track } from 'analytics/segment' type Props = { t: T, @@ -63,6 +64,7 @@ class RecipientField extends Component, { isVali handleRecipientAddressHelp = () => { openURL(urls.recipientAddressInfo) + track('Send Flow Recipient Address Help Requested') } render() { const { bridge, account, transaction, t, autoFocus } = this.props diff --git a/src/components/modals/Send/steps/01-step-amount.js b/src/components/modals/Send/steps/01-step-amount.js index 3461a4d7..b551f04a 100644 --- a/src/components/modals/Send/steps/01-step-amount.js +++ b/src/components/modals/Send/steps/01-step-amount.js @@ -10,6 +10,7 @@ import FormattedVal from 'components/base/FormattedVal' import Text from 'components/base/Text' import CounterValue from 'components/CounterValue' import Spinner from 'components/base/Spinner' +import TrackPage from 'analytics/TrackPage' import RecipientField from '../fields/RecipientField' import AmountField from '../fields/AmountField' @@ -34,6 +35,7 @@ export default ({ return ( + diff --git a/src/components/modals/Send/steps/02-step-connect-device.js b/src/components/modals/Send/steps/02-step-connect-device.js index 47352a2d..876ba1d1 100644 --- a/src/components/modals/Send/steps/02-step-connect-device.js +++ b/src/components/modals/Send/steps/02-step-connect-device.js @@ -11,7 +11,7 @@ import type { StepProps } from '../index' export default function StepConnectDevice({ account, onChangeAppOpened }: StepProps<*>) { return ( - + > { const { t } = this.props return ( - + {multiline(t('app:send.steps.verification.warning'))} {t('app:send.steps.verification.body')} diff --git a/src/components/modals/Send/steps/04-step-confirmation.js b/src/components/modals/Send/steps/04-step-confirmation.js index 1b28ffb8..6e308795 100644 --- a/src/components/modals/Send/steps/04-step-confirmation.js +++ b/src/components/modals/Send/steps/04-step-confirmation.js @@ -60,7 +60,7 @@ export default function StepConfirmation({ t, optimisticOperation, error }: Step const translatedErrDesc = error ? || '' : '' return ( - + @@ -88,10 +88,10 @@ export function StepConfirmationFooter({ {optimisticOperation ? ( - // TODO: actually go to operations details url ? (