Sep 19, 2025 02:10 Show only task strictly on the left side and details on the right side - Follow Up Deployment 02:07 Show only task strictly on the left side and details on the right side - Follow Up Deployment 02:02 Don't show the photos and update box on the task list. Just show them when the task name has been click. - Follow Up Deployment 01:51 Change the title from Simple CRM Tasks into MBWA(Management By Wandering Around) - Follow Up Deployment 01:44 For the task kindly add an upload button for photo if no initial photo is attached once task has been added - Follow Up Deployment 01:40 Always sort task base on location choices in this order Berthaphil I, Berthaphil II South, Berthaphil II North, Berthaphil II Office Park, Clark Center, Berthaphil IV, Berthaphil VI, and Berthaphil VIII - Follow Up Deployment 01:34 Once a progress has been completed a button will appear on the task bar for the deletion of task. Add also a filter for location - Follow Up Deployment 01:29 The delete function is being removed when I change the progress. Make the delete function steady in the task bar - Follow Up Deployment 01:25 For Location put a selection box for Berthaphil I, Berthaphil II South, Berthaphil II North, Berthaphil Office Park, Clark Center, Berthaphil IV, Berthaphil VI, and Berthaphil VIII - Follow Up Deployment 01:22 Add location to create task bubble. Just show the Task and Location in the task area - Follow Up Deployment Sep 18, 2025 16:10 CAn you make this project shareable to other especially when inputs are placed - Follow Up Deployment 16:05 Add an upload image to task as an update for the completed task. Photo must be selected from file - Follow Up Deployment 16:01 Add also filter by assigned to - Follow Up Deployment 15:52 import React, { useEffect, useState } from "react"; type Status = "Todo" | "In Progress" | "Blocked" | "Done";
interface TaskComment {
id: string;
text: string;
createdAt: string; // ISO string
}
interface Task {
id: string;
title: string;
assignedTo: string;
dateReported: string; // YYYY-MM-DD
status: Status;
imageDataUrl?: string;
comments: TaskComment[];
createdAt: string; // ISO string
}
const STATUS_OPTIONS: Status[] = ["Todo", "In Progress", "Blocked", "Done"];
function formatDate(dateStr: string): string {
if (!dateStr) return "";
const [y, m, d] = dateStr.split("-").map(Number);
const dt = new Date(y || 0, (m || 1) - 1, d || 1);
return dt.toLocaleDateString();
}
function statusBadgeClasses(status: Status): string {
switch (status) {
case "Todo":
return "bg-gray-100 text-gray-700 border-gray-200";
case "In Progress":
return "bg-blue-100 text-blue-700 border-blue-200";
case "Blocked":
return "bg-red-100 text-red-700 border-red-200";
case "Done":
return "b… 15:52 initial commit 
