Merge branch 'dev' into main

growthepie · Jan 11, 2024 · 59763bf · 59763bf · vercel · Jan 11, 2024
2 parents f2abf94 + dbbf4b3
commit 59763bf
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 6 deletions.
diff --git a/app/api/optimism-retropgf-3/projects/route.ts b/app/api/optimism-retropgf-3/projects/route.ts
@@ -11,6 +11,11 @@ const pool = new Pool({
 });
 
 export async function GET() {
+  // get OP token price from coingecko
+  const tokenPrice = await fetch(
+    "https://api.coingecko.com/api/v3/simple/price?ids=optimism&vs_currencies=usd",
+  ).then((res) => res.json());
+
   try {
     const result = await pool.query(
       `SELECT 
@@ -39,7 +44,7 @@ export async function GET() {
       }
     });
 
-    return Response.json({ projects: data });
+    return Response.json({ projects: data, prices: tokenPrice });
   } catch (error) {
     return Response.json({ error });
   }

diff --git a/app/optimism-retropgf-3/page.tsx b/app/optimism-retropgf-3/page.tsx
@@ -698,12 +698,22 @@ export default function Page() {
                       </div>
                     </TooltipTrigger>
                     <TooltipContent className="z-50 flex items-center justify-center">
-                      <div className="px-3 py-1.5 text-sm font-medium bg-forest-100 dark:bg-[#4B5553] text-forest-900 dark:text-forest-100 rounded-xl shadow-lg z-50 flex items-center">
-                        <div className="text-xs space-x-1">
-
-                          {info.row.original.awarded.toLocaleString()} OP <span className="font-light">Awarded</span>
-
+                      <div className="ml-2 px-3 py-1.5 text-sm bg-forest-100 dark:bg-[#4B5553] text-forest-900 dark:text-forest-100 rounded-xl shadow-lg z-50 flex flex-col space-y-1">
+                        <div className="text-xs text-center">Award Amount</div>
+                        <div className="flex justify-between space-x-1 font-bold items-end leading-snug">
+                          <div className="flex-1 text-right">{info.row.original.awarded.toLocaleString()}</div><div className="text-left opacity-60 text-xs font-normal">OP</div>
                         </div>
+                        {projectsResponse?.prices.optimism.usd &&
+                          (
+                            <>
+                              <div className="flex justify-between space-x-1 items-end">
+                                <div className="flex-1 text-right"><span className="opacity-60 text-[0.65rem]">$</span>{Math.round(projectsResponse.prices.optimism.usd * info.row.original.awarded).toLocaleString()}</div><div className="text-left opacity-60 text-[0.65rem]">USD</div>
+                              </div>
+                              {/* <div className="text-[0.6rem] text-center opacity-60">@ ${projectsResponse.prices.optimism.usd} / OP</div> */}
+                            </>
+                          )
+                        }
+
                       </div>
                     </TooltipContent>
                   </Tooltip>

diff --git a/types/api/RetroPGF3.ts b/types/api/RetroPGF3.ts
@@ -83,6 +83,11 @@ export type Project = {
 
 export type ProjectsResponse = {
   projects: Project[];
+  prices: {
+    optimism: {
+      usd: number;
+    };
+  };
 };
 
 export type List = {