Changeset View
Changeset View
Standalone View
Standalone View
web/cashtab/src/components/Common/ScanQRCode.js
import React, { useState } from 'react'; | import React, { useState } from 'react'; | ||||
import { Alert, Modal } from 'antd'; | import { Alert, Modal } from 'antd'; | ||||
import { QrcodeOutlined } from '@ant-design/icons'; | import { QrcodeOutlined } from '@ant-design/icons'; | ||||
import styled from 'styled-components'; | import styled from 'styled-components'; | ||||
import { BrowserQRCodeReader } from '@zxing/library'; | import { BrowserQRCodeReader } from '@zxing/library'; | ||||
import { currency } from '@components/Common/Ticker.js'; | import { | ||||
currency, | |||||
isCash, | |||||
isToken, | |||||
parseAddressParams, | |||||
} from '@components/Common/Ticker.js'; | |||||
import { Event } from '@utils/GoogleAnalytics'; | import { Event } from '@utils/GoogleAnalytics'; | ||||
const StyledScanQRCode = styled.span` | const StyledScanQRCode = styled.span` | ||||
display: block; | display: block; | ||||
`; | `; | ||||
const StyledModal = styled(Modal)` | const StyledModal = styled(Modal)` | ||||
width: 400px !important; | width: 400px !important; | ||||
Show All 34 Lines | const teardownCodeReader = codeReader => { | ||||
} | } | ||||
}; | }; | ||||
const parseContent = content => { | const parseContent = content => { | ||||
let type = 'unknown'; | let type = 'unknown'; | ||||
let values = {}; | let values = {}; | ||||
// If what scanner reads from QR code begins with 'bitcoincash:' or 'simpleledger:' or their successor prefixes | // If what scanner reads from QR code begins with 'bitcoincash:' or 'simpleledger:' or their successor prefixes | ||||
if ( | if (isCash(content) || isToken(content)) { | ||||
content.split(currency.prefix).length > 1 || | |||||
content.split(currency.tokenPrefix).length > 1 | |||||
) { | |||||
type = 'address'; | type = 'address'; | ||||
values = { address: content }; | |||||
// Check for params and alternative prefixes | |||||
// eg mercurymessenger.io | |||||
// ecash:qqd3qn4zazjhygk5a2vzw2gvqgqwempr4gtfza25mc?amount=500000 | |||||
values = parseAddressParams(content); | |||||
// Event("Category", "Action", "Label") | // Event("Category", "Action", "Label") | ||||
// Track number of successful QR code scans | // Track number of successful QR code scans | ||||
// BCH or slp? | // BCH or slp? | ||||
let eventLabel = currency.ticker; | let eventLabel = currency.ticker; | ||||
const isToken = content.split(currency.tokenPrefix).length > 1; | const isToken = content.split(currency.tokenPrefix).length > 1; | ||||
if (isToken) { | if (isToken) { | ||||
eventLabel = currency.tokenTicker; | eventLabel = currency.tokenTicker; | ||||
} | } | ||||
Show All 24 Lines | const scanForQrCode = async () => { | ||||
'test-area-qr-code-webcam', | 'test-area-qr-code-webcam', | ||||
); | ); | ||||
const result = parseContent(content.text); | const result = parseContent(content.text); | ||||
// stop scanning and fill form if it's an address | // stop scanning and fill form if it's an address | ||||
if (result.type === 'address') { | if (result.type === 'address') { | ||||
// Hide the scanner | // Hide the scanner | ||||
setVisible(false); | setVisible(false); | ||||
onScan(result.values.address); | onScan(result.values); | ||||
return teardownCodeReader(codeReader); | return teardownCodeReader(codeReader); | ||||
} | } | ||||
} catch (err) { | } catch (err) { | ||||
console.log(`Error in QR scanner:`); | console.log(`Error in QR scanner:`); | ||||
console.log(err); | console.log(err); | ||||
console.log(JSON.stringify(err.message)); | console.log(JSON.stringify(err.message)); | ||||
//setMobileErrorMsg(JSON.stringify(err.message)); | //setMobileErrorMsg(JSON.stringify(err.message)); | ||||
setError(err); | setError(err); | ||||
▲ Show 20 Lines • Show All 58 Lines • Show Last 20 Lines |