62 lines
2.3 KiB
TypeScript
62 lines
2.3 KiB
TypeScript
import { FunctionalComponent, h, Fragment } from "preact";
|
||
import { Project } from "../../models/project";
|
||
import TaskTable from "./tasks-table";
|
||
import TimePreview from "./time-preview";
|
||
import FinancialPreview from "./financial-preview";
|
||
import { addTask, updateTaskEstimation, removeTask, updateProjectLabel, updateTaskLabel, ProjectReducerActions } from "../../hooks/use-project-reducer";
|
||
import { Task, TaskID, EstimationConfidence } from "../../models/task";
|
||
|
||
export interface EstimationTabProps {
|
||
project: Project
|
||
dispatch: (action: ProjectReducerActions) => void
|
||
}
|
||
|
||
const EstimationTab: FunctionalComponent<EstimationTabProps> = ({ project, dispatch }) => {
|
||
const onTaskAdd = (task: Task) => {
|
||
dispatch(addTask(task));
|
||
};
|
||
|
||
const onTaskRemove = (taskId: TaskID) => {
|
||
dispatch(removeTask(taskId));
|
||
}
|
||
|
||
const onTaskLabelUpdate = (taskId: TaskID, label: string) => {
|
||
dispatch(updateTaskLabel(taskId, label));
|
||
}
|
||
|
||
const onEstimationChange = (taskId: TaskID, confidence: EstimationConfidence, value: number) => {
|
||
dispatch(updateTaskEstimation(taskId, confidence, value));
|
||
};
|
||
|
||
return (
|
||
<Fragment>
|
||
<div class="columns">
|
||
<div class="column is-9">
|
||
<TaskTable
|
||
project={project}
|
||
onTaskAdd={onTaskAdd}
|
||
onTaskRemove={onTaskRemove}
|
||
onTaskLabelUpdate={onTaskLabelUpdate}
|
||
onEstimationChange={onEstimationChange} />
|
||
</div>
|
||
<div class="column is-3">
|
||
<TimePreview project={project} />
|
||
<FinancialPreview project={project} />
|
||
</div>
|
||
</div>
|
||
{
|
||
Object.keys(project.tasks).length <= 20 ?
|
||
<div class="message noPrint">
|
||
<div class="message-body">
|
||
<p><strong>⚠️ Attention</strong></p>
|
||
<p>Votre projet ne contient pas assez de tâches pour que les niveaux de confiance soient fiables. Un minimum de 20 tâches est conseillé pour obtenir une estimation pertinente.</p>
|
||
</div>
|
||
</div> :
|
||
null
|
||
}
|
||
</Fragment>
|
||
);
|
||
};
|
||
|
||
export default EstimationTab;
|