Add infra overrides tab to Deployments page (#8344)

orion-ui/src/pages/Deployment.vue

@@ -26,6 +26,10 @@
         <ParametersTable :deployment="deployment" />
       </template>
 
+      <template #infra-overrides>
+        <CodeHighlighting v-if="deployment" language="json" :value="overrides" />
+      </template>
+
       <template #details>
         <DeploymentDetails :deployment="deployment" @update="deploymentSubscription.refresh" />
       </template>
@@ -47,7 +51,7 @@
 </template>
 
 <script lang="ts" setup>
-  import { DeploymentDescription, FlowRunFilteredList, DeploymentDescriptionEmptyState, DeploymentDeprecatedMessage, PageHeadingDeployment, DeploymentDetails, ParametersTable, localization, useRecentFlowRunFilter, useTabs, useWorkspaceApi } from '@prefecthq/orion-design'
+  import { DeploymentDescription, FlowRunFilteredList, DeploymentDescriptionEmptyState, DeploymentDeprecatedMessage, PageHeadingDeployment, DeploymentDetails, ParametersTable, localization, useRecentFlowRunFilter, useTabs, useWorkspaceApi, CodeHighlighting } from '@prefecthq/orion-design'
   import { media } from '@prefecthq/prefect-design'
   import { useSubscription, useRouteParam } from '@prefecthq/vue-compositions'
   import { computed, watch } from 'vue'
@@ -70,6 +74,7 @@
     { label: 'Description' },
     { label: 'Runs' },
     { label: 'Parameters', hidden: deployment.value?.deprecated },
+    { label: 'Infra Overrides', hidden: deployment.value?.deprecated },
   ])
   const tabs = useTabs(computedTabs)
 
@@ -80,6 +85,10 @@
     router.push(routes.deployments())
   }
 
+  const overrides = computed(() => {
+    return deployment.value?.infrastructureOverrides ? JSON.stringify(deployment.value.infrastructureOverrides, undefined, 2) : '{}'
+  })
+
   const deploymentFilter = useRecentFlowRunFilter({ deployments: [deploymentId.value] })
 
   const title = computed(() => {