@erpsquad/common 1.8.40 → 1.8.42

package/dist/views/template-editor/components/EditorSidebar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorSidebar.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useCallback, useEffect } from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useDropzone } from 'react-dropzone';\r\nimport {\r\n  Box,\r\n  Divider,\r\n  ListItem,\r\n  ListItemIcon,\r\n  ListItemText,\r\n  Grid,\r\n  Accordion,\r\n  AccordionSummary,\r\n  AccordionDetails,\r\n  Typography,\r\n  CircularProgress,\r\n  Alert,\r\n} from '@mui/material';\r\nimport {\r\n  Heading,\r\n  Text as TextIcon,\r\n  Image as ImageIcon,\r\n  Table as TableIcon,\r\n  Blocks as SignatureIcon,\r\n  QrCode as QrCodeIcon,\r\n  Barcode as BarcodeIcon,\r\n} from 'lucide-react';\r\nimport { styled } from '@mui/material/styles';\r\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\r\nimport { getV1Drive, postV1Drive, setBaseUrl as setDriveUrl } from '../../../api-client/api.drive/api';\r\nimport SearchBar from '../../../components/search-bar/search-bar';\r\nimport { getToken, uploadFiles } from '../../../utils/common';\r\n\r\nsetDriveUrl(`${import.meta.env.VITE_BACKEND_BASE_URL}/document`);\r\n\r\nconst StyledListItem = styled(ListItem)(({ theme }) => ({\r\n  padding: theme.spacing(1.5),\r\n  cursor: 'grab',\r\n  borderRadius: theme.shape.borderRadius,\r\n  '&:hover': {\r\n    backgroundColor: theme.palette.grey[100],\r\n  },\r\n  '&.dragging': {\r\n    opacity: 0.5,\r\n  },\r\n}));\r\n\r\nconst DropzoneBox = styled(Box)(({ theme }) => ({\r\n  border: `2px dashed ${theme.palette.grey[400]}`,\r\n  borderRadius: theme.shape.borderRadius,\r\n  padding: theme.spacing(2),\r\n  textAlign: 'center',\r\n  backgroundColor: theme.palette.grey[50],\r\n  cursor: 'pointer',\r\n  '&:hover': {\r\n    backgroundColor: theme.palette.grey[100],\r\n  },\r\n}));\r\n\r\nconst SidebarItem = ({ id, icon, label, imageUrl }: { id: string; icon?: React.ReactElement; label: string; imageUrl?: string }) => {\r\n  // Extract the element type from the sidebar item id\r\n  const elementType = typeof id === 'string' ? id.replace('sidebar-', '') : id;\r\n  \r\n  const { attributes, listeners, setNodeRef, isDragging } = useDraggable({\r\n    id,\r\n    data: {\r\n      // Pass the correct type based on the id\r\n      type: imageUrl ? 'image' : elementType,\r\n      imageUrl,\r\n      label,\r\n    },\r\n  });\r\n  \r\n  return (\r\n    <StyledListItem\r\n      ref={setNodeRef}\r\n      {...listeners}\r\n      {...attributes}\r\n      className={isDragging ? 'dragging' : ''}\r\n      sx={{ border: '1px solid', borderColor: 'grey.200', p: 0.75 }}\r\n    >\r\n      {imageUrl ? (\r\n        <img\r\n          src={imageUrl}\r\n          alt={label}\r\n          style={{ width: '100%', height: 140, objectFit: 'cover', marginRight: 8 }}\r\n        />\r\n      ) : (\r\n        <>\r\n          <ListItemIcon sx={{ minWidth: 40 }}>{icon}</ListItemIcon>\r\n          <ListItemText primary={label} primaryTypographyProps={{ variant: 'body2' }} />\r\n        </>\r\n      )}\r\n    </StyledListItem>\r\n  );\r\n};\r\n\r\nconst EditorSidebar = () => {\r\n  const [expanded, setExpanded] = useState('text');\r\n  const [uploadedImages, setUploadedImages] = useState([]);\r\n  const [uploading, setUploading] = useState(false);\r\n  const [error, setError] = useState(null);\r\n\r\n  const handleChange = (panel) => (event, isExpanded) => {\r\n    setExpanded(isExpanded ? panel : false);\r\n  };\r\n\r\n  const onDrop = useCallback(async (acceptedFiles) => {\r\n    setUploading(true);\r\n    setError(null);\r\n    try {\r\n      for (const file of acceptedFiles) {\r\n        const uFiles = await uploadFiles([file], \"document\");\r\n        const token = getToken();\r\n        const payload = {\r\n          ...token,\r\n          \"x-timezone\": String(token[\"x-timezone\"] || \"\"),\r\n          \"title\": file?.name.split(\".\")[0],\r\n          \"path\": \"/\",\r\n          \"is_private\": true,\r\n          \"is_directory\": false,\r\n          \"file_size\": file.size,\r\n          \"is_child\": false,\r\n          \"file_extension\": file?.name.split(\".\")[1],\r\n          \"type\": \"image\",\r\n          \"mime_type\": file.type,\r\n          \"url\": `${import.meta.env.VITE_S3_BUCKET_URL}${uFiles[0]}`\r\n      }\r\n        // Replace with your actual API endpoint\r\n        await postV1Drive(payload);\r\n\r\n        setUploadedImages((prev) => [\r\n          ...prev,\r\n          {\r\n            id: `uploaded-image-${Date.now()}-${Math.random()}`,\r\n            url: `${import.meta.env.VITE_S3_BUCKET_URL}${uFiles[0]}`, // Assume API returns imageUrl\r\n            name: file.name,\r\n          },\r\n        ]);\r\n      }\r\n    } catch (err) {\r\n      setError('Failed to upload image. Please try again.');\r\n    } finally {\r\n      setUploading(false);\r\n    }\r\n  }, []);\r\n\r\n  const { getRootProps, getInputProps, isDragActive } = useDropzone({\r\n    onDrop,\r\n    accept: { 'image/*': ['.jpeg', '.png', '.jpg', '.gif'] },\r\n    multiple: true,\r\n  });\r\n\r\n  const sections = [\r\n    {\r\n      id: 'text',\r\n      icon: <TextIcon size={18} />,\r\n      label: 'Text',\r\n      content: (\r\n        <Box sx={{ display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: 1 }}>\r\n          <SidebarItem id=\"sidebar-heading\" icon={<Heading size={20} />} label=\"Heading 1\" />\r\n          <SidebarItem id=\"sidebar-heading-2\" icon={<Heading size={18} />} label=\"Heading 2\" />\r\n          <SidebarItem id=\"sidebar-heading-3\" icon={<Heading size={16} />} label=\"Heading 3\" />\r\n          <SidebarItem id=\"sidebar-heading-4\" icon={<Heading size={14} />} label=\"Heading 4\" />\r\n          <SidebarItem id=\"sidebar-text\" icon={<TextIcon size={20} />} label=\"Body\" />\r\n          <SidebarItem id=\"sidebar-text-block\" icon={<TextIcon size={20} />} label=\"Text Block\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'images',\r\n      icon: <ImageIcon size={18} />,\r\n      label: 'Images',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <Box sx={{ mt: 2 }}>\r\n            <DropzoneBox {...getRootProps()}>\r\n              <input {...getInputProps()} />\r\n              {isDragActive ? (\r\n                <Typography variant=\"body2\" color=\"text.secondary\">\r\n                  Drop the images here...\r\n                </Typography>\r\n              ) : (\r\n                <Typography variant=\"body2\" color=\"text.secondary\">\r\n                  Drag and drop images here, or click to select\r\n                </Typography>\r\n              )}\r\n              {uploading && (\r\n                <Box sx={{ mt: 1 }}>\r\n                  <CircularProgress size={20} />\r\n                </Box>\r\n              )}\r\n            </DropzoneBox>\r\n            {error && (\r\n              <Alert severity=\"error\" sx={{ mt: 2 }}>\r\n                {error}\r\n              </Alert>\r\n            )}\r\n            {uploadedImages.length > 0 && (\r\n              <Box sx={{ mt: 2 }}>\r\n                <Typography variant=\"body2\" sx={{ mb: 1, color: 'grey.500' }}>\r\n                  Uploaded Images\r\n                </Typography>\r\n                <Grid container spacing={1}>\r\n                  {uploadedImages.map((image) => (\r\n                    <Grid item xs={6} key={image.id}>\r\n                      <SidebarItem\r\n                        id={image.id}\r\n                        label={image.name}\r\n                        imageUrl={image.url}\r\n                      />\r\n                    </Grid>\r\n                  ))}\r\n                </Grid>\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'buttons',\r\n      icon: (\r\n        <Box\r\n          sx={{\r\n            width: 16,\r\n            height: 16,\r\n            bgcolor: 'grey.400',\r\n            borderRadius: 1,\r\n            color: 'white',\r\n            display: 'flex',\r\n            alignItems: 'center',\r\n            justifyContent: 'center',\r\n            fontSize: '8px',\r\n          }}\r\n        >\r\n          BTN\r\n        </Box>\r\n      ),\r\n      label: 'Buttons',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem\r\n            id=\"sidebar-buttons\"\r\n            icon={\r\n              <Box\r\n                sx={{\r\n                  width: 20,\r\n                  height: 20,\r\n                  bgcolor: 'success.main',\r\n                  borderRadius: 1,\r\n                  color: 'white',\r\n                  display: 'flex',\r\n                  alignItems: 'center',\r\n                  justifyContent: 'center',\r\n                  fontSize: '10px',\r\n                }}\r\n              >\r\n                BTN\r\n              </Box>\r\n            }\r\n            label=\"Buttons\"\r\n          />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'divider',\r\n      icon: <Divider sx={{ width: 18 }} />,\r\n      label: 'Divider',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-divider\" icon={<Divider sx={{ width: 20 }} />} label=\"Divider\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'table',\r\n      icon: <TableIcon size={18} />,\r\n      label: 'Table',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-table\" icon={<TableIcon size={20} />} label=\"Table\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'signature',\r\n      icon: <SignatureIcon size={18} />,\r\n      label: 'Signature',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-signature\" icon={<SignatureIcon size={20} />} label=\"Signature\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'qr-code',\r\n      icon: <QrCodeIcon size={18} />,\r\n      label: 'QR Code',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-qr-code\" icon={<QrCodeIcon size={20} />} label=\"QR Code\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'bar-code',\r\n      icon: <BarcodeIcon size={18} />,\r\n      label: 'Bar Code',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-bar-code\" icon={<BarcodeIcon size={20} />} label=\"Bar Code\" />\r\n        </Box>\r\n      ),\r\n    },\r\n  ];\r\n\r\n  const getDriveFiles = async () => {\r\n    try {\r\n      const token = getToken();\r\n      const response = await getV1Drive({\r\n        ...token,\r\n        \"x-timezone\": String(token[\"x-timezone\"] || \"\"),\r\n        skip: 0,\r\n        limit: 10,\r\n        filters: `(is_directory.eq=0)`\r\n      });\r\n      // Check if response is successful and has data\r\n      if ('data' in response && response.data && typeof response.data === 'object' && 'drive' in response.data) {\r\n        const files = (response.data as any).drive || [];\r\n        setUploadedImages(files);\r\n      }\r\n    } catch (error) {\r\n      console.log(error);\r\n    }\r\n  }\r\n\r\n  useEffect(() => {\r\n    getDriveFiles()\r\n  }, [])\r\n\r\n  return (\r\n    <Box\r\n      sx={{\r\n        bgcolor: 'background.paper',\r\n        borderRight: 1,\r\n        borderColor: 'grey.200',\r\n        width: 390,\r\n        display: 'flex',\r\n        flexDirection: 'column',\r\n        height: 'calc(100vh - 104px)',\r\n        boxShadow: '0 2px 8px rgba(0,0,0,0.05)',\r\n        fontFamily: 'Inter, system-ui, Avenir, Helvetica, Arial, sans-serif',\r\n      }}\r\n    >\r\n      <Box sx={{ p: 2, borderBottom: 1, borderColor: 'grey.200' }}>\r\n        <SearchBar \r\n          handleSearch={(key) => console.log('Search:', key)}\r\n          sx={{ backgroundColor: \"#fff !important\", border: \"1px solid grey\" }}\r\n        />\r\n      </Box>\r\n      <Box sx={{ flexGrow: 1, overflowY: 'auto', p: 1 }}>\r\n        {sections.map((section) => (\r\n          <Accordion\r\n            key={section.id}\r\n            expanded={expanded === section.id}\r\n            onChange={handleChange(section.id)}\r\n            sx={{\r\n              border: 'none',\r\n              boxShadow: 'none',\r\n              backgroundColor: 'transparent',\r\n              '&:before': { display: 'none' },\r\n              marginBottom: 1,\r\n            }}\r\n          >\r\n            <AccordionSummary\r\n              expandIcon={<ExpandMoreIcon sx={{ color: 'grey.600' }} />}\r\n              sx={{\r\n                borderRadius: '8px',\r\n                padding: '0 12px',\r\n                backgroundColor: expanded === section.id ? 'grey.200' : 'grey.50',\r\n                '&:hover': {\r\n                  backgroundColor: 'grey.50',\r\n                },\r\n                transition: 'background-color 0.2s ease',\r\n                minHeight: 42,\r\n                '& .MuiAccordionSummary-content': {\r\n                  alignItems: 'center',\r\n                  margin: '8px 0',\r\n                },\r\n                '&.Mui-expanded': {\r\n                  minHeight: 42,\r\n                },\r\n              }}\r\n            >\r\n              <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\r\n                {section.icon}\r\n                <Typography\r\n                  variant=\"body2\"\r\n                  sx={{ fontWeight: 500, color: 'text.primary' }}\r\n                >\r\n                  {section.label}\r\n                </Typography>\r\n              </Box>\r\n            </AccordionSummary>\r\n            <AccordionDetails sx={{ padding: '8px 16px' }}>\r\n              {section.content}\r\n            </AccordionDetails>\r\n          </Accordion>\r\n        ))}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default EditorSidebar;"],"names":["setDriveUrl","StyledListItem","styled","ListItem","theme","padding","spacing","cursor","borderRadius","shape","backgroundColor","palette","grey","opacity","DropzoneBox","Box","border","textAlign","SidebarItem","id","icon","label","imageUrl","elementType","replace","attributes","listeners","setNodeRef","isDragging","useDraggable","data","type","jsx","ref","className","sx","borderColor","p","children","src","alt","style","width","height","objectFit","marginRight","jsxs","Fragment","ListItemIcon","minWidth","ListItemText","primary","primaryTypographyProps","variant","expanded","setExpanded","useState","uploadedImages","setUploadedImages","uploading","setUploading","error","setError","onDrop","useCallback","async","acceptedFiles","file","uFiles","uploadFiles","token","getToken","payload","String","title","name","split","path","is_private","is_directory","file_size","size","is_child","file_extension","mime_type","url","postV1Drive","prev","Date","now","Math","random","err","getRootProps","getInputProps","isDragActive","useDropzone","accept","multiple","sections","TextIcon","content","display","gridTemplateColumns","gap","Heading","ImageIcon","mt","Typography","color","CircularProgress","Alert","severity","length","mb","Grid","container","map","image","item","xs","bgcolor","alignItems","justifyContent","fontSize","Divider","TableIcon","SignatureIcon","QrCodeIcon","BarcodeIcon","useEffect","response","getV1Drive","skip","limit","filters","files","drive","getDriveFiles","borderRight","flexDirection","boxShadow","fontFamily","borderBottom","SearchBar","handleSearch","key","flexGrow","overflowY","section","Accordion","onChange","panel","event","isExpanded","marginBottom","AccordionSummary","expandIcon","ExpandMoreIcon","transition","minHeight","margin","fontWeight","AccordionDetails"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/EditorSidebar.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useCallback, useEffect } from 'react';\r\nimport { useDraggable } from '@dnd-kit/core';\r\nimport { useDropzone } from 'react-dropzone';\r\nimport {\r\n  Box,\r\n  Divider,\r\n  ListItem,\r\n  ListItemIcon,\r\n  ListItemText,\r\n  Grid,\r\n  Accordion,\r\n  AccordionSummary,\r\n  AccordionDetails,\r\n  Typography,\r\n  CircularProgress,\r\n  Alert,\r\n} from '@mui/material';\r\nimport {\r\n  Heading,\r\n  Text as TextIcon,\r\n  Image as ImageIcon,\r\n  Table as TableIcon,\r\n  Blocks as SignatureIcon,\r\n  QrCode as QrCodeIcon,\r\n  Barcode as BarcodeIcon,\r\n} from 'lucide-react';\r\nimport { styled } from '@mui/material/styles';\r\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\r\nimport { getV1Drive, postV1Drive, setBaseUrl as setDriveUrl } from '../../../api-client/api.drive/api';\r\nimport SearchBar from '../../../components/search-bar/search-bar';\r\nimport { getToken, uploadFiles } from '../../../utils/common';\r\n\r\nsetDriveUrl(`${import.meta.env.VITE_BACKEND_BASE_URL}/document`);\r\n\r\nconst StyledListItem = styled(ListItem)(({ theme }) => ({\r\n  padding: theme.spacing(1.5),\r\n  cursor: 'grab',\r\n  borderRadius: theme.shape.borderRadius,\r\n  '&:hover': {\r\n    backgroundColor: theme.palette.grey[100],\r\n  },\r\n  '&.dragging': {\r\n    opacity: 0.5,\r\n  },\r\n}));\r\n\r\nconst DropzoneBox = styled(Box)(({ theme }) => ({\r\n  border: `2px dashed ${theme.palette.grey[400]}`,\r\n  borderRadius: theme.shape.borderRadius,\r\n  padding: theme.spacing(2),\r\n  textAlign: 'center',\r\n  backgroundColor: theme.palette.grey[50],\r\n  cursor: 'pointer',\r\n  '&:hover': {\r\n    backgroundColor: theme.palette.grey[100],\r\n  },\r\n}));\r\n\r\nconst SidebarItem = ({ id, icon, label, imageUrl }: { id: string; icon?: React.ReactElement; label: string; imageUrl?: string }) => {\r\n  // Extract the element type from the sidebar item id\r\n  const elementType = typeof id === 'string' ? id.replace('sidebar-', '') : id;\r\n  \r\n  const { attributes, listeners, setNodeRef, isDragging } = useDraggable({\r\n    id,\r\n    data: {\r\n      // Pass the correct type based on the id\r\n      type: imageUrl ? 'image' : elementType,\r\n      imageUrl,\r\n      label,\r\n    },\r\n  });\r\n  \r\n  return (\r\n    <StyledListItem\r\n      ref={setNodeRef}\r\n      {...listeners}\r\n      {...attributes}\r\n      className={isDragging ? 'dragging' : ''}\r\n      sx={{ border: '1px solid', borderColor: 'grey.200', p: 0.75 }}\r\n    >\r\n      {imageUrl ? (\r\n        <img\r\n          src={imageUrl}\r\n          alt={label}\r\n          style={{ width: '100%', height: 140, objectFit: 'cover', marginRight: 8 }}\r\n        />\r\n      ) : (\r\n        <>\r\n          <ListItemIcon sx={{ minWidth: 40 }}>{icon}</ListItemIcon>\r\n          <ListItemText primary={label} primaryTypographyProps={{ variant: 'body2' }} />\r\n        </>\r\n      )}\r\n    </StyledListItem>\r\n  );\r\n};\r\n\r\nconst EditorSidebar = () => {\r\n  const [expanded, setExpanded] = useState('text');\r\n  const [uploadedImages, setUploadedImages] = useState([]);\r\n  const [uploading, setUploading] = useState(false);\r\n  const [error, setError] = useState(null);\r\n\r\n  const handleChange = (panel) => (event, isExpanded) => {\r\n    setExpanded(isExpanded ? panel : false);\r\n  };\r\n\r\n  const onDrop = useCallback(async (acceptedFiles) => {\r\n    setUploading(true);\r\n    setError(null);\r\n    try {\r\n      for (const file of acceptedFiles) {\r\n        const uFiles = await uploadFiles([file], \"document\");\r\n        const token = getToken();\r\n        const payload = {\r\n          ...token,\r\n          \"x-timezone\": String(token[\"x-timezone\"] || \"\"),\r\n          \"title\": file?.name.split(\".\")[0],\r\n          \"path\": \"/\",\r\n          \"is_private\": true,\r\n          \"is_directory\": false,\r\n          \"file_size\": file.size,\r\n          \"is_child\": false,\r\n          \"file_extension\": file?.name.split(\".\")[1],\r\n          \"type\": \"image\",\r\n          \"mime_type\": file.type,\r\n          \"url\": `${import.meta.env.VITE_S3_BUCKET_URL}${uFiles[0]}`\r\n      }\r\n        // Replace with your actual API endpoint\r\n        await postV1Drive(payload);\r\n\r\n        setUploadedImages((prev) => [\r\n          ...prev,\r\n          {\r\n            id: `uploaded-image-${Date.now()}-${Math.random()}`,\r\n            url: `${import.meta.env.VITE_S3_BUCKET_URL}${uFiles[0]}`, // Assume API returns imageUrl\r\n            name: file.name,\r\n          },\r\n        ]);\r\n      }\r\n    } catch (err) {\r\n      setError('Failed to upload image. Please try again.');\r\n    } finally {\r\n      setUploading(false);\r\n    }\r\n  }, []);\r\n\r\n  const { getRootProps, getInputProps, isDragActive } = useDropzone({\r\n    onDrop,\r\n    accept: { 'image/*': ['.jpeg', '.png', '.jpg', '.gif'] },\r\n    multiple: true,\r\n  });\r\n\r\n  const sections = [\r\n    {\r\n      id: 'text',\r\n      icon: <TextIcon size={18} />,\r\n      label: 'Text',\r\n      content: (\r\n        <Box sx={{ display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: 1 }}>\r\n          <SidebarItem id=\"sidebar-heading\" icon={<Heading size={20} />} label=\"Heading 1\" />\r\n          <SidebarItem id=\"sidebar-heading-2\" icon={<Heading size={18} />} label=\"Heading 2\" />\r\n          <SidebarItem id=\"sidebar-heading-3\" icon={<Heading size={16} />} label=\"Heading 3\" />\r\n          <SidebarItem id=\"sidebar-heading-4\" icon={<Heading size={14} />} label=\"Heading 4\" />\r\n          <SidebarItem id=\"sidebar-text\" icon={<TextIcon size={20} />} label=\"Body\" />\r\n          <SidebarItem id=\"sidebar-text-block\" icon={<TextIcon size={20} />} label=\"Text Block\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'images',\r\n      icon: <ImageIcon size={18} />,\r\n      label: 'Images',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <Box sx={{ mt: 2 }}>\r\n            <DropzoneBox {...getRootProps()}>\r\n              <input {...getInputProps()} />\r\n              {isDragActive ? (\r\n                <Typography variant=\"body2\" color=\"text.secondary\">\r\n                  Drop the images here...\r\n                </Typography>\r\n              ) : (\r\n                <Typography variant=\"body2\" color=\"text.secondary\">\r\n                  Drag and drop images here, or click to select\r\n                </Typography>\r\n              )}\r\n              {uploading && (\r\n                <Box sx={{ mt: 1 }}>\r\n                  <CircularProgress size={20} />\r\n                </Box>\r\n              )}\r\n            </DropzoneBox>\r\n            {error && (\r\n              <Alert severity=\"error\" sx={{ mt: 2 }}>\r\n                {error}\r\n              </Alert>\r\n            )}\r\n            {uploadedImages.length > 0 && (\r\n              <Box sx={{ mt: 2 }}>\r\n                <Typography variant=\"body2\" sx={{ mb: 1, color: 'grey.500' }}>\r\n                  Uploaded Images\r\n                </Typography>\r\n                <Grid container spacing={1}>\r\n                  {uploadedImages.map((image) => (\r\n                    <Grid item xs={6} key={image.id}>\r\n                      <SidebarItem\r\n                        id={image.id}\r\n                        label={image.name}\r\n                        imageUrl={image.url}\r\n                      />\r\n                    </Grid>\r\n                  ))}\r\n                </Grid>\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'buttons',\r\n      icon: (\r\n        <Box\r\n          sx={{\r\n            width: 16,\r\n            height: 16,\r\n            bgcolor: 'grey.400',\r\n            borderRadius: 1,\r\n            color: 'white',\r\n            display: 'flex',\r\n            alignItems: 'center',\r\n            justifyContent: 'center',\r\n            fontSize: '8px',\r\n          }}\r\n        >\r\n          BTN\r\n        </Box>\r\n      ),\r\n      label: 'Buttons',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem\r\n            id=\"sidebar-buttons\"\r\n            icon={\r\n              <Box\r\n                sx={{\r\n                  width: 20,\r\n                  height: 20,\r\n                  bgcolor: 'success.main',\r\n                  borderRadius: 1,\r\n                  color: 'white',\r\n                  display: 'flex',\r\n                  alignItems: 'center',\r\n                  justifyContent: 'center',\r\n                  fontSize: '10px',\r\n                }}\r\n              >\r\n                BTN\r\n              </Box>\r\n            }\r\n            label=\"Buttons\"\r\n          />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'divider',\r\n      icon: <Divider sx={{ width: 18 }} />,\r\n      label: 'Divider',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-divider\" icon={<Divider sx={{ width: 20 }} />} label=\"Divider\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'table',\r\n      icon: <TableIcon size={18} />,\r\n      label: 'Table',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-table\" icon={<TableIcon size={20} />} label=\"Table\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'signature',\r\n      icon: <SignatureIcon size={18} />,\r\n      label: 'Signature',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-signature\" icon={<SignatureIcon size={20} />} label=\"Signature\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'qr-code',\r\n      icon: <QrCodeIcon size={18} />,\r\n      label: 'QR Code',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-qr-code\" icon={<QrCodeIcon size={20} />} label=\"QR Code\" />\r\n        </Box>\r\n      ),\r\n    },\r\n    {\r\n      id: 'bar-code',\r\n      icon: <BarcodeIcon size={18} />,\r\n      label: 'Bar Code',\r\n      content: (\r\n        <Box sx={{ mt: 2 }}>\r\n          <SidebarItem id=\"sidebar-bar-code\" icon={<BarcodeIcon size={20} />} label=\"Bar Code\" />\r\n        </Box>\r\n      ),\r\n    },\r\n  ];\r\n\r\n  const getDriveFiles = async () => {\r\n    try {\r\n      const token = getToken();\r\n      const response = await getV1Drive({\r\n        ...token,\r\n        \"x-timezone\": String(token[\"x-timezone\"] || \"\"),\r\n        skip: 0,\r\n        limit: 10,\r\n        filters: `(is_directory.eq=0)`\r\n      });\r\n      // Check if response is successful and has data\r\n      if ('data' in response && response.data && typeof response.data === 'object' && 'drive' in response.data) {\r\n        const files = (response.data as any).drive || [];\r\n        setUploadedImages(files);\r\n      }\r\n    } catch (error) {\r\n      console.log(error);\r\n    }\r\n  }\r\n\r\n  useEffect(() => {\r\n    getDriveFiles()\r\n  }, [])\r\n\r\n  return (\r\n    <Box\r\n      sx={{\r\n        bgcolor: 'background.paper',\r\n        borderRight: 1,\r\n        borderColor: 'grey.200',\r\n        width: 390,\r\n        display: 'flex',\r\n        flexDirection: 'column',\r\n        height: 'calc(100vh - 104px)',\r\n        boxShadow: '0 2px 8px rgba(0,0,0,0.05)',\r\n        fontFamily: 'Inter, system-ui, Avenir, Helvetica, Arial, sans-serif',\r\n      }}\r\n    >\r\n      <Box sx={{ p: 2, borderBottom: 1, borderColor: 'grey.200' }}>\r\n        <SearchBar \r\n          handleSearch={(key) => console.log('Search:', key)}\r\n          sx={{ backgroundColor: \"#fff !important\", border: \"1px solid grey\" }}\r\n        />\r\n      </Box>\r\n      <Box sx={{ flexGrow: 1, overflowY: 'auto', p: 1 }}>\r\n        {sections.map((section) => (\r\n          <Accordion\r\n            key={section.id}\r\n            expanded={expanded === section.id}\r\n            onChange={handleChange(section.id)}\r\n            sx={{\r\n              border: 'none',\r\n              boxShadow: 'none',\r\n              backgroundColor: 'transparent',\r\n              '&:before': { display: 'none' },\r\n              marginBottom: 1,\r\n            }}\r\n          >\r\n            <AccordionSummary\r\n              expandIcon={<ExpandMoreIcon sx={{ color: 'grey.600' }} />}\r\n              sx={{\r\n                borderRadius: '8px',\r\n                padding: '0 12px',\r\n                backgroundColor: expanded === section.id ? 'grey.200' : 'grey.50',\r\n                '&:hover': {\r\n                  backgroundColor: 'grey.50',\r\n                },\r\n                transition: 'background-color 0.2s ease',\r\n                minHeight: 42,\r\n                '& .MuiAccordionSummary-content': {\r\n                  alignItems: 'center',\r\n                  margin: '8px 0',\r\n                },\r\n                '&.Mui-expanded': {\r\n                  minHeight: 42,\r\n                },\r\n              }}\r\n            >\r\n              <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\r\n                {section.icon}\r\n                <Typography\r\n                  variant=\"body2\"\r\n                  sx={{ fontWeight: 500, color: 'text.primary' }}\r\n                >\r\n                  {section.label}\r\n                </Typography>\r\n              </Box>\r\n            </AccordionSummary>\r\n            <AccordionDetails sx={{ padding: '8px 16px' }}>\r\n              {section.content}\r\n            </AccordionDetails>\r\n          </Accordion>\r\n        ))}\r\n      </Box>\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default EditorSidebar;"],"names":["setDriveUrl","StyledListItem","styled","ListItem","theme","padding","spacing","cursor","borderRadius","shape","backgroundColor","palette","grey","opacity","DropzoneBox","Box","border","textAlign","SidebarItem","id","icon","label","imageUrl","elementType","replace","attributes","listeners","setNodeRef","isDragging","useDraggable","data","type","jsx","ref","className","sx","borderColor","p","children","src","alt","style","width","height","objectFit","marginRight","jsxs","Fragment","ListItemIcon","minWidth","ListItemText","primary","primaryTypographyProps","variant","expanded","setExpanded","useState","uploadedImages","setUploadedImages","uploading","setUploading","error","setError","onDrop","useCallback","async","acceptedFiles","file","uFiles","uploadFiles","token","getToken","payload","String","title","name","split","path","is_private","is_directory","file_size","size","is_child","file_extension","mime_type","url","postV1Drive","prev","Date","now","Math","random","err","getRootProps","getInputProps","isDragActive","useDropzone","accept","multiple","sections","TextIcon","content","display","gridTemplateColumns","gap","Heading","ImageIcon","mt","Typography","color","CircularProgress","Alert","severity","length","mb","Grid","container","map","image","item","xs","bgcolor","alignItems","justifyContent","fontSize","Divider","TableIcon","SignatureIcon","QrCodeIcon","BarcodeIcon","useEffect","response","getV1Drive","skip","limit","filters","files","drive","getDriveFiles","borderRight","flexDirection","boxShadow","fontFamily","borderBottom","SearchBar","handleSearch","key","flexGrow","overflowY","section","Accordion","onChange","panel","event","isExpanded","marginBottom","AccordionSummary","expandIcon","ExpandMoreIcon","transition","minHeight","margin","fontWeight","AccordionDetails"],"mappings":"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"}

package/dist/views/template-editor/components/SectionFlowEditor/index.esm.js

@@ -4,7 +4,6 @@ import EditorHeader from "../EditorHeader/index.esm.js";
 import EditorCanvas from "../EditorCanvas/index.esm.js";
 import { DndContext, pointerWithin } from "../../../../node_modules/@dnd-kit/core/dist/core.esm/index.esm.js";
 import { enqueueSnackbar } from "../../../../node_modules/notistack/notistack.esm/index.esm.js";
-import { Box } from "@mui/material";
 import { useParams, useLocation } from "react-router-dom";
 import { getToken, getErrorMessage } from "../../../../utils/common/index.esm.js";
 import { getV1SubjectsId, getV1FormBuilderRelationalSchemaFieldsName, getV1TemplatesId, getV1TemplateHeaderFooterCompanyIdHeaderFooter, patchV1TemplateHeaderFooterId, postV1TemplateHeaderFooter } from "../../../../api-client/api.system-feature/api/index.esm.js";
@@ -13,6 +12,7 @@ import { initialStyles } from "../../utils/constant/index.esm.js";
 import _ from "lodash";
 import formatText from "../../../../utils/format-text/index.esm.js";
 import TemplateNameModal from "../../template-name-modal/template-name-modal/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
 import v4 from "../../../../node_modules/uuid/dist/esm-browser/v4/index.esm.js";
 const SectionFlowEditor = ({ modulePath, module, type }) => {
   const { id, template_id } = useParams();

package/dist/views/template-editor/components/SectionFlowEditor/index.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../EditorHeader/index.js"),a=require("../EditorCanvas/index.js"),o=require("../../../../node_modules/@dnd-kit/core/dist/core.esm/index.js"),n=require("../../../../node_modules/notistack/notistack.esm/index.js"),d=require("@mui/material"),r=require("react-router-dom"),s=require("../../../../utils/common/index.js"),l=require("../../../../api-client/api.system-feature/api/index.js"),c=require("../../utils/common/index.js"),u=require("../../utils/constant/index.js"),p=require("lodash"),f=require("../../../../utils/format-text/index.js"),h=require("../../template-name-modal/template-name-modal/index.js"),y=require("../../../../node_modules/uuid/dist/esm-browser/v4/index.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=/* @__PURE__ */m(p);exports.default=({modulePath:p,module:m,type:g})=>{const{id:b,template_id:S}=r.useParams(),{state:x}=r.useLocation(),[_,k]=t.useState([]),[$,I]=t.useState([]),[j,q]=t.useState([]),[W,w]=t.useState(null),[G,H]=t.useState(null),[P,F]=t.useState(null),[z,C]=t.useState(!1),[E,T]=t.useState([]),[D,K]=t.useState("main"),[B,V]=t.useState(!1),[L,O]=t.useState(null),[M,N]=t.useState(""),R=c.templateRoutes(p,g),[A,U]=t.useState([]),[J,Q]=t.useState(null),X=e=>"header"===e&&B?$:"footer"===e&&B?j:_,Y=e=>"header"===e&&B?I:"footer"===e&&B?q:k;t.useEffect(()=>{var e;document.body.style.overflow="hidden";const t=null==(e=document.getElementsByTagName("main"))?void 0:e[0];return t&&(t.style.marginTop="4.125rem"),()=>{document.body.removeAttribute("style")}},[]),t.useEffect(()=>{(async()=>{var e,t,i,a;if(b){const i=s.getToken(),a=await l.getV1SubjectsId({...i,"x-timezone":(null==(e=i["x-timezone"])?void 0:e.toString())||"",id:b});if("data"in a&&a.data&&"object"==typeof a.data&&"resource"in a.data){const e=a.data.resource,i=s.getToken(),o=await l.getV1FormBuilderRelationalSchemaFieldsName({...i,"x-timezone":(null==(t=i["x-timezone"])?void 0:t.toString())||"",name:e}),n="data"in o&&o.data&&"object"==typeof o.data&&"fields"in o.data&&o.data.fields||[],d="data"in o&&o.data&&"object"==typeof o.data&&"relational_fields"in o.data&&o.data.relational_fields||[],r=n.map(e=>({...e,key:e.key.replace("__replaceKey","")})).filter(e=>{var t;return!e.is_inner_join&&"id"!==e.alias&&!(null==(t=null==e?void 0:e.alias)?void 0:t.includes("_id"))}),c=[],u=[];d.forEach(e=>{if(!e)return;const t=(e.fields||[]).map(t=>{const i={...t,key:t.key.replace("__replaceKey",""),alias:(null==t?void 0:t.templateKey)?null==t?void 0:t.templateKey:t.alias};return"object"===e.type&&e.dataKey&&(i.key=`${e.dataKey}.${i.key}`),i}).filter(e=>!e.is_inner_join&&"id"!==e.alias&&!e.alias.includes("_id")),i=v.default.differenceWith(t,t,(e,t)=>e.key===(null==t?void 0:t.joinKey)).map(t=>({label:f.default(t.alias.replace(/_data$/,"").replace(/_/g," ")),value:"object"===e.type&&e.dataKey?`${e.dataKey}.${t.alias.replace(/ /g,"_").toLowerCase()}`:t.alias.replace(/ /g,"_").toLowerCase()}));"object"===e.type?u.push(...i):c.push({...e,fields:i})});const p=[...r.map(e=>{const t=(null==e?void 0:e.alias)||(null==e?void 0:e.key),i=f.default(t.replace(/_data$/,"").replace(/_/g," "));return{label:i,value:i.replace(/ /g,"_").toLowerCase()}}),...u],h=v.default.uniqBy(p,"value");T(h),U(c)}}if(S){const e=s.getToken(),t=await l.getV1TemplatesId({...e,"x-timezone":(null==(i=e["x-timezone"])?void 0:i.toString())||"",id:S}),a=("data"in t&&t.data&&"object"==typeof t.data&&"sections"in t.data&&t.data.sections||[]).map(e=>({...e,id:e.id||`section-${y.default()}`}));Q("data"in t&&t.data?t.data:null),k(a)}if(null==x?void 0:x.company_id){const e=s.getToken(),t=await l.getV1TemplateHeaderFooterCompanyIdHeaderFooter({...e,"x-timezone":(null==(a=e["x-timezone"])?void 0:a.toString())||"",company_id:x.company_id}),i="data"in t&&t.data&&"object"==typeof t.data?t.data:null;N((null==i?void 0:i._id)||"");const o=(null==i?void 0:i.header_sections)||[],n=(null==i?void 0:i.footer_sections)||[],d=o.map(e=>({...e,id:e.id||`header-section-${y.default()}`})),r=n.map(e=>({...e,id:e.id||`footer-section-${y.default()}`}));I(d),q(r)}})()},[S,b,null==x?void 0:x.company_id]);const Z=(e,t={})=>{let i="";const a=u.initialStyles[e]||{},o=c.generateInlineStyles(a),n="header"===D&&B?"header-":"footer"===D&&B?"footer-":"";switch(e){case"heading":i=`<h1 style="${o}">Heading 1</h1>`;break;case"heading-2":i=`<h2 style="${o}">Heading 2</h2>`;break;case"heading-3":i=`<h3 style="${o}">Heading 3</h3>`;break;case"heading-4":i=`<h4 style="${o}">Heading 4</h4>`;break;case"text":i=`<p style="${o}">Hello, enter your text here...</p>`;break;case"image":i=`<img src="${t.src}" alt="${t.alt}" style="${o};" />`;break;case"buttons":t.text=(null==t?void 0:t.text)||"Button text",i=`<button style="${o}">${t.text}</button>`;break;case"divider":i=`<hr style="${o}" />`;break;case"table":const e=a,{border:n,borderStyle:d,borderColor:r,...s}=e,l=c.generateInlineStyles(e.is_bordered?e:s),u=c.generateInlineStyles(e.tHead),p=c.generateInlineStyles(e.tBody),f=c.generateInlineStyles({...e.thCells,border:n,borderStyle:d,borderColor:r}),h=c.generateInlineStyles({...e.tbCells,border:n,borderStyle:d,borderColor:r});i=`\n          <table style="${l}">\n            <thead style="${u}">\n              <tr style="background-color: #f5f5f5;">\n                <th style="${f}"></th>\n                <th style="${f}"></th>\n                <th style="${f}"></th>\n              </tr>\n            </thead>\n            <tbody style="${p}">\n              <tr>\n                <td style="${h}"></td>\n                <td style="${h}"></td>\n                <td style="${h}"></td>\n              </tr>\n            </tbody>\n          </table>\n        `;break;case"signature":i=`<div style="${o}">Signature: <input type='text' style="border:0; border-bottom:1px solid black" class='signature-input'/></div>`;break;case"qr-code":t.placeholder=(null==t?void 0:t.placeholder)||"{{qr_data}}",i=`<div style="background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;">${t.placeholder}</div>`;break;case"bar-code":t.placeholder=(null==t?void 0:t.placeholder)||"{{barcode_data}}",i=`<div style="background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;">${t.placeholder}</div>`;break;default:i='<p style="font-size: 16px; color: #333333; line-height: 1.5;">New section</p>'}return c.extractStyles(i),{id:`${n}section-${y.default()}`,content:i,type:e,attributes:{...t||{},styles:a},is_edited_from_source:!1}},ee=async()=>{if(0===_.length&&0===$.length&&0===j.length)return void n.enqueueSnackbar("Please add at least one section");const e=c.generateEmailPreview(_,$,j,!0);try{const t={...s.getToken(),...S?{id:S}:{subject_id:b,is_default:!1,company_id:x.company_id},sections:_,contents:e};O(t)}catch(t){const e=s.getErrorMessage(null==t?void 0:t.message);n.enqueueSnackbar(e,{variant:"error"})}};/* @__PURE__ */
-return e.jsxs(d.Box,{sx:{display:"flex",flexDirection:"column",height:"100vh"},children:[
-/* @__PURE__ */e.jsx(i.default,{onPreview:()=>C(!z),onSave:ee,preview:z,sections:_,isEditingHeaderFooter:B,setIsEditingHeaderFooter:()=>{V(!B),B&&K("main")},onSaveHeaderFooter:async()=>{var e,t;if(0===_.length&&0===$.length&&0===j.length)return void n.enqueueSnackbar("Please add at least one section",{variant:"error"});if(!(null==x?void 0:x.company_id))return void n.enqueueSnackbar("Company has not been selected",{variant:"error"});const i=`${c.generateHeaderFooterPreview($,"header")}${c.generateHeaderFooterPreview(j,"footer")}`,a=e=>({id:e.id,content:e.content,type:e.type,isSplitPair:e.isSplitPair,splitGroupId:e.splitGroupId,splitWidth:void 0!==e.splitWidth?String(e.splitWidth):void 0}),o=$.map(a),d=j.map(a);try{if(M){const t=s.getToken();200===(await l.patchV1TemplateHeaderFooterId({...t,"x-timezone":(null==(e=t["x-timezone"])?void 0:e.toString())||"",id:M,header_sections:o,footer_sections:d,contents:i})).status_code&&(n.enqueueSnackbar("Header/Footer saved successfully",{variant:"success"}),V(!1))}else{const e=s.getToken();200===(await l.postV1TemplateHeaderFooter({...e,"x-timezone":(null==(t=e["x-timezone"])?void 0:t.toString())||"",header_sections:o,footer_sections:d,contents:i,company_id:x.company_id})).status_code&&(n.enqueueSnackbar("Header/Footer saved successfully",{variant:"success"}),V(!1))}}catch(r){const e=s.getErrorMessage(null==r?void 0:r.message);n.enqueueSnackbar(e,{variant:"error"})}},modulePath:p,type:g,mode:S?"edit":"add",templateData:J}),
-/* @__PURE__ */e.jsx(d.Box,{sx:{display:"flex",flex:1,overflow:"hidden"},children:/* @__PURE__ */e.jsx(o.DndContext,{onDragStart:e=>{const{active:t}=e;w(t.id)},onDragOver:e=>{const{over:t}=e;t?("header-canvas"===t.id&&B?K("header"):"footer-canvas"===t.id&&B?K("footer"):"main-canvas"===t.id&&K("main"),"header-canvas"!==t.id&&"main-canvas"!==t.id&&"footer-canvas"!==t.id&&F(t.id)):F(null)},onDragEnd:e=>{var t;const{active:i,over:a}=e;if(w(null),F(null),!a)return;let o=_,d=k;if(("header-canvas"===a.id||(null==P?void 0:P.startsWith("header-")))&&B?(o=$,d=I,K("header")):("footer-canvas"===a.id||(null==P?void 0:P.startsWith("footer-")))&&B?(o=j,d=q,K("footer")):K("main"),"image"===(null==(t=i.data.current)?void 0:t.type)){const e=i.data.current.imageUrl,t=Z("image",{src:e,alt:"Image"}),r=o.findIndex(e=>e.id===a.id),s=[...o];return"header-canvas"===a.id||"main-canvas"===a.id||"footer-canvas"===a.id||-1===r?d([...o,t]):(s.splice(r,0,t),d(s)),void n.enqueueSnackbar("Added uploaded image section")}if("string"==typeof i.id&&i.id.startsWith("sidebar-")){const e=i.id.replace("sidebar-",""),t=Z(e),n=o.findIndex(e=>e.id===a.id);if(-1!==n&&"header-canvas"!==a.id&&"main-canvas"!==a.id&&"footer-canvas"!==a.id){const i=o[n];if(!i.content||i.content.includes("Click to add")||i.content.includes("enter your text")){const a=[...o];a[n]={...i,type:e,content:t.content},d(a)}else{const e=[...o];e.splice(n,0,t),d(e)}}else d([...o,t]);return}if(i.id!==a.id&&"string"==typeof i.id&&"string"==typeof a.id){let e=[],t=null;i.id.startsWith("header-")&&B?(e=$,t=I):i.id.startsWith("footer-")&&B?(e=j,t=q):(e=_,t=k);const n=i.id.replace(/^(header-|footer-)/,""),r=e.findIndex(e=>e.id===n||e.id===i.id);let s=o.findIndex(e=>e.id===String(a.id).replace(/^(header-|footer-)/,""));if("header-canvas"!==a.id&&"main-canvas"!==a.id&&"footer-canvas"!==a.id||(s=o.length),-1!==r&&-1!==s)if(e===o){const i=[...e],[a]=i.splice(r,1);if(a.isSplitPair&&a.splitGroupId){const o=a.splitGroupId,n=[a,...e.filter(e=>e.splitGroupId===o&&e.id!==a.id)],d=i.filter(e=>e.splitGroupId!==o);d.splice(s,0,...n),t(d)}else i.splice(s,0,a),t(i)}else{const i=e[r],n=[...e];n.splice(r,1),t(n);const l=[...o],c={...i};("header-canvas"===a.id||a.id.startsWith("header-"))&&B?c.id.startsWith("header-")||(c.id=`header-${c.id}`):("footer-canvas"===a.id||a.id.startsWith("footer-"))&&B?c.id.startsWith("footer-")||(c.id=`footer-${c.id}`):c.id=c.id.replace(/^(header-|footer-)/,""),l.splice(s,0,c),d(l)}}},collisionDetection:o.pointerWithin,children:/* @__PURE__ */e.jsx(a.default,{sections:_,headerSections:$,footerSections:j,activeId:W,overSection:P,selectedSection:G,onSelectSection:H,onUpdateSection:(e,t,i)=>{const a=X(i),o=Y(i),n=e.replace(/^(header-|footer-)/,"");o(a.map(i=>i.id===n||i.id===e?{...i,...t}:i))},onSplitSection:(e,t,i,a)=>{const o=X(a),n=Y(a),d=e.replace(/^(header-|footer-)/,""),r=o.findIndex(t=>t.id===d||t.id===e);if(-1===r)return;const s=o[r],l=[...o],c="header"===a?"header-":"footer"===a?"footer-":"";if(s.isSplitPair&&s.splitGroupId){const e=s.splitGroupId,a=100/(l.filter(t=>t.splitGroupId===e).length+1);l[r]={...s,content:t,splitWidth:a};const o={id:`${c}section-${y.default()}`,content:i,type:s.type,isSplitPair:!0,splitGroupId:e,splitWidth:a,attributes:s.attributes,is_edited_from_source:!1};l.splice(r+1,0,o);for(let t=0;t<l.length;t++)l[t].splitGroupId===e&&(l[t].splitWidth=a)}else{const e=y.default(),a=50;l[r]={...s,content:t,isSplitPair:!0,splitGroupId:e,splitWidth:a};const o={id:`${c}section-${y.default()}`,content:i,type:s.type,isSplitPair:!0,splitGroupId:e,splitWidth:a,attributes:s.attributes,is_edited_from_source:!1};l.splice(r+1,0,o)}n(l)},onDeleteSection:(e,t)=>{const i=X(t),a=Y(t),o=e.replace(/^(header-|footer-)/,""),n=i.find(t=>t.id===o||t.id===e);if(n){if(n.isSplitPair&&n.splitGroupId){const t=i.filter(e=>e.splitGroupId===n.splitGroupId);if(t.length<=2){const n=t.find(t=>t.id!==o&&t.id!==e);n&&(n.isSplitPair=!1,n.splitGroupId=void 0,n.splitWidth=void 0),a(i.filter(t=>t.id!==o&&t.id!==e))}else{const d=100/t.filter(t=>t.id!==o&&t.id!==e).length;a(i.filter(t=>t.id!==o&&t.id!==e).map(e=>e.splitGroupId===n.splitGroupId?{...e,splitWidth:d}:e))}}else a(i.filter(t=>t.id!==o&&t.id!==e));G===e&&H(null)}},preview:z,handleSave:ee,placeholders:E,isEditingHeaderFooter:B,relation_table:A})})}),null!==L&&/* @__PURE__ */e.jsx(h.default,{isOpen:null!==L,setIsOpen:()=>O(null),payload:L,templateRoutes:R,mode:S?"edit":"add",templateData:J})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../EditorHeader/index.js"),a=require("../EditorCanvas/index.js"),o=require("../../../../node_modules/@dnd-kit/core/dist/core.esm/index.js"),n=require("../../../../node_modules/notistack/notistack.esm/index.js"),d=require("react-router-dom"),r=require("../../../../utils/common/index.js"),s=require("../../../../api-client/api.system-feature/api/index.js"),l=require("../../utils/common/index.js"),c=require("../../utils/constant/index.js"),u=require("lodash"),p=require("../../../../utils/format-text/index.js"),f=require("../../template-name-modal/template-name-modal/index.js"),h=require("../../../../node_modules/@mui/material/Box/Box/index.js"),m=require("../../../../node_modules/uuid/dist/esm-browser/v4/index.js");function y(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=/* @__PURE__ */y(u);exports.default=({modulePath:u,module:y,type:g})=>{const{id:b,template_id:S}=d.useParams(),{state:x}=d.useLocation(),[_,k]=t.useState([]),[$,I]=t.useState([]),[j,q]=t.useState([]),[W,w]=t.useState(null),[G,H]=t.useState(null),[P,F]=t.useState(null),[z,C]=t.useState(!1),[E,T]=t.useState([]),[D,K]=t.useState("main"),[B,V]=t.useState(!1),[L,O]=t.useState(null),[M,N]=t.useState(""),R=l.templateRoutes(u,g),[A,U]=t.useState([]),[J,Q]=t.useState(null),X=e=>"header"===e&&B?$:"footer"===e&&B?j:_,Y=e=>"header"===e&&B?I:"footer"===e&&B?q:k;t.useEffect(()=>{var e;document.body.style.overflow="hidden";const t=null==(e=document.getElementsByTagName("main"))?void 0:e[0];return t&&(t.style.marginTop="4.125rem"),()=>{document.body.removeAttribute("style")}},[]),t.useEffect(()=>{(async()=>{var e,t,i,a;if(b){const i=r.getToken(),a=await s.getV1SubjectsId({...i,"x-timezone":(null==(e=i["x-timezone"])?void 0:e.toString())||"",id:b});if("data"in a&&a.data&&"object"==typeof a.data&&"resource"in a.data){const e=a.data.resource,i=r.getToken(),o=await s.getV1FormBuilderRelationalSchemaFieldsName({...i,"x-timezone":(null==(t=i["x-timezone"])?void 0:t.toString())||"",name:e}),n="data"in o&&o.data&&"object"==typeof o.data&&"fields"in o.data&&o.data.fields||[],d="data"in o&&o.data&&"object"==typeof o.data&&"relational_fields"in o.data&&o.data.relational_fields||[],l=n.map(e=>({...e,key:e.key.replace("__replaceKey","")})).filter(e=>{var t;return!e.is_inner_join&&"id"!==e.alias&&!(null==(t=null==e?void 0:e.alias)?void 0:t.includes("_id"))}),c=[],u=[];d.forEach(e=>{if(!e)return;const t=(e.fields||[]).map(t=>{const i={...t,key:t.key.replace("__replaceKey",""),alias:(null==t?void 0:t.templateKey)?null==t?void 0:t.templateKey:t.alias};return"object"===e.type&&e.dataKey&&(i.key=`${e.dataKey}.${i.key}`),i}).filter(e=>!e.is_inner_join&&"id"!==e.alias&&!e.alias.includes("_id")),i=v.default.differenceWith(t,t,(e,t)=>e.key===(null==t?void 0:t.joinKey)).map(t=>({label:p.default(t.alias.replace(/_data$/,"").replace(/_/g," ")),value:"object"===e.type&&e.dataKey?`${e.dataKey}.${t.alias.replace(/ /g,"_").toLowerCase()}`:t.alias.replace(/ /g,"_").toLowerCase()}));"object"===e.type?u.push(...i):c.push({...e,fields:i})});const f=[...l.map(e=>{const t=(null==e?void 0:e.alias)||(null==e?void 0:e.key),i=p.default(t.replace(/_data$/,"").replace(/_/g," "));return{label:i,value:i.replace(/ /g,"_").toLowerCase()}}),...u],h=v.default.uniqBy(f,"value");T(h),U(c)}}if(S){const e=r.getToken(),t=await s.getV1TemplatesId({...e,"x-timezone":(null==(i=e["x-timezone"])?void 0:i.toString())||"",id:S}),a=("data"in t&&t.data&&"object"==typeof t.data&&"sections"in t.data&&t.data.sections||[]).map(e=>({...e,id:e.id||`section-${m.default()}`}));Q("data"in t&&t.data?t.data:null),k(a)}if(null==x?void 0:x.company_id){const e=r.getToken(),t=await s.getV1TemplateHeaderFooterCompanyIdHeaderFooter({...e,"x-timezone":(null==(a=e["x-timezone"])?void 0:a.toString())||"",company_id:x.company_id}),i="data"in t&&t.data&&"object"==typeof t.data?t.data:null;N((null==i?void 0:i._id)||"");const o=(null==i?void 0:i.header_sections)||[],n=(null==i?void 0:i.footer_sections)||[],d=o.map(e=>({...e,id:e.id||`header-section-${m.default()}`})),l=n.map(e=>({...e,id:e.id||`footer-section-${m.default()}`}));I(d),q(l)}})()},[S,b,null==x?void 0:x.company_id]);const Z=(e,t={})=>{let i="";const a=c.initialStyles[e]||{},o=l.generateInlineStyles(a),n="header"===D&&B?"header-":"footer"===D&&B?"footer-":"";switch(e){case"heading":i=`<h1 style="${o}">Heading 1</h1>`;break;case"heading-2":i=`<h2 style="${o}">Heading 2</h2>`;break;case"heading-3":i=`<h3 style="${o}">Heading 3</h3>`;break;case"heading-4":i=`<h4 style="${o}">Heading 4</h4>`;break;case"text":i=`<p style="${o}">Hello, enter your text here...</p>`;break;case"image":i=`<img src="${t.src}" alt="${t.alt}" style="${o};" />`;break;case"buttons":t.text=(null==t?void 0:t.text)||"Button text",i=`<button style="${o}">${t.text}</button>`;break;case"divider":i=`<hr style="${o}" />`;break;case"table":const e=a,{border:n,borderStyle:d,borderColor:r,...s}=e,c=l.generateInlineStyles(e.is_bordered?e:s),u=l.generateInlineStyles(e.tHead),p=l.generateInlineStyles(e.tBody),f=l.generateInlineStyles({...e.thCells,border:n,borderStyle:d,borderColor:r}),h=l.generateInlineStyles({...e.tbCells,border:n,borderStyle:d,borderColor:r});i=`\n          <table style="${c}">\n            <thead style="${u}">\n              <tr style="background-color: #f5f5f5;">\n                <th style="${f}"></th>\n                <th style="${f}"></th>\n                <th style="${f}"></th>\n              </tr>\n            </thead>\n            <tbody style="${p}">\n              <tr>\n                <td style="${h}"></td>\n                <td style="${h}"></td>\n                <td style="${h}"></td>\n              </tr>\n            </tbody>\n          </table>\n        `;break;case"signature":i=`<div style="${o}">Signature: <input type='text' style="border:0; border-bottom:1px solid black" class='signature-input'/></div>`;break;case"qr-code":t.placeholder=(null==t?void 0:t.placeholder)||"{{qr_data}}",i=`<div style="background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;">${t.placeholder}</div>`;break;case"bar-code":t.placeholder=(null==t?void 0:t.placeholder)||"{{barcode_data}}",i=`<div style="background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;">${t.placeholder}</div>`;break;default:i='<p style="font-size: 16px; color: #333333; line-height: 1.5;">New section</p>'}return l.extractStyles(i),{id:`${n}section-${m.default()}`,content:i,type:e,attributes:{...t||{},styles:a},is_edited_from_source:!1}},ee=async()=>{if(0===_.length&&0===$.length&&0===j.length)return void n.enqueueSnackbar("Please add at least one section");const e=l.generateEmailPreview(_,$,j,!0);try{const t={...r.getToken(),...S?{id:S}:{subject_id:b,is_default:!1,company_id:x.company_id},sections:_,contents:e};O(t)}catch(t){const e=r.getErrorMessage(null==t?void 0:t.message);n.enqueueSnackbar(e,{variant:"error"})}};/* @__PURE__ */
+return e.jsxs(h.default,{sx:{display:"flex",flexDirection:"column",height:"100vh"},children:[
+/* @__PURE__ */e.jsx(i.default,{onPreview:()=>C(!z),onSave:ee,preview:z,sections:_,isEditingHeaderFooter:B,setIsEditingHeaderFooter:()=>{V(!B),B&&K("main")},onSaveHeaderFooter:async()=>{var e,t;if(0===_.length&&0===$.length&&0===j.length)return void n.enqueueSnackbar("Please add at least one section",{variant:"error"});if(!(null==x?void 0:x.company_id))return void n.enqueueSnackbar("Company has not been selected",{variant:"error"});const i=`${l.generateHeaderFooterPreview($,"header")}${l.generateHeaderFooterPreview(j,"footer")}`,a=e=>({id:e.id,content:e.content,type:e.type,isSplitPair:e.isSplitPair,splitGroupId:e.splitGroupId,splitWidth:void 0!==e.splitWidth?String(e.splitWidth):void 0}),o=$.map(a),d=j.map(a);try{if(M){const t=r.getToken();200===(await s.patchV1TemplateHeaderFooterId({...t,"x-timezone":(null==(e=t["x-timezone"])?void 0:e.toString())||"",id:M,header_sections:o,footer_sections:d,contents:i})).status_code&&(n.enqueueSnackbar("Header/Footer saved successfully",{variant:"success"}),V(!1))}else{const e=r.getToken();200===(await s.postV1TemplateHeaderFooter({...e,"x-timezone":(null==(t=e["x-timezone"])?void 0:t.toString())||"",header_sections:o,footer_sections:d,contents:i,company_id:x.company_id})).status_code&&(n.enqueueSnackbar("Header/Footer saved successfully",{variant:"success"}),V(!1))}}catch(c){const e=r.getErrorMessage(null==c?void 0:c.message);n.enqueueSnackbar(e,{variant:"error"})}},modulePath:u,type:g,mode:S?"edit":"add",templateData:J}),
+/* @__PURE__ */e.jsx(h.default,{sx:{display:"flex",flex:1,overflow:"hidden"},children:/* @__PURE__ */e.jsx(o.DndContext,{onDragStart:e=>{const{active:t}=e;w(t.id)},onDragOver:e=>{const{over:t}=e;t?("header-canvas"===t.id&&B?K("header"):"footer-canvas"===t.id&&B?K("footer"):"main-canvas"===t.id&&K("main"),"header-canvas"!==t.id&&"main-canvas"!==t.id&&"footer-canvas"!==t.id&&F(t.id)):F(null)},onDragEnd:e=>{var t;const{active:i,over:a}=e;if(w(null),F(null),!a)return;let o=_,d=k;if(("header-canvas"===a.id||(null==P?void 0:P.startsWith("header-")))&&B?(o=$,d=I,K("header")):("footer-canvas"===a.id||(null==P?void 0:P.startsWith("footer-")))&&B?(o=j,d=q,K("footer")):K("main"),"image"===(null==(t=i.data.current)?void 0:t.type)){const e=i.data.current.imageUrl,t=Z("image",{src:e,alt:"Image"}),r=o.findIndex(e=>e.id===a.id),s=[...o];return"header-canvas"===a.id||"main-canvas"===a.id||"footer-canvas"===a.id||-1===r?d([...o,t]):(s.splice(r,0,t),d(s)),void n.enqueueSnackbar("Added uploaded image section")}if("string"==typeof i.id&&i.id.startsWith("sidebar-")){const e=i.id.replace("sidebar-",""),t=Z(e),n=o.findIndex(e=>e.id===a.id);if(-1!==n&&"header-canvas"!==a.id&&"main-canvas"!==a.id&&"footer-canvas"!==a.id){const i=o[n];if(!i.content||i.content.includes("Click to add")||i.content.includes("enter your text")){const a=[...o];a[n]={...i,type:e,content:t.content},d(a)}else{const e=[...o];e.splice(n,0,t),d(e)}}else d([...o,t]);return}if(i.id!==a.id&&"string"==typeof i.id&&"string"==typeof a.id){let e=[],t=null;i.id.startsWith("header-")&&B?(e=$,t=I):i.id.startsWith("footer-")&&B?(e=j,t=q):(e=_,t=k);const n=i.id.replace(/^(header-|footer-)/,""),r=e.findIndex(e=>e.id===n||e.id===i.id);let s=o.findIndex(e=>e.id===String(a.id).replace(/^(header-|footer-)/,""));if("header-canvas"!==a.id&&"main-canvas"!==a.id&&"footer-canvas"!==a.id||(s=o.length),-1!==r&&-1!==s)if(e===o){const i=[...e],[a]=i.splice(r,1);if(a.isSplitPair&&a.splitGroupId){const o=a.splitGroupId,n=[a,...e.filter(e=>e.splitGroupId===o&&e.id!==a.id)],d=i.filter(e=>e.splitGroupId!==o);d.splice(s,0,...n),t(d)}else i.splice(s,0,a),t(i)}else{const i=e[r],n=[...e];n.splice(r,1),t(n);const l=[...o],c={...i};("header-canvas"===a.id||a.id.startsWith("header-"))&&B?c.id.startsWith("header-")||(c.id=`header-${c.id}`):("footer-canvas"===a.id||a.id.startsWith("footer-"))&&B?c.id.startsWith("footer-")||(c.id=`footer-${c.id}`):c.id=c.id.replace(/^(header-|footer-)/,""),l.splice(s,0,c),d(l)}}},collisionDetection:o.pointerWithin,children:/* @__PURE__ */e.jsx(a.default,{sections:_,headerSections:$,footerSections:j,activeId:W,overSection:P,selectedSection:G,onSelectSection:H,onUpdateSection:(e,t,i)=>{const a=X(i),o=Y(i),n=e.replace(/^(header-|footer-)/,"");o(a.map(i=>i.id===n||i.id===e?{...i,...t}:i))},onSplitSection:(e,t,i,a)=>{const o=X(a),n=Y(a),d=e.replace(/^(header-|footer-)/,""),r=o.findIndex(t=>t.id===d||t.id===e);if(-1===r)return;const s=o[r],l=[...o],c="header"===a?"header-":"footer"===a?"footer-":"";if(s.isSplitPair&&s.splitGroupId){const e=s.splitGroupId,a=100/(l.filter(t=>t.splitGroupId===e).length+1);l[r]={...s,content:t,splitWidth:a};const o={id:`${c}section-${m.default()}`,content:i,type:s.type,isSplitPair:!0,splitGroupId:e,splitWidth:a,attributes:s.attributes,is_edited_from_source:!1};l.splice(r+1,0,o);for(let t=0;t<l.length;t++)l[t].splitGroupId===e&&(l[t].splitWidth=a)}else{const e=m.default(),a=50;l[r]={...s,content:t,isSplitPair:!0,splitGroupId:e,splitWidth:a};const o={id:`${c}section-${m.default()}`,content:i,type:s.type,isSplitPair:!0,splitGroupId:e,splitWidth:a,attributes:s.attributes,is_edited_from_source:!1};l.splice(r+1,0,o)}n(l)},onDeleteSection:(e,t)=>{const i=X(t),a=Y(t),o=e.replace(/^(header-|footer-)/,""),n=i.find(t=>t.id===o||t.id===e);if(n){if(n.isSplitPair&&n.splitGroupId){const t=i.filter(e=>e.splitGroupId===n.splitGroupId);if(t.length<=2){const n=t.find(t=>t.id!==o&&t.id!==e);n&&(n.isSplitPair=!1,n.splitGroupId=void 0,n.splitWidth=void 0),a(i.filter(t=>t.id!==o&&t.id!==e))}else{const d=100/t.filter(t=>t.id!==o&&t.id!==e).length;a(i.filter(t=>t.id!==o&&t.id!==e).map(e=>e.splitGroupId===n.splitGroupId?{...e,splitWidth:d}:e))}}else a(i.filter(t=>t.id!==o&&t.id!==e));G===e&&H(null)}},preview:z,handleSave:ee,placeholders:E,isEditingHeaderFooter:B,relation_table:A})})}),null!==L&&/* @__PURE__ */e.jsx(f.default,{isOpen:null!==L,setIsOpen:()=>O(null),payload:L,templateRoutes:R,mode:S?"edit":"add",templateData:J})]})};
 //# sourceMappingURL=index.js.map

package/dist/views/template-editor/components/SectionFlowEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/SectionFlowEditor.tsx"],"sourcesContent":["/* eslint-disable no-case-declarations */\r\n/* eslint-disable @typescript-eslint/no-unused-vars */\r\n/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useEffect } from 'react';\r\nimport EditorHeader from './EditorHeader';\r\nimport EditorCanvas from './EditorCanvas';\r\nimport {\r\n  DndContext,\r\n  DragEndEvent,\r\n  DragOverEvent,\r\n  DragStartEvent,\r\n  pointerWithin,\r\n} from '@dnd-kit/core';\r\nimport { SectionData, ElementType } from '../types/editor';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { Box } from '@mui/material';\r\nimport { useLocation, useParams } from 'react-router-dom';\r\nimport { getErrorMessage, getToken } from '../../../utils/common';\r\nimport { getV1FormBuilderRelationalSchemaFieldsName, getV1SubjectsId, getV1TemplateHeaderFooterCompanyIdHeaderFooter, getV1TemplatesId, patchV1TemplateHeaderFooterId, postV1TemplateHeaderFooter } from '../../../api-client/api.system-feature/api';\r\nimport { templateRoutes, extractStyles, generateEmailPreview, generateHeaderFooterPreview, generateInlineStyles } from '../utils/common';\r\nimport { initialStyles } from '../utils/constant';\r\nimport _ from 'lodash';\r\nimport formatText from '../../../utils/format-text';\r\nimport TemplateNameModal from \"../template-name-modal/template-name-modal\";\r\n\r\ninterface EnhancedSectionData extends SectionData {\r\n  isSplitPair?: boolean;\r\n  splitGroupId?: string;\r\n  splitWidth?: number;\r\n}\r\n\r\ninterface SectionFlowEditorProps {\r\n  modulePath: string;\r\n  module: string;\r\n  type: string;\r\n}\r\n\r\nconst SectionFlowEditor: React.FC<SectionFlowEditorProps> = ({ modulePath, module, type}) => {\r\n  const { id, template_id } = useParams();\r\n  const { state: locationState } = useLocation();\r\n\r\n  const [sections, setSections] = useState<EnhancedSectionData[]>([]);\r\n  const [headerSections, setHeaderSections] = useState<EnhancedSectionData[]>([]);\r\n  const [footerSections, setFooterSections] = useState<EnhancedSectionData[]>([]);\r\n  const [activeId, setActiveId] = useState<string | null>(null);\r\n  const [selectedSection, setSelectedSection] = useState<string | null>(null);\r\n  const [overSection, setOverSection] = useState<string | null>(null);\r\n  const [preview, setPreview] = useState<boolean>(false);\r\n  const [placeholders, setPlaceholders] = useState<Record<string, any>[]>([]);\r\n  const [activeCanvas, setActiveCanvas] = useState<'main' | 'header' | 'footer'>('main');\r\n  const [isEditingHeaderFooter, setIsEditingHeaderFooter] = useState<boolean>(false);\r\n  const [payload, setPayload] = useState<any>(null);\r\n  const [headerFooterId, setHeaderFooterId] = useState<string>('');\r\n  const ROUTES = templateRoutes(modulePath, type);\r\n  const [relation_table, setRelationTable] = useState<any[]>([]);\r\n  const [templateData, setTemplateData] = useState<Record<string, any> | null >(null);\r\n\r\n  const handleDragStart = (event: DragStartEvent) => {\r\n    const { active } = event;\r\n    setActiveId(active.id as string);\r\n  };\r\n\r\n  const handleDragOver = (event: DragOverEvent) => {\r\n    const { /* active, */ over } = event;\r\n\r\n    if (!over) {\r\n      setOverSection(null);\r\n      return;\r\n    }\r\n\r\n    if (over.id === 'header-canvas' && isEditingHeaderFooter) {\r\n      setActiveCanvas('header');\r\n    } else if (over.id === 'footer-canvas' && isEditingHeaderFooter) {\r\n      setActiveCanvas('footer');\r\n    } else if (over.id === 'main-canvas') {\r\n      setActiveCanvas('main');\r\n    }\r\n\r\n    if (over.id !== 'header-canvas' && over.id !== 'main-canvas' && over.id !== 'footer-canvas') {\r\n      setOverSection(over.id as string);\r\n    }\r\n  };\r\n\r\n  const handleDragEnd = (event: DragEndEvent) => {\r\n    const { active, over } = event;\r\n  \r\n    setActiveId(null);\r\n    setOverSection(null);\r\n  \r\n    if (!over) return;\r\n  \r\n    let targetSections = sections;\r\n    let setTargetSections = setSections;\r\n    \r\n    if ((over.id === 'header-canvas' || overSection?.startsWith('header-')) && isEditingHeaderFooter) {\r\n      targetSections = headerSections;\r\n      setTargetSections = setHeaderSections;\r\n      setActiveCanvas('header');\r\n    } else if ((over.id === 'footer-canvas' || overSection?.startsWith('footer-')) && isEditingHeaderFooter) {\r\n      targetSections = footerSections;\r\n      setTargetSections = setFooterSections;\r\n      setActiveCanvas('footer');\r\n    } else {\r\n      setActiveCanvas('main');\r\n    }\r\n  \r\n    if (active.data.current?.type === 'image') {\r\n      const imageUrl = active.data.current.imageUrl;\r\n      const newSection: EnhancedSectionData = createNewSection('image', { src: imageUrl, alt: 'Image' });\r\n  \r\n      const overIndex = targetSections.findIndex((section) => section.id === over.id);\r\n      const newSections = [...targetSections];\r\n  \r\n      if (over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas' || overIndex === -1) {\r\n        setTargetSections([...targetSections, newSection]);\r\n      } else {\r\n        newSections.splice(overIndex, 0, newSection);\r\n        setTargetSections(newSections);\r\n      }\r\n  \r\n      enqueueSnackbar('Added uploaded image section');\r\n      return;\r\n    }\r\n  \r\n    if (typeof active.id === 'string' && active.id.startsWith('sidebar-')) {\r\n      const type = active.id.replace('sidebar-', '') as ElementType;\r\n      const newSection = createNewSection(type);\r\n  \r\n      const overIndex = targetSections.findIndex((section) => section.id === over.id);\r\n      const isOverSection = overIndex !== -1;\r\n  \r\n      if (!isOverSection || over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas') {\r\n        setTargetSections([...targetSections, newSection]);\r\n      } else {\r\n        const targetSection = targetSections[overIndex];\r\n        const isEmpty =\r\n          !targetSection.content ||\r\n          targetSection.content.includes('Click to add') ||\r\n          targetSection.content.includes('enter your text');\r\n  \r\n        if (isEmpty) {\r\n          const updatedSections = [...targetSections];\r\n          updatedSections[overIndex] = {\r\n            ...targetSection,\r\n            type,\r\n            content: newSection.content,\r\n          };\r\n          setTargetSections(updatedSections);\r\n          // enqueueSnackbar(`Changed section to ${type}`);\r\n        } else {\r\n          const updatedSections = [...targetSections];\r\n          updatedSections.splice(overIndex, 0, newSection);\r\n          setTargetSections(updatedSections);\r\n          // enqueueSnackbar(`Added new ${type} section`);\r\n        }\r\n      }\r\n      return;\r\n    }\r\n  \r\n    if (\r\n      active.id !== over.id &&\r\n      typeof active.id === 'string' &&\r\n      typeof over.id === 'string'\r\n    ) {\r\n      let sourceSections: EnhancedSectionData[] = [];\r\n      let sourceSetSections: React.Dispatch<React.SetStateAction<EnhancedSectionData[]>> | null = null;\r\n      let canvasId = '';\r\n      \r\n      if (active.id.startsWith('header-') && isEditingHeaderFooter) {\r\n        sourceSections = headerSections;\r\n        sourceSetSections = setHeaderSections;\r\n        canvasId = 'header-canvas';\r\n      } else if (active.id.startsWith('footer-') && isEditingHeaderFooter) {\r\n        sourceSections = footerSections;\r\n        sourceSetSections = setFooterSections;\r\n        canvasId = 'footer-canvas';\r\n      } else {\r\n        sourceSections = sections;\r\n        sourceSetSections = setSections;\r\n        canvasId = 'main-canvas';\r\n      }\r\n      \r\n      const cleanActiveId = active.id.replace(/^(header-|footer-)/, '');\r\n      \r\n      const oldIndex = sourceSections.findIndex((section) => \r\n        section.id === cleanActiveId || section.id === active.id\r\n      );\r\n      \r\n      let newIndex = targetSections.findIndex((section) => \r\n        section.id === String(over.id).replace(/^(header-|footer-)/, '')\r\n      );\r\n  \r\n      if (over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas') {\r\n        newIndex = targetSections.length;\r\n      }\r\n  \r\n      if (oldIndex !== -1 && newIndex !== -1) {\r\n        if (sourceSections === targetSections) {\r\n          const newSections = [...sourceSections];\r\n          const [movedSection] = newSections.splice(oldIndex, 1);\r\n  \r\n          if (movedSection.isSplitPair && movedSection.splitGroupId) {\r\n            const groupId = movedSection.splitGroupId;\r\n            const groupSections = [movedSection, ...sourceSections.filter(\r\n              s => s.splitGroupId === groupId && s.id !== movedSection.id\r\n            )];\r\n  \r\n            const cleaned = newSections.filter(s => s.splitGroupId !== groupId);\r\n            cleaned.splice(newIndex, 0, ...groupSections);\r\n            sourceSetSections(cleaned);\r\n          } else {\r\n            newSections.splice(newIndex, 0, movedSection);\r\n            sourceSetSections(newSections);\r\n          }\r\n        } else {\r\n          const originalSection = sourceSections[oldIndex];\r\n          \r\n          const newSourceSections = [...sourceSections];\r\n          newSourceSections.splice(oldIndex, 1);\r\n          sourceSetSections(newSourceSections);\r\n          \r\n          const newTargetSections = [...targetSections];\r\n          \r\n          const movedSection = {...originalSection};\r\n          \r\n          if ((over.id === 'header-canvas' || over.id.startsWith('header-')) && isEditingHeaderFooter) {\r\n            if (!movedSection.id.startsWith('header-')) {\r\n              movedSection.id = `header-${movedSection.id}`;\r\n            }\r\n          } else if ((over.id === 'footer-canvas' || over.id.startsWith('footer-')) && isEditingHeaderFooter) {\r\n            if (!movedSection.id.startsWith('footer-')) {\r\n              movedSection.id = `footer-${movedSection.id}`;\r\n            }\r\n          } else {\r\n            movedSection.id = movedSection.id.replace(/^(header-|footer-)/, '');\r\n          }\r\n          \r\n          newTargetSections.splice(newIndex, 0, movedSection);\r\n          setTargetSections(newTargetSections);\r\n        }\r\n      }\r\n    }\r\n  };\r\n\r\n  const getRelevantSections = (canvasType: string) => {\r\n    if (canvasType === 'header' && isEditingHeaderFooter) return headerSections;\r\n    if (canvasType === 'footer' && isEditingHeaderFooter) return footerSections;\r\n    return sections;\r\n  };\r\n\r\n  const getRelevantSetSections = (canvasType: string) => {\r\n    if (canvasType === 'header' && isEditingHeaderFooter) return setHeaderSections;\r\n    if (canvasType === 'footer' && isEditingHeaderFooter) return setFooterSections;\r\n    return setSections;\r\n  };\r\n\r\n  const handleUpdateSection = (id: string, data: Partial<EnhancedSectionData>, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    relevantSetSections(\r\n      relevantSections.map((section) =>\r\n        section.id === cleanId || section.id === id ? { ...section, ...data } : section\r\n      )\r\n    );\r\n  };\r\n\r\n  const handleSplitSection = (id: string, content1: string, content2: string, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    const index = relevantSections.findIndex((section) => section.id === cleanId || section.id === id);\r\n    if (index === -1) return;\r\n\r\n    const section = relevantSections[index];\r\n    const newSections = [...relevantSections];\r\n    \r\n    const sectionPrefix = canvasType === 'header' ? 'header-' : canvasType === 'footer' ? 'footer-' : '';\r\n    \r\n    if (section.isSplitPair && section.splitGroupId) {\r\n      const splitGroupId = section.splitGroupId;\r\n      const splitSections = newSections.filter(s => s.splitGroupId === splitGroupId);\r\n      const totalSections = splitSections.length + 1;\r\n      const newWidth = 100 / totalSections;\r\n      \r\n      newSections[index] = { \r\n        ...section, \r\n        content: content1,\r\n        splitWidth: newWidth\r\n      };\r\n\r\n      const newSection: EnhancedSectionData = {\r\n        id: `${sectionPrefix}section-${uuidv4()}`,\r\n        content: content2,\r\n        type: section.type,\r\n        isSplitPair: true,\r\n        splitGroupId: splitGroupId,\r\n        splitWidth: newWidth,\r\n        attributes: section.attributes,\r\n        is_edited_from_source: false\r\n      };\r\n\r\n      newSections.splice(index + 1, 0, newSection);\r\n      \r\n      for (let i = 0; i < newSections.length; i++) {\r\n        if (newSections[i].splitGroupId === splitGroupId) {\r\n          newSections[i].splitWidth = newWidth;\r\n        }\r\n      }\r\n    } else {\r\n      const splitGroupId = uuidv4();\r\n      const initialWidth = 50;\r\n      \r\n      newSections[index] = { \r\n        ...section, \r\n        content: content1,\r\n        isSplitPair: true,\r\n        splitGroupId,\r\n        splitWidth: initialWidth\r\n      };\r\n\r\n      const newSection: EnhancedSectionData = {\r\n        id: `${sectionPrefix}section-${uuidv4()}`,\r\n        content: content2,\r\n        type: section.type,\r\n        isSplitPair: true,\r\n        splitGroupId,\r\n        splitWidth: initialWidth,\r\n        attributes: section.attributes,\r\n        is_edited_from_source: false\r\n      };\r\n\r\n      newSections.splice(index + 1, 0, newSection);\r\n    }\r\n    \r\n    relevantSetSections(newSections);\r\n    // enqueueSnackbar('Section split successfully');\r\n  };\r\n\r\n  const handleDeleteSection = (id: string, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    const sectionToDelete = relevantSections.find(s => s.id === cleanId || s.id === id);\r\n    \r\n    if (!sectionToDelete) return;\r\n    \r\n    if (sectionToDelete.isSplitPair && sectionToDelete.splitGroupId) {\r\n      const splitSections = relevantSections.filter(s => s.splitGroupId === sectionToDelete.splitGroupId);\r\n      \r\n      if (splitSections.length <= 2) {\r\n        const remainingSection = splitSections.find(s => s.id !== cleanId && s.id !== id);\r\n        if (remainingSection) {\r\n          remainingSection.isSplitPair = false;\r\n          remainingSection.splitGroupId = undefined;\r\n          remainingSection.splitWidth = undefined;\r\n        }\r\n        relevantSetSections(relevantSections.filter(s => s.id !== cleanId && s.id !== id));\r\n      } else {\r\n        const remainingSplitSections = splitSections.filter(s => s.id !== cleanId && s.id !== id);\r\n        const newWidth = 100 / remainingSplitSections.length;\r\n        \r\n        const updatedSections = relevantSections.filter(section => section.id !== cleanId && section.id !== id).map(section => {\r\n          if (section.splitGroupId === sectionToDelete.splitGroupId) {\r\n            return { ...section, splitWidth: newWidth };\r\n          }\r\n          return section;\r\n        });\r\n        \r\n        relevantSetSections(updatedSections);\r\n        // enqueueSnackbar('Section removed from split group');\r\n      }\r\n    } else {\r\n      relevantSetSections(relevantSections.filter(section => section.id !== cleanId && section.id !== id));\r\n      // enqueueSnackbar('Section deleted');\r\n    }\r\n    \r\n    if (selectedSection === id) {\r\n      setSelectedSection(null);\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    document.body.style.overflow = 'hidden';\r\n    const main = document.getElementsByTagName('main')?.[0];\r\n    if (main) {\r\n      main.style.marginTop = '4.125rem';\r\n    }\r\n    return () => {\r\n      document.body.removeAttribute('style');\r\n    }\r\n  }, []);\r\n\r\nconst getData = async () => {\r\n  if (id) {\r\n    const token = getToken();\r\n    const subjRes = await getV1SubjectsId({ \r\n      ...token, \r\n      'x-timezone': token['x-timezone']?.toString() || '',\r\n      id \r\n    });\r\n\r\n    if ('data' in subjRes && subjRes.data && typeof subjRes.data === 'object' && 'resource' in subjRes.data) {\r\n      const resource = (subjRes.data as any).resource;\r\n      const token2 = getToken();\r\n      const fRes = await getV1FormBuilderRelationalSchemaFieldsName({\r\n        ...token2,\r\n        'x-timezone': token2['x-timezone']?.toString() || '',\r\n        name: resource,\r\n      });\r\n      const schemaFields = ('data' in fRes && fRes.data && typeof fRes.data === 'object' && 'fields' in fRes.data) \r\n        ? ((fRes.data as any).fields || [])\r\n        : [];\r\n      const relation_table = ('data' in fRes && fRes.data && typeof fRes.data === 'object' && 'relational_fields' in fRes.data)\r\n        ? ((fRes.data as any).relational_fields || [])\r\n        : [];\r\n\r\n      // Process main schema fields\r\n      const updatedFields = schemaFields\r\n        .map((field) => ({\r\n          ...field,\r\n          key: field.key.replace('__replaceKey', ''),\r\n        }))\r\n        .filter((field) => !field.is_inner_join && field.alias !== 'id' && !field?.alias?.includes('_id'));\r\n\r\n      // Process relation tables - separate array and object types\r\n      const arrayRelationTables = [];\r\n      const objectRelationFields = [];\r\n\r\n      relation_table.forEach((table) => {\r\n        if (!table) return;\r\n\r\n        const updatedTableFields = (table.fields || []).map((field) => {\r\n          const updatedField = {\r\n            ...field,\r\n            key: field.key.replace('__replaceKey', ''),\r\n            alias: field?.templateKey ? field?.templateKey : field.alias,\r\n          };\r\n\r\n          // Prepend dataKey to field keys for object types\r\n          if (table.type === 'object' && table.dataKey) {\r\n            updatedField.key = `${table.dataKey}.${updatedField.key}`;\r\n          }\r\n\r\n          return updatedField;\r\n        }).filter(\r\n          (field) =>\r\n            !field.is_inner_join &&\r\n            field.alias !== 'id' &&\r\n            !field.alias.includes('_id')\r\n        );\r\n\r\n        const uniqueTableFields = _.differenceWith(\r\n          updatedTableFields,\r\n          updatedTableFields,\r\n          (fieldA: any, fieldB: any) => fieldA.key === fieldB?.joinKey\r\n        );\r\n\r\n        const tableFields = uniqueTableFields.map((f: any) => {\r\n          const field = formatText(f.alias.replace(/_data$/, '').replace(/_/g, ' '));\r\n          const value = table.type === 'object' && table.dataKey \r\n            ? `${table.dataKey}.${f.alias.replace(/ /g, '_').toLowerCase()}`\r\n            : f.alias.replace(/ /g, '_').toLowerCase();\r\n            \r\n          return { \r\n            label: field, \r\n            value: value \r\n          };\r\n        });\r\n\r\n        if (table.type === 'object') {\r\n          // Merge object type fields into main fields\r\n          objectRelationFields.push(...tableFields);\r\n        } else {\r\n          // Keep array types separate\r\n          arrayRelationTables.push({\r\n            ...table,\r\n            fields: tableFields\r\n          });\r\n        }\r\n      });\r\n\r\n      // Combine main fields and object relation fields\r\n      const allFields = [\r\n        ...updatedFields.map((f) => {\r\n          const n = f?.alias || f?.key\r\n          const field = formatText(n.replace(/_data$/, '').replace(/_/g, ' '));\r\n          return { \r\n            label: field, \r\n            value: field.replace(/ /g, '_').toLowerCase() \r\n          };\r\n        }),\r\n        ...objectRelationFields\r\n      ];\r\n\r\n      const uniqueAllFields = _.uniqBy(allFields, 'value');\r\n\r\n      setPlaceholders(uniqueAllFields);\r\n      setRelationTable(arrayRelationTables);\r\n    }\r\n  }\r\n\r\n  // Rest of the function remains the same...\r\n  if (template_id) {\r\n    const token3 = getToken();\r\n    const res = await getV1TemplatesId({ \r\n      ...token3, \r\n      'x-timezone': token3['x-timezone']?.toString() || '',\r\n      id: template_id \r\n    });\r\n    const templateSections = ('data' in res && res.data && typeof res.data === 'object' && 'sections' in res.data)\r\n      ? ((res.data as any).sections || [])\r\n      : [];\r\n    const mainSecs = templateSections.map((s: any) => ({\r\n      ...s,\r\n      id: s.id || `section-${uuidv4()}`,\r\n    }));\r\n    setTemplateData(('data' in res && res.data) ? res.data as any : null);\r\n\r\n    setSections(mainSecs);\r\n  }\r\n\r\n  if (locationState?.company_id) {\r\n    const token4 = getToken();\r\n    const res = await getV1TemplateHeaderFooterCompanyIdHeaderFooter({\r\n      ...token4,\r\n      'x-timezone': token4['x-timezone']?.toString() || '',\r\n      company_id: locationState.company_id,\r\n    });\r\n    const resData = ('data' in res && res.data && typeof res.data === 'object') ? res.data as any : null;\r\n    setHeaderFooterId(resData?._id || '');\r\n    const headerSections = resData?.header_sections || [];\r\n    const footerSections = resData?.footer_sections || [];\r\n    const headerSecs = headerSections.map((s) => ({\r\n      ...s,\r\n      id: s.id || `header-section-${uuidv4()}`,\r\n    }));\r\n    const footerSecs = footerSections.map((s) => ({\r\n      ...s,\r\n      id: s.id || `footer-section-${uuidv4()}`,\r\n    }));\r\n\r\n    setHeaderSections(headerSecs);\r\n    setFooterSections(footerSecs);\r\n  }\r\n};\r\n  \r\n  useEffect(() => {\r\n    getData();\r\n  }, [template_id, id, locationState?.company_id]);\r\n\r\n  const createNewSection = (type: ElementType, attrs: Record<string, any> = {}): EnhancedSectionData => {\r\n    let content = '';\r\n    const styles = initialStyles[type] || {};\r\n    const inlineStyles: string = generateInlineStyles(styles);\r\n\r\n    const idPrefix = activeCanvas === 'header' && isEditingHeaderFooter ? 'header-' : \r\n                     activeCanvas === 'footer' && isEditingHeaderFooter ? 'footer-' : '';\r\n\r\n    switch (type) {\r\n      case 'heading':\r\n        content = `<h1 style=\"${inlineStyles}\">Heading 1</h1>`;\r\n        break;\r\n      case 'heading-2':\r\n        content = `<h2 style=\"${inlineStyles}\">Heading 2</h2>`;\r\n        break;\r\n      case 'heading-3':\r\n        content = `<h3 style=\"${inlineStyles}\">Heading 3</h3>`;\r\n        break;\r\n      case 'heading-4':\r\n        content = `<h4 style=\"${inlineStyles}\">Heading 4</h4>`;\r\n        break;\r\n      case 'text':\r\n        content = `<p style=\"${inlineStyles}\">Hello, enter your text here...</p>`;\r\n        break;\r\n      case 'image':\r\n        content = `<img src=\"${attrs.src}\" alt=\"${attrs.alt}\" style=\"${inlineStyles};\" />`;\r\n        break;\r\n      case 'buttons':\r\n        attrs.text = attrs?.text || 'Button text';\r\n        content = `<button style=\"${inlineStyles}\">${attrs.text}</button>`;\r\n        break;\r\n      case 'divider':\r\n        content = `<hr style=\"${inlineStyles}\" />`;\r\n        break;\r\n      case 'table':\r\n        const tableStyles = styles as any;\r\n        const { border, borderStyle, borderColor, ...rest } = tableStyles;\r\n        const tInlineStyles = generateInlineStyles(tableStyles.is_bordered ? tableStyles : rest);\r\n        const tHeadInlineStyles: string = generateInlineStyles(tableStyles.tHead);\r\n        const tBodyInlineStyles: string = generateInlineStyles(tableStyles.tBody);\r\n        const thCellInlineStyles: string = generateInlineStyles({...tableStyles.thCells, border, borderStyle, borderColor });\r\n        const tbCellInlineStyles: string = generateInlineStyles({...tableStyles.tbCells, border, borderStyle, borderColor});\r\n        content = `\r\n          <table style=\"${tInlineStyles}\">\r\n            <thead style=\"${tHeadInlineStyles}\">\r\n              <tr style=\"background-color: #f5f5f5;\">\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n              </tr>\r\n            </thead>\r\n            <tbody style=\"${tBodyInlineStyles}\">\r\n              <tr>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n              </tr>\r\n            </tbody>\r\n          </table>\r\n        `;\r\n        break;\r\n      case 'signature':\r\n        content = `<div style=\"${inlineStyles}\">Signature: <input type='text' style=\"border:0; border-bottom:1px solid black\" class='signature-input'/></div>`;\r\n        break;\r\n      case 'qr-code':\r\n        attrs.placeholder = attrs?.placeholder || '{{qr_data}}';\r\n        content = `<div style=\"background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;\">${attrs.placeholder}</div>`;\r\n        break;\r\n      case 'bar-code':\r\n        attrs.placeholder = attrs?.placeholder || '{{barcode_data}}';\r\n        content = `<div style=\"background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;\">${attrs.placeholder}</div>`;\r\n        break;\r\n      default:\r\n        content = '<p style=\"font-size: 16px; color: #333333; line-height: 1.5;\">New section</p>';\r\n    }\r\n\r\n    let attributes: Record<string, any> = {};\r\n    attributes = extractStyles(content, type);\r\n\r\n    return { \r\n      id: `${idPrefix}section-${uuidv4()}`, \r\n      content, \r\n      type, \r\n      attributes: {...(attrs || {}), styles},\r\n      is_edited_from_source: false\r\n    };\r\n  };\r\n\r\n  const handleSave = async () => {\r\n    if(sections.length === 0 && headerSections.length === 0 && footerSections.length === 0)  {\r\n      enqueueSnackbar('Please add at least one section');\r\n      return;\r\n    }\r\n    \r\n    const mainHtml = generateEmailPreview(sections, headerSections, footerSections, true);\r\n    try {\r\n     const p = { \r\n        ...getToken(), \r\n        ...(template_id ? { id: template_id } : { subject_id: id, is_default: false, company_id: locationState.company_id }), \r\n        sections: sections, \r\n        contents: mainHtml \r\n      }\r\n      setPayload(p);\r\n    } catch (error) {\r\n      const m = getErrorMessage(error?.message);\r\n      enqueueSnackbar(m, { variant: 'error' });\r\n    }\r\n  };\r\n  const handleSaveHeaderFooter = async () => {\r\n    if(sections.length === 0 && headerSections.length === 0 && footerSections.length === 0)  {\r\n      enqueueSnackbar('Please add at least one section', { variant: 'error' });\r\n      return;\r\n    } else if(!locationState?.company_id) {\r\n      enqueueSnackbar('Company has not been selected', { variant: 'error' });\r\n      return;\r\n    }\r\n    \r\n    const headerHtml = generateHeaderFooterPreview(headerSections, 'header');\r\n    const footerHtml = generateHeaderFooterPreview(footerSections, 'footer');\r\n    const combinedHtml = `${headerHtml}${footerHtml}`;\r\n    \r\n    // Convert splitWidth from number to string for API\r\n    const convertSectionForApi = (section: EnhancedSectionData) => ({\r\n      id: section.id,\r\n      content: section.content,\r\n      type: section.type,\r\n      isSplitPair: section.isSplitPair,\r\n      splitGroupId: section.splitGroupId,\r\n      splitWidth: section.splitWidth !== undefined ? String(section.splitWidth) : undefined,\r\n    });\r\n    \r\n    const convertedHeaderSections = headerSections.map(convertSectionForApi);\r\n    const convertedFooterSections = footerSections.map(convertSectionForApi);\r\n    \r\n    try {\r\n      if(headerFooterId) {\r\n        const token5 = getToken();\r\n        const res = await patchV1TemplateHeaderFooterId({ \r\n          ...token5,\r\n          'x-timezone': token5['x-timezone']?.toString() || '',\r\n          id: headerFooterId, \r\n          header_sections: convertedHeaderSections, \r\n          footer_sections: convertedFooterSections, \r\n          contents: combinedHtml \r\n        });\r\n        if(res.status_code === 200) {\r\n          enqueueSnackbar('Header/Footer saved successfully', { variant: 'success' });\r\n          setIsEditingHeaderFooter(false);\r\n        }\r\n      } else {\r\n        const token6 = getToken();\r\n        const res = await postV1TemplateHeaderFooter({ \r\n          ...token6,\r\n          'x-timezone': token6['x-timezone']?.toString() || '',\r\n          header_sections: convertedHeaderSections, \r\n          footer_sections: convertedFooterSections, \r\n          contents: combinedHtml, \r\n          company_id: locationState.company_id\r\n        });\r\n        if(res.status_code === 200) {\r\n          enqueueSnackbar('Header/Footer saved successfully', { variant: 'success' });\r\n          setIsEditingHeaderFooter(false);\r\n        }\r\n      }\r\n    } catch (error) {\r\n      const m = getErrorMessage(error?.message);\r\n      enqueueSnackbar(m, { variant: 'error' });\r\n    }\r\n  };\r\n\r\n  const toggleHeaderFooterEditing = () => {\r\n    setIsEditingHeaderFooter(!isEditingHeaderFooter);\r\n    if (isEditingHeaderFooter) {\r\n      setActiveCanvas('main');\r\n    }\r\n  };\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', flexDirection: 'column', height: '100vh' }}>\r\n      <EditorHeader \r\n        onPreview={() => setPreview(!preview)} \r\n        onSave={handleSave}\r\n        preview={preview}\r\n        sections={sections}\r\n        isEditingHeaderFooter={isEditingHeaderFooter}\r\n        setIsEditingHeaderFooter={toggleHeaderFooterEditing}\r\n        onSaveHeaderFooter={handleSaveHeaderFooter}\r\n        modulePath={modulePath} \r\n        type={type}\r\n        mode={template_id ? 'edit' : 'add'}\r\n        templateData={templateData}\r\n      />\r\n      <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\r\n        <DndContext\r\n          onDragStart={handleDragStart}\r\n          onDragOver={handleDragOver}\r\n          onDragEnd={handleDragEnd}\r\n          collisionDetection={pointerWithin}\r\n        >\r\n          <EditorCanvas\r\n            sections={sections}\r\n            headerSections={headerSections}\r\n            footerSections={footerSections}\r\n            activeId={activeId}\r\n            overSection={overSection}\r\n            selectedSection={selectedSection}\r\n            onSelectSection={setSelectedSection}\r\n            onUpdateSection={handleUpdateSection}\r\n            onSplitSection={handleSplitSection}\r\n            onDeleteSection={handleDeleteSection}\r\n            preview={preview}\r\n            handleSave={handleSave}\r\n            placeholders={placeholders}\r\n            isEditingHeaderFooter={isEditingHeaderFooter}\r\n            relation_table={relation_table}\r\n          />\r\n        </DndContext>\r\n      </Box>\r\n      {payload !== null && \r\n        <TemplateNameModal \r\n          isOpen={payload !== null} \r\n          setIsOpen={() => setPayload(null)} \r\n          payload={payload}\r\n          templateRoutes={ROUTES}\r\n          mode={template_id ? 'edit' : 'add'}\r\n          templateData={templateData}\r\n        />\r\n      }\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default SectionFlowEditor;"],"names":["modulePath","module","type","id","template_id","useParams","state","locationState","useLocation","sections","setSections","useState","headerSections","setHeaderSections","footerSections","setFooterSections","activeId","setActiveId","selectedSection","setSelectedSection","overSection","setOverSection","preview","setPreview","placeholders","setPlaceholders","activeCanvas","setActiveCanvas","isEditingHeaderFooter","setIsEditingHeaderFooter","payload","setPayload","headerFooterId","setHeaderFooterId","ROUTES","templateRoutes","relation_table","setRelationTable","templateData","setTemplateData","getRelevantSections","canvasType","getRelevantSetSections","useEffect","document","body","style","overflow","main","_a","getElementsByTagName","marginTop","removeAttribute","async","token","getToken","subjRes","getV1SubjectsId","toString","data","resource","token2","fRes","getV1FormBuilderRelationalSchemaFieldsName","_b","name","schemaFields","fields","relational_fields","updatedFields","map","field","key","replace","filter","is_inner_join","alias","includes","arrayRelationTables","objectRelationFields","forEach","table","updatedTableFields","updatedField","templateKey","dataKey","tableFields","_","differenceWith","fieldA","fieldB","joinKey","f","label","formatText","value","toLowerCase","push","allFields","n","uniqueAllFields","uniqBy","token3","res","getV1TemplatesId","_c","mainSecs","s","uuidv4","company_id","token4","getV1TemplateHeaderFooterCompanyIdHeaderFooter","_d","resData","_id","header_sections","footer_sections","headerSecs","footerSecs","getData","createNewSection","attrs","content","styles","initialStyles","inlineStyles","generateInlineStyles","idPrefix","src","alt","text","tableStyles","border","borderStyle","borderColor","rest","tInlineStyles","is_bordered","tHeadInlineStyles","tHead","tBodyInlineStyles","tBody","thCellInlineStyles","thCells","tbCellInlineStyles","tbCells","placeholder","extractStyles","attributes","is_edited_from_source","handleSave","length","enqueueSnackbar","mainHtml","generateEmailPreview","p","subject_id","is_default","contents","error","m","getErrorMessage","message","variant","jsxs","Box","sx","display","flexDirection","height","children","jsx","EditorHeader","onPreview","onSave","onSaveHeaderFooter","combinedHtml","generateHeaderFooterPreview","convertSectionForApi","section","isSplitPair","splitGroupId","splitWidth","String","convertedHeaderSections","convertedFooterSections","token5","patchV1TemplateHeaderFooterId","status_code","token6","postV1TemplateHeaderFooter","mode","flex","DndContext","onDragStart","event","active","onDragOver","over","onDragEnd","targetSections","setTargetSections","startsWith","current","imageUrl","newSection","overIndex","findIndex","newSections","splice","targetSection","updatedSections","sourceSections","sourceSetSections","cleanActiveId","oldIndex","newIndex","movedSection","groupId","groupSections","cleaned","originalSection","newSourceSections","newTargetSections","collisionDetection","pointerWithin","EditorCanvas","onSelectSection","onUpdateSection","relevantSections","relevantSetSections","cleanId","onSplitSection","content1","content2","index","sectionPrefix","newWidth","i","initialWidth","onDeleteSection","sectionToDelete","find","splitSections","remainingSection","TemplateNameModal","isOpen","setIsOpen"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/template-editor/components/SectionFlowEditor.tsx"],"sourcesContent":["/* eslint-disable no-case-declarations */\r\n/* eslint-disable @typescript-eslint/no-unused-vars */\r\n/* eslint-disable react-hooks/exhaustive-deps */\r\n/* eslint-disable unused-imports/no-unused-vars */\r\nimport React, { useState, useEffect } from 'react';\r\nimport EditorHeader from './EditorHeader';\r\nimport EditorCanvas from './EditorCanvas';\r\nimport {\r\n  DndContext,\r\n  DragEndEvent,\r\n  DragOverEvent,\r\n  DragStartEvent,\r\n  pointerWithin,\r\n} from '@dnd-kit/core';\r\nimport { SectionData, ElementType } from '../types/editor';\r\nimport { v4 as uuidv4 } from 'uuid';\r\nimport { enqueueSnackbar } from 'notistack';\r\nimport { Box } from '@mui/material';\r\nimport { useLocation, useParams } from 'react-router-dom';\r\nimport { getErrorMessage, getToken } from '../../../utils/common';\r\nimport { getV1FormBuilderRelationalSchemaFieldsName, getV1SubjectsId, getV1TemplateHeaderFooterCompanyIdHeaderFooter, getV1TemplatesId, patchV1TemplateHeaderFooterId, postV1TemplateHeaderFooter } from '../../../api-client/api.system-feature/api';\r\nimport { templateRoutes, extractStyles, generateEmailPreview, generateHeaderFooterPreview, generateInlineStyles } from '../utils/common';\r\nimport { initialStyles } from '../utils/constant';\r\nimport _ from 'lodash';\r\nimport formatText from '../../../utils/format-text';\r\nimport TemplateNameModal from \"../template-name-modal/template-name-modal\";\r\n\r\ninterface EnhancedSectionData extends SectionData {\r\n  isSplitPair?: boolean;\r\n  splitGroupId?: string;\r\n  splitWidth?: number;\r\n}\r\n\r\ninterface SectionFlowEditorProps {\r\n  modulePath: string;\r\n  module: string;\r\n  type: string;\r\n}\r\n\r\nconst SectionFlowEditor: React.FC<SectionFlowEditorProps> = ({ modulePath, module, type}) => {\r\n  const { id, template_id } = useParams();\r\n  const { state: locationState } = useLocation();\r\n\r\n  const [sections, setSections] = useState<EnhancedSectionData[]>([]);\r\n  const [headerSections, setHeaderSections] = useState<EnhancedSectionData[]>([]);\r\n  const [footerSections, setFooterSections] = useState<EnhancedSectionData[]>([]);\r\n  const [activeId, setActiveId] = useState<string | null>(null);\r\n  const [selectedSection, setSelectedSection] = useState<string | null>(null);\r\n  const [overSection, setOverSection] = useState<string | null>(null);\r\n  const [preview, setPreview] = useState<boolean>(false);\r\n  const [placeholders, setPlaceholders] = useState<Record<string, any>[]>([]);\r\n  const [activeCanvas, setActiveCanvas] = useState<'main' | 'header' | 'footer'>('main');\r\n  const [isEditingHeaderFooter, setIsEditingHeaderFooter] = useState<boolean>(false);\r\n  const [payload, setPayload] = useState<any>(null);\r\n  const [headerFooterId, setHeaderFooterId] = useState<string>('');\r\n  const ROUTES = templateRoutes(modulePath, type);\r\n  const [relation_table, setRelationTable] = useState<any[]>([]);\r\n  const [templateData, setTemplateData] = useState<Record<string, any> | null >(null);\r\n\r\n  const handleDragStart = (event: DragStartEvent) => {\r\n    const { active } = event;\r\n    setActiveId(active.id as string);\r\n  };\r\n\r\n  const handleDragOver = (event: DragOverEvent) => {\r\n    const { /* active, */ over } = event;\r\n\r\n    if (!over) {\r\n      setOverSection(null);\r\n      return;\r\n    }\r\n\r\n    if (over.id === 'header-canvas' && isEditingHeaderFooter) {\r\n      setActiveCanvas('header');\r\n    } else if (over.id === 'footer-canvas' && isEditingHeaderFooter) {\r\n      setActiveCanvas('footer');\r\n    } else if (over.id === 'main-canvas') {\r\n      setActiveCanvas('main');\r\n    }\r\n\r\n    if (over.id !== 'header-canvas' && over.id !== 'main-canvas' && over.id !== 'footer-canvas') {\r\n      setOverSection(over.id as string);\r\n    }\r\n  };\r\n\r\n  const handleDragEnd = (event: DragEndEvent) => {\r\n    const { active, over } = event;\r\n  \r\n    setActiveId(null);\r\n    setOverSection(null);\r\n  \r\n    if (!over) return;\r\n  \r\n    let targetSections = sections;\r\n    let setTargetSections = setSections;\r\n    \r\n    if ((over.id === 'header-canvas' || overSection?.startsWith('header-')) && isEditingHeaderFooter) {\r\n      targetSections = headerSections;\r\n      setTargetSections = setHeaderSections;\r\n      setActiveCanvas('header');\r\n    } else if ((over.id === 'footer-canvas' || overSection?.startsWith('footer-')) && isEditingHeaderFooter) {\r\n      targetSections = footerSections;\r\n      setTargetSections = setFooterSections;\r\n      setActiveCanvas('footer');\r\n    } else {\r\n      setActiveCanvas('main');\r\n    }\r\n  \r\n    if (active.data.current?.type === 'image') {\r\n      const imageUrl = active.data.current.imageUrl;\r\n      const newSection: EnhancedSectionData = createNewSection('image', { src: imageUrl, alt: 'Image' });\r\n  \r\n      const overIndex = targetSections.findIndex((section) => section.id === over.id);\r\n      const newSections = [...targetSections];\r\n  \r\n      if (over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas' || overIndex === -1) {\r\n        setTargetSections([...targetSections, newSection]);\r\n      } else {\r\n        newSections.splice(overIndex, 0, newSection);\r\n        setTargetSections(newSections);\r\n      }\r\n  \r\n      enqueueSnackbar('Added uploaded image section');\r\n      return;\r\n    }\r\n  \r\n    if (typeof active.id === 'string' && active.id.startsWith('sidebar-')) {\r\n      const type = active.id.replace('sidebar-', '') as ElementType;\r\n      const newSection = createNewSection(type);\r\n  \r\n      const overIndex = targetSections.findIndex((section) => section.id === over.id);\r\n      const isOverSection = overIndex !== -1;\r\n  \r\n      if (!isOverSection || over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas') {\r\n        setTargetSections([...targetSections, newSection]);\r\n      } else {\r\n        const targetSection = targetSections[overIndex];\r\n        const isEmpty =\r\n          !targetSection.content ||\r\n          targetSection.content.includes('Click to add') ||\r\n          targetSection.content.includes('enter your text');\r\n  \r\n        if (isEmpty) {\r\n          const updatedSections = [...targetSections];\r\n          updatedSections[overIndex] = {\r\n            ...targetSection,\r\n            type,\r\n            content: newSection.content,\r\n          };\r\n          setTargetSections(updatedSections);\r\n          // enqueueSnackbar(`Changed section to ${type}`);\r\n        } else {\r\n          const updatedSections = [...targetSections];\r\n          updatedSections.splice(overIndex, 0, newSection);\r\n          setTargetSections(updatedSections);\r\n          // enqueueSnackbar(`Added new ${type} section`);\r\n        }\r\n      }\r\n      return;\r\n    }\r\n  \r\n    if (\r\n      active.id !== over.id &&\r\n      typeof active.id === 'string' &&\r\n      typeof over.id === 'string'\r\n    ) {\r\n      let sourceSections: EnhancedSectionData[] = [];\r\n      let sourceSetSections: React.Dispatch<React.SetStateAction<EnhancedSectionData[]>> | null = null;\r\n      let canvasId = '';\r\n      \r\n      if (active.id.startsWith('header-') && isEditingHeaderFooter) {\r\n        sourceSections = headerSections;\r\n        sourceSetSections = setHeaderSections;\r\n        canvasId = 'header-canvas';\r\n      } else if (active.id.startsWith('footer-') && isEditingHeaderFooter) {\r\n        sourceSections = footerSections;\r\n        sourceSetSections = setFooterSections;\r\n        canvasId = 'footer-canvas';\r\n      } else {\r\n        sourceSections = sections;\r\n        sourceSetSections = setSections;\r\n        canvasId = 'main-canvas';\r\n      }\r\n      \r\n      const cleanActiveId = active.id.replace(/^(header-|footer-)/, '');\r\n      \r\n      const oldIndex = sourceSections.findIndex((section) => \r\n        section.id === cleanActiveId || section.id === active.id\r\n      );\r\n      \r\n      let newIndex = targetSections.findIndex((section) => \r\n        section.id === String(over.id).replace(/^(header-|footer-)/, '')\r\n      );\r\n  \r\n      if (over.id === 'header-canvas' || over.id === 'main-canvas' || over.id === 'footer-canvas') {\r\n        newIndex = targetSections.length;\r\n      }\r\n  \r\n      if (oldIndex !== -1 && newIndex !== -1) {\r\n        if (sourceSections === targetSections) {\r\n          const newSections = [...sourceSections];\r\n          const [movedSection] = newSections.splice(oldIndex, 1);\r\n  \r\n          if (movedSection.isSplitPair && movedSection.splitGroupId) {\r\n            const groupId = movedSection.splitGroupId;\r\n            const groupSections = [movedSection, ...sourceSections.filter(\r\n              s => s.splitGroupId === groupId && s.id !== movedSection.id\r\n            )];\r\n  \r\n            const cleaned = newSections.filter(s => s.splitGroupId !== groupId);\r\n            cleaned.splice(newIndex, 0, ...groupSections);\r\n            sourceSetSections(cleaned);\r\n          } else {\r\n            newSections.splice(newIndex, 0, movedSection);\r\n            sourceSetSections(newSections);\r\n          }\r\n        } else {\r\n          const originalSection = sourceSections[oldIndex];\r\n          \r\n          const newSourceSections = [...sourceSections];\r\n          newSourceSections.splice(oldIndex, 1);\r\n          sourceSetSections(newSourceSections);\r\n          \r\n          const newTargetSections = [...targetSections];\r\n          \r\n          const movedSection = {...originalSection};\r\n          \r\n          if ((over.id === 'header-canvas' || over.id.startsWith('header-')) && isEditingHeaderFooter) {\r\n            if (!movedSection.id.startsWith('header-')) {\r\n              movedSection.id = `header-${movedSection.id}`;\r\n            }\r\n          } else if ((over.id === 'footer-canvas' || over.id.startsWith('footer-')) && isEditingHeaderFooter) {\r\n            if (!movedSection.id.startsWith('footer-')) {\r\n              movedSection.id = `footer-${movedSection.id}`;\r\n            }\r\n          } else {\r\n            movedSection.id = movedSection.id.replace(/^(header-|footer-)/, '');\r\n          }\r\n          \r\n          newTargetSections.splice(newIndex, 0, movedSection);\r\n          setTargetSections(newTargetSections);\r\n        }\r\n      }\r\n    }\r\n  };\r\n\r\n  const getRelevantSections = (canvasType: string) => {\r\n    if (canvasType === 'header' && isEditingHeaderFooter) return headerSections;\r\n    if (canvasType === 'footer' && isEditingHeaderFooter) return footerSections;\r\n    return sections;\r\n  };\r\n\r\n  const getRelevantSetSections = (canvasType: string) => {\r\n    if (canvasType === 'header' && isEditingHeaderFooter) return setHeaderSections;\r\n    if (canvasType === 'footer' && isEditingHeaderFooter) return setFooterSections;\r\n    return setSections;\r\n  };\r\n\r\n  const handleUpdateSection = (id: string, data: Partial<EnhancedSectionData>, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    relevantSetSections(\r\n      relevantSections.map((section) =>\r\n        section.id === cleanId || section.id === id ? { ...section, ...data } : section\r\n      )\r\n    );\r\n  };\r\n\r\n  const handleSplitSection = (id: string, content1: string, content2: string, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    const index = relevantSections.findIndex((section) => section.id === cleanId || section.id === id);\r\n    if (index === -1) return;\r\n\r\n    const section = relevantSections[index];\r\n    const newSections = [...relevantSections];\r\n    \r\n    const sectionPrefix = canvasType === 'header' ? 'header-' : canvasType === 'footer' ? 'footer-' : '';\r\n    \r\n    if (section.isSplitPair && section.splitGroupId) {\r\n      const splitGroupId = section.splitGroupId;\r\n      const splitSections = newSections.filter(s => s.splitGroupId === splitGroupId);\r\n      const totalSections = splitSections.length + 1;\r\n      const newWidth = 100 / totalSections;\r\n      \r\n      newSections[index] = { \r\n        ...section, \r\n        content: content1,\r\n        splitWidth: newWidth\r\n      };\r\n\r\n      const newSection: EnhancedSectionData = {\r\n        id: `${sectionPrefix}section-${uuidv4()}`,\r\n        content: content2,\r\n        type: section.type,\r\n        isSplitPair: true,\r\n        splitGroupId: splitGroupId,\r\n        splitWidth: newWidth,\r\n        attributes: section.attributes,\r\n        is_edited_from_source: false\r\n      };\r\n\r\n      newSections.splice(index + 1, 0, newSection);\r\n      \r\n      for (let i = 0; i < newSections.length; i++) {\r\n        if (newSections[i].splitGroupId === splitGroupId) {\r\n          newSections[i].splitWidth = newWidth;\r\n        }\r\n      }\r\n    } else {\r\n      const splitGroupId = uuidv4();\r\n      const initialWidth = 50;\r\n      \r\n      newSections[index] = { \r\n        ...section, \r\n        content: content1,\r\n        isSplitPair: true,\r\n        splitGroupId,\r\n        splitWidth: initialWidth\r\n      };\r\n\r\n      const newSection: EnhancedSectionData = {\r\n        id: `${sectionPrefix}section-${uuidv4()}`,\r\n        content: content2,\r\n        type: section.type,\r\n        isSplitPair: true,\r\n        splitGroupId,\r\n        splitWidth: initialWidth,\r\n        attributes: section.attributes,\r\n        is_edited_from_source: false\r\n      };\r\n\r\n      newSections.splice(index + 1, 0, newSection);\r\n    }\r\n    \r\n    relevantSetSections(newSections);\r\n    // enqueueSnackbar('Section split successfully');\r\n  };\r\n\r\n  const handleDeleteSection = (id: string, canvasType: string) => {\r\n    const relevantSections = getRelevantSections(canvasType);\r\n    const relevantSetSections = getRelevantSetSections(canvasType);\r\n    \r\n    const cleanId = id.replace(/^(header-|footer-)/, '');\r\n    \r\n    const sectionToDelete = relevantSections.find(s => s.id === cleanId || s.id === id);\r\n    \r\n    if (!sectionToDelete) return;\r\n    \r\n    if (sectionToDelete.isSplitPair && sectionToDelete.splitGroupId) {\r\n      const splitSections = relevantSections.filter(s => s.splitGroupId === sectionToDelete.splitGroupId);\r\n      \r\n      if (splitSections.length <= 2) {\r\n        const remainingSection = splitSections.find(s => s.id !== cleanId && s.id !== id);\r\n        if (remainingSection) {\r\n          remainingSection.isSplitPair = false;\r\n          remainingSection.splitGroupId = undefined;\r\n          remainingSection.splitWidth = undefined;\r\n        }\r\n        relevantSetSections(relevantSections.filter(s => s.id !== cleanId && s.id !== id));\r\n      } else {\r\n        const remainingSplitSections = splitSections.filter(s => s.id !== cleanId && s.id !== id);\r\n        const newWidth = 100 / remainingSplitSections.length;\r\n        \r\n        const updatedSections = relevantSections.filter(section => section.id !== cleanId && section.id !== id).map(section => {\r\n          if (section.splitGroupId === sectionToDelete.splitGroupId) {\r\n            return { ...section, splitWidth: newWidth };\r\n          }\r\n          return section;\r\n        });\r\n        \r\n        relevantSetSections(updatedSections);\r\n        // enqueueSnackbar('Section removed from split group');\r\n      }\r\n    } else {\r\n      relevantSetSections(relevantSections.filter(section => section.id !== cleanId && section.id !== id));\r\n      // enqueueSnackbar('Section deleted');\r\n    }\r\n    \r\n    if (selectedSection === id) {\r\n      setSelectedSection(null);\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    document.body.style.overflow = 'hidden';\r\n    const main = document.getElementsByTagName('main')?.[0];\r\n    if (main) {\r\n      main.style.marginTop = '4.125rem';\r\n    }\r\n    return () => {\r\n      document.body.removeAttribute('style');\r\n    }\r\n  }, []);\r\n\r\nconst getData = async () => {\r\n  if (id) {\r\n    const token = getToken();\r\n    const subjRes = await getV1SubjectsId({ \r\n      ...token, \r\n      'x-timezone': token['x-timezone']?.toString() || '',\r\n      id \r\n    });\r\n\r\n    if ('data' in subjRes && subjRes.data && typeof subjRes.data === 'object' && 'resource' in subjRes.data) {\r\n      const resource = (subjRes.data as any).resource;\r\n      const token2 = getToken();\r\n      const fRes = await getV1FormBuilderRelationalSchemaFieldsName({\r\n        ...token2,\r\n        'x-timezone': token2['x-timezone']?.toString() || '',\r\n        name: resource,\r\n      });\r\n      const schemaFields = ('data' in fRes && fRes.data && typeof fRes.data === 'object' && 'fields' in fRes.data) \r\n        ? ((fRes.data as any).fields || [])\r\n        : [];\r\n      const relation_table = ('data' in fRes && fRes.data && typeof fRes.data === 'object' && 'relational_fields' in fRes.data)\r\n        ? ((fRes.data as any).relational_fields || [])\r\n        : [];\r\n\r\n      // Process main schema fields\r\n      const updatedFields = schemaFields\r\n        .map((field) => ({\r\n          ...field,\r\n          key: field.key.replace('__replaceKey', ''),\r\n        }))\r\n        .filter((field) => !field.is_inner_join && field.alias !== 'id' && !field?.alias?.includes('_id'));\r\n\r\n      // Process relation tables - separate array and object types\r\n      const arrayRelationTables = [];\r\n      const objectRelationFields = [];\r\n\r\n      relation_table.forEach((table) => {\r\n        if (!table) return;\r\n\r\n        const updatedTableFields = (table.fields || []).map((field) => {\r\n          const updatedField = {\r\n            ...field,\r\n            key: field.key.replace('__replaceKey', ''),\r\n            alias: field?.templateKey ? field?.templateKey : field.alias,\r\n          };\r\n\r\n          // Prepend dataKey to field keys for object types\r\n          if (table.type === 'object' && table.dataKey) {\r\n            updatedField.key = `${table.dataKey}.${updatedField.key}`;\r\n          }\r\n\r\n          return updatedField;\r\n        }).filter(\r\n          (field) =>\r\n            !field.is_inner_join &&\r\n            field.alias !== 'id' &&\r\n            !field.alias.includes('_id')\r\n        );\r\n\r\n        const uniqueTableFields = _.differenceWith(\r\n          updatedTableFields,\r\n          updatedTableFields,\r\n          (fieldA: any, fieldB: any) => fieldA.key === fieldB?.joinKey\r\n        );\r\n\r\n        const tableFields = uniqueTableFields.map((f: any) => {\r\n          const field = formatText(f.alias.replace(/_data$/, '').replace(/_/g, ' '));\r\n          const value = table.type === 'object' && table.dataKey \r\n            ? `${table.dataKey}.${f.alias.replace(/ /g, '_').toLowerCase()}`\r\n            : f.alias.replace(/ /g, '_').toLowerCase();\r\n            \r\n          return { \r\n            label: field, \r\n            value: value \r\n          };\r\n        });\r\n\r\n        if (table.type === 'object') {\r\n          // Merge object type fields into main fields\r\n          objectRelationFields.push(...tableFields);\r\n        } else {\r\n          // Keep array types separate\r\n          arrayRelationTables.push({\r\n            ...table,\r\n            fields: tableFields\r\n          });\r\n        }\r\n      });\r\n\r\n      // Combine main fields and object relation fields\r\n      const allFields = [\r\n        ...updatedFields.map((f) => {\r\n          const n = f?.alias || f?.key\r\n          const field = formatText(n.replace(/_data$/, '').replace(/_/g, ' '));\r\n          return { \r\n            label: field, \r\n            value: field.replace(/ /g, '_').toLowerCase() \r\n          };\r\n        }),\r\n        ...objectRelationFields\r\n      ];\r\n\r\n      const uniqueAllFields = _.uniqBy(allFields, 'value');\r\n\r\n      setPlaceholders(uniqueAllFields);\r\n      setRelationTable(arrayRelationTables);\r\n    }\r\n  }\r\n\r\n  // Rest of the function remains the same...\r\n  if (template_id) {\r\n    const token3 = getToken();\r\n    const res = await getV1TemplatesId({ \r\n      ...token3, \r\n      'x-timezone': token3['x-timezone']?.toString() || '',\r\n      id: template_id \r\n    });\r\n    const templateSections = ('data' in res && res.data && typeof res.data === 'object' && 'sections' in res.data)\r\n      ? ((res.data as any).sections || [])\r\n      : [];\r\n    const mainSecs = templateSections.map((s: any) => ({\r\n      ...s,\r\n      id: s.id || `section-${uuidv4()}`,\r\n    }));\r\n    setTemplateData(('data' in res && res.data) ? res.data as any : null);\r\n\r\n    setSections(mainSecs);\r\n  }\r\n\r\n  if (locationState?.company_id) {\r\n    const token4 = getToken();\r\n    const res = await getV1TemplateHeaderFooterCompanyIdHeaderFooter({\r\n      ...token4,\r\n      'x-timezone': token4['x-timezone']?.toString() || '',\r\n      company_id: locationState.company_id,\r\n    });\r\n    const resData = ('data' in res && res.data && typeof res.data === 'object') ? res.data as any : null;\r\n    setHeaderFooterId(resData?._id || '');\r\n    const headerSections = resData?.header_sections || [];\r\n    const footerSections = resData?.footer_sections || [];\r\n    const headerSecs = headerSections.map((s) => ({\r\n      ...s,\r\n      id: s.id || `header-section-${uuidv4()}`,\r\n    }));\r\n    const footerSecs = footerSections.map((s) => ({\r\n      ...s,\r\n      id: s.id || `footer-section-${uuidv4()}`,\r\n    }));\r\n\r\n    setHeaderSections(headerSecs);\r\n    setFooterSections(footerSecs);\r\n  }\r\n};\r\n  \r\n  useEffect(() => {\r\n    getData();\r\n  }, [template_id, id, locationState?.company_id]);\r\n\r\n  const createNewSection = (type: ElementType, attrs: Record<string, any> = {}): EnhancedSectionData => {\r\n    let content = '';\r\n    const styles = initialStyles[type] || {};\r\n    const inlineStyles: string = generateInlineStyles(styles);\r\n\r\n    const idPrefix = activeCanvas === 'header' && isEditingHeaderFooter ? 'header-' : \r\n                     activeCanvas === 'footer' && isEditingHeaderFooter ? 'footer-' : '';\r\n\r\n    switch (type) {\r\n      case 'heading':\r\n        content = `<h1 style=\"${inlineStyles}\">Heading 1</h1>`;\r\n        break;\r\n      case 'heading-2':\r\n        content = `<h2 style=\"${inlineStyles}\">Heading 2</h2>`;\r\n        break;\r\n      case 'heading-3':\r\n        content = `<h3 style=\"${inlineStyles}\">Heading 3</h3>`;\r\n        break;\r\n      case 'heading-4':\r\n        content = `<h4 style=\"${inlineStyles}\">Heading 4</h4>`;\r\n        break;\r\n      case 'text':\r\n        content = `<p style=\"${inlineStyles}\">Hello, enter your text here...</p>`;\r\n        break;\r\n      case 'image':\r\n        content = `<img src=\"${attrs.src}\" alt=\"${attrs.alt}\" style=\"${inlineStyles};\" />`;\r\n        break;\r\n      case 'buttons':\r\n        attrs.text = attrs?.text || 'Button text';\r\n        content = `<button style=\"${inlineStyles}\">${attrs.text}</button>`;\r\n        break;\r\n      case 'divider':\r\n        content = `<hr style=\"${inlineStyles}\" />`;\r\n        break;\r\n      case 'table':\r\n        const tableStyles = styles as any;\r\n        const { border, borderStyle, borderColor, ...rest } = tableStyles;\r\n        const tInlineStyles = generateInlineStyles(tableStyles.is_bordered ? tableStyles : rest);\r\n        const tHeadInlineStyles: string = generateInlineStyles(tableStyles.tHead);\r\n        const tBodyInlineStyles: string = generateInlineStyles(tableStyles.tBody);\r\n        const thCellInlineStyles: string = generateInlineStyles({...tableStyles.thCells, border, borderStyle, borderColor });\r\n        const tbCellInlineStyles: string = generateInlineStyles({...tableStyles.tbCells, border, borderStyle, borderColor});\r\n        content = `\r\n          <table style=\"${tInlineStyles}\">\r\n            <thead style=\"${tHeadInlineStyles}\">\r\n              <tr style=\"background-color: #f5f5f5;\">\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n                <th style=\"${thCellInlineStyles}\"></th>\r\n              </tr>\r\n            </thead>\r\n            <tbody style=\"${tBodyInlineStyles}\">\r\n              <tr>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n                <td style=\"${tbCellInlineStyles}\"></td>\r\n              </tr>\r\n            </tbody>\r\n          </table>\r\n        `;\r\n        break;\r\n      case 'signature':\r\n        content = `<div style=\"${inlineStyles}\">Signature: <input type='text' style=\"border:0; border-bottom:1px solid black\" class='signature-input'/></div>`;\r\n        break;\r\n      case 'qr-code':\r\n        attrs.placeholder = attrs?.placeholder || '{{qr_data}}';\r\n        content = `<div style=\"background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;\">${attrs.placeholder}</div>`;\r\n        break;\r\n      case 'bar-code':\r\n        attrs.placeholder = attrs?.placeholder || '{{barcode_data}}';\r\n        content = `<div style=\"background-color: #f5f5f5; padding: 16px; text-align: center; color: #666666;\">${attrs.placeholder}</div>`;\r\n        break;\r\n      default:\r\n        content = '<p style=\"font-size: 16px; color: #333333; line-height: 1.5;\">New section</p>';\r\n    }\r\n\r\n    let attributes: Record<string, any> = {};\r\n    attributes = extractStyles(content, type);\r\n\r\n    return { \r\n      id: `${idPrefix}section-${uuidv4()}`, \r\n      content, \r\n      type, \r\n      attributes: {...(attrs || {}), styles},\r\n      is_edited_from_source: false\r\n    };\r\n  };\r\n\r\n  const handleSave = async () => {\r\n    if(sections.length === 0 && headerSections.length === 0 && footerSections.length === 0)  {\r\n      enqueueSnackbar('Please add at least one section');\r\n      return;\r\n    }\r\n    \r\n    const mainHtml = generateEmailPreview(sections, headerSections, footerSections, true);\r\n    try {\r\n     const p = { \r\n        ...getToken(), \r\n        ...(template_id ? { id: template_id } : { subject_id: id, is_default: false, company_id: locationState.company_id }), \r\n        sections: sections, \r\n        contents: mainHtml \r\n      }\r\n      setPayload(p);\r\n    } catch (error) {\r\n      const m = getErrorMessage(error?.message);\r\n      enqueueSnackbar(m, { variant: 'error' });\r\n    }\r\n  };\r\n  const handleSaveHeaderFooter = async () => {\r\n    if(sections.length === 0 && headerSections.length === 0 && footerSections.length === 0)  {\r\n      enqueueSnackbar('Please add at least one section', { variant: 'error' });\r\n      return;\r\n    } else if(!locationState?.company_id) {\r\n      enqueueSnackbar('Company has not been selected', { variant: 'error' });\r\n      return;\r\n    }\r\n    \r\n    const headerHtml = generateHeaderFooterPreview(headerSections, 'header');\r\n    const footerHtml = generateHeaderFooterPreview(footerSections, 'footer');\r\n    const combinedHtml = `${headerHtml}${footerHtml}`;\r\n    \r\n    // Convert splitWidth from number to string for API\r\n    const convertSectionForApi = (section: EnhancedSectionData) => ({\r\n      id: section.id,\r\n      content: section.content,\r\n      type: section.type,\r\n      isSplitPair: section.isSplitPair,\r\n      splitGroupId: section.splitGroupId,\r\n      splitWidth: section.splitWidth !== undefined ? String(section.splitWidth) : undefined,\r\n    });\r\n    \r\n    const convertedHeaderSections = headerSections.map(convertSectionForApi);\r\n    const convertedFooterSections = footerSections.map(convertSectionForApi);\r\n    \r\n    try {\r\n      if(headerFooterId) {\r\n        const token5 = getToken();\r\n        const res = await patchV1TemplateHeaderFooterId({ \r\n          ...token5,\r\n          'x-timezone': token5['x-timezone']?.toString() || '',\r\n          id: headerFooterId, \r\n          header_sections: convertedHeaderSections, \r\n          footer_sections: convertedFooterSections, \r\n          contents: combinedHtml \r\n        });\r\n        if(res.status_code === 200) {\r\n          enqueueSnackbar('Header/Footer saved successfully', { variant: 'success' });\r\n          setIsEditingHeaderFooter(false);\r\n        }\r\n      } else {\r\n        const token6 = getToken();\r\n        const res = await postV1TemplateHeaderFooter({ \r\n          ...token6,\r\n          'x-timezone': token6['x-timezone']?.toString() || '',\r\n          header_sections: convertedHeaderSections, \r\n          footer_sections: convertedFooterSections, \r\n          contents: combinedHtml, \r\n          company_id: locationState.company_id\r\n        });\r\n        if(res.status_code === 200) {\r\n          enqueueSnackbar('Header/Footer saved successfully', { variant: 'success' });\r\n          setIsEditingHeaderFooter(false);\r\n        }\r\n      }\r\n    } catch (error) {\r\n      const m = getErrorMessage(error?.message);\r\n      enqueueSnackbar(m, { variant: 'error' });\r\n    }\r\n  };\r\n\r\n  const toggleHeaderFooterEditing = () => {\r\n    setIsEditingHeaderFooter(!isEditingHeaderFooter);\r\n    if (isEditingHeaderFooter) {\r\n      setActiveCanvas('main');\r\n    }\r\n  };\r\n\r\n  return (\r\n    <Box sx={{ display: 'flex', flexDirection: 'column', height: '100vh' }}>\r\n      <EditorHeader \r\n        onPreview={() => setPreview(!preview)} \r\n        onSave={handleSave}\r\n        preview={preview}\r\n        sections={sections}\r\n        isEditingHeaderFooter={isEditingHeaderFooter}\r\n        setIsEditingHeaderFooter={toggleHeaderFooterEditing}\r\n        onSaveHeaderFooter={handleSaveHeaderFooter}\r\n        modulePath={modulePath} \r\n        type={type}\r\n        mode={template_id ? 'edit' : 'add'}\r\n        templateData={templateData}\r\n      />\r\n      <Box sx={{ display: 'flex', flex: 1, overflow: 'hidden' }}>\r\n        <DndContext\r\n          onDragStart={handleDragStart}\r\n          onDragOver={handleDragOver}\r\n          onDragEnd={handleDragEnd}\r\n          collisionDetection={pointerWithin}\r\n        >\r\n          <EditorCanvas\r\n            sections={sections}\r\n            headerSections={headerSections}\r\n            footerSections={footerSections}\r\n            activeId={activeId}\r\n            overSection={overSection}\r\n            selectedSection={selectedSection}\r\n            onSelectSection={setSelectedSection}\r\n            onUpdateSection={handleUpdateSection}\r\n            onSplitSection={handleSplitSection}\r\n            onDeleteSection={handleDeleteSection}\r\n            preview={preview}\r\n            handleSave={handleSave}\r\n            placeholders={placeholders}\r\n            isEditingHeaderFooter={isEditingHeaderFooter}\r\n            relation_table={relation_table}\r\n          />\r\n        </DndContext>\r\n      </Box>\r\n      {payload !== null && \r\n        <TemplateNameModal \r\n          isOpen={payload !== null} \r\n          setIsOpen={() => setPayload(null)} \r\n          payload={payload}\r\n          templateRoutes={ROUTES}\r\n          mode={template_id ? 'edit' : 'add'}\r\n          templateData={templateData}\r\n        />\r\n      }\r\n    </Box>\r\n  );\r\n};\r\n\r\nexport default SectionFlowEditor;"],"names":["modulePath","module","type","id","template_id","useParams","state","locationState","useLocation","sections","setSections","useState","headerSections","setHeaderSections","footerSections","setFooterSections","activeId","setActiveId","selectedSection","setSelectedSection","overSection","setOverSection","preview","setPreview","placeholders","setPlaceholders","activeCanvas","setActiveCanvas","isEditingHeaderFooter","setIsEditingHeaderFooter","payload","setPayload","headerFooterId","setHeaderFooterId","ROUTES","templateRoutes","relation_table","setRelationTable","templateData","setTemplateData","getRelevantSections","canvasType","getRelevantSetSections","useEffect","document","body","style","overflow","main","_a","getElementsByTagName","marginTop","removeAttribute","async","token","getToken","subjRes","getV1SubjectsId","toString","data","resource","token2","fRes","getV1FormBuilderRelationalSchemaFieldsName","_b","name","schemaFields","fields","relational_fields","updatedFields","map","field","key","replace","filter","is_inner_join","alias","includes","arrayRelationTables","objectRelationFields","forEach","table","updatedTableFields","updatedField","templateKey","dataKey","tableFields","_","differenceWith","fieldA","fieldB","joinKey","f","label","formatText","value","toLowerCase","push","allFields","n","uniqueAllFields","uniqBy","token3","res","getV1TemplatesId","_c","mainSecs","s","uuidv4","company_id","token4","getV1TemplateHeaderFooterCompanyIdHeaderFooter","_d","resData","_id","header_sections","footer_sections","headerSecs","footerSecs","getData","createNewSection","attrs","content","styles","initialStyles","inlineStyles","generateInlineStyles","idPrefix","src","alt","text","tableStyles","border","borderStyle","borderColor","rest","tInlineStyles","is_bordered","tHeadInlineStyles","tHead","tBodyInlineStyles","tBody","thCellInlineStyles","thCells","tbCellInlineStyles","tbCells","placeholder","extractStyles","attributes","is_edited_from_source","handleSave","length","enqueueSnackbar","mainHtml","generateEmailPreview","p","subject_id","is_default","contents","error","m","getErrorMessage","message","variant","jsxs","Box","sx","display","flexDirection","height","children","jsx","EditorHeader","onPreview","onSave","onSaveHeaderFooter","combinedHtml","generateHeaderFooterPreview","convertSectionForApi","section","isSplitPair","splitGroupId","splitWidth","String","convertedHeaderSections","convertedFooterSections","token5","patchV1TemplateHeaderFooterId","status_code","token6","postV1TemplateHeaderFooter","mode","flex","DndContext","onDragStart","event","active","onDragOver","over","onDragEnd","targetSections","setTargetSections","startsWith","current","imageUrl","newSection","overIndex","findIndex","newSections","splice","targetSection","updatedSections","sourceSections","sourceSetSections","cleanActiveId","oldIndex","newIndex","movedSection","groupId","groupSections","cleaned","originalSection","newSourceSections","newTargetSections","collisionDetection","pointerWithin","EditorCanvas","onSelectSection","onUpdateSection","relevantSections","relevantSetSections","cleanId","onSplitSection","content1","content2","index","sectionPrefix","newWidth","i","initialWidth","onDeleteSection","sectionToDelete","find","splitSections","remainingSection","TemplateNameModal","isOpen","setIsOpen"],"mappings":"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"}

package/dist/views/template-editor/components/SectionFormatPanel/index.esm.js

@@ -1,7 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo, useState, useEffect, useCallback } from "react";
-import { Paper, Box, Tooltip, IconButton, FormControl, MenuItem } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
+import default_1 from "../../../../node_modules/@mui/icons-material/Close/index.esm.js";
 import { Typography } from "../../../../components/typography/typography/index.esm.js";
 import TextControls from "../controllers/TextControls/index.esm.js";
 import ButtonControls from "../controllers/ButtonControls/index.esm.js";
@@ -13,7 +12,13 @@ import CodeControls from "../controllers/CodeControls/index.esm.js";
 import Select from "../../../../components/select/select/index.esm.js";
 import { initialStyles } from "../../utils/constant/index.esm.js";
 import { extractStyles, generateInlineStyles, getInitialSectionData } from "../../utils/common/index.esm.js";
+import Paper from "../../../../node_modules/@mui/material/Paper/Paper/index.esm.js";
+import Box from "../../../../node_modules/@mui/material/Box/Box/index.esm.js";
+import Tooltip from "../../../../node_modules/@mui/material/Tooltip/Tooltip/index.esm.js";
+import IconButton from "../../../../node_modules/@mui/material/IconButton/IconButton/index.esm.js";
 import { Save } from "../../../../components/icons/save/index.esm.js";
+import FormControl from "../../../../node_modules/@mui/material/FormControl/FormControl/index.esm.js";
+import MenuItem from "../../../../node_modules/@mui/material/MenuItem/MenuItem/index.esm.js";
 const sectionTypes = ["text", "text-block", "heading", "heading-2", "heading-3", "heading-4", "buttons", "image", "divider", "table", "signature", "qr-code", "bar-code"];
 const SectionFormatPanel = ({
   section,
@@ -452,7 +457,7 @@ const SectionFormatPanel = ({
                   handleSave == null ? void 0 : handleSave();
                   onClose();
                 }, "aria-label": "Save", children: /* @__PURE__ */ jsx(Save, { fontSize: "small" }) }),
-                /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" }) })
+                /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx(default_1, { fontSize: "small" }) })
               ] }) })
             ]
           }