Hide the banner behind the feature flag (#6077)

# Motivation

[A warning was recently
added](#6076) to the HW neuron
creation form to inform users about the consequences of not creating a
hotkey for the new neuron. This warning is intended to be part of the
periodic confirmation feature, which is not yet available. However, it
was mistakenly added without being gated behind the feature flag.

# Changes

- Move the warning behind a feature flag.

# Tests

- Added.

# Todos

- [ ] Add entry to changelog (if necessary).
Not necessary.

frontend/src/lib/components/neurons/AddUserToHotkeys.svelte

@@ -7,6 +7,7 @@
   import type { NeuronId } from "@dfinity/nns";
   import { createEventDispatcher } from "svelte";
   import CalloutWarning from "$lib/components/common/CalloutWarning.svelte";
+  import { ENABLE_PERIODIC_FOLLOWING_CONFIRMATION } from "$lib/stores/feature-flags.store";
 
   export let account: Account;
   export let neuronId: NeuronId;
@@ -31,7 +32,9 @@
 </script>
 
 <div class="wrapper" data-tid="add-principal-to-hotkeys-modal">
-  <CalloutWarning htmlText={$i18n.losing_rewards.hw_create_neuron_warning} />
+  {#if $ENABLE_PERIODIC_FOLLOWING_CONFIRMATION}
+    <CalloutWarning htmlText={$i18n.losing_rewards.hw_create_neuron_warning} />
+  {/if}
 
   <p class="description">{$i18n.neurons.add_user_as_hotkey_message}</p>
 

frontend/src/tests/lib/modals/neurons/NnsStakeNeuronModal.spec.ts

@@ -14,6 +14,7 @@ import {
   stakeNeuron,
   updateDelay,
 } from "$lib/services/neurons.services";
+import { overrideFeatureFlagsStore } from "$lib/stores/feature-flags.store";
 import { neuronsStore } from "$lib/stores/neurons.store";
 import { mockIdentity, resetIdentity } from "$tests/mocks/auth.store.mock";
 import {
@@ -443,6 +444,34 @@ describe("NnsStakeNeuronModal", () => {
       expect(addHotkeyForHardwareWalletNeuron).not.toBeCalled();
     });
 
+    it("should display missing rewards warning when feature flag on", async () => {
+      overrideFeatureFlagsStore.setFlag(
+        "ENABLE_PERIODIC_FOLLOWING_CONFIRMATION",
+        true
+      );
+      const po = await renderComponent({});
+      await createNeuron(po);
+
+      expect(await po.getAddUserToHotkeysPo().isPresent()).toBe(true);
+      expect(
+        await po.getAddUserToHotkeysPo().isMissingRewardsWarningVisible()
+      ).toBe(true);
+    });
+
+    it("should not display missing rewards warning when feature flag off", async () => {
+      overrideFeatureFlagsStore.setFlag(
+        "ENABLE_PERIODIC_FOLLOWING_CONFIRMATION",
+        false
+      );
+      const po = await renderComponent({});
+      await createNeuron(po);
+
+      expect(await po.getAddUserToHotkeysPo().isPresent()).toBe(true);
+      expect(
+        await po.getAddUserToHotkeysPo().isMissingRewardsWarningVisible()
+      ).toBe(false);
+    });
+
     it("should create neuron for hardwareWallet and add dissolve delay", async () => {
       neuronsStore.setNeurons({ neurons: [newNeuron], certified: true });
       const po = await renderComponent({});

frontend/src/tests/page-objects/AddUserToHotkeys.page-object.ts

@@ -1,3 +1,4 @@
+import { CalloutWarningPo } from "$tests/page-objects/CalloutWarning.page-object";
 import { BasePageObject } from "$tests/page-objects/base.page-object";
 import type { PageObjectElement } from "$tests/types/page-object.types";
 
@@ -8,6 +9,10 @@ export class AddUserToHotkeysPo extends BasePageObject {
     return new AddUserToHotkeysPo(element.byTestId(AddUserToHotkeysPo.TID));
   }
 
+  isMissingRewardsWarningVisible(): Promise<boolean> {
+    return CalloutWarningPo.under(this.root).isPresent();
+  }
+
   clickSkip(): Promise<void> {
     return this.click("skip-add-principal-to-hotkey-modal");
   }