Update hooks page design

balancer · Aug 14, 2024 · a6f15ed · a6f15ed
1 parent 0bca6e3
commit a6f15ed
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 26 deletions.
diff --git a/packages/nextjs/app/hooks/_components/HooksCards.tsx b/packages/nextjs/app/hooks/_components/HooksCards.tsx
@@ -36,26 +36,26 @@ export const HooksCards = ({ hooks }: { hooks: HookDetails[] }) => {
 
   return (
     <>
-      <div className="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 gap-5 w-full">
-        {hooks.map(hook => (
-          <div
-            key={hook.id}
-            className="bg-base-200 hover:bg-base-100 p-5 rounded-lg w-full hover:cursor-pointer"
-            onClick={() => setActiveModal(hook.id)}
+      {hooks.map(hook => (
+        <div
+          key={hook.id}
+          className="bg-base-200 hover:bg-base-100 p-5 rounded-lg w-full hover:cursor-pointer grid grid-cols-8"
+          onClick={() => setActiveModal(hook.id)}
+        >
+          <div className="col-start-1 col-end-3 text-xl font-bold ">{hook.title}</div>
+          <Link
+            className="col-start-3 col-end-6 flex gap-2 items-center text-nowrap overflow-hidden whitespace-nowrap"
+            target="_blank"
+            rel="noopener noreferrer"
+            href={hook.github}
           >
-            <div className="mb-3">
-              <div className="flex justify-between items-center">
-                <h1 className="text-2xl font-bold mb-0">{hook.title}</h1>
-                <Link target="_blank" rel="noopener noreferrer" href={hook.github}>
-                  <GithubIcon />
-                </Link>
-              </div>
-              {/* <div className="">Created By {hook.created_by}</div> */}
-            </div>
-            <div className="text-lg card-description">{hook.description}</div>
-          </div>
-        ))}
-      </div>
+            <GithubIcon />
+            {hook.github.slice(0, 40)}...
+          </Link>
+          <div className="col-start-7 col-end-7">{hook.category}</div>
+          <div className="col-start-8 col-end-8">{hook.created_by}</div>
+        </div>
+      ))}
 
       {activeModal && (
         <Modal isOpen={activeModal !== null} onClose={() => setActiveModal(null)}>

diff --git a/packages/nextjs/app/hooks/page.tsx b/packages/nextjs/app/hooks/page.tsx
@@ -39,7 +39,15 @@ const Hooks: NextPage = async () => {
           .
         </p>
       </div>
-      {hooks ? <HooksCards hooks={hooks} /> : <div className="text-xl text-error">Error fetching hooks data!</div>}
+      <div className="w-full flex flex-col gap-3">
+        <div className="w-full grid grid-cols-8">
+          <div className="col-start-1 col-end-3">Name</div>
+          <div className="col-start-4 col-end-6">Repo URL</div>
+          <div className="col-start-7 col-end-7">Category</div>
+          <div className="col-start-8 col-end-8">Created By</div>
+        </div>
+        {hooks ? <HooksCards hooks={hooks} /> : <div className="text-xl text-error">Error fetching hooks data!</div>}
+      </div>
     </div>
   );
 };

diff --git a/packages/nextjs/contracts/deployedContracts.ts b/packages/nextjs/contracts/deployedContracts.ts
@@ -7,7 +7,7 @@ import { GenericContractsDeclaration } from "~~/utils/scaffold-eth/contract";
 const deployedContracts = {
   31337: {
     MockToken1: {
-      address: "0x8e8cB505973E04200554Bd98741086C7Eca9f42a",
+      address: "0x290F385a98e707275366648817403E415a808a63",
       abi: [
         {
           type: "constructor",
@@ -365,7 +365,7 @@ const deployedContracts = {
       },
     },
     MockToken2: {
-      address: "0xC2D1A7c03C0459a8d0Ee885283CE828DE5fFf617",
+      address: "0x3D10F2021266d0d83090046fDF0b8790779C2A82",
       abi: [
         {
           type: "constructor",
@@ -723,7 +723,7 @@ const deployedContracts = {
       },
     },
     MockVeBAL: {
-      address: "0x906e3a6d1baf80e3e3fa3D57A5DA73099Da86C4c",
+      address: "0xd213c4cC9Bd38bc7dC8877e5f53955c3E5F5F416",
       abi: [
         {
           type: "constructor",
@@ -1081,7 +1081,7 @@ const deployedContracts = {
       },
     },
     ConstantSumFactory: {
-      address: "0x68c87F9fB214Bb4856a13c9123f9b0624944D1A6",
+      address: "0x90e1d376163cb8287ae4fF1f15CbD4F594DF6201",
       abi: [
         {
           type: "constructor",
@@ -1465,7 +1465,7 @@ const deployedContracts = {
       },
     },
     ConstantProductFactory: {
-      address: "0x2a374E85Ca5F1af906De5CdDa3658219e8759097",
+      address: "0x98Ae3884f844035F02d1eEbE94E54C25bCb53794",
       abi: [
         {
           type: "constructor",
@@ -1849,7 +1849,7 @@ const deployedContracts = {
       },
     },
     VeBALFeeDiscountHook: {
-      address: "0xb33ca895101aB93835fd846d8C23FBdBC29d5843",
+      address: "0x7798AD4e898a948FFCf426fb2aAdffbD01087085",
       abi: [
         {
           type: "constructor",