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

chore: lint

Browse Source
This commit is contained in:
karishmas6
2024-09-08 14:02:56 +05:30
parent c5719ecea3
commit 4d54fe9970
1 changed files with 1 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/organisms/RightSidePanel.tsx
View File

@@ -23,7 +23,6 @@ import RadioGroup from '@mui/material/RadioGroup';
// 2. Handle field deletion | confirmation // 2. Handle field deletion | confirmation
// 3. Add description for each browser step // 3. Add description for each browser step
// 4. Handle non custom action steps // 4. Handle non custom action steps
interface RightSidePanelProps { interface RightSidePanelProps {
onFinishCapture: () => void; onFinishCapture: () => void;
} }
@@ -136,13 +135,11 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
const resetListState = useCallback(() => { const resetListState = useCallback(() => {
setShowPaginationOptions(false); setShowPaginationOptions(false);
updatePaginationType(''); updatePaginationType('');
setShowLimitOptions(false); setShowLimitOptions(false);
updateLimitType('10');
updateLimitType(''); updateLimitType('');
updateCustomLimit(''); updateCustomLimit('');
}, [updatePaginationType, updateLimitType, updateCustomLimit]); }, [updatePaginationType, updateLimitType, updateCustomLimit]);
const handleStopGetList = useCallback(() => { const handleStopGetList = useCallback(() => {
stopGetList(); stopGetList();
resetListState(); resetListState();
@@ -172,15 +169,12 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
notify('error', 'Please select a pagination type.'); notify('error', 'Please select a pagination type.');
return; return;
} }
const settings = getListSettingsObject(); const settings = getListSettingsObject();
const paginationSelector = settings.pagination?.selector; const paginationSelector = settings.pagination?.selector;
if (['clickNext', 'clickLoadMore'].includes(paginationType) && !paginationSelector) { if (['clickNext', 'clickLoadMore'].includes(paginationType) && !paginationSelector) {
notify('error', 'Please select the pagination element first.'); notify('error', 'Please select the pagination element first.');
return; return;
} }
stopPaginationMode(); stopPaginationMode();
setShowPaginationOptions(false); setShowPaginationOptions(false);
startLimitMode(); startLimitMode();
@@ -193,13 +187,11 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
notify('error', 'Please select a limit or enter a custom limit.'); notify('error', 'Please select a limit or enter a custom limit.');
return; return;
} }
const limit = limitType === 'custom' ? parseInt(customLimit) : parseInt(limitType); const limit = limitType === 'custom' ? parseInt(customLimit) : parseInt(limitType);
if (isNaN(limit) || limit <= 0) { if (isNaN(limit) || limit <= 0) {
notify('error', 'Please enter a valid limit.'); notify('error', 'Please enter a valid limit.');
return; return;
} }
stopLimitMode(); stopLimitMode();
setShowLimitOptions(false); setShowLimitOptions(false);
stopCaptureAndEmitGetListSettings(); stopCaptureAndEmitGetListSettings();
@@ -212,8 +204,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
} }
}, [captureStage, paginationType, limitType, customLimit, startPaginationMode, stopPaginationMode, startLimitMode, stopLimitMode, notify, stopCaptureAndEmitGetListSettings, getListSettingsObject]); }, [captureStage, paginationType, limitType, customLimit, startPaginationMode, stopPaginationMode, startLimitMode, stopLimitMode, notify, stopCaptureAndEmitGetListSettings, getListSettingsObject]);
const handlePaginationSettingSelect = (option: PaginationType) => { const handlePaginationSettingSelect = (option: PaginationType) => {
updatePaginationType(option); updatePaginationType(option);
if (['clickNext', 'clickLoadMore'].includes(option)) { if (['clickNext', 'clickLoadMore'].includes(option)) {
@@ -239,9 +229,7 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
<SimpleBox height={60} width='100%' background='lightGray' radius='0%'> <SimpleBox height={60} width='100%' background='lightGray' radius='0%'>
<Typography sx={{ padding: '10px' }}>Last action: {` ${lastAction}`}</Typography> <Typography sx={{ padding: '10px' }}>Last action: {` ${lastAction}`}</Typography>
</SimpleBox> </SimpleBox>
<SidePanelHeader /> <SidePanelHeader />
<Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}> <Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}>
{!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetList}>Capture List</Button>} {!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetList}>Capture List</Button>}
{getList && ( {getList && (
@@ -256,7 +244,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
</Box> </Box>
</> </>
)} )}
{showPaginationOptions && ( {showPaginationOptions && (
<Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}> <Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}>
<Typography>How can we find the next list item on the page?</Typography> <Typography>How can we find the next list item on the page?</Typography>
@@ -267,7 +254,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
<Button variant={paginationType === 'none' ? "contained" : "outlined"} onClick={() => handlePaginationSettingSelect('none')}>No more items to load</Button> <Button variant={paginationType === 'none' ? "contained" : "outlined"} onClick={() => handlePaginationSettingSelect('none')}>No more items to load</Button>
</Box> </Box>
)} )}
{showLimitOptions && ( {showLimitOptions && (
<FormControl> <FormControl>
<FormLabel> <FormLabel>
@@ -296,7 +282,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
</FormControl> </FormControl>
)} )}
{!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetText}>Capture Text</Button>} {!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetText}>Capture Text</Button>}
{getText && {getText &&
<> <>
@@ -306,7 +291,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
</Box> </Box>
</> </>
} }
{!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetScreenshot}>Capture Screenshot</Button>} {!getText && !getScreenshot && !getList && <Button variant="contained" onClick={startGetScreenshot}>Capture Screenshot</Button>}
{getScreenshot && ( {getScreenshot && (
<Box display="flex" flexDirection="column" gap={2}> <Box display="flex" flexDirection="column" gap={2}>
@@ -316,7 +300,6 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
</Box> </Box>
)} )}
</Box> </Box>
<Box> <Box>
{browserSteps.map(step => ( {browserSteps.map(step => (
<Box key={step.id} sx={{ boxShadow: 5, padding: '10px', margin: '10px', borderRadius: '4px' }}> <Box key={step.id} sx={{ boxShadow: 5, padding: '10px', margin: '10px', borderRadius: '4px' }}>