From f0f2b0c1384889fa5ff184ea6443aea8c1d401cc Mon Sep 17 00:00:00 2001
From: Emily Xiong <xiongemi@gmail.com>
Date: Fri, 19 Jul 2024 16:01:57 -0400
Subject: [PATCH] feat(graph): add parallelism in target details

---
 .../target-configuration-details.tsx          | 28 +++++++++++++++++--
 .../src/lib/property-info-tooltip.tsx         |  9 +++++-
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/graph/ui-project-details/src/lib/target-configuration-details/target-configuration-details.tsx b/graph/ui-project-details/src/lib/target-configuration-details/target-configuration-details.tsx
index 640708eb3a6e9c..5a8b05b6294fa2 100644
--- a/graph/ui-project-details/src/lib/target-configuration-details/target-configuration-details.tsx
+++ b/graph/ui-project-details/src/lib/target-configuration-details/target-configuration-details.tsx
@@ -330,9 +330,31 @@ export default function TargetConfigurationDetails({
                 />
               </FadingCollapsible>
             </>
-          ) : (
-            ''
-          )}
+          ) : null}
+
+          {targetConfiguration.parallelism === false ? (
+            <div className="group mb-4">
+              <h4 className="mb-4">
+                <Tooltip
+                  openAction="hover"
+                  content={(<PropertyInfoTooltip type="parallelism" />) as any}
+                >
+                  <span className="font-medium">
+                    <TooltipTriggerText>Parallelism</TooltipTriggerText>
+                  </span>
+                </Tooltip>
+              </h4>
+              <div className="group/line overflow-hidden whitespace-nowrap pl-5">
+                <TargetConfigurationProperty data={{ paralelism: false }}>
+                  <TargetSourceInfo
+                    className="min-w-0 flex-1 pl-4 opacity-0 transition-opacity duration-150 ease-in-out group-hover/line:opacity-100"
+                    propertyKey={`targets.${targetName}.parallelism`}
+                    sourceMap={sourceMap}
+                  />
+                </TargetConfigurationProperty>
+              </div>
+            </div>
+          ) : null}
         </div>
       )}
     </div>
diff --git a/graph/ui-tooltips/src/lib/property-info-tooltip.tsx b/graph/ui-tooltips/src/lib/property-info-tooltip.tsx
index 06e90d9923b410..2de8f569a7a0e9 100644
--- a/graph/ui-tooltips/src/lib/property-info-tooltip.tsx
+++ b/graph/ui-tooltips/src/lib/property-info-tooltip.tsx
@@ -10,7 +10,8 @@ type PropertyInfoTooltipType =
   | 'dependsOn'
   | 'options'
   | 'configurations'
-  | 'release';
+  | 'release'
+  | 'parallelism';
 
 type PropertyInfoTooltipTypeOptions = {
   docsUrl?: string;
@@ -81,6 +82,12 @@ const PROPERTY_INFO_TOOLTIP_TYPE_OPTIONS: Record<
       "The nx-release-publish target is used to publish your project with nxrelease. Don't invoke this directly - use nx release publish instead.",
     docsUrl: 'https://nx.dev/nx-api/nx/documents/release',
   },
+  parallelism: {
+    heading: 'Parallelism',
+    description:
+      'By default, tasks can be run in parallel with other tasks. By setting `"parallelism": false` in the target\'s configuration, it ensures that the target will not run in parallel with other tasks.',
+    docsUrl: 'https://nx.dev/reference/project-configuration',
+  },
 };
 
 export function PropertyInfoTooltip({ type }: PropertyInfoTooltipProps) {