Voting boosts feature

src/abi/Distributor.ts

@@ -57,12 +57,30 @@ export const distributorAbi = [
   {
     type: "function",
     name: "allowlistedMultipliers",
-    inputs: [{ name: "", type: "uint256", internalType: "uint256" }],
+    inputs: [{ name: "index", type: "uint256", internalType: "uint256" }],
     outputs: [
-      { name: "", type: "address", internalType: "contract IMultiplier" },
+      {
+        name: "multiplier",
+        type: "address",
+        internalType: "contract IMultiplier",
+      },
     ],
     stateMutability: "view",
   },
+  {
+    type: "function",
+    name: "calculateTotalMultipliers",
+    inputs: [
+      { name: "_user", type: "address", internalType: "address" },
+      {
+        name: "_multiplierIndexes",
+        type: "uint256[]",
+        internalType: "uint256[]",
+      },
+    ],
+    outputs: [{ name: "", type: "uint256", internalType: "uint256" }],
+    stateMutability: "nonpayable",
+  },
   {
     type: "function",
     name: "castVote",
@@ -136,20 +154,6 @@ export const distributorAbi = [
     outputs: [{ name: "", type: "uint256", internalType: "uint256" }],
     stateMutability: "view",
   },
-  {
-    type: "function",
-    name: "getTotalMultipliers",
-    inputs: [
-      { name: "_user", type: "address", internalType: "address" },
-      {
-        name: "_multiplierIndexes",
-        type: "uint256[]",
-        internalType: "uint256[]",
-      },
-    ],
-    outputs: [{ name: "", type: "uint256", internalType: "uint256" }],
-    stateMutability: "view",
-  },
   {
     type: "function",
     name: "getValidMultiplierIndexes",
@@ -178,15 +182,23 @@ export const distributorAbi = [
     name: "initialize",
     inputs: [
       { name: "_bread", type: "address", internalType: "address" },
-      { name: "_butteredBread", type: "address", internalType: "address" },
+      {
+        name: "_butteredBread",
+        type: "address",
+        internalType: "address",
+      },
       { name: "_precision", type: "uint256", internalType: "uint256" },
       {
         name: "_minRequiredVotingPower",
         type: "uint256",
         internalType: "uint256",
       },
       { name: "_maxPoints", type: "uint256", internalType: "uint256" },
-      { name: "_cycleLength", type: "uint256", internalType: "uint256" },
+      {
+        name: "_cycleLength",
+        type: "uint256",
+        internalType: "uint256",
+      },
       {
         name: "_yieldFixedSplitDivisor",
         type: "uint256",
@@ -197,11 +209,22 @@ export const distributorAbi = [
         type: "uint256",
         internalType: "uint256",
       },
-      { name: "_projects", type: "address[]", internalType: "address[]" },
+      {
+        name: "_projects",
+        type: "address[]",
+        internalType: "address[]",
+      },
     ],
     outputs: [],
     stateMutability: "nonpayable",
   },
+  {
+    type: "function",
+    name: "initialize",
+    inputs: [],
+    outputs: [],
+    stateMutability: "nonpayable",
+  },
   {
     type: "function",
     name: "lastClaimedBlockNumber",
@@ -320,7 +343,11 @@ export const distributorAbi = [
     type: "function",
     name: "setButteredBread",
     inputs: [
-      { name: "_butteredBread", type: "address", internalType: "address" },
+      {
+        name: "_butteredBread",
+        type: "address",
+        internalType: "address",
+      },
     ],
     outputs: [],
     stateMutability: "nonpayable",

src/app/core/components/Icons/CheckDouble.tsx

@@ -0,0 +1,18 @@
+function CheckDoubleIcon() {
+  return (
+    <svg  
+      className="fill-current w-full h-full"
+      viewBox="0 0 24 24" 
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path 
+        fillRule="evenodd" 
+        clipRule="evenodd" 
+        d="M15 6H17V8H15V6ZM13 10V8H15V10H13ZM11 12V10H13V12H11ZM9 14V12H11V14H9ZM7 16V14H9V16H7ZM5 16H7V18H5V16ZM3 14H5V16H3V14ZM3 14H1V12H3V14ZM11 16H13V18H11V16ZM15 14V16H13V14H15ZM17 12V14H15V12H17ZM19 10V12H17V10H19ZM21 8H19V10H21V8ZM21 8H23V6H21V8Z" 
+      />
+    </svg>
+  );
+}
+
+export default CheckDoubleIcon;
+

src/app/core/components/MobileMenu/MobileNavigation.tsx

@@ -75,6 +75,29 @@ export function MobileNavigation({ handleNavToggle }: IProps) {
             </svg>
 
             <span>Vaults</span>
+          </Link>{" "}
+          <Link
+            href="/governance/boosters"
+            onClick={() => handleNavToggle()}
+            className="text-neutral-900 dark:text-breadgray-rye dark:hover:text-breadgray-light-grey flex gap-2 items-center justify-end px-2"
+          >
+            <svg
+              width="24"
+              height="24"
+              viewBox="0 0 24 24"
+              xmlns="http://www.w3.org/2000/svg"
+              className="fill-current"
+            >
+              <g opacity="0.5">
+                <path
+                  fill-rule="evenodd"
+                  clip-rule="evenodd"
+                  d="M14 6H20H22V8V14H20V10H18V8H14V6ZM16 12V10H18V12H16ZM14 14V12H16V14H14ZM12 14H14V16H12V14ZM10 12H12V14H10V12ZM8 12V10H10V12H8ZM6 14V12H8V14H6ZM4 16V14H6V16H4ZM4 16V18H2V16H4Z"
+                />
+              </g>
+            </svg>
+
+            <span>Boosters</span>
           </Link>
         </>
       )}

src/app/governance/boosters/BoosterPage.tsx

@@ -0,0 +1,55 @@
+"use client";
+import { useEffect, useState } from "react";
+import { useConnectedUser } from "@/app/core/hooks/useConnectedUser";
+import { getConfig } from "@/app/core/hooks/WagmiProvider/config/getConfig";
+import { PageGrid } from "@/app/governance/components/PageGrid";
+import { VotingPowerPanel } from "./components/VotingPowerPanel";
+import { BoosterCard } from "./components/BoosterCard";
+import { boostData, mapBoostToCardProps } from "./data/BoostData";
+import Button from "@/app/core/components/Button";
+
+export function BoosterPage() {
+  const { user } = useConnectedUser();
+
+  return (
+    <section className="grow w-full max-w-[44rem] lg:max-w-[67rem] m-auto pb-16 px-4 lg:px-8">
+      <PageGrid>
+        <div className="col-span-12 lg:col-span-8 row-start-1 row-span-1">
+          <TitleSection />
+        </div>
+        <VotingPowerPanel />
+      </PageGrid>
+      <div className="w-full pt-6">
+        <h2 className="font-bold text-xl">All boosters?</h2>
+        <div className="grid md:grid-cols-3 gap-4 items-start">
+          {BoosterList()}
+        </div>
+      </div>
+    </section>
+  );
+}
+
+function TitleSection() {
+  return (
+    <div className="flex flex-col gap-4">
+      <h1 className="font-bold text-3xl text-breadgray-grey100 dark:text-breadgray-ultra-white">
+        Voting Power Boosters
+      </h1>
+      <div className="max-w-xl text-lg text-breadgray-rye dark:text-breadgray-light-grey">
+        <p>
+          Active voter? Top baker? If this is you, the Breadchain cooperative
+          rewards you with voting power boosters for your engaging support of
+          post-capitalism. Be active and your voice will be amplified.{" "}
+        </p>
+      </div>
+    </div>
+  );
+}
+
+function BoosterList() {
+  return boostData.map((boost, index) => {
+    return (
+      <BoosterCard key={index} boost={boost} {...mapBoostToCardProps(boost)} />
+    );
+  });
+}