vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: revamp cap text run ui

Browse Source
This commit is contained in:
Rohit
2025-07-07 22:57:17 +05:30
parent 54a850b0f3
commit c8b8262818
1 changed files with 65 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
src/components/run/RunContent.tsx
View File

@@ -27,6 +27,7 @@ import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow'; import TableRow from '@mui/material/TableRow';
import 'highlight.js/styles/github.css'; import 'highlight.js/styles/github.css';
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useThemeMode } from "../../context/theme-provider";
interface RunContentProps { interface RunContentProps {
row: Data, row: Data,
@@ -54,6 +55,8 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
const [legacyColumns, setLegacyColumns] = useState<string[]>([]); const [legacyColumns, setLegacyColumns] = useState<string[]>([]);
const [isLegacyData, setIsLegacyData] = useState<boolean>(false); const [isLegacyData, setIsLegacyData] = useState<boolean>(false);
const { darkMode } = useThemeMode();
useEffect(() => { useEffect(() => {
setTab(tab); setTab(tab);
}, [interpretationInProgress]); }, [interpretationInProgress]);
@@ -262,8 +265,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
if (!currentData || currentData.length === 0) return null; if (!currentData || currentData.length === 0) return null;
const downloadData = isPaginatedList ? currentData : data; const isSchemaData = title.toLowerCase().includes('text') || title.toLowerCase().includes('schema');
const downloadColumns = isPaginatedList ? currentColumns : columns;
return ( return (
<Accordion defaultExpanded sx={{ mb: 2 }}> <Accordion defaultExpanded sx={{ mb: 2 }}>
@@ -283,7 +285,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
<Box> <Box>
<Button <Button
component="a" component="a"
onClick={() => downloadJSON(downloadData, jsonFilename)} onClick={() => downloadJSON(currentData, jsonFilename)}
sx={{ sx={{
color: '#FF00C3', color: '#FF00C3',
textTransform: 'none', textTransform: 'none',
@@ -297,12 +299,12 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
} }
}} }}
> >
Download as JSON {t('run_content.captured_data.download_json', 'Download as JSON')}
</Button> </Button>
<Button <Button
component="a" component="a"
onClick={() => downloadCSV(downloadData, downloadColumns, csvFilename)} onClick={() => downloadCSV(currentData, currentColumns, csvFilename)}
sx={{ sx={{
color: '#FF00C3', color: '#FF00C3',
textTransform: 'none', textTransform: 'none',
@@ -315,7 +317,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
} }
}} }}
> >
Download as CSV {t('run_content.captured_data.download_csv', 'Download as CSV')}
</Button> </Button>
</Box> </Box>
@@ -338,6 +340,7 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
onClick={() => navigateListTable('next')} onClick={() => navigateListTable('next')}
disabled={currentListIndex === listData.length - 1} disabled={currentListIndex === listData.length - 1}
sx={{ sx={{
borderColor: '#FF00C3',
color: currentListIndex === listData.length - 1 ? 'gray' : '#FF00C3', color: currentListIndex === listData.length - 1 ? 'gray' : '#FF00C3',
'&.Mui-disabled': { '&.Mui-disabled': {
borderColor: 'rgba(0, 0, 0, 0.12)' borderColor: 'rgba(0, 0, 0, 0.12)'
@@ -353,21 +356,66 @@ export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRe
<Table stickyHeader aria-label="sticky table"> <Table stickyHeader aria-label="sticky table">
<TableHead> <TableHead>
<TableRow> <TableRow>
{(isPaginatedList ? currentColumns : columns).map((column) => ( {isSchemaData ? (
<TableCell key={column}>{column}</TableCell> <>
))} <TableCell
sx={{
borderBottom: '1px solid',
borderColor: darkMode ? '#3a4453' : '#dee2e6',
backgroundColor: darkMode ? '#2a3441' : '#f8f9fa'
}}
>
Label
</TableCell>
<TableCell
sx={{
borderBottom: '1px solid',
borderColor: darkMode ? '#3a4453' : '#dee2e6',
backgroundColor: darkMode ? '#2a3441' : '#f8f9fa'
}}
>
Value
</TableCell>
</>
) : (
(isPaginatedList ? currentColumns : columns).map((column) => (
<TableCell
key={column}
sx={{
borderBottom: '1px solid',
borderColor: darkMode ? '#3a4453' : '#dee2e6',
backgroundColor: darkMode ? '#2a3441' : '#f8f9fa'
}}
>
{column}
</TableCell>
))
)}
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody>
{(isPaginatedList ? currentData : data).map((row, index) => ( {isSchemaData ? (
<TableRow key={index}> currentColumns.map((column) => (
{(isPaginatedList ? currentColumns : columns).map((column) => ( <TableRow key={column}>
<TableCell key={column}> <TableCell sx={{ fontWeight: 500 }}>
{row[column] === undefined || row[column] === "" ? "-" : row[column]} {column}
</TableCell> </TableCell>
))} <TableCell>
</TableRow> {currentData[0][column] === undefined || currentData[0][column] === "" ? "-" : currentData[0][column]}
))} </TableCell>
</TableRow>
))
) : (
currentData.map((row, index) => (
<TableRow key={index}>
{(isPaginatedList ? currentColumns : columns).map((column) => (
<TableCell key={column}>
{row[column] === undefined || row[column] === "" ? "-" : row[column]}
</TableCell>
))}
</TableRow>
))
)}
</TableBody> </TableBody>
</Table> </Table>
</TableContainer> </TableContainer>