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

feat: show tabs only if multiple actions

Browse Source
This commit is contained in:
Rohit
2025-04-30 22:35:00 +05:30
parent f5df4c9c8a
commit e09e794754
1 changed files with 52 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
src/components/run/InterpretationLog.tsx
View File

@@ -33,7 +33,6 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
const [captureListData, setCaptureListData] = useState<any[]>([]); const [captureListData, setCaptureListData] = useState<any[]>([]);
const [captureTextData, setCaptureTextData] = useState<any[]>([]); const [captureTextData, setCaptureTextData] = useState<any[]>([]);
const [screenshotData, setScreenshotData] = useState<string[]>([]); const [screenshotData, setScreenshotData] = useState<string[]>([]);
const [otherData, setOtherData] = useState<any[]>([]);
const [captureListPage, setCaptureListPage] = useState<number>(0); const [captureListPage, setCaptureListPage] = useState<number>(0);
const [screenshotPage, setScreenshotPage] = useState<number>(0); const [screenshotPage, setScreenshotPage] = useState<number>(0);
@@ -77,7 +76,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
prevState + '\n' + t('interpretation_log.data_sections.serializable_received') + '\n' prevState + '\n' + t('interpretation_log.data_sections.serializable_received') + '\n'
+ JSON.stringify(data, null, 2) + '\n' + t('interpretation_log.data_sections.separator')); + JSON.stringify(data, null, 2) + '\n' + t('interpretation_log.data_sections.separator'));
if (type === 'captureList' && Array.isArray(data)) { if (type === 'captureList') {
setCaptureListData(prev => [...prev, data]); setCaptureListData(prev => [...prev, data]);
if (captureListData.length === 0) { if (captureListData.length === 0) {
const availableTabs = getAvailableTabs(); const availableTabs = getAvailableTabs();
@@ -98,7 +97,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
} }
scrollLogToBottom(); scrollLogToBottom();
}, [captureListData.length, captureTextData.length, otherData.length, t]); }, [captureListData.length, captureTextData.length, t]);
const handleBinaryCallback = useCallback(({ data, mimetype, type }: { data: any, mimetype: string, type: string }) => { const handleBinaryCallback = useCallback(({ data, mimetype, type }: { data: any, mimetype: string, type: string }) => {
const base64String = Buffer.from(data).toString('base64'); const base64String = Buffer.from(data).toString('base64');
@@ -132,7 +131,6 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
setCaptureListData([]); setCaptureListData([]);
setCaptureTextData([]); setCaptureTextData([]);
setScreenshotData([]); setScreenshotData([]);
setOtherData([]);
setActiveTab(0); setActiveTab(0);
setCaptureListPage(0); setCaptureListPage(0);
setScreenshotPage(0); setScreenshotPage(0);
@@ -188,6 +186,17 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
const getCaptureTextColumns = captureTextData.length > 0 ? Object.keys(captureTextData[0]) : []; const getCaptureTextColumns = captureTextData.length > 0 ? Object.keys(captureTextData[0]) : [];
const shouldShowTabs = availableTabs.length > 1;
const getSingleContentType = () => {
if (availableTabs.length === 1) {
return availableTabs[0].id;
}
return null;
};
const singleContentType = getSingleContentType();
return ( return (
<Grid container> <Grid container>
<Grid item xs={12} md={9} lg={9}> <Grid item xs={12} md={9} lg={9}>
@@ -240,43 +249,45 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
{availableTabs.length > 0 ? ( {availableTabs.length > 0 ? (
<> <>
<Box {shouldShowTabs && (
sx={{ <Box
display: 'flex', sx={{
borderBottom: '1px solid', display: 'flex',
borderColor: darkMode ? '#3a4453' : '#dee2e6', borderBottom: '1px solid',
backgroundColor: darkMode ? '#2a3441' : '#f8f9fa' borderColor: darkMode ? '#3a4453' : '#dee2e6',
}} backgroundColor: darkMode ? '#2a3441' : '#f8f9fa'
> }}
{availableTabs.map((tab, index) => ( >
<Box {availableTabs.map((tab, index) => (
key={tab.id} <Box
onClick={() => setActiveTab(index)} key={tab.id}
sx={{ onClick={() => setActiveTab(index)}
px: 4, sx={{
py: 2, px: 4,
cursor: 'pointer', py: 2,
borderBottom: activeTab === index ? '2px solid' : 'none', cursor: 'pointer',
borderColor: activeTab === index ? (darkMode ? '#ff00c3' : '#ff00c3') : 'transparent', borderBottom: activeTab === index ? '2px solid' : 'none',
backgroundColor: activeTab === index ? (darkMode ? '#34404d' : '#e9ecef') : 'transparent', borderColor: activeTab === index ? (darkMode ? '#ff00c3' : '#ff00c3') : 'transparent',
color: darkMode ? 'white' : 'black', backgroundColor: activeTab === index ? (darkMode ? '#34404d' : '#e9ecef') : 'transparent',
fontWeight: activeTab === index ? 500 : 400, color: darkMode ? 'white' : 'black',
textAlign: 'center', fontWeight: activeTab === index ? 500 : 400,
position: 'relative', textAlign: 'center',
'&:hover': { position: 'relative',
backgroundColor: activeTab !== index ? (darkMode ? '#303b49' : '#e2e6ea') : undefined '&:hover': {
} backgroundColor: activeTab !== index ? (darkMode ? '#303b49' : '#e2e6ea') : undefined
}} }
> }}
<Typography variant="body1"> >
{tab.label} <Typography variant="body1">
</Typography> {tab.label}
</Box> </Typography>
))} </Box>
</Box> ))}
</Box>
)}
<Box sx={{ flexGrow: 1, overflow: 'auto', p: 0 }}> <Box sx={{ flexGrow: 1, overflow: 'auto', p: 0 }}>
{activeTab === availableTabs.findIndex(tab => tab.id === 'captureList') && captureListData.length > 0 && ( {(activeTab === availableTabs.findIndex(tab => tab.id === 'captureList') || singleContentType === 'captureList') && captureListData.length > 0 && (
<Box> <Box>
<Box sx={{ <Box sx={{
display: 'flex', display: 'flex',
@@ -355,7 +366,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
</Box> </Box>
)} )}
{activeTab === availableTabs.findIndex(tab => tab.id === 'captureScreenshot') && ( {(activeTab === availableTabs.findIndex(tab => tab.id === 'captureScreenshot') || singleContentType === 'captureScreenshot') && screenshotData.length > 0 && (
<Box> <Box>
{screenshotData.length > 1 && ( {screenshotData.length > 1 && (
<Box sx={{ <Box sx={{
@@ -402,7 +413,7 @@ export const InterpretationLog: React.FC<InterpretationLogProps> = ({ isOpen, se
</Box> </Box>
)} )}
{activeTab === availableTabs.findIndex(tab => tab.id === 'captureText') && ( {(activeTab === availableTabs.findIndex(tab => tab.id === 'captureText') || singleContentType === 'captureText') && captureTextData.length > 0 && (
<TableContainer component={Paper} sx={{ boxShadow: 'none', borderRadius: 0 }}> <TableContainer component={Paper} sx={{ boxShadow: 'none', borderRadius: 0 }}>
<Table> <Table>
<TableHead> <TableHead>