Fixes a bug where editing a pipeline step's title or color in the board changes the column's label to the column's uuid and the color to gray.
60 lines
1.7 KiB
TypeScript
60 lines
1.7 KiB
TypeScript
import styled from '@emotion/styled';
|
|
|
|
import { CompanyBoard } from '@/companies/board/components/CompanyBoard';
|
|
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
|
import { PipelineAddButton } from '@/pipeline/components/PipelineAddButton';
|
|
import { usePipelineSteps } from '@/pipeline/hooks/usePipelineSteps';
|
|
import { PipelineStep } from '@/pipeline/types/PipelineStep';
|
|
import { IconTargetArrow } from '@/ui/display/icon';
|
|
import { PageBody } from '@/ui/layout/page/PageBody';
|
|
import { PageContainer } from '@/ui/layout/page/PageContainer';
|
|
import { PageHeader } from '@/ui/layout/page/PageHeader';
|
|
|
|
const StyledBoardContainer = styled.div`
|
|
display: flex;
|
|
height: 100%;
|
|
width: 100%;
|
|
`;
|
|
|
|
export const Opportunities = () => {
|
|
const { handlePipelineStepAdd, handlePipelineStepDelete } =
|
|
usePipelineSteps();
|
|
|
|
const { updateOneRecord: updateOnePipelineStep } =
|
|
useUpdateOneRecord<PipelineStep>({
|
|
objectNameSingular: 'pipelineStep',
|
|
});
|
|
|
|
const handleEditColumnTitle = ({
|
|
columnId,
|
|
title,
|
|
color,
|
|
}: {
|
|
columnId: string;
|
|
title: string;
|
|
color: string;
|
|
}) => {
|
|
updateOnePipelineStep?.({
|
|
idToUpdate: columnId,
|
|
input: { name: title, color },
|
|
});
|
|
};
|
|
|
|
return (
|
|
<PageContainer>
|
|
<PageHeader title="Opportunities" Icon={IconTargetArrow}>
|
|
<PipelineAddButton />
|
|
</PageHeader>
|
|
<PageBody>
|
|
<StyledBoardContainer>
|
|
<CompanyBoard
|
|
onColumnAdd={handlePipelineStepAdd}
|
|
onColumnDelete={handlePipelineStepDelete}
|
|
onEditColumnTitle={handleEditColumnTitle}
|
|
/>
|
|
</StyledBoardContainer>
|
|
</PageBody>
|
|
</PageContainer>
|
|
);
|
|
};
|