Update keystone links (#18792)

* update keystone links

* update tests

* fix lint

app/_locales/en/messages.json

@@ -1970,6 +1970,9 @@
     "message": "Want to $1 about gas?",
     "description": "$1 will be replaced by the learnMore translation key"
   },
+  "learnMoreKeystone": {
+    "message": "Learn More"
+  },
   "learnMoreUpperCase": {
     "message": "Learn more"
   },

shared/constants/hardware-wallets.ts

@@ -33,7 +33,7 @@ export enum HardwareAffiliateLinks {
   ledger = 'https://shop.ledger.com/?r=17c4991a03fa',
   gridplus = 'https://gridplus.io/?afmc=7p',
   trezor = 'https://shop.trezor.io/product/trezor-one-black?offer_id=35&aff_id=11009',
-  keystone = 'https://shop.keyst.one/?rfsn=6088257.656b3e9&utm_source=refersion&utm_medium=affiliate&utm_campaign=6088257.656b3e9',
+  keystone = 'https://keyst.one/metamask?rfsn=6088257.656b3e9&utm_source=refersion&utm_medium=affiliate&utm_campaign=6088257.656b3e9',
   airgap = 'https://airgap.it/',
   coolwallet = 'https://www.coolwallet.io/',
   dcent = 'https://dcentwallet.com/',

ui/pages/create-account/connect-hardware/index.test.tsx

@@ -18,25 +18,32 @@ jest.mock('../../../store/actions', () => ({
 }));
 
 jest.mock('../../../selectors', () => ({
-  getCurrentChainId: () => jest.fn().mockResolvedValue('0x1'),
+  getCurrentChainId: () => '0x1',
-  getRpcPrefsForCurrentProvider: () => jest.fn().mockResolvedValue({}),
+  getRpcPrefsForCurrentProvider: () => {
-  getMetaMaskAccountsConnected: () => jest.fn().mockResolvedValue([]),
+    return {};
-  getMetaMaskAccounts: () => jest.fn().mockResolvedValue([]),
+  },
+  getMetaMaskAccountsConnected: () => [],
+  getMetaMaskAccounts: () => {
+    return {};
+  },
 }));
 
 jest.mock('../../../ducks/history/history', () => ({
-  getMostRecentOverviewPage: () => jest.fn().mockResolvedValue('/'),
+  getMostRecentOverviewPage: () => '',
 }));
 
+const mockTrackEvent = jest.fn();
+
 const mockProps = {
-  forgetDevice: jest.fn(),
+  forgetDevice: () => jest.fn(),
-  showAlert: jest.fn(),
+  showAlert: () => jest.fn(),
-  hideAlert: jest.fn(),
+  hideAlert: () => jest.fn(),
-  unlockHardwareWalletAccount: jest.fn(),
+  unlockHardwareWalletAccount: () => jest.fn(),
-  setHardwareWalletDefaultHdPath: jest.fn(),
+  setHardwareWalletDefaultHdPath: () => jest.fn(),
   history: {},
   defaultHdPath: "m/44'/60'/0'/0",
   mostRecentOverviewPage: '',
+  trackEvent: () => mockTrackEvent,
 };
 
 const mockState = {
@@ -148,4 +155,24 @@ describe('ConnectHardwareForm', () => {
       });
     });
   });
+
+  describe('QR Hardware Wallet Steps', () => {
+    it('should render the QR hardware wallet steps', async () => {
+      const { getByText, getByLabelText } = renderWithProvider(
+        <ConnectHardwareForm {...mockProps} />,
+        mockStore,
+      );
+
+      const qrButton = getByLabelText('QRCode');
+
+      fireEvent.click(qrButton);
+
+      await waitFor(() => {
+        expect(getByText('Keystone')).toBeInTheDocument();
+        expect(getByText('AirGap Vault')).toBeInTheDocument();
+        expect(getByText('CoolWallet')).toBeInTheDocument();
+        expect(getByText("D'Cent")).toBeInTheDocument();
+      });
+    });
+  });
 });

ui/pages/create-account/connect-hardware/select-hardware.js

@@ -431,12 +431,12 @@ export default class SelectHardware extends Component {
               onClick={() => {
                 this.context.trackEvent({
                   category: MetaMetricsEventCategory.Navigation,
-                  event: 'Clicked Keystone Buy Now',
+                  event: 'Clicked Keystone Learn More',
                 });
                 openWindow(HardwareAffiliateLinks.keystone);
               }}
             >
-              {this.context.t('buyNow')}
+              {this.context.t('learnMoreKeystone')}
             </Button>
             <Button
               className="hw-connect__external-btn"