5주차 칸반보드 개선 회의

이벤트랑 CRUD 분리

디테일에서 발생하는 수정들 → CRUD

수정 사항 중 보드 뷰에 반영되야 할 정보는

• ASSIGNEES_CHANGED →3순위
• LABELS_CHAGNED → 2순위
• TASK_DELETED → 1순위
• SUBTASK_CHANGED → 후순위

→ event 로 오면 클라이언트는 부분 수정으로 반영할 예정.

→ 클라이언트는 초기 값을 로딩하고 그 이후로는 상태로 가지고 있다.

→ 클라이언트에서 sharedb doc 형태를 들고 있고, 객체 형태 그리고 이벤트를 수신해서 업데이트를 하겠다.

그럼 보드 뷰에서 발생시킬 수 있는 이벤트들은 무엇인가?

• CREATE_TASK
• UPDATE_POSITION
• INSERT_TITLE
• DELETE_TITLE

→ TASK_CREATED → 0순위

→ POSITION_UPDATED → 0순위

→ TITLE_UPATED → 0순위

+ 롱폴링 유지

1. 칸반보드의 작업이 실시간으로 보임 → 현재 이상하게 동작하는 것 개선
2. 디테일 내부에서의 특정 작업이 외부에 보임

Request

// /project/:projectId/update

type CreateTaskPayload = {
	event: "CREATE_TASK";
	sectionId: number;
	position: string;
}

type UpdatePositionPayload = {
  event: "UPDATE_POSITION";
  taskId: number;
  sectionId: number;
  position: string;
}

type UpdateTitlePayload = {
  event: "INSERT_TITLE" | "DELETE_TITLE",
  taskId: number;
  title: {
	  position: number;
	  content: string;
	  length: number;
	}
}
  

Response

// /event?projectId=:projectId

type CreatedEvent = {
	event: "TASK_CREATED";
	task: {
		id: number;
		title: string; // ''
		sectionId: number;
		position: string;
		assignees: Assignee[]; // []
		labels: Label[]; // []
		subtasks: {
			total: 0;
			completed: 0;
		}
	}
}

type PositionUpdatedEvent = {
	event: "POSITION_UPDATED";
	task: {
		id: number;
		sectionId: number;
		position: string;
	}
}

type TitleUpdatedEvent = {
	event: "TITLE_UPDATED";
	task: {
		id: number;
		title: string;
	}
}

type DeletedEvent = {
	event: "TASK_DELETED";
	task: {
		id: number;
	}
}

type AssigneesChangedEvent = {
	event: "ASSIGNEES_CHANGED";
	task: {
		id: number;
		assignees: Assignee[];
	}
}

type LabelsChangedEvent = {
	event: "LABELS_CHANGED";
	task: {
		id: number;
		labels: Label[];
	}
}

type SubtaskChangedEvent = {
	event: "SUBTASK_CHANGED";
	task: {
		id: number;
		subtasks: {
			total: 0;
			completed: 0;
		}
	}
}