+ 
+
-
-
+ ) : (
+ <>
+ {t("language")}
+
+
+ )}
+
+
+
+
+
);
};
const NavBarWrapper = styled.div`
grid-area: navbar;
background-color: white;
- padding:5px;
+ padding: 5px;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #e0e0e0;
diff --git a/src/components/molecules/RecordingsTable.tsx b/src/components/molecules/RecordingsTable.tsx
index 651d3677..92bf572a 100644
--- a/src/components/molecules/RecordingsTable.tsx
+++ b/src/components/molecules/RecordingsTable.tsx
@@ -1,4 +1,5 @@
import * as React from 'react';
+import { useTranslation } from 'react-i18next';
import Paper from '@mui/material/Paper';
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
@@ -19,6 +20,7 @@ import { useNavigate } from 'react-router-dom';
import { stopRecording } from "../../api/recording";
import { GenericModal } from '../atoms/GenericModal';
+
/** TODO:
* 1. allow editing existing robot after persisting browser steps
*/
@@ -31,30 +33,9 @@ interface Column {
format?: (value: string) => string;
}
-const columns: readonly Column[] = [
- { id: 'interpret', label: 'Run', minWidth: 80 },
- { id: 'name', label: 'Name', minWidth: 80 },
- {
- id: 'schedule',
- label: 'Schedule',
- minWidth: 80,
- },
- {
- id: 'integrate',
- label: 'Integrate',
- minWidth: 80,
- },
- {
- id: 'settings',
- label: 'Settings',
- minWidth: 80,
- },
- {
- id: 'options',
- label: 'Options',
- minWidth: 80,
- },
-];
+
+
+
interface Data {
id: string;
@@ -76,12 +57,38 @@ interface RecordingsTableProps {
}
export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handleScheduleRecording, handleIntegrateRecording, handleSettingsRecording, handleEditRobot, handleDuplicateRobot }: RecordingsTableProps) => {
+ const {t} = useTranslation();
const [page, setPage] = React.useState(0);
const [rowsPerPage, setRowsPerPage] = React.useState(10);
const [rows, setRows] = React.useState([]);
const [isModalOpen, setModalOpen] = React.useState(false);
const [searchTerm, setSearchTerm] = React.useState('');
+ const columns: readonly Column[] = [
+ { id: 'interpret', label: t('recordingtable.run'), minWidth: 80 },
+ { id: 'name', label: t('recordingtable.name'), minWidth: 80 },
+ {
+ id: 'schedule',
+ label: t('recordingtable.schedule'),
+ minWidth: 80,
+ },
+ {
+ id: 'integrate',
+ label: t('recordingtable.integrate'),
+ minWidth: 80,
+ },
+ {
+ id: 'settings',
+ label: t('recordingtable.settings'),
+ minWidth: 80,
+ },
+ {
+ id: 'options',
+ label: t('recordingtable.options'),
+ minWidth: 80,
+ },
+ ];
+
const { notify, setRecordings, browserId, setBrowserId, recordingUrl, setRecordingUrl, recordingName, setRecordingName, recordingId, setRecordingId } = useGlobalInfoStore();
const navigate = useNavigate();
@@ -151,16 +158,17 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
row.name.toLowerCase().includes(searchTerm.toLowerCase())
);
+
return (
- My Robots
+ {t('recordingtable.heading')}
-
@@ -297,9 +305,9 @@ export const RecordingsTable = ({ handleEditRecording, handleRunRecording, handl
/>
setModalOpen(false)} modalStyle={modalStyle}>
@@ -397,6 +405,8 @@ const OptionsButton = ({ handleEdit, handleDelete, handleDuplicate }: OptionsBut
setAnchorEl(null);
};
+ const {t} = useTranslation();
+
return (
<>
Edit
-
-
+
+
+
+
);
diff --git a/src/components/molecules/RunsTable.tsx b/src/components/molecules/RunsTable.tsx
index 669cecd6..41dd047a 100644
--- a/src/components/molecules/RunsTable.tsx
+++ b/src/components/molecules/RunsTable.tsx
@@ -1,4 +1,6 @@
import * as React from 'react';
+import { useEffect, useState } from "react";
+import { useTranslation } from 'react-i18next';
import Paper from '@mui/material/Paper';
import Table from '@mui/material/Table';
import TableBody from '@mui/material/TableBody';
@@ -7,14 +9,24 @@ import TableContainer from '@mui/material/TableContainer';
import TableHead from '@mui/material/TableHead';
import TablePagination from '@mui/material/TablePagination';
import TableRow from '@mui/material/TableRow';
-import { useEffect, useState } from "react";
+import { Accordion, AccordionSummary, AccordionDetails, Typography, Box, TextField } from '@mui/material';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import SearchIcon from '@mui/icons-material/Search';
+
import { useGlobalInfoStore } from "../../context/globalInfo";
import { getStoredRuns } from "../../api/storage";
import { RunSettings } from "./RunSettings";
import { CollapsibleRow } from "./ColapsibleRow";
-import { Accordion, AccordionSummary, AccordionDetails, Typography, Box, TextField } from '@mui/material';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import SearchIcon from '@mui/icons-material/Search';
+
+// Export columns before the component
+export const columns: readonly Column[] = [
+ { id: 'runStatus', label: 'Status', minWidth: 80 },
+ { id: 'name', label: 'Name', minWidth: 80 },
+ { id: 'startedAt', label: 'Started At', minWidth: 80 },
+ { id: 'finishedAt', label: 'Finished At', minWidth: 80 },
+ { id: 'settings', label: 'Settings', minWidth: 80 },
+ { id: 'delete', label: 'Delete', minWidth: 80 },
+];
interface Column {
id: 'runStatus' | 'name' | 'startedAt' | 'finishedAt' | 'delete' | 'settings';
@@ -24,16 +36,7 @@ interface Column {
format?: (value: string) => string;
}
-export const columns: readonly Column[] = [
- { id: 'runStatus', label: 'Status', minWidth: 80 },
- { id: 'name', label: 'Robot Name', minWidth: 80 },
- { id: 'startedAt', label: 'Started at', minWidth: 80 },
- { id: 'finishedAt', label: 'Finished at', minWidth: 80 },
- { id: 'settings', label: 'Settings', minWidth: 80 },
- { id: 'delete', label: 'Delete', minWidth: 80 },
-];
-
-export interface Data {
+interface Data {
id: number;
status: string;
name: string;
@@ -58,15 +61,25 @@ interface RunsTableProps {
runningRecordingName: string;
}
-export const RunsTable = (
- { currentInterpretationLog, abortRunHandler, runId, runningRecordingName }: RunsTableProps) => {
+export const RunsTable: React.FC = ({
+ currentInterpretationLog,
+ abortRunHandler,
+ runId,
+ runningRecordingName
+}) => {
+ const { t } = useTranslation();
+
+ // Update column labels using translation if needed
+ const translatedColumns = columns.map(column => ({
+ ...column,
+ label: t(`runstable.${column.id}`, column.label)
+ }));
+
const [page, setPage] = useState(0);
const [rowsPerPage, setRowsPerPage] = useState(10);
const [rows, setRows] = useState([]);
-
const [searchTerm, setSearchTerm] = useState('');
-
const { notify, rerenderRuns, setRerenderRuns } = useGlobalInfoStore();
const handleChangePage = (event: unknown, newPage: number) => {
@@ -86,16 +99,13 @@ export const RunsTable = (
const fetchRuns = async () => {
const runs = await getStoredRuns();
if (runs) {
- const parsedRows: Data[] = [];
- runs.map((run: any, index) => {
- parsedRows.push({
- id: index,
- ...run,
- });
- });
+ const parsedRows: Data[] = runs.map((run: any, index: number) => ({
+ id: index,
+ ...run,
+ }));
setRows(parsedRows);
} else {
- notify('error', 'No runs found. Please try again.')
+ notify('error', 'No runs found. Please try again.');
}
};
@@ -104,7 +114,7 @@ export const RunsTable = (
fetchRuns();
setRerenderRuns(false);
}
- }, [rerenderRuns]);
+ }, [rerenderRuns, rows.length, setRerenderRuns]);
const handleDelete = () => {
setRows([]);
@@ -112,7 +122,6 @@ export const RunsTable = (
fetchRuns();
};
-
// Filter rows based on search term
const filteredRows = rows.filter((row) =>
row.name.toLowerCase().includes(searchTerm.toLowerCase())
@@ -120,7 +129,6 @@ export const RunsTable = (
// Group filtered rows by robot meta id
const groupedRows = filteredRows.reduce((acc, row) => {
-
if (!acc[row.robotMetaId]) {
acc[row.robotMetaId] = [];
}
@@ -132,11 +140,11 @@ export const RunsTable = (
- All Runs
+ {t('runstable.runs', 'Runs')}
(
{data[data.length - 1].name}
-
+ Maxun
+
+
-
- Maxun
-
+ {user ? (
+
+ {!isRecording ? (
+ <>
+
+
+
+
+ {user.email}
+
+
+
+
+ ) : (
+ <>
+
+
+
+
+
+
+
- {
- user ? (
-
- {!isRecording ? (
- <>
-
-
-
- {latestVersion === null ? (
- Checking for updates...
- ) : currentVersion === latestVersion ? (
-
- 🎉 You're up to date!
-
- ) : (
- <>
-
- A new version is available: {latestVersion}. Upgrade to the latest version for bug fixes, enhancements and new features!
-
- View all the new updates - {' '}here. -
-
-
- {tab === 0 && (
-
-
- )}
- {tab === 1 && (
-
-
- )}
-
- )}
-
-
-
-
- {user.email}
-
-
-
- ) : (
- <>
-
-
-
- ) : ""
- }
- - View all the new updates - {' '}here. -
- Run the commands below
- # pull latest changes
-
- git pull origin master
-
-
- # install dependencies
-
- npm install
-
-
- # start maxun
-
- npm run start
-
-
- Run the commands below
- # pull latest docker images
-
- docker-compose pull
-
-
- # start maxun
-
- docker-compose up -d
-
-
- Enter URL To Extract Data
+ {t('recordingtable.modal.title')}
- Start Training Robot
+ {t('recordingtable.modal.button')}
-