dashboard: improvements to isDisconnected state (#34614)

- Make sure the disconnected overlay shows below the header (by hardcoding the height and margin-top to make space for the header)
- Reduce the interval for checking if disconnected from the dev deployment from 5s to 2.5s for a more responsive feel

GitOrigin-RevId: 5cdf161caaf0f6bd842c3f0b2bc02fdd8bb74a82

npm-packages/dashboard-common/src/lib/deploymentContext.tsx

@@ -392,7 +392,7 @@ function DeploymentWithConnectionState({
       setConnectionState(
         nextConnectionState.isWebSocketConnected ? "Connected" : "Disconnected",
       );
-    }, 5000);
+    }, 2500);
     return () => clearInterval(checkConnection);
   });
   useEffect(() => {
@@ -426,7 +426,7 @@ function DeploymentWithConnectionState({
 function LocalDeploymentDisconnectOverlay() {
   return (
     <div
-      className="absolute z-50 flex h-full w-full items-center justify-center"
+      className="absolute z-50 mt-[3.5rem] flex h-[calc(100vh-3.5rem)] w-full items-center justify-center"
       style={{
         backdropFilter: "blur(0.5rem)",
       }}
@@ -454,7 +454,7 @@ function SelfHostedDisconnectOverlay({
 }) {
   return (
     <div
-      className="absolute z-50 flex h-full w-full items-center justify-center"
+      className="absolute z-50  mt-[3.5rem] flex h-[calc(100vh-3.5rem)] w-full items-center justify-center"
       style={{
         backdropFilter: "blur(0.5rem)",
       }}