diff --git a/native/qr-code/qr-code-screen.react.js b/native/qr-code/qr-code-screen.react.js
index e4d7a1ca4..879d76851 100644
--- a/native/qr-code/qr-code-screen.react.js
+++ b/native/qr-code/qr-code-screen.react.js
@@ -1,107 +1,108 @@
// @flow
import * as React from 'react';
import { View, Text } from 'react-native';
import QRCode from 'react-native-qrcode-svg';
import { qrCodeLinkURL } from 'lib/facts/links.js';
import type { QRCodeSignInNavigationProp } from './qr-code-sign-in-navigator.react.js';
import type { NavigationRoute } from '../navigation/route-names.js';
import { useStyles } from '../themes/colors.js';
import * as AES from '../utils/aes-crypto-module.js';
+import { getContentSigningKey } from '../utils/crypto-utils.js';
type QRCodeScreenProps = {
+navigation: QRCodeSignInNavigationProp<'QRCodeScreen'>,
+route: NavigationRoute<'QRCodeScreen'>,
};
-const defaultDeviceEd25519Key = 'device_ed25519_key';
-
// eslint-disable-next-line no-unused-vars
function QRCodeScreen(props: QRCodeScreenProps): React.Node {
const [qrCodeValue, setQrCodeValue] = React.useState();
const generateQRCode = React.useCallback(async () => {
try {
const aes256Key: Uint8Array = await AES.generateKey();
- const url = qrCodeLinkURL(aes256Key, defaultDeviceEd25519Key);
+ const ed25519Key: string = await getContentSigningKey();
+
+ const url = qrCodeLinkURL(aes256Key, ed25519Key);
setQrCodeValue(url);
} catch (err) {
console.error('Failed to generate QR Code:', err);
}
}, []);
React.useEffect(() => {
generateQRCode();
}, [generateQRCode]);
const styles = useStyles(unboundStyles);
return (
Log in to Comm
Open the Comm app on your phone and scan the QR code below
How to find the scanner:
Go to
Profile
Select
Linked devices
Click
Add
on the top right
);
}
const unboundStyles = {
container: {
flex: 1,
alignItems: 'center',
marginTop: 125,
},
heading: {
fontSize: 24,
color: 'panelForegroundLabel',
paddingBottom: 12,
},
headingSubtext: {
fontSize: 12,
color: 'panelForegroundLabel',
paddingBottom: 30,
},
instructionsBox: {
alignItems: 'center',
width: 300,
marginTop: 40,
padding: 15,
borderColor: 'panelForegroundLabel',
borderWidth: 2,
borderRadius: 8,
},
instructionsTitle: {
fontSize: 12,
color: 'panelForegroundLabel',
paddingBottom: 15,
},
instructionsStep: {
fontSize: 12,
padding: 1,
color: 'panelForegroundLabel',
},
instructionsBold: {
fontWeight: 'bold',
},
};
export default QRCodeScreen;
diff --git a/web/account/qr-code-login.react.js b/web/account/qr-code-login.react.js
index 9b5366ecb..4b50214dc 100644
--- a/web/account/qr-code-login.react.js
+++ b/web/account/qr-code-login.react.js
@@ -1,53 +1,59 @@
// @flow
import { QRCodeSVG } from 'qrcode.react';
import * as React from 'react';
import { qrCodeLinkURL } from 'lib/facts/links.js';
import css from './qr-code-login.css';
import { generateKey } from '../media/aes-crypto-utils.js';
-
-const defaultDeviceEd25519Key = 'device_ed25519_key';
+import { useSelector } from '../redux/redux-utils.js';
function QrCodeLogin(): React.Node {
const [qrCodeValue, setQrCodeValue] = React.useState();
+ const ed25519Key = useSelector(
+ state => state.cryptoStore.primaryIdentityKeys?.ed25519,
+ );
const generateQRCode = React.useCallback(async () => {
try {
+ if (!ed25519Key) {
+ return;
+ }
+
const aes256Key: Uint8Array = await generateKey();
- const url = qrCodeLinkURL(aes256Key, defaultDeviceEd25519Key);
+ const url = qrCodeLinkURL(aes256Key, ed25519Key);
setQrCodeValue(url);
} catch (err) {
console.error('Failed to generate QR Code:', err);
}
- }, []);
+ }, [ed25519Key]);
React.useEffect(() => {
generateQRCode();
}, [generateQRCode]);
return (
Log in to Comm
Open the Comm app on your phone and scan the QR code below
How to find the scanner:
Go to Profile
Select Linked devices
Click Add on the top right
);
}
export default QrCodeLogin;