From 7149c9795d7b8bdf55452be35980694290b8ef6d Mon Sep 17 00:00:00 2001
From: Aditya Choudhari <aditya.choudhari@wandb.com>
Date: Wed, 4 Dec 2024 18:13:25 -0800
Subject: [PATCH] init

---
 .../deployments/TableDeployments.tsx          |  2 +-
 .../releases/DeploymentPageContent.tsx        | 20 +++++++++++++++----
 .../systems/[systemSlug]/deployments/page.tsx |  2 +-
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/TableDeployments.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/TableDeployments.tsx
index d1f749328..ab614ccfd 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/TableDeployments.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/TableDeployments.tsx
@@ -171,7 +171,7 @@ const DeploymentTable: React.FC<{
   >;
 }> = ({ systemSlug, deployments, environments, workspace }) => {
   return (
-    <div className="w-full overflow-x-auto">
+    <div className="scrollbar-thin scrollbar-thumb-neutral-700 scrollbar-track-neutral-800 w-full overflow-x-auto">
       <table className="w-full min-w-max border-separate border-spacing-0">
         <thead>
           <tr>
diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/[deploymentSlug]/releases/DeploymentPageContent.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/[deploymentSlug]/releases/DeploymentPageContent.tsx
index 1ccdb017d..b4b321ed9 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/[deploymentSlug]/releases/DeploymentPageContent.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/[deploymentSlug]/releases/DeploymentPageContent.tsx
@@ -63,9 +63,11 @@ export const DeploymentPageContent: React.FC<DeploymentPageContentProps> = ({
   const loading = releases.isLoading;
   const router = useRouter();
 
+  const numEnvironmentBlocks = Math.min(3, environments.length);
+
   return (
     <div>
-      <div className="h-full text-sm">
+      <div className="text-sm">
         <div className="flex items-center gap-4 border-b border-neutral-800 p-1 px-2">
           <div className="flex flex-grow items-center gap-2">
             <ReleaseConditionDialog
@@ -136,8 +138,8 @@ export const DeploymentPageContent: React.FC<DeploymentPageContentProps> = ({
           </div>
         )}
         {!loading && releases.data && (
-          <div className="flex flex-col">
-            <Table>
+          <div className="scrollbar-none flex w-[calc(100vw-267px)] flex-col">
+            <Table className="scrollbar-none">
               <TableHeader>
                 <TableRow className="hover:bg-transparent">
                   <TableHead className="sticky left-0 z-10 min-w-[500px] p-0">
@@ -178,7 +180,17 @@ export const DeploymentPageContent: React.FC<DeploymentPageContentProps> = ({
                           "border-b",
                       )}
                     >
-                      <div className="flex h-[60px] w-full items-center gap-2 px-4 backdrop-blur-sm">
+                      <div
+                        className={cn(
+                          "flex h-[60px] items-center gap-2 overflow-auto px-4 backdrop-blur-sm",
+                          numEnvironmentBlocks === 3 &&
+                            "max-w-[calc(100vw-256px-737px)]",
+                          numEnvironmentBlocks === 2 &&
+                            "max-w-[calc(100vw-256px-491px)]",
+                          numEnvironmentBlocks === 1 &&
+                            "max-w-[calc(100vw-256px-246px)]",
+                        )}
+                      >
                         <span className="truncate">{release.name}</span>{" "}
                         <Badge
                           variant="secondary"
diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/page.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/page.tsx
index 6beaf8731..b2985fb82 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/page.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/[systemSlug]/deployments/page.tsx
@@ -28,7 +28,7 @@ export default async function SystemDeploymentsPage({
       {deployments.length === 0 ? (
         <DeploymentGettingStarted systemId={system.id} />
       ) : (
-        <div className="scrollbar-thin scrollbar-thumb-neutral-800 scrollbar-track-neutral-900 container mx-auto h-[calc(100vh-40px)] overflow-auto p-8">
+        <div className="scrollbar-thin scrollbar-thumb-neutral-800 scrollbar-track-neutral-900 container mx-auto h-[calc(100%-49px)] overflow-auto p-8">
           <DeploymentTable
             deployments={deployments}
             environments={environments}