@campxdev/shared 1.8.13 → 1.8.14

package/src/components/CardsGrid.tsx

@@ -1,28 +0,0 @@
-import { Box, SxProps } from '@mui/material'
-import React from 'react'
-export default function CardsGrid({
-  cardWidth,
-  gap,
-  children,
-  sx,
-}: {
-  cardWidth: number
-  gap: number
-  children: React.ReactNode
-  sx?: SxProps
-}) {
-  return (
-    <Box
-      sx={{
-        width: '100%',
-        display: 'grid',
-        gridTemplateColumns: `repeat(auto-fill, minmax(${cardWidth}px, 1fr))`,
-        alignItems: 'start',
-        gap: `${gap}px`,
-        ...sx,
-      }}
-    >
-      {children}
-    </Box>
-  )
-}

package/src/components/ChangePassword.tsx

@@ -1,123 +0,0 @@
-import { Visibility, VisibilityOff } from '@mui/icons-material'
-import {
-  Button,
-  CircularProgress,
-  IconButton,
-  InputAdornment,
-  Stack,
-} from '@mui/material'
-import { useState } from 'react'
-import { useForm } from 'react-hook-form'
-import { toast } from 'react-toastify'
-import { FormTextField } from '.'
-import axios, { axiosErrorToast } from '../config/axios'
-import { isDevelopment } from '../constants/isDevelopment'
-
-function ChangePassword({ close }) {
-  const [showPassword, setShowPassword] = useState({
-    oldPassword: false,
-    newPassword: false,
-    confirmPassword: false,
-  })
-  const [isLoading, setIsLoading] = useState(false)
-
-  const { handleSubmit, control, reset } = useForm()
-
-  const onSubmit = async (formData) => {
-    setIsLoading(true)
-    const { oldPassword, newPassword, confirmPassword } = formData
-    if (newPassword === confirmPassword) {
-      try {
-        await axios.post(
-          isDevelopment
-            ? 'https://api.campx.dev/auth-server/auth/change-password'
-            : 'https://api.campx.in/auth-server/auth/change-password',
-          {
-            oldPassword,
-            newPassword,
-          },
-        )
-        toast.success('Password Changed Successfully')
-        setIsLoading(false)
-        reset()
-        close()
-      } catch (error) {
-        axiosErrorToast(error)
-        setIsLoading(false)
-      }
-    } else {
-      toast.error('New Password, Confirm Password must be same')
-      setIsLoading(false)
-    }
-  }
-
-  const fields = [
-    { label: 'Old Password', name: 'oldPassword' },
-    { label: 'New Password', name: 'newPassword' },
-    { label: 'Confirm Password', name: 'confirmPassword' },
-  ]
-
-  return (
-    <form onSubmit={handleSubmit(onSubmit)}>
-      <Stack gap={2} direction="column">
-        {fields.map((item) => {
-          return (
-            <>
-              <FormTextField
-                label={item.label}
-                control={control}
-                name={item.name}
-                type={showPassword[item.name] ? 'text' : 'password'}
-                required
-                InputProps={{
-                  endAdornment: (
-                    <InputAdornment position="end">
-                      <IconButton
-                        size="small"
-                        onClick={() =>
-                          setShowPassword((prev) => ({
-                            ...prev,
-                            [item.name]: !prev[item.name],
-                          }))
-                        }
-                        edge="end"
-                      >
-                        {showPassword[item.name] ? (
-                          <VisibilityOff />
-                        ) : (
-                          <Visibility />
-                        )}
-                      </IconButton>
-                    </InputAdornment>
-                  ),
-                }}
-              />
-            </>
-          )
-        })}
-
-        <Stack direction={'row'} gap={2} sx={{ marginTop: '20px' }}>
-          <Button variant="outlined" onClick={close}>
-            Cancel
-          </Button>
-          <Button
-            type="submit"
-            endIcon={
-              isLoading && (
-                <CircularProgress
-                  style={{ color: 'white' }}
-                  size="30px"
-                  thickness={1.7}
-                />
-              )
-            }
-          >
-            Submit
-          </Button>
-        </Stack>
-      </Stack>
-    </form>
-  )
-}
-
-export default ChangePassword

package/src/components/Chips.tsx

@@ -1,81 +0,0 @@
-import { Chip, Stack, styled } from '@mui/material'
-import { ReactNode, useEffect, useState } from 'react'
-
-type IChip = {
-  label: string
-  value: string
-}
-
-interface ChipsProps {
-  list: { label: string | ReactNode; value: string | number }[]
-  selected: string[] | string | number
-  onSelected: (selected: IChip[] | any) => void
-  direction?: 'row' | 'column'
-  singleSelection?: boolean
-  toggle?: boolean
-}
-
-export default function Chips({
-  list = [],
-  selected: _selected,
-  onSelected,
-  direction = 'row',
-  singleSelection = true,
-  toggle = false,
-}: ChipsProps) {
-  const [selected, setSelected] = useState<any[] | any>([])
-
-  useEffect(() => {
-    setSelected(_selected)
-  }, [_selected])
-
-  const handleChange = (value) => {
-    if (singleSelection) {
-      if (selected === value && !toggle) {
-        setSelected('')
-        onSelected('')
-      } else {
-        setSelected(value)
-        onSelected(value)
-      }
-    } else {
-      if (selected.includes(value)) {
-        setSelected((prev) => prev.filter((item) => item !== value))
-        onSelected(selected.filter((item) => item !== value))
-      } else {
-        setSelected([...selected, value])
-        onSelected([...selected, value])
-      }
-    }
-  }
-
-  const isSelected = (value) =>
-    singleSelection ? selected === value : selected.includes(value)
-
-  return (
-    <Stack gap={'8px'} direction={direction} flexWrap={'wrap'}>
-      {list.map((item, index) => (
-        <StyledChip
-          key={index}
-          color={'primary'}
-          label={item.label}
-          clickable
-          variant={isSelected(item?.value) ? 'outlined' : 'filled'}
-          onClick={() => handleChange(item?.value)}
-        />
-      ))}
-    </Stack>
-  )
-}
-
-const StyledChip = styled(Chip)(({ theme }) => ({
-  minWidth: '100px',
-  '&.MuiButtonBase-root.MuiChip-filled': {
-    background: theme.palette.secondary.light,
-    color: theme.palette.text.primary,
-  },
-  height: '40px',
-  fontSize: '14px',
-  fontWeight: 500,
-  borderRadius: '20px',
-}))

package/src/components/Detail.tsx

@@ -1,15 +0,0 @@
-import React from 'react'
-
-interface DetailProps {
-  label: string
-  value: string | number
-}
-
-export default function Detail(props: DetailProps) {
-  return (
-    <div>
-      <div>{props.label}</div>
-      <h3>{props.value}</h3>
-    </div>
-  )
-}

package/src/components/DetailsGrid.tsx

@@ -1,52 +0,0 @@
-import { Box, BoxProps, styled, useTheme } from '@mui/material'
-import LabelValue from './LabelValue'
-import { ReactNode } from 'react'
-
-interface DetailsGridProps {
-  colCount: number
-  inverseLabels?: boolean
-  list: { label: ReactNode; value?: ReactNode }[]
-  noBorder?: boolean
-  space?: number
-}
-
-const StyledGrid = styled(Box, {
-  shouldForwardProp: (prop) => prop !== 'noBorder',
-})<{ cols: number; noBorder: boolean; space: number }>(
-  ({ theme, cols, noBorder, space }) => ({
-    padding: noBorder ? '1rem' : '20px',
-    marginTop: noBorder ? 0 : '1rem',
-    border: noBorder ? 'none' : theme.borders.grayLight,
-    display: 'grid',
-    gridTemplateColumns: `repeat(${cols}, 1fr)`,
-    gap: `${space}px`,
-    borderRadius: '10px',
-    [`& > :not(:nth-of-type(${cols}n))`]: {
-      borderRight: theme.borders.grayLight,
-    },
-    '& > :last-child': {
-      borderRight: 'none',
-    },
-  }),
-)
-
-export default function DetailsGrid({
-  colCount,
-  inverseLabels = false,
-  list,
-  noBorder = false,
-  space = 16,
-}: DetailsGridProps) {
-  return (
-    <StyledGrid cols={colCount} space={space} noBorder={noBorder}>
-      {list?.map((item, index) => (
-        <LabelValue
-          reverse={inverseLabels}
-          label={item?.label}
-          value={item?.value}
-          key={index}
-        />
-      ))}
-    </StyledGrid>
-  )
-}

package/src/components/DividerHeading.tsx

@@ -1,41 +0,0 @@
-import { Box, styled, Typography } from '@mui/material'
-import { ReactNode } from 'react'
-
-export default function DividerHeading({
-  title,
-  actions,
-}: {
-  title: string
-  actions?: ReactNode
-}) {
-  return (
-    <StyledContainer>
-      <Typography variant="h6">{title}</Typography>
-      {actions && <Box>{actions}</Box>}
-    </StyledContainer>
-  )
-}
-
-const StyledContainer = styled(Box)(({ theme }) => ({
-  margin: '20px 0',
-  paddingBottom: '5px',
-  borderBottom: theme.borders.grayLight,
-  display: 'flex',
-  justifyContent: 'space-between',
-  position: 'relative',
-  alignItems: 'baseline',
-  '& .MuiTypography-root': {
-    marginRight: 'auto',
-  },
-  '&::before': {
-    position: 'absolute',
-    left: 0,
-    bottom: -2,
-    borderRadius: '2px',
-    content: '""',
-    display: 'block',
-    width: '60px',
-    height: '4px',
-    backgroundColor: theme.palette.common.yellow,
-  },
-}))

package/src/components/DrawerWrapper/DialogWrapper.tsx

@@ -1,67 +0,0 @@
-import { Close } from '@mui/icons-material'
-import {
-  alpha,
-  Box,
-  Dialog,
-  DialogContent,
-  DialogProps,
-  IconButton,
-  styled,
-  Typography,
-} from '@mui/material'
-import { ReactNode } from 'react'
-
-const StyledDialogHeader = styled(Box)(({ theme }) => ({
-  height: '64px',
-  backgroundColor: alpha(theme.palette.text.secondary, 0.1),
-  display: 'flex',
-  justifyContent: 'space-between',
-  alignItems: 'center',
-  padding: '0.6rem 1rem',
-}))
-
-interface Props extends DialogProps {
-  onClose: () => void
-  children: ReactNode
-}
-
-export default function DialogWrapper({
-  title,
-  open,
-  onClose,
-  children,
-  ...props
-}: Props) {
-  return (
-    <Dialog
-      fullWidth
-      sx={{
-        zIndex: 500,
-        minHeight: '70vh',
-        '& .MuiDialog-container': {
-          '& .MuiPaper-root': {
-            maxWidth: '1420px',
-          },
-        },
-      }}
-      onClose={onClose}
-      open={open}
-      {...props}
-      PaperProps={{
-        sx: {
-          borderRadius: '10px',
-        },
-      }}
-    >
-      <StyledDialogHeader>
-        <Typography fontWeight={600}>{title}</Typography>
-        <IconButton onClick={onClose}>
-          <Close />
-        </IconButton>
-      </StyledDialogHeader>
-      <DialogContent sx={{ padding: '0' }}>
-        <>{children}</>
-      </DialogContent>
-    </Dialog>
-  )
-}

package/src/components/DrawerWrapper/DrawerTemplate.tsx

@@ -1,53 +0,0 @@
-import { Close } from '@mui/icons-material'
-import {
-  alpha,
-  Box,
-  Drawer,
-  IconButton,
-  styled,
-  Typography,
-} from '@mui/material'
-
-const StyledDrawerHeader = styled(Box)(({ theme }) => ({
-  height: '64px',
-  backgroundColor: alpha(theme.palette.text.secondary, 0.1),
-  display: 'flex',
-  justifyContent: 'space-between',
-  alignItems: 'center',
-  padding: '0.6rem 1rem',
-}))
-
-const StyledDrawerContent = styled(Box)(({ theme }) => ({
-  padding: '1rem',
-  height: 'calc(100vh - 64px)',
-  overflowY: 'auto',
-  paddingBottom: '4rem',
-}))
-
-export const DrawerTemplate = ({ handleClose, modal, setModal }) => {
-  return (
-    <Drawer
-      anchor="right"
-      elevation={10}
-      onClose={handleClose}
-      open={modal.open}
-      sx={{
-        zIndex: 500,
-        '& .MuiDrawer-paper': {
-          boxSizing: 'border-box',
-          width: 600,
-        },
-      }}
-    >
-      <StyledDrawerHeader>
-        <Typography fontWeight={600}>{modal.title}</Typography>
-        <IconButton onClick={() => setModal({ ...modal, open: false })}>
-          <Close />
-        </IconButton>
-      </StyledDrawerHeader>
-      <StyledDrawerContent>
-        {modal.content({ close: handleClose })}
-      </StyledDrawerContent>
-    </Drawer>
-  )
-}

package/src/components/DrawerWrapper/DrawerWrapper.tsx

@@ -1,53 +0,0 @@
-import { createContext, useContext, useState } from 'react'
-import { DrawerTemplate } from './DrawerTemplate'
-
-interface IProps {
-  title: string
-  modalType?: 'dialog' | 'drawer'
-  content: ({ close }: { close: () => void }) => any
-}
-
-type ContextType = (props: IProps) => void
-
-const DialogContext = createContext<ContextType>(null)
-
-export default function DialogProvider({ children }) {
-  const [modal, setModal] = useState({
-    title: '',
-    open: false,
-    content: ({ close }) => null,
-    modalType: 'drawer',
-  })
-
-  const handleClose = () => {
-    setModal({
-      ...modal,
-      open: false,
-    })
-  }
-
-  const showModal = (props) => {
-    setModal({
-      ...modal,
-      open: true,
-      title: props.title,
-      content: props.content,
-      // modalType: props.modalType ?? 'drawer',
-    })
-  }
-
-  return (
-    <DialogContext.Provider value={showModal}>
-      {children}
-      <>
-        <DrawerTemplate
-          handleClose={handleClose}
-          modal={modal}
-          setModal={setModal}
-        />
-      </>
-    </DialogContext.Provider>
-  )
-}
-
-export const useModal = () => useContext(DialogContext)

package/src/components/DropDownButton/AnchorElement.tsx

@@ -1,44 +0,0 @@
-import { KeyboardArrowDown } from '@mui/icons-material'
-import { CircularProgress } from '@mui/material'
-import { StyledDropDownButton, StyledIconButton } from './styles'
-
-export default function AnchorElement({
-  button,
-  icon,
-  handleClick,
-  loading,
-  anchor,
-}) {
-  if (anchor) return <>{anchor({ open: handleClick })}</>
-
-  if (button)
-    return (
-      <StyledDropDownButton
-        onClick={handleClick}
-        variant="outlined"
-        disabled={loading}
-        endIcon={
-          loading ? (
-            <CircularProgress size="20px" thickness={1.7} />
-          ) : (
-            <KeyboardArrowDown />
-          )
-        }
-        {...button?.buttonProps}
-      >
-        {button?.label}
-      </StyledDropDownButton>
-    )
-
-  if (!button && !anchor) {
-    return (
-      <StyledIconButton
-        outlined={icon?.outlined ?? false}
-        onClick={handleClick}
-        {...icon.iconProps}
-      >
-        {icon.icon}
-      </StyledIconButton>
-    )
-  }
-}