From d81e2684ce38e1d9a9731b8176b57440ab5d99e1 Mon Sep 17 00:00:00 2001
From: karishmas6 <carishmashukla28@gmail.com>
Date: Thu, 10 Oct 2024 16:27:38 +0530
Subject: [PATCH] fix: revert changes

---
 src/components/organisms/RightSidePanel.tsx | 216 ++++++++++----------
 1 file changed, 107 insertions(+), 109 deletions(-)

diff --git a/src/components/organisms/RightSidePanel.tsx b/src/components/organisms/RightSidePanel.tsx
index 2e46d323..110bdce8 100644
--- a/src/components/organisms/RightSidePanel.tsx
+++ b/src/components/organisms/RightSidePanel.tsx
@@ -120,7 +120,7 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
     setHoverStates(prev => ({ ...prev, [id]: false }));
   };
 
-  const handlePairDelete = () => { }
+  const handlePairDelete = () => {}
 
   const handleTextLabelChange = (id: number, label: string, listId?: number, fieldKey?: string) => {
     if (listId !== undefined && fieldKey !== undefined) {
@@ -451,137 +451,135 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
           </Box>
         )}
       </Box>
-      {
-        workflow.workflow.map((pair, i, workflow) => (
-          <Box key={workflow.length - i} sx={{ mb: 2 }}>
-            {browserSteps.filter(step => {
-              if (step.type === 'text') {
-                return confirmedTextSteps[step.id]; // Check if text step is confirmed
-              } else if (step.type === 'list') {
-                return Object.values(confirmedListTextFields[step.id] || {}).some(Boolean); // Check if any list fields are confirmed
-              } else if (step.type === 'screenshot') {
-                return true; // Assuming all screenshot steps are considered confirmed by default
-              }
-              return false; // Default case
-            }).map((step) => (
-              <Box
-                key={step.id}
-                sx={{
-                  boxShadow: 5,
-                  padding: '10px',
-                  margin: '13px',
-                  borderRadius: '4px',
-                  position: 'relative',
-                }}
-                onMouseEnter={() => handleMouseEnter(step.id)}
-                onMouseLeave={() => handleMouseLeave(step.id)}
-              >
-                {step.type === 'text' && (
-                  <>
-                    {hoverStates[step.id] && (
-                      <IconButton
-                        onClick={() => handlePairDelete()}
-                        sx={{
-                          position: 'absolute',
-                          top: -15,
-                          right: -15,
-                          color: 'red',
-                          p: 0,
-                          zIndex: 1,
-                          boxShadow: '5px',
-                          backgroundColor: 'white',
-                          borderRadius: '50%',
-                        }}
-                      >
-                        <DeleteIcon sx={{ fontSize: 40 }} />
-                      </IconButton>
-                    )}
+      <Box>
+        {browserSteps.map(step => (
+          <Box key={step.id} sx={{ boxShadow: 5, padding: '10px', margin: '13px', borderRadius: '4px', position: 'relative', }} onMouseEnter={() => handleMouseEnter(step.id)} onMouseLeave={() => handleMouseLeave(step.id)}>
+            {
+              step.type === 'text' && (
+                <>
+                  {confirmedTextSteps[step.id] && hoverStates[step.id] && (
+                    <IconButton
+                      onClick={() => handlePairDelete()}
+                      sx={{
+                        position: 'absolute',
+                        top: -15,
+                        right: -15,
+                        color: 'red',
+                        p: 0,
+                        zIndex: 1,
+                        boxShadow: '5px', 
+                        backgroundColor: 'white', 
+                        borderRadius: '50%', 
+                      }}
+                    >
+                      <DeleteIcon sx={{ fontSize: 40 }} />
+                    </IconButton>
+                  )}
+                  <TextField
+                    label="Label"
+                    value={textLabels[step.id] || step.label || ''}
+                    onChange={(e) => handleTextLabelChange(step.id, e.target.value)}
+                    fullWidth
+                    margin="normal"
+                    error={!!errors[step.id]}
+                    helperText={errors[step.id]}
+                    InputProps={{
+                      readOnly: confirmedTextSteps[step.id],
+                      startAdornment: (
+                        <InputAdornment position="start">
+                          <EditIcon />
+                        </InputAdornment>
+                      )
+                    }}
+                  />
+                  <TextField
+                    label="Data"
+                    value={step.data}
+                    fullWidth
+                    margin="normal"
+                    InputProps={{
+                      readOnly: confirmedTextSteps[step.id],
+                      startAdornment: (
+                        <InputAdornment position="start">
+                          <TextFieldsIcon />
+                        </InputAdornment>
+                      )
+                    }}
+                  />
+                  {!confirmedTextSteps[step.id] && (
+                    <Box display="flex" justifyContent="space-between" gap={2}>
+                      <Button variant="contained" onClick={() => handleTextStepConfirm(step.id)} disabled={!textLabels[step.id]?.trim()}>Confirm</Button>
+                      <Button variant="contained" onClick={() => handleTextStepDiscard(step.id)}>Discard</Button>
+                    </Box>
+                  )}
+                </>
+              )}
+            {step.type === 'screenshot' && (
+              <Box display="flex" alignItems="center">
+                <DocumentScannerIcon sx={{ mr: 1 }} />
+                <Typography>
+                  {`Take ${step.fullPage ? 'Fullpage' : 'Visible Part'} Screenshot`}
+                </Typography>
+              </Box>
+            )}
+            {step.type === 'list' && (
+              <>
+                <Typography>List Selected Successfully</Typography>
+                {Object.entries(step.fields).map(([key, field]) => (
+                  <Box key={key}>
                     <TextField
-                      label="Label"
-                      value={textLabels[step.id] || step.label || ''}
-                      onChange={(e) => handleTextLabelChange(step.id, e.target.value)}
+                      label="Field Label"
+                      value={field.label || ''}
+                      onChange={(e) => handleTextLabelChange(field.id, e.target.value, step.id, key)}
                       fullWidth
                       margin="normal"
-                      error={!!errors[step.id]}
-                      helperText={errors[step.id]}
                       InputProps={{
-                        readOnly: confirmedTextSteps[step.id],
+                        readOnly: confirmedListTextFields[field.id]?.[key],
                         startAdornment: (
                           <InputAdornment position="start">
                             <EditIcon />
                           </InputAdornment>
-                        ),
+                        )
                       }}
                     />
                     <TextField
-                      label="Data"
-                      value={step.data}
+                      label="Field Data"
+                      value={field.data || ''}
                       fullWidth
                       margin="normal"
                       InputProps={{
-                        readOnly: confirmedTextSteps[step.id],
+                        readOnly: true,
                         startAdornment: (
                           <InputAdornment position="start">
                             <TextFieldsIcon />
                           </InputAdornment>
-                        ),
+                        )
                       }}
                     />
-                  </>
-                )}
-                {step.type === 'screenshot' && (
-                  <Box display="flex" alignItems="center">
-                    <DocumentScannerIcon sx={{ mr: 1 }} />
-                    <Typography>
-                      {`Take ${step.fullPage ? 'Fullpage' : 'Visible Part'} Screenshot`}
-                    </Typography>
-                  </Box>
-                )}
-                {step.type === 'list' && (
-                  <>
-                    <Typography>List Selected Successfully</Typography>
-                    {Object.entries(step.fields).map(([key, field]) => (
-                      <Box key={key}>
-                        <TextField
-                          label="Field Label"
-                          value={field.label || ''}
-                          onChange={(e) =>
-                            handleTextLabelChange(field.id, e.target.value, step.id, key)
-                          }
-                          fullWidth
-                          margin="normal"
-                          InputProps={{
-                            readOnly: confirmedListTextFields[field.id]?.[key],
-                            startAdornment: (
-                              <InputAdornment position="start">
-                                <EditIcon />
-                              </InputAdornment>
-                            ),
-                          }}
-                        />
-                        <TextField
-                          label="Field Data"
-                          value={field.data || ''}
-                          fullWidth
-                          margin="normal"
-                          InputProps={{
-                            readOnly: true,
-                            startAdornment: (
-                              <InputAdornment position="start">
-                                <TextFieldsIcon />
-                              </InputAdornment>
-                            ),
-                          }}
-                        />
+                    {!confirmedListTextFields[step.id]?.[key] && (
+                      <Box display="flex" justifyContent="space-between" gap={2}>
+                        <Button
+                          variant="contained"
+                          onClick={() => handleListTextFieldConfirm(step.id, key)}
+                          disabled={!field.label?.trim()}
+                        >
+                          Confirm
+                        </Button>
+                        <Button
+                          variant="contained"
+                          onClick={() => handleListTextFieldDiscard(step.id, key)}
+                        >
+                          Discard
+                        </Button>
                       </Box>
-                    ))}
-                  </>
-                )}
-              </Box>
-            ))}
+                    )}
+                  </Box>
+                ))}
+              </>
+            )}
           </Box>
         ))}
-
+      </Box>
     </Paper>
   );
 };
\ No newline at end of file