From fb3f8d5174c22d6a5cc1ce9856f174626076df21 Mon Sep 17 00:00:00 2001
From: Max Strasinsky <98811342+mstrasinskis@users.noreply.github.com>
Date: Mon, 23 Dec 2024 20:13:56 +0000
Subject: [PATCH] Add a warning HW neurons staking step 2 (#6076)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# Motivation

Add a warning to the HW neuron creation form to inform the user about
the consequences of not creating a hotkey for the new neuron.

# Changes

- Add a static warning.

# Tests

- Tested locally to confirm that the warning is displayed.

| 🌚 | 🌝 |
|--------|--------|
| <img width="622" alt="image"
src="https://github.com/user-attachments/assets/1e83f3a9-7cf0-48d5-a4c3-df829847bc24"
/> | <img width="615" alt="image"
src="https://github.com/user-attachments/assets/368da8e6-2e94-4e34-a6b1-6dc235d65be4"
/> |

# Todos

- [ ] Add entry to changelog (if necessary).
Not necessary.
---
 frontend/src/lib/components/common/CalloutWarning.svelte    | 1 +
 frontend/src/lib/components/neurons/AddUserToHotkeys.svelte | 3 +++
 frontend/src/lib/i18n/en.json                               | 1 +
 frontend/src/lib/types/i18n.d.ts                            | 1 +
 4 files changed, 6 insertions(+)

diff --git a/frontend/src/lib/components/common/CalloutWarning.svelte b/frontend/src/lib/components/common/CalloutWarning.svelte
index 1b3f67f9d4c..a9a7e7ef8b6 100644
--- a/frontend/src/lib/components/common/CalloutWarning.svelte
+++ b/frontend/src/lib/components/common/CalloutWarning.svelte
@@ -2,6 +2,7 @@
   import { Html, IconError } from "@dfinity/gix-components";
 
   export let htmlText: string;
+  // TODO(mstr): Use Banner component here instead of custom styling.
 </script>
 
 <article data-tid="callout-warning-component">
diff --git a/frontend/src/lib/components/neurons/AddUserToHotkeys.svelte b/frontend/src/lib/components/neurons/AddUserToHotkeys.svelte
index f6dc86562bd..92d224c64c7 100644
--- a/frontend/src/lib/components/neurons/AddUserToHotkeys.svelte
+++ b/frontend/src/lib/components/neurons/AddUserToHotkeys.svelte
@@ -6,6 +6,7 @@
   import { busy } from "@dfinity/gix-components";
   import type { NeuronId } from "@dfinity/nns";
   import { createEventDispatcher } from "svelte";
+  import CalloutWarning from "$lib/components/common/CalloutWarning.svelte";
 
   export let account: Account;
   export let neuronId: NeuronId;
@@ -30,6 +31,8 @@
 </script>
 
 <div class="wrapper" data-tid="add-principal-to-hotkeys-modal">
+  <CalloutWarning htmlText={$i18n.losing_rewards.hw_create_neuron_warning} />
+
   <p class="description">{$i18n.neurons.add_user_as_hotkey_message}</p>
 
   <div>
diff --git a/frontend/src/lib/i18n/en.json b/frontend/src/lib/i18n/en.json
index 1b80d5753b0..b21df7ba6ce 100644
--- a/frontend/src/lib/i18n/en.json
+++ b/frontend/src/lib/i18n/en.json
@@ -395,6 +395,7 @@
     "confirming": "Confirming following. This may take a moment.",
     "confirm": "Confirm Following",
     "badge_label": "Confirm following to avoid missing rewards",
+    "hw_create_neuron_warning": "It is recommended to <strong>Add Hotkey</strong> now, otherwise the NNS dapp will not be able to warn you if this neuron starts missing voting rewards due to inactivity.",
     "hw_hotkey_warning": "You may have neurons that are not added to the NNS dapp. If you want to view your neurons and get alerts in case they start missing voting rewards, you can add them by clicking <strong>Show Neurons > Add to NNS Dapp</strong>."
   },
   "losing_rewards_banner": {
diff --git a/frontend/src/lib/types/i18n.d.ts b/frontend/src/lib/types/i18n.d.ts
index 36b85d472ba..0335bd88e95 100644
--- a/frontend/src/lib/types/i18n.d.ts
+++ b/frontend/src/lib/types/i18n.d.ts
@@ -409,6 +409,7 @@ interface I18nLosing_rewards {
   confirming: string;
   confirm: string;
   badge_label: string;
+  hw_create_neuron_warning: string;
   hw_hotkey_warning: string;
 }