@canmingir/link 1.1.7 → 1.2.0

package/minimal/src/sections/kanban/kanban-column.jsx

@@ -1,202 +0,0 @@
-import PropTypes from 'prop-types';
-import { useCallback } from 'react';
-import { Droppable, Draggable } from '@hello-pangea/dnd';
-
-import Paper from '@mui/material/Paper';
-import Stack from '@mui/material/Stack';
-import Button from '@mui/material/Button';
-import { alpha } from '@mui/material/styles';
-
-import { useBoolean } from 'src/hooks/use-boolean';
-
-import {
-  createTask,
-  updateTask,
-  deleteTask,
-  clearColumn,
-  updateColumn,
-  deleteColumn,
-} from 'src/api/kanban';
-
-import Iconify from 'src/components/iconify';
-import { useSnackbar } from 'src/components/snackbar';
-
-import KanbanTaskAdd from './kanban-task-add';
-import KanbanTaskItem from './kanban-task-item';
-import KanbanColumnToolBar from './kanban-column-tool-bar';
-
-// ----------------------------------------------------------------------
-
-export default function KanbanColumn({ column, tasks, index }) {
-  const { enqueueSnackbar } = useSnackbar();
-
-  const openAddTask = useBoolean();
-
-  const handleUpdateColumn = useCallback(
-    async (columnName) => {
-      try {
-        if (column.name !== columnName) {
-          updateColumn(column.id, columnName);
-
-          enqueueSnackbar('Update success!', {
-            anchorOrigin: { vertical: 'top', horizontal: 'center' },
-          });
-        }
-      } catch (error) {
-        console.error(error);
-      }
-    },
-    [column.id, column.name, enqueueSnackbar]
-  );
-
-  const handleClearColumn = useCallback(async () => {
-    try {
-      clearColumn(column.id);
-    } catch (error) {
-      console.error(error);
-    }
-  }, [column.id]);
-
-  const handleDeleteColumn = useCallback(async () => {
-    try {
-      deleteColumn(column.id);
-
-      enqueueSnackbar('Delete success!', {
-        anchorOrigin: { vertical: 'top', horizontal: 'center' },
-      });
-    } catch (error) {
-      console.error(error);
-    }
-  }, [column.id, enqueueSnackbar]);
-
-  const handleAddTask = useCallback(
-    async (taskData) => {
-      try {
-        createTask(column.id, taskData);
-
-        openAddTask.onFalse();
-      } catch (error) {
-        console.error(error);
-      }
-    },
-    [column.id, openAddTask]
-  );
-
-  const handleUpdateTask = useCallback(async (taskData) => {
-    try {
-      updateTask(taskData);
-    } catch (error) {
-      console.error(error);
-    }
-  }, []);
-
-  const handleDeleteTask = useCallback(
-    async (taskId) => {
-      try {
-        deleteTask(column.id, taskId);
-
-        enqueueSnackbar('Delete success!', {
-          anchorOrigin: { vertical: 'top', horizontal: 'center' },
-        });
-      } catch (error) {
-        console.error(error);
-      }
-    },
-    [column.id, enqueueSnackbar]
-  );
-
-  const renderAddTask = (
-    <Stack
-      spacing={2}
-      sx={{
-        pb: 3,
-      }}
-    >
-      {openAddTask.value && (
-        <KanbanTaskAdd
-          status={column.name}
-          onAddTask={handleAddTask}
-          onCloseAddTask={openAddTask.onFalse}
-        />
-      )}
-
-      <Button
-        fullWidth
-        size="large"
-        color="inherit"
-        startIcon={
-          <Iconify
-            icon={openAddTask.value ? 'solar:close-circle-broken' : 'mingcute:add-line'}
-            width={18}
-            sx={{ mr: -0.5 }}
-          />
-        }
-        onClick={openAddTask.onToggle}
-        sx={{ fontSize: 14 }}
-      >
-        {openAddTask.value ? 'Close' : 'Add Task'}
-      </Button>
-    </Stack>
-  );
-
-  return (
-    <Draggable draggableId={column.id} index={index}>
-      {(provided, snapshot) => (
-        <Paper
-          ref={provided.innerRef}
-          {...provided.draggableProps}
-          sx={{
-            px: 2,
-            borderRadius: 2,
-            bgcolor: 'background.neutral',
-            ...(snapshot.isDragging && {
-              bgcolor: (theme) => alpha(theme.palette.grey[500], 0.24),
-            }),
-          }}
-        >
-          <Stack {...provided.dragHandleProps}>
-            <KanbanColumnToolBar
-              columnName={column.name}
-              onUpdateColumn={handleUpdateColumn}
-              onClearColumn={handleClearColumn}
-              onDeleteColumn={handleDeleteColumn}
-            />
-
-            <Droppable droppableId={column.id} type="TASK">
-              {(dropProvided) => (
-                <Stack
-                  ref={dropProvided.innerRef}
-                  {...dropProvided.droppableProps}
-                  spacing={2}
-                  sx={{
-                    py: 3,
-                    width: 280,
-                  }}
-                >
-                  {column.taskIds.map((taskId, taskIndex) => (
-                    <KanbanTaskItem
-                      key={taskId}
-                      index={taskIndex}
-                      task={tasks[taskId]}
-                      onUpdateTask={handleUpdateTask}
-                      onDeleteTask={() => handleDeleteTask(taskId)}
-                    />
-                  ))}
-                  {dropProvided.placeholder}
-                </Stack>
-              )}
-            </Droppable>
-
-            {renderAddTask}
-          </Stack>
-        </Paper>
-      )}
-    </Draggable>
-  );
-}
-
-KanbanColumn.propTypes = {
-  column: PropTypes.object,
-  index: PropTypes.number,
-  tasks: PropTypes.object,
-};

package/minimal/src/sections/kanban/kanban-contacts-dialog.jsx

@@ -1,138 +0,0 @@
-import PropTypes from 'prop-types';
-import { useState, useCallback } from 'react';
-
-import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
-import Avatar from '@mui/material/Avatar';
-import Dialog from '@mui/material/Dialog';
-import ListItem from '@mui/material/ListItem';
-import TextField from '@mui/material/TextField';
-import Typography from '@mui/material/Typography';
-import DialogTitle from '@mui/material/DialogTitle';
-import ListItemText from '@mui/material/ListItemText';
-import DialogContent from '@mui/material/DialogContent';
-import InputAdornment from '@mui/material/InputAdornment';
-import ListItemAvatar from '@mui/material/ListItemAvatar';
-
-import { _contacts } from 'src/_mock';
-
-import Iconify from 'src/components/iconify';
-import Scrollbar from 'src/components/scrollbar';
-import SearchNotFound from 'src/components/search-not-found';
-
-// ----------------------------------------------------------------------
-
-const ITEM_HEIGHT = 64;
-
-export default function KanbanContactsDialog({ assignee = [], open, onClose }) {
-  const [searchContact, setSearchContact] = useState('');
-
-  const handleSearchContacts = useCallback((event) => {
-    setSearchContact(event.target.value);
-  }, []);
-
-  const dataFiltered = applyFilter({
-    inputData: _contacts,
-    query: searchContact,
-  });
-
-  const notFound = !dataFiltered.length && !!searchContact;
-
-  return (
-    <Dialog fullWidth maxWidth="xs" open={open} onClose={onClose}>
-      <DialogTitle sx={{ pb: 0 }}>
-        Contacts <Typography component="span">({_contacts.length})</Typography>
-      </DialogTitle>
-
-      <Box sx={{ px: 3, py: 2.5 }}>
-        <TextField
-          fullWidth
-          value={searchContact}
-          onChange={handleSearchContacts}
-          placeholder="Search..."
-          InputProps={{
-            startAdornment: (
-              <InputAdornment position="start">
-                <Iconify icon="eva:search-fill" sx={{ color: 'text.disabled' }} />
-              </InputAdornment>
-            ),
-          }}
-        />
-      </Box>
-
-      <DialogContent sx={{ p: 0 }}>
-        {notFound ? (
-          <SearchNotFound query={searchContact} sx={{ mt: 3, mb: 10 }} />
-        ) : (
-          <Scrollbar
-            sx={{
-              px: 2.5,
-              height: ITEM_HEIGHT * 6,
-            }}
-          >
-            {dataFiltered.map((contact) => {
-              const checked = assignee.map((person) => person.name).includes(contact.name);
-
-              return (
-                <ListItem
-                  key={contact.id}
-                  disableGutters
-                  secondaryAction={
-                    <Button
-                      size="small"
-                      color={checked ? 'primary' : 'inherit'}
-                      startIcon={
-                        <Iconify
-                          width={16}
-                          icon={checked ? 'eva:checkmark-fill' : 'mingcute:add-line'}
-                          sx={{ mr: -0.5 }}
-                        />
-                      }
-                    >
-                      {checked ? 'Assigned' : 'Assign'}
-                    </Button>
-                  }
-                  sx={{ height: ITEM_HEIGHT }}
-                >
-                  <ListItemAvatar>
-                    <Avatar src={contact.avatarUrl} />
-                  </ListItemAvatar>
-
-                  <ListItemText
-                    primaryTypographyProps={{
-                      typography: 'subtitle2',
-                      sx: { mb: 0.25 },
-                    }}
-                    secondaryTypographyProps={{ typography: 'caption' }}
-                    primary={contact.name}
-                    secondary={contact.email}
-                  />
-                </ListItem>
-              );
-            })}
-          </Scrollbar>
-        )}
-      </DialogContent>
-    </Dialog>
-  );
-}
-
-KanbanContactsDialog.propTypes = {
-  open: PropTypes.bool,
-  onClose: PropTypes.func,
-  assignee: PropTypes.array,
-};
-
-// ----------------------------------------------------------------------
-
-function applyFilter({ inputData, query }) {
-  if (query) {
-    inputData = inputData.filter(
-      (contact) =>
-        contact.name.toLowerCase().indexOf(query.toLowerCase()) !== -1 ||
-        contact.email.toLowerCase().indexOf(query.toLowerCase()) !== -1
-    );
-  }
-
-  return inputData;
-}

package/minimal/src/sections/kanban/kanban-details-attachments.jsx

@@ -1,50 +0,0 @@
-import PropTypes from 'prop-types';
-import { useState, useCallback } from 'react';
-
-import Stack from '@mui/material/Stack';
-
-import { UploadBox, MultiFilePreview } from 'src/components/upload';
-
-// ----------------------------------------------------------------------
-
-export default function KanbanDetailsAttachments({ attachments }) {
-  const [files, setFiles] = useState(attachments);
-
-  const handleDrop = useCallback(
-    (acceptedFiles) => {
-      const newFiles = acceptedFiles.map((file) =>
-        Object.assign(file, {
-          preview: URL.createObjectURL(file),
-        })
-      );
-
-      setFiles([...files, ...newFiles]);
-    },
-    [files]
-  );
-
-  const handleRemoveFile = useCallback(
-    (inputFile) => {
-      const filtered = files.filter((file) => file !== inputFile);
-      setFiles(filtered);
-    },
-    [files]
-  );
-
-  return (
-    <Stack direction="row" flexWrap="wrap">
-      <MultiFilePreview
-        thumbnail
-        files={files}
-        onRemove={(file) => handleRemoveFile(file)}
-        sx={{ width: 64, height: 64 }}
-      />
-
-      <UploadBox onDrop={handleDrop} />
-    </Stack>
-  );
-}
-
-KanbanDetailsAttachments.propTypes = {
-  attachments: PropTypes.array,
-};

package/minimal/src/sections/kanban/kanban-details-comment-input.jsx

@@ -1,47 +0,0 @@
-import Paper from '@mui/material/Paper';
-import Stack from '@mui/material/Stack';
-import Button from '@mui/material/Button';
-import Avatar from '@mui/material/Avatar';
-import InputBase from '@mui/material/InputBase';
-import IconButton from '@mui/material/IconButton';
-
-import { useMockedUser } from 'src/hooks/use-mocked-user';
-
-import Iconify from 'src/components/iconify';
-
-// ----------------------------------------------------------------------
-
-export default function KanbanDetailsCommentInput() {
-  const { user } = useMockedUser();
-
-  return (
-    <Stack
-      direction="row"
-      spacing={2}
-      sx={{
-        py: 3,
-        px: 2.5,
-      }}
-    >
-      <Avatar src={user?.photoURL} alt={user?.displayName} />
-
-      <Paper variant="outlined" sx={{ p: 1, flexGrow: 1, bgcolor: 'transparent' }}>
-        <InputBase fullWidth multiline rows={2} placeholder="Type a message" sx={{ px: 1 }} />
-
-        <Stack direction="row" alignItems="center">
-          <Stack direction="row" flexGrow={1}>
-            <IconButton>
-              <Iconify icon="solar:gallery-add-bold" />
-            </IconButton>
-
-            <IconButton>
-              <Iconify icon="eva:attach-2-fill" />
-            </IconButton>
-          </Stack>
-
-          <Button variant="contained">Comment</Button>
-        </Stack>
-      </Paper>
-    </Stack>
-  );
-}

package/minimal/src/sections/kanban/kanban-details-comment-list.jsx

@@ -1,78 +0,0 @@
-import PropTypes from 'prop-types';
-
-import Stack from '@mui/material/Stack';
-import Avatar from '@mui/material/Avatar';
-import Typography from '@mui/material/Typography';
-
-import { fToNow } from 'src/utils/format-time';
-
-import Image from 'src/components/image';
-import Lightbox, { useLightBox } from 'src/components/lightbox';
-
-// ----------------------------------------------------------------------
-
-export default function KanbanDetailsCommentList({ comments }) {
-  const slides = comments
-    .filter((comment) => comment.messageType === 'image')
-    .map((slide) => ({ src: slide.message }));
-
-  const lightbox = useLightBox(slides);
-
-  return (
-    <>
-      <Stack
-        spacing={3}
-        flexGrow={1}
-        sx={{
-          py: 3,
-          px: 2.5,
-          bgcolor: 'background.neutral',
-        }}
-      >
-        {comments.map((comment) => (
-          <Stack key={comment.id} direction="row" spacing={2}>
-            <Avatar src={comment.avatarUrl} />
-
-            <Stack spacing={comment.messageType === 'image' ? 1 : 0.5} flexGrow={1}>
-              <Stack direction="row" alignItems="center" justifyContent="space-between">
-                <Typography variant="subtitle2"> {comment.name}</Typography>
-                <Typography variant="caption" sx={{ color: 'text.disabled' }}>
-                  {fToNow(comment.createdAt)}
-                </Typography>
-              </Stack>
-
-              {comment.messageType === 'image' ? (
-                <Image
-                  alt={comment.message}
-                  src={comment.message}
-                  onClick={() => lightbox.onOpen(comment.message)}
-                  sx={{
-                    borderRadius: 1.5,
-                    cursor: 'pointer',
-                    transition: (theme) => theme.transitions.create(['opacity']),
-                    '&:hover': {
-                      opacity: 0.8,
-                    },
-                  }}
-                />
-              ) : (
-                <Typography variant="body2">{comment.message}</Typography>
-              )}
-            </Stack>
-          </Stack>
-        ))}
-      </Stack>
-
-      <Lightbox
-        index={lightbox.selected}
-        slides={slides}
-        open={lightbox.open}
-        close={lightbox.onClose}
-      />
-    </>
-  );
-}
-
-KanbanDetailsCommentList.propTypes = {
-  comments: PropTypes.array,
-};

package/minimal/src/sections/kanban/kanban-details-priority.jsx

@@ -1,62 +0,0 @@
-import PropTypes from 'prop-types';
-
-import Stack from '@mui/material/Stack';
-import { alpha } from '@mui/material/styles';
-import ButtonBase from '@mui/material/ButtonBase';
-
-import Iconify from 'src/components/iconify';
-
-// ----------------------------------------------------------------------
-
-export default function KanbanDetailsPriority({ priority, onChangePriority }) {
-  return (
-    <Stack direction="row" flexWrap="wrap" spacing={1}>
-      {['low', 'medium', 'hight'].map((option) => (
-        <ButtonBase
-          key={option}
-          onClick={() => onChangePriority(option)}
-          sx={{
-            py: 0.5,
-            pl: 0.75,
-            pr: 1.25,
-            fontSize: 12,
-            borderRadius: 1,
-            lineHeight: '20px',
-            textTransform: 'capitalize',
-            fontWeight: 'fontWeightBold',
-            boxShadow: (theme) => `inset 0 0 0 1px ${alpha(theme.palette.grey[500], 0.24)}`,
-            ...(option === priority && {
-              boxShadow: (theme) => `inset 0 0 0 2px ${theme.palette.text.primary}`,
-            }),
-          }}
-        >
-          <Iconify
-            icon={
-              (option === 'low' && 'solar:double-alt-arrow-down-bold-duotone') ||
-              (option === 'medium' && 'solar:double-alt-arrow-right-bold-duotone') ||
-              'solar:double-alt-arrow-up-bold-duotone'
-            }
-            sx={{
-              mr: 0.5,
-              ...(option === 'low' && {
-                color: 'info.main',
-              }),
-              ...(option === 'medium' && {
-                color: 'warning.main',
-              }),
-              ...(option === 'hight' && {
-                color: 'error.main',
-              }),
-            }}
-          />
-
-          {option}
-        </ButtonBase>
-      ))}
-    </Stack>
-  );
-}
-KanbanDetailsPriority.propTypes = {
-  priority: PropTypes.string,
-  onChangePriority: PropTypes.func,
-};