chore: merge main

Signed-off-by: David Dal Busco <david.dalbusco@dfinity.org>

.github/workflows/checks.yml

@@ -38,10 +38,7 @@ jobs:
                   exit 1
           }
   spelling:
-    runs-on:
-      labels: dind-small
-    container:
-      image: ghcr.io/dfinity/minimal-runner-image:0.1
+    runs-on: ubuntu-20.04
     steps:
       - name: Checkout
         uses: actions/checkout@v4
@@ -55,10 +52,7 @@ jobs:
       - name: Spellcheck changelog
         run: scripts/spellcheck-changelog
   cargo-tests:
-    runs-on:
-      labels: dind-small
-    container:
-      image: ghcr.io/dfinity/minimal-runner-image:0.1
+    runs-on: ubuntu-20.04
     steps:
       - uses: actions/checkout@v4
       - uses: actions/cache@v4
@@ -162,10 +156,7 @@ jobs:
           fi
   release-templating-works:
     name: Release template
-    runs-on:
-      labels: dind-small
-    container:
-      image: ghcr.io/dfinity/minimal-runner-image:0.1
+    runs-on: ubuntu-20.04
     steps:
       - uses: actions/checkout@v4
         with:

CHANGELOG-Nns-Dapp-unreleased.md

@@ -23,12 +23,16 @@ proposal is successful, the changes it released will be moved from this file to
 * Move Canisters button from sidebar to account menu.
 * Move GitHub button from account menu to sidebar.
 * Reduce calls to `sns-governance` canister by getting `nervous_system_parameters` from the aggregator instead.
+* Move theme toggle from account menu to sidebar.
+* The `Markdown` UI component was migrated to `@dfinity/gix-components`.
 * Upgrade frontend dev dependencies (`SvelteKit v2`, `vite`, `vitest`, etc.)
 
 #### Deprecated
 
 #### Removed
 
+* Stop making unnecessary calls to load the SNS proposal every time we load the derived state.
+
 #### Fixed
 
 * Fixed a bug where a performance counter in `init` is wiped during state initialization.

frontend/src/lib/components/common/MenuItems.svelte

@@ -19,6 +19,7 @@
     IconVote,
     IconWallet,
     MenuItem,
+    ThemeToggleButton,
   } from "@dfinity/gix-components";
   import { layoutMenuOpen, menuCollapsed } from "@dfinity/gix-components";
   import type { ComponentType } from "svelte";
@@ -98,7 +99,10 @@
 
   <div class="menu-footer" class:hidden={$menuCollapsed && !$layoutMenuOpen}>
     <MenuMetrics />
-    <SourceCodeButton />
+    <div class="menu-footer-buttons">
+      <div class="grow-item"><SourceCodeButton /></div>
+      <ThemeToggleButton />
+    </div>
   </div>
 </div>
 
@@ -131,4 +135,11 @@
       display: flex;
     }
   }
+  .menu-footer-buttons {
+    display: flex;
+    gap: var(--padding);
+    .grow-item {
+      flex-grow: 1;
+    }
+  }
 </style>

frontend/src/lib/components/header/AccountMenu.svelte

@@ -8,7 +8,7 @@
   import LinkToCanisters from "./LinkToCanisters.svelte";
   import LoginIconOnly from "./LoginIconOnly.svelte";
   import Logout from "./Logout.svelte";
-  import { IconUser, ThemeToggle, Popover } from "@dfinity/gix-components";
+  import { IconUser, Popover } from "@dfinity/gix-components";
 
   let visible = false;
   let button: HTMLButtonElement | undefined;
@@ -32,8 +32,6 @@
       <div class="info">
         <AccountDetails />
 
-        <ThemeToggle />
-
         <ManageInternetIdentityButton />
 
         <SettingsButton on:nnsLink={() => (visible = false)} />

frontend/src/lib/components/metrics/TotalValueLocked.svelte

@@ -66,10 +66,6 @@
     width: 100%;
     padding: var(--padding) var(--padding-2x);
 
-    &:hover {
-      background: var(--sidebar-button-background-hover);
-    }
-
     &.stacked {
       display: flex;
       flex-direction: column-reverse;

frontend/src/lib/components/project-detail/ProjectProposal.svelte

@@ -4,15 +4,18 @@
   import { i18n } from "$lib/stores/i18n";
   import type { SnsSummary } from "$lib/types/sns";
   import NnsProposalCard from "../proposals/NnsProposalCard.svelte";
+  import type { ProposalId } from "@dfinity/nns";
   import type { ProposalInfo } from "@dfinity/nns";
   import { nonNullish } from "@dfinity/utils";
 
   export let summary: SnsSummary;
 
+  let proposalId: ProposalId | undefined;
+  $: proposalId = getProjectProposal(summary);
+
   let proposalInfo: ProposalInfo | undefined;
 
-  $: {
-    const proposalId = getProjectProposal(summary);
+  const loadProposalFromId = (proposalId: ProposalId | undefined) => {
     if (nonNullish(proposalId)) {
       loadProposal({
         proposalId,
@@ -27,7 +30,9 @@
         silentUpdateErrorMessages: true,
       });
     }
-  }
+  };
+
+  $: loadProposalFromId(proposalId);
 </script>
 
 {#if nonNullish(proposalInfo)}

frontend/src/lib/components/proposal-detail/ProposalSummary.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import Markdown from "$lib/components/ui/Markdown.svelte";
+  import { Markdown } from "@dfinity/gix-components";
   import { nonNullish } from "@dfinity/utils";
 
   export let summary: string | undefined;

frontend/src/lib/derived/sns-aggregator.derived.ts

@@ -0,0 +1,18 @@
+import { snsAggregatorStore } from "$lib/stores/sns-aggregator.store";
+import type { CachedSnsDto } from "$lib/types/sns-aggregator";
+import { derived, type Readable } from "svelte/store";
+
+/**
+ * Creates a derived store, which maps root canister IDs to some data derived
+ * from SNS aggregator data.
+ */
+export const snsAggregatorDerived = <T>(
+  mapFn: (sns: CachedSnsDto) => T
+): Readable<Record<string, T>> =>
+  derived(snsAggregatorStore, (aggregatorStore) =>
+    Object.fromEntries(
+      aggregatorStore.data?.map((sns) => {
+        return [sns.canister_ids.root_canister_id, mapFn(sns)];
+      }) ?? []
+    )
+  );

frontend/src/lib/derived/sns-functions.derived.ts

@@ -1,7 +1,7 @@
-import { snsAggregatorStore } from "$lib/stores/sns-aggregator.store";
 import { convertNervousFunction } from "$lib/utils/sns-aggregator-converters.utils";
 import type { SnsNervousSystemFunction } from "@dfinity/sns";
-import { derived, type Readable } from "svelte/store";
+import { type Readable } from "svelte/store";
+import { snsAggregatorDerived } from "./sns-aggregator.derived";
 
 interface SnsNervousSystemFunctions {
   nsFunctions: SnsNervousSystemFunction[];
@@ -18,15 +18,7 @@ export interface SnsNervousSystemFunctionsStore
 /**
  * A store that contains the nervous system functions for each sns project.
  */
-export const snsFunctionsStore: SnsNervousSystemFunctionsStore = derived(
-  snsAggregatorStore,
-  (aggregatorStore) =>
-    Object.fromEntries(
-      aggregatorStore.data?.map((sns) => [
-        sns.canister_ids.root_canister_id,
-        {
-          nsFunctions: sns.parameters.functions.map(convertNervousFunction),
-        },
-      ]) ?? []
-    )
-);
+export const snsFunctionsStore: SnsNervousSystemFunctionsStore =
+  snsAggregatorDerived((sns) => ({
+    nsFunctions: sns.parameters.functions.map(convertNervousFunction),
+  }));

frontend/src/lib/derived/sns-parameters.derived.ts

@@ -1,7 +1,7 @@
-import { snsAggregatorStore } from "$lib/stores/sns-aggregator.store";
+import { snsAggregatorDerived } from "$lib/derived/sns-aggregator.derived";
 import { convertNervousSystemParameters } from "$lib/utils/sns-aggregator-converters.utils";
 import type { SnsNervousSystemParameters } from "@dfinity/sns";
-import { derived, type Readable } from "svelte/store";
+import { type Readable } from "svelte/store";
 
 export interface SnsParameters {
   parameters: SnsNervousSystemParameters;
@@ -15,19 +15,7 @@ export interface SnsParametersStore {
 /**
  * A store that contains the sns nervous system parameters for each project.
  */
-export const snsParametersStore: Readable<SnsParametersStore> = derived(
-  snsAggregatorStore,
-  (aggregatorStore) =>
-    Object.fromEntries(
-      aggregatorStore.data?.map((sns) => {
-        return [
-          sns.canister_ids.root_canister_id,
-          {
-            parameters: convertNervousSystemParameters(
-              sns.nervous_system_parameters
-            ),
-          },
-        ];
-      }) ?? []
-    )
-);
+export const snsParametersStore: Readable<SnsParametersStore> =
+  snsAggregatorDerived((sns) => ({
+    parameters: convertNervousSystemParameters(sns.nervous_system_parameters),
+  }));

frontend/src/lib/derived/sns-total-token-supply.derived.ts

@@ -1,6 +1,6 @@
-import { snsAggregatorStore } from "$lib/stores/sns-aggregator.store";
 import type { RootCanisterIdText } from "$lib/types/sns";
-import { derived, type Readable } from "svelte/store";
+import { type Readable } from "svelte/store";
+import { snsAggregatorDerived } from "./sns-aggregator.derived";
 
 interface ProjectTotalSupplyData {
   totalSupply: bigint;
@@ -17,15 +17,7 @@ export interface SnsTotalTokenSupplyStore
 /**
  * A store that contains the total token supply of SNS projects.
  */
-export const snsTotalTokenSupplyStore: SnsTotalTokenSupplyStore = derived(
-  snsAggregatorStore,
-  (aggregatorStore) =>
-    Object.fromEntries(
-      aggregatorStore.data?.map((sns) => [
-        sns.canister_ids.root_canister_id,
-        {
-          totalSupply: BigInt(sns.icrc1_total_supply),
-        },
-      ]) ?? []
-    )
-);
+export const snsTotalTokenSupplyStore: SnsTotalTokenSupplyStore =
+  snsAggregatorDerived((sns) => ({
+    totalSupply: BigInt(sns.icrc1_total_supply),
+  }));

frontend/src/lib/services/sns-neurons.services.ts

@@ -21,6 +21,7 @@ import {
 } from "$lib/api/sns.api";
 import { FORCE_CALL_STRATEGY } from "$lib/constants/mockable.constants";
 import { HOTKEY_PERMISSIONS } from "$lib/constants/sns-neurons.constants";
+import { snsParametersStore } from "$lib/derived/sns-parameters.derived";
 import { snsTokenSymbolSelectedStore } from "$lib/derived/sns/sns-token-symbol-selected.store";
 import { snsTokensByRootCanisterIdStore } from "$lib/derived/sns/sns-tokens.derived";
 import { loadActionableProposalsForSns } from "$lib/services/actionable-sns-proposals.services";
@@ -506,6 +507,21 @@ export const stakeNeuron = async ({
     const identity = await getAuthenticatedIdentity();
     const stakeE8s = numberToE8s(amount);
 
+    // The stakeNeuron function should not be called with an amount smaller than
+    // the minimum stake. This check is only here to prevent people losing
+    // tokens if the check is accidentally not done before, but does not provide
+    // a proper error message.
+    const paramsStore = get(snsParametersStore);
+    const minimumStakeE8s = fromDefinedNullable(
+      paramsStore[rootCanisterId.toText()]?.parameters
+        ?.neuron_minimum_stake_e8s ?? []
+    );
+    if (stakeE8s < minimumStakeE8s) {
+      throw new Error(
+        "The caller should make sure the amount is at least the minimum stake"
+      );
+    }
+
     const fee = get(snsTokensByRootCanisterIdStore)[rootCanisterId.toText()]
       ?.fee;