55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
import React, { FC } from "react";
|
|
import { Box, Group, Text } from "@mantine/core";
|
|
import { modals } from "@mantine/modals";
|
|
import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext";
|
|
import ProjectMenu from "@/app/deals/drawers/ProjectsEditorDrawer/components/ProjectMenu";
|
|
import { ProjectSchema } from "@/lib/client";
|
|
import styles from "./../ProjectsEditorDrawer.module.css";
|
|
|
|
type Props = {
|
|
project: ProjectSchema;
|
|
};
|
|
|
|
const ProjectMobile: FC<Props> = ({ project }) => {
|
|
const { onUpdateProject, setSelectedProject, setIsEditorDrawerOpened } =
|
|
useProjectsContext();
|
|
|
|
const startEditing = () => {
|
|
modals.openContextModal({
|
|
modal: "enterNameModal",
|
|
title: "Редактирование проекта",
|
|
withCloseButton: true,
|
|
innerProps: {
|
|
onComplete: name => onUpdateProject(project.id, { name }),
|
|
defaultValue: project.name,
|
|
},
|
|
});
|
|
};
|
|
|
|
const onClick = () => {
|
|
setSelectedProject(project);
|
|
setIsEditorDrawerOpened(false);
|
|
};
|
|
|
|
return (
|
|
<Group
|
|
w={"100%"}
|
|
pl={"xs"}
|
|
py={"xs"}
|
|
justify={"space-between"}
|
|
wrap={"nowrap"}
|
|
className={styles.project}
|
|
onClick={onClick}>
|
|
<Box>
|
|
<Text>{project.name}</Text>
|
|
</Box>
|
|
<ProjectMenu
|
|
project={project}
|
|
startEditing={startEditing}
|
|
/>
|
|
</Group>
|
|
);
|
|
};
|
|
|
|
export default ProjectMobile;
|