From c8513a8a14e8d8934916631b7fcb1683f9619d68 Mon Sep 17 00:00:00 2001
From: James Ritchie <james@jamesritchie.co.uk>
Date: Wed, 15 May 2024 16:20:47 +0100
Subject: [PATCH] Static version of the Concurrency page finished

---
 .../app/components/primitives/Tooltip.tsx     |  2 +-
 .../route.tsx                                 | 88 +++++++++++++------
 2 files changed, 60 insertions(+), 30 deletions(-)

diff --git a/apps/webapp/app/components/primitives/Tooltip.tsx b/apps/webapp/app/components/primitives/Tooltip.tsx
index a37a9b9d9..9e1322779 100644
--- a/apps/webapp/app/components/primitives/Tooltip.tsx
+++ b/apps/webapp/app/components/primitives/Tooltip.tsx
@@ -94,7 +94,7 @@ export function InfoIconTooltip({
   return (
     <SimpleTooltip
       button={
-        <InformationCircleIcon className={cn("h-3.5 w-3.5 text-text-dimmed", buttonClassName)} />
+        <InformationCircleIcon className={cn("size-3.5 text-text-dimmed", buttonClassName)} />
       }
       content={content}
       variant="dark"
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx
index dc45f91ff..019af7824 100644
--- a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx
+++ b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.v3.$projectParam.concurrency/route.tsx
@@ -1,4 +1,8 @@
-import { BookOpenIcon, ChatBubbleLeftEllipsisIcon } from "@heroicons/react/20/solid";
+import {
+  BookOpenIcon,
+  ChatBubbleLeftEllipsisIcon,
+  InformationCircleIcon,
+} from "@heroicons/react/20/solid";
 import { Outlet } from "@remix-run/react";
 import { Feedback } from "~/components/Feedback";
 import { EnvironmentLabel } from "~/components/environments/EnvironmentLabel";
@@ -14,6 +18,12 @@ import {
   TableHeaderCell,
   TableRow,
 } from "~/components/primitives/Table";
+import {
+  InfoIconTooltip,
+  SimpleTooltip,
+  Tooltip,
+  TooltipTrigger,
+} from "~/components/primitives/Tooltip";
 import { docsPath } from "~/utils/pathBuilder";
 
 export default function Page() {
@@ -103,9 +113,16 @@ export default function Page() {
         <Table>
           <TableHeader>
             <TableRow>
-              <TableHeaderCell>Name</TableHeaderCell>
               <TableHeaderCell>Task ID</TableHeaderCell>
-              <TableHeaderCell>Concurrency limit</TableHeaderCell>
+              <TableHeaderCell>Task</TableHeaderCell>
+              <TableHeaderCell className="flex items-center gap-1">
+                Concurrency limit
+                <SimpleTooltip
+                  content="You can configure concurrency per task."
+                  button={<InformationCircleIcon className="size-3.5 text-text-dimmed" />}
+                  className="normal-case tracking-normal"
+                />
+              </TableHeaderCell>
               <TableHeaderCell>Queued</TableHeaderCell>
               <TableHeaderCell>Executing</TableHeaderCell>
               <TableHeaderCell>Age of oldest message</TableHeaderCell>
@@ -113,42 +130,55 @@ export default function Page() {
           </TableHeader>
           <TableBody>
             <TableRow>
-              <TableCell>Organization</TableCell>
-              <TableCell>10</TableCell>
-              <TableCell>5</TableCell>
+              <TableCell>batch-child-task</TableCell>
+              <TableCell>batchChildTask()</TableCell>
+              <TableCell>Not set</TableCell>
               <TableCell>4</TableCell>
+              <TableCell>3</TableCell>
               <TableCell>Date here</TableCell>
-              <TableCell>Maximum concurrency for your organization, Trigger.dev.</TableCell>
             </TableRow>
             <TableRow>
-              <TableCell>
-                <EnvironmentLabel environment={{ type: "DEVELOPMENT" }} />
-              </TableCell>
-              <TableCell>5</TableCell>
-              <TableCell>5</TableCell>
+              <TableCell>batch-parent-task</TableCell>
+              <TableCell>batchParentTask()</TableCell>
+              <TableCell>Not set</TableCell>
               <TableCell>4</TableCell>
+              <TableCell>2</TableCell>
               <TableCell>Date here</TableCell>
-              <TableCell>Maximum concurrency for your development environment.</TableCell>
             </TableRow>
             <TableRow>
-              <TableCell>
-                <EnvironmentLabel environment={{ type: "STAGING" }} />
-              </TableCell>
+              <TableCell>child-task</TableCell>
+              <TableCell>childTask()</TableCell>
+              <TableCell>4</TableCell>
+              <TableCell>1</TableCell>
+              <TableCell>1</TableCell>
+              <TableCell>Date here</TableCell>
+            </TableRow>
+          </TableBody>
+        </Table>
+        <Header2 className="mb-3 mt-6">Your queue limits</Header2>
+        <Table>
+          <TableHeader>
+            <TableRow>
+              <TableHeaderCell>Task ID</TableHeaderCell>
+              <TableHeaderCell>Task</TableHeaderCell>
+              <TableHeaderCell>Concurrency limit</TableHeaderCell>
+            </TableRow>
+          </TableHeader>
+          <TableBody>
+            <TableRow>
+              <TableCell>batch-child-task</TableCell>
+              <TableCell>batchChildTask()</TableCell>
               <TableCell>5</TableCell>
+            </TableRow>
+            <TableRow>
+              <TableCell>batch-parent-task</TableCell>
+              <TableCell>batchParentTask()</TableCell>
+              <TableCell>4</TableCell>
+            </TableRow>
+            <TableRow>
+              <TableCell>child-task</TableCell>
+              <TableCell>childTask()</TableCell>
               <TableCell>0</TableCell>
-              <TableCell>0</TableCell>
-              <TableCell>Date here</TableCell>
-              <TableCell>Maximum concurrency for your staging environment.</TableCell>
-            </TableRow>
-            <TableRow>
-              <TableCell>
-                <EnvironmentLabel environment={{ type: "PRODUCTION" }} />
-              </TableCell>
-              <TableCell>5</TableCell>
-              <TableCell>5</TableCell>
-              <TableCell>4</TableCell>
-              <TableCell>Date here</TableCell>
-              <TableCell>Maximum concurrency for your production environment.</TableCell>
             </TableRow>
           </TableBody>
         </Table>