Merge pull request #398 from getmaxun/run-load

feat: display loader on robot run

public/locales/de.json

@@ -451,6 +451,7 @@
             "log": "Protokoll"
         },
         "empty_output": "Die Ausgabe ist leer.",
+        "loading": "Ausführung läuft. Extrahierte Daten werden nach Abschluss des Durchlaufs hier angezeigt.",
         "captured_data": {
             "title": "Erfasste Daten",
             "download_json": "Als JSON herunterladen",

public/locales/en.json

@@ -462,6 +462,7 @@
         "log": "Log"
       },
       "empty_output": "The output is empty.",
+      "loading": "Run in progress. Extracted data will appear here once run completes.",
       "captured_data": {
         "title": "Captured Data",
         "download_json": "Download as JSON",

public/locales/es.json

@@ -452,6 +452,7 @@
       "log": "Registro"
     },
     "empty_output": "La salida está vacía.",
+    "loading": "Ejecución en curso. Los datos extraídos aparecerán aquí una vez que se complete la ejecución.",
     "captured_data": {
       "title": "Datos Capturados",
       "download_json": "Descargar como JSON",

public/locales/ja.json

@@ -452,6 +452,7 @@
             "log": "ログ"
         },
         "empty_output": "出力は空です。",
+        "loading": "実行中です。実行が完了すると、抽出されたデータがここに表示されます。",
         "captured_data": {
             "title": "キャプチャされたデータ",
             "download_json": "JSONとしてダウンロード",

public/locales/zh.json

@@ -452,6 +452,7 @@
       "log": "日志"
     },
     "empty_output": "输出为空。",
+    "loading": "运行中。运行完成后，提取的数据将显示在此处。",
     "captured_data": {
       "title": "捕获的数据",
       "download_json": "下载为JSON",

src/components/run/RunContent.tsx

@@ -1,4 +1,4 @@
-import { Box, Tabs, Typography, Tab, Paper, Button } from "@mui/material";
+import { Box, Tabs, Typography, Tab, Paper, Button, CircularProgress } from "@mui/material";
 import Highlight from "react-highlight";
 import * as React from "react";
 import { Data } from "./RunsTable";
@@ -148,9 +148,15 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
           </Button> : null}
         </TabPanel>
         <TabPanel value='output' sx={{ width: '700px' }}>
-          {!row || !row.serializableOutput || !row.binaryOutput
+          {interpretationInProgress ? (
+            <Box sx={{ display: 'flex', alignItems: 'center' }}>
+              <CircularProgress size={22} sx={{ marginRight: '10px' }} />
+              {t('run_content.loading')}
+            </Box>
+          ) : (!row || !row.serializableOutput || !row.binaryOutput
             || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0)
-            ? <Typography>{t('run_content.empty_output')}</Typography> : null}
+            ? <Typography>{t('run_content.empty_output')}</Typography> 
+            : null)}
 
           {row.serializableOutput &&
             Object.keys(row.serializableOutput).length !== 0 &&