Re-land bbiggs changes to reduce margin on narrow screens with fixes + full width setting (#10522)

packages/cli/src/ui/layouts/DefaultAppLayout.tsx

@@ -17,7 +17,7 @@ export const DefaultAppLayout: React.FC = () => {
   const uiState = useUIState();
 
   return (
-    <Box flexDirection="column" width="90%">
+    <Box flexDirection="column" width={uiState.mainAreaWidth}>
       <MainContent />
 
       <Box flexDirection="column" ref={uiState.mainControlsRef}>
@@ -25,7 +25,7 @@ export const DefaultAppLayout: React.FC = () => {
 
         {uiState.dialogsVisible ? (
           <DialogManager
-            terminalWidth={uiState.terminalWidth}
+            terminalWidth={uiState.mainAreaWidth}
             addItem={uiState.historyManager.addItem}
           />
         ) : (