diff --git a/web/cashtab/src/components/Common/Ticker.js b/web/cashtab/src/components/Common/Ticker.js --- a/web/cashtab/src/components/Common/Ticker.js +++ b/web/cashtab/src/components/Common/Ticker.js @@ -28,7 +28,11 @@ xecApiBatchSize: 20, websocketDisconnectedRefreshInterval: 1000, // 1000 = 1s websocketConnectedRefreshInterval: 30000, - defaultSettings: { fiatCurrency: 'usd', sendModal: false }, + defaultSettings: { + fiatCurrency: 'usd', + sendModal: false, + autoCameraOn: true, + }, notificationDurationShort: 3, notificationDurationLong: 5, localStorageMaxCharacters: 24, @@ -76,6 +80,7 @@ 'chf', ], sendModal: [true, false], + autoCameraOn: [true, false], }, fiatCurrencies: { usd: { name: 'US Dollar', symbol: '$', slug: 'usd' }, diff --git a/web/cashtab/src/components/Configure/Configure.js b/web/cashtab/src/components/Configure/Configure.js --- a/web/cashtab/src/components/Configure/Configure.js +++ b/web/cashtab/src/components/Configure/Configure.js @@ -56,7 +56,8 @@ import { formatSavedBalance } from 'utils/formatting'; import { isValidXecAddress } from 'utils/validation'; import { convertToEcashPrefix } from 'utils/cashMethods'; - +import useWindowDimensions from 'hooks/useWindowDimensions'; +import { isMobile, isIOS, isSafari } from 'react-device-detect'; import { currency } from 'components/Common/Ticker.js'; const { Panel } = Collapse; @@ -435,6 +436,13 @@ margin: 60px 0 50px; `; +const HideableTextContainer = styled.div``; +const AutoCameraTextCtn = styled.div` + display: flex; + white-space: nowrap; + gap: 3px; +`; + const GeneralSettingsItem = styled.div` display: flex; align-items: center; @@ -460,6 +468,14 @@ .SendConfirm { color: ${props => props.theme.lightWhite}; } + ${AutoCameraTextCtn} { + color: ${props => props.theme.lightWhite}; + ${HideableTextContainer} { + @media (max-width: 500px) { + display: none; + } + } + } `; const Configure = () => { @@ -561,6 +577,9 @@ useState(null); const [manualContactAddressIsValid, setManualContactAddressIsValid] = useState(null); + const { width } = useWindowDimensions(); + + const scannerSupported = width < 769 && isMobile && !(isIOS && !isSafari); useEffect(() => { // Update savedWallets every time the active wallet changes @@ -938,6 +957,10 @@ changeCashtabSettings('sendModal', checkedState); }; + const handleCameraOverride = checkedState => { + changeCashtabSettings('autoCameraOn', checkedState); + }; + const getContactNameByAddress = contactAddress => { if (!contactAddress) { return; @@ -1834,6 +1857,27 @@ onChange={handleSendModalToggle} /> + {scannerSupported && ( + + + Auto-open camera{' '} + + on send + + + } + unCheckedChildren={} + checked={ + cashtabSettings + ? cashtabSettings.autoCameraOn + : false + } + onChange={handleCameraOverride} + /> + + )} [ diff --git a/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap b/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap --- a/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap +++ b/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap @@ -348,7 +348,7 @@ General Settings
{ expect( - isValidCashtabSettings({ fiatCurrency: 'usd', sendModal: false }), + isValidCashtabSettings({ + fiatCurrency: 'usd', + sendModal: false, + autoCameraOn: true, + }), ).toBe(true); }); it(`Rejects a cashtab settings object for an unsupported currency`, () => { @@ -671,20 +675,24 @@ ).toStrictEqual({ fiatCurrency: 'gbp', sendModal: false, + autoCameraOn: true, })); it('sets settings object with no exsting valid settings to default values', () => expect(parseInvalidSettingsForMigration({})).toStrictEqual({ fiatCurrency: 'usd', sendModal: false, + autoCameraOn: true, })); it('does nothing if valid settings object is present in localStorage', () => expect( parseInvalidSettingsForMigration({ fiatCurrency: 'brl', sendModal: true, + autoCameraOn: true, }), ).toStrictEqual({ fiatCurrency: 'brl', sendModal: true, + autoCameraOn: true, })); });