🌱 Implement Request BTC component

i18n/locales/en/common.json

@@ -55,6 +55,7 @@
   "Apply Filters": "Apply Filters",
   "Approval": "Approval",
   "Auto Logout": "Auto Logout",
+  "BTC Address": "BTC Address",
   "BTC token": "BTC token",
   "Back": "Back",
   "Back to Delegates": "Back to Delegates",
@@ -114,7 +115,9 @@
   "Copied!": "Copied!",
   "Copy": "Copy",
   "Copy Link": "Copy Link",
+  "Copy address": "Copy address",
   "Copy link": "Copy link",
+  "Copy the address or scan the QR code, to easily request BTC tokens from Lisk Hub or Lisk Mobile users.": "Copy the address or scan the QR code, to easily request BTC tokens from Lisk Hub or Lisk Mobile users.",
   "Copy to Clipboard": "Copy to Clipboard",
   "Could not reach the network. Please try again.": "Could not reach the network. Please try again.",
   "Create": "Create",

src/components/requestV2/request.js

@@ -1,11 +1,31 @@
+import PropTypes from 'prop-types';
 import React from 'react';
 
-import RequestLSK from './requestLsk';
+import { tokenKeys } from '../../constants/tokens';
+import RequestBtc from './requestBtc';
+import RequestLsk from './requestLsk';
+
+const TagNameMap = {
+  LSK: RequestLsk,
+  BTC: RequestBtc,
+};
 
 const Request = ({
-  address, t,
-}) => (
-  <RequestLSK address={address} t={t} />
-);
+  address, t, token,
+}) => {
+  const TagName = TagNameMap[token];
+  return <TagName address={address} t={t} />;
+};
+
+Request.propTypes = {
+  address: PropTypes.string.required,
+  token: PropTypes.oneOf(tokenKeys).required,
+  t: PropTypes.func,
+};
+
+Request.defaultProps = {
+  address: '',
+  token: 'LSK',
+};
 
 export default Request;

src/components/requestV2/requestBtc.js

@@ -0,0 +1,24 @@
+import React from 'react';
+
+import RequestWrapper from './requestWrapper';
+
+import styles from './requestV2.css';
+
+const RequestBtc = ({
+  address, t,
+}) => (
+  <RequestWrapper copyLabel={t('Copy address')} copyValue={address} t={t}>
+    <span className={`${styles.label}`}>
+      {t('Copy the address or scan the QR code, to easily request BTC tokens from Lisk Hub or Lisk Mobile users.')}
+    </span>
+    <label className={`${styles.fieldGroup}`}>
+      <span className={`${styles.fieldLabel}`}>{t('BTC Address')}</span>
+      <span className={`${styles.amountField} address`}>
+        {address}
+      </span>
+    </label>
+  </RequestWrapper>
+
+);
+
+export default RequestBtc;