minimun size setting

Author: Chenglong-MS

src/app/App.tsx

@@ -465,10 +465,28 @@ export const AppFC: FC<AppFCProps> = function AppFC(appProps) {
     ]);
 
     let app =
-        <Box sx={{ flexGrow: 1, height: '100%', overflow: "hidden", display: "flex", flexDirection: "column" }}>
-            {appBar}
-            <RouterProvider router={router} />
-            <MessageSnackbar />
+        <Box sx={{ 
+            position: 'absolute',  // Added to fill viewport
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            overflow: 'auto',      // Enable scrolling at root level
+            '& > *': {
+                minWidth: '1200px',
+                minHeight: '800px'
+            }
+        }}>
+            <Box sx={{ 
+                display: 'flex',
+                flexDirection: 'column',
+                height: '100%',
+                width: '100%'
+            }}>
+                {appBar}
+                <RouterProvider router={router} />
+                <MessageSnackbar />
+            </Box>
         </Box>;
 
     return (

src/views/DataFormulator.tsx

@@ -178,7 +178,7 @@ Totals (7 entries)	5	5	5	15
     console.log(selectedModelId)
 
     return (
-        <Box sx={{ display: 'block', width: "100%", height: 'calc(100vh - 49px)' }}>
+        <Box sx={{ display: 'block', width: "100%", height: 'calc(100% - 49px)' }}>
             <DndProvider backend={HTML5Backend}>
                 {selectedModelId == undefined ? modelSelectionDialogBox : (tables.length > 0 ? fixedSplitPane : dataUploadRequestBox)} 
             </DndProvider>

src/views/ModelSelectionDialog.tsx

@@ -331,7 +331,7 @@ export const ModelSelectionButton: React.FC<{}> = ({ }) => {
 
                     let message = "the model is ready to use";
                     if (status == "unknown") {
-                        message = "Status unknown, click the status icon to test again.";
+                        message = "Click the status icon to test again before applying.";
                     } else if (status == "error") {
                         message = testedModels.find(t => t.id == model.id)?.message || "Unknown error";
                     }
@@ -419,7 +419,7 @@ export const ModelSelectionButton: React.FC<{}> = ({ }) => {
                                 }}
                             >
                                 <TableCell colSpan={2} align="right" ></TableCell>
-                                <TableCell colSpan={5}>
+                                <TableCell colSpan={6}>
                                     <Typography variant="caption" color="#c82c2c">
                                         {message}
                                     </Typography>