Ajout d'une première version des impact budgétaires dans les détails d'une...

Ajout d'une première version des impact budgétaires dans les détails d'une variable de la page d'accueil

src/lib/components/variables/VariableDetail.svelte

 <script lang="ts">
   import { createEventDispatcher, getContext } from "svelte"
   import { quartOut } from "svelte/easing"
+  import type { Writable } from "svelte/store"
   import { fly } from "svelte/transition"
 
   import { clickOutside } from "$lib/click_outside"
@@ -8,22 +9,31 @@
   import Accordion from "$lib/components/accordion/Accordion.svelte"
   import PictoBudgetEtat from "$lib/components/pictos/PictoBudgetEtat.svelte"
   import TestCasePictos from "$lib/components/test_cases/TestCasePictos.svelte"
-  import {
-    budgetVariablesName,
-    variableSummaryByName,
-    variableSummaryByNameByReformName,
-  } from "$lib/variables"
   import {
     decompositionCoreByName,
     decompositionCoreByNameByReformName,
   } from "$lib/decompositions"
-  import type { Writable } from "svelte/store"
   import type { Situation } from "$lib/situations"
   import { newSimulationUrl } from "$lib/urls"
+  import {
+    budgetVariablesName,
+    variableSummaryByName,
+    variableSummaryByNameByReformName,
+  } from "$lib/variables"
+  import {
+    requestAllBudgetCalculations,
+    type RequestedCalculations,
+  } from "$lib/calculations"
+  import type { BudgetSimulation } from "$lib/budgets"
+  import ValueChange from "$lib/components/ValueChange.svelte"
+  import VariableDetailBudget from "$lib/components/variables/VariableDetailBudget.svelte"
 
   export let name: string
 
   const billName = getContext("billName") as Writable<string | undefined>
+  const budgetSimulation = getContext("budgetSimulation") as Writable<
+    BudgetSimulation | undefined
+  >
   const dateFormatter = new Intl.DateTimeFormat("fr-FR", {
     dateStyle: "medium",
   }).format
@@ -38,6 +48,9 @@
     ["one", "er"],
   ])
   const ordinalPluralRules = new Intl.PluralRules("fr-FR", { type: "ordinal" })
+  const requestedCalculations = getContext(
+    "requestedCalculations",
+  ) as Writable<RequestedCalculations>
   const testCases = getContext("testCases") as Writable<Situation[]>
   const year = getContext("year") as Writable<number>
 
@@ -73,6 +86,13 @@
   $: label =
     decomposition?.label ??
     variable?.label ??
+    decomposition?.short_label ??
+    variable?.short_label ??
+    decomposition?.name ??
+    variable?.name
+
+  $: shortLabel =
+    decomposition?.short_label ??
     variable?.short_label ??
     decomposition?.name ??
     variable?.name
@@ -116,6 +136,15 @@
     },
     {},
   )
+
+  if (budgetVariablesName.has(name)) {
+    // Only called once, when the page has been loaded from the server
+    // with a budget=true query parameter
+    $requestedCalculations = requestAllBudgetCalculations(
+      $requestedCalculations,
+      name,
+    )
+  }
 </script>
 
 <aside
@@ -224,9 +253,25 @@
       title="Impacts budgétaires"
     >
       {#if budgetVariablesName.has(name)}
-        <span> Budgets </span>
-        <button
-          class="mt-4 mx-auto flex items-center gap-2 py-2 px-5 shadow-lg bg-le-vert-400 hover:bg-le-vert-500 active:bg-le-vert-600 rounded-md text-white text-sm font-bold tracking-[0.085em] uppercase"
+        {#if $budgetSimulation === undefined}
+          Chargement des données budgétaires...
+        {:else if $budgetSimulation.errors != null && $budgetSimulation.errors.length > 0}
+          {#each $budgetSimulation.errors as error}
+            <span>{error}</span>
+          {/each}
+        {:else}
+          <VariableDetailBudget
+            budgetSimulation={$budgetSimulation}
+            label={shortLabel}
+            {name}
+          />
+        {/if}
+        <a
+          class="w-fit mt-4 mx-auto flex items-center gap-2 py-2 px-5 shadow-lg bg-le-vert-400 hover:bg-le-vert-500 active:bg-le-vert-600 rounded-md text-white text-sm font-bold tracking-[0.085em] uppercase"
+          href={newSimulationUrl({
+            budget: true,
+            parametersVariableName: name,
+          })}
           title="Vers le simulateur budgétaire de l'impôt sur le revenu"
         >
           <PictoBudgetEtat />
@@ -234,10 +279,10 @@
             class="ml-2 align-[-0.4rem] text-2xl"
             icon="ri-arrow-right-line"
           />
-        </button>
+        </a>
       {:else}
         <span class="text-sm italic">
-          Le calcul des impacts budgétaires du dispositif «&nbsp;{label}&nbsp;»
+          Le calcul des impacts budgétaires du dispositif «&nbsp;{shortLabel}&nbsp;»
           n'est pas encore disponible.
           <span class="font-normal"
             >Ce sujet vous intéresse ? Écrivez-nous à
@@ -252,7 +297,7 @@
       {#if filteredTestCases.length > 0}
         <span>
           Situations types illustrant les mécanismes du dispositif «<span
-            class="font-serif italic">&nbsp;{label}&nbsp;</span
+            class="font-serif italic">&nbsp;{shortLabel}&nbsp;</span
           >» :
         </span>
         <div class="mt-4 mb-10 grid grid-cols-3 gap-5">
@@ -300,7 +345,7 @@
       {/if}
       <span>
         Consulter le dispositif «<span class="font-serif italic"
-          >&nbsp;{label}&nbsp;</span
+          >&nbsp;{shortLabel}&nbsp;</span
         >» avec des cas types représentatifs :
       </span>
       <div class="mt-4 flex justify-between gap-1">

src/lib/components/variables/VariableDetailBudget.svelte

+<script lang="ts">
+  import type { BudgetSimulation } from "$lib/budgets"
+  import ValueChange from "$lib/components/ValueChange.svelte"
+
+  export let budgetSimulation: BudgetSimulation
+  export let label: string
+  export let name: string
+
+  $: ({ amendement: amendment, base: law, plf: bill } = budgetSimulation.result)
+
+  $: ({ quantiles: amendmentQuantiles, state_budget: amendmentStateBudget } =
+    amendment ?? {})
+
+  $: ({ quantiles: billQuantiles, state_budget: billStateBudget } = bill ?? {})
+
+  $: ({ quantiles: lawQuantiles, state_budget: lawStateBudget } = law)
+
+  $: showAmendment =
+    amendment !== undefined && Boolean(amendmentQuantiles?.length)
+
+  $: showBill = bill !== undefined && Boolean(billQuantiles?.length)
+
+  // Comme la valeur du contrefactuel se trouve dans "law",
+  // on ne peut pas facilement détecter qu'il est activé.
+  // On se dit alors que c'est le cas lorsqu'il y a une réforme (PLF).
+  $: showRevaluation = showBill
+
+  $: symbol = name.includes("csg")
+    ? name.includes("retraite")
+      ? "retraite"
+      : "salaire"
+    : undefined
+
+  $: ({
+    compare_before_after: amendmentPopulationComparison,
+    state_budget: amendmentStateBudget,
+  } = amendment ?? {})
+
+  $: ({
+    compare_before_after: billPopulationComparison,
+    state_budget: billStateBudget,
+  } = bill ?? {})
+
+  $: ({ compare_before_after: lawPopulationComparison } = law)
+</script>
+
+<div>
+  Les recettes du dispositif «&nbsp;{label}&nbsp;» sont estimées à
+  <span class="font-bold">
+    <ValueChange
+      compact
+      inline
+      legend={false}
+      unitName="currency-EUR"
+      valueByCalculationName={name === "irpp_economique"
+        ? {
+            amendment: showAmendment
+              ? -amendmentStateBudget.irpp_economique
+              : undefined,
+            bill: showBill ? -billStateBudget.irpp_economique : undefined,
+            law: showRevaluation ? undefined : -lawStateBudget.irpp_economique,
+            revaluation: showRevaluation
+              ? -lawStateBudget.irpp_economique
+              : undefined,
+          }
+        : name.includes("csg")
+          ? {
+              amendment: showAmendment
+                ? -amendmentStateBudget[`csg_deductible_${symbol}`] -
+                  amendmentStateBudget[`csg_imposable_${symbol}`]
+                : undefined,
+              bill: showBill
+                ? -billStateBudget[`csg_deductible_${symbol}`] -
+                  billStateBudget[`csg_imposable_${symbol}`]
+                : undefined,
+              law: showRevaluation
+                ? undefined
+                : -lawStateBudget[`csg_deductible_${symbol}`] -
+                  lawStateBudget[`csg_imposable_${symbol}`],
+              revaluation: showRevaluation
+                ? -lawStateBudget[`csg_deductible_${symbol}`] -
+                  lawStateBudget[`csg_imposable_${symbol}`]
+                : undefined,
+            }
+          : name.includes("af")
+            ? {
+                amendment: showAmendment
+                  ? Math.abs(-amendmentStateBudget.af)
+                  : undefined,
+                bill: showBill ? Math.abs(-billStateBudget.af) : undefined,
+                law: showRevaluation ? undefined : Math.abs(-lawStateBudget.af),
+                revaluation: showRevaluation
+                  ? Math.abs(-lawStateBudget.af)
+                  : undefined,
+              }
+            : undefined}
+    /> en {new Date().getFullYear()}.
+  </span>
+</div>
+<div>
+  Sur <ValueChange
+    compact
+    inline
+    legend={false}
+    unitName="people"
+    valueByCalculationName={{
+      law: lawPopulationComparison?.base.total,
+    }}
+  /> de foyers fiscaux,
+  <span class="font-bold"
+    ><ValueChange
+      compact
+      inline
+      legend={false}
+      unitName="people"
+      valueByCalculationName={{
+        amendment:
+          amendmentPopulationComparison?.amendement_base.non_zero_after,
+        bill:
+          billPopulationComparison?.plf.non_zero_after ??
+          amendmentPopulationComparison?.amendement_base.non_zero_before,
+        law:
+          billStateBudget === undefined
+            ? lawPopulationComparison?.base.non_zero_after
+            : undefined,
+        revaluation:
+          billStateBudget === undefined
+            ? undefined
+            : lawPopulationComparison?.base.non_zero_after,
+      }}
+    />
+    sont concernés par le dispositif «&nbsp;{label}&nbsp;».</span
+  >
+</div>