Skip to main content

Overview

Task comments enable team collaboration by allowing users to add notes, updates, and communication directly to photography orders. Comments are attached to specific tasks and visible to all team members on the network.
Comments keep all communication about an order in one place, eliminating the need for separate messaging or sticky notes.

Comment Data Model

Comments are stored in the task_comments table with the following structure:
interface TaskComment {
  id: number;           // Unique identifier
  created_at: DateTime; // Timestamp
  task_id: number;      // Reference to parent task
  comment: string;      // Comment text
}
The Prisma schema defines this relationship:
model task_comments {
  id         Int      @id @default(autoincrement())
  created_at DateTime @default(now())
  task       Tasks    @relation(fields: [task_id], references: [id], onDelete: Cascade)
  task_id    Int
  comment    String

  @@map("task_comments")
}

model Tasks {
  // ... other fields
  task_comments          task_comments[]
  amount_of_comments     Int             @default(0)
}
Comments use cascading delete - when a task is deleted, all associated comments are automatically removed.

Adding Comments

Add comments to tasks to track progress, note issues, or communicate with your team.

Via User Interface

1

Open Task

Click on a task card from the Kanban board or task overview to open its details.
2

Navigate to Comments Section

Scroll to the comments area within the task details modal or page.
3

Write Comment

Type your comment in the text field. Comments can include:
  • Status updates (“Photos edited and ready for review”)
  • Issues or blockers (“Client requested additional shots”)
  • Reminders (“Need to confirm delivery address”)
  • General notes (“Used 50mm lens for portraits”)
4

Submit

Click the submit or save button to add your comment.

Via API

Add comments programmatically using the API endpoint:
POST /api/addCommentToTask

Request Body:
{
  "task_id": 123,
  "comment": "Photos edited and sent to client for review"
}

Response:
"Successful!"

API Implementation

The comment creation endpoint is in src/routes/api/(comments)/addCommentToTask/+server.ts:
export const POST: RequestHandler = async ({ request }) => {
  try {
    const { task_id, comment } = await request.json();
    
    // Create the comment
    await prisma.task_comments.create({
      data: {
        task_id: task_id,
        comment: comment,
        created_at: new Date()
      }
    });
    
    // Increment the comment counter
    await prisma.tasks.update({
      where: { id: task_id },
      data: {
        amount_of_comments: { increment: 1 }
      }
    });
    
    return json('Successful!');
  } catch {
    return json('Invalid!');
  }
};
The amount_of_comments field on the task is automatically incremented when a comment is added, providing a quick count without querying all comments.

Viewing Comments

Comments are displayed chronologically within each task:

Comment Display

Each comment shows:
  • Comment text - The message content
  • Timestamp - When the comment was created
  • Comment ID - For reference or updates

Sorting

Comments are typically displayed in chronological order (oldest first) to show the conversation flow naturally.

Updating Comments

Modify existing comments when needed:

Via API

POST /api/updateCommentFromTask

Request Body:
{
  "comment_id": 45,
  "comment": "Updated: Photos sent to client and approved"
}

Response:
"Successful!"
When updating comments, consider prefixing with “Updated:” to indicate the comment was modified.

Deleting Comments

Deleting comments is permanent and cannot be undone.

Via API

POST /api/deleteCommentFromTask

Request Body:
{
  "comment_id": 45,
  "task_id": 123
}

Response:
"Successful!"
When a comment is deleted:
  1. The comment record is removed from task_comments
  2. The task’s amount_of_comments is decremented
  3. Changes sync to all connected clients

Comment Counter

Tasks track the number of comments for quick reference:
amount_of_comments: number;  // Displayed on task cards
This counter:
  • Increments when comments are added
  • Decrements when comments are deleted
  • Displays on Kanban cards to show activity level
  • Helps identify tasks with active discussions

Real-Time Collaboration

Comments benefit from PhotoFlow’s real-time synchronization:
1

User Adds Comment

A team member adds a comment to a task on their PC.
2

Database Updated

The comment is saved to PostgreSQL and the counter is incremented.
3

Socket.io Broadcast

The server broadcasts the update to all connected clients.
4

All Clients Refresh

Every PC sees the new comment immediately without manual refresh.
This allows multiple team members to discuss an order in real-time, similar to a chat application.

Use Cases

Progress Updates

“Finished shooting, importing photos now”Keep the team informed about where each order stands.

Client Communication

“Client requested 5 additional group shots”Log client requests and changes to requirements.

Technical Notes

“Used flash for indoor shots, ISO 800”Document technical decisions for future reference.

Issues and Blockers

“Waiting on client to confirm delivery date”Flag problems that need attention or resolution.

Handoffs

“Editing complete, ready for quality check”Signal when tasks move between team members.

Reminders

“Need to follow up with client on Friday”Add reminders for follow-up actions.

Best Practices

Clear Communication

Write comments that are:
  • Specific - Include relevant details
  • Actionable - State what needs to happen next
  • Concise - Get to the point quickly
  • Professional - Others will read these
Good examples:
✓ "Client approved proofs, starting final edits"
✓ "Issue: Missing shot of bride with parents. Requested reshoot."
✓ "Delivered 150 edited photos via cloud link"
Poor examples:
✗ "done"
✗ "working on it"
✗ "???"

Timestamps Are Automatic

No need to include dates/times in your comment text - the created_at field is automatically set:
created_at: new Date()  // Set automatically

Use for Team Communication

Comments are ideal for:
  • Questions that others need to answer
  • Status updates that affect the team
  • Notes that add context to the order

Avoid Sensitive Information

Don’t include sensitive information like:
  • Payment details
  • Client passwords or personal data
  • Private customer information
Keep comments professional and focused on the photography work.

Comment Notifications

While PhotoFlow doesn’t have built-in notifications, you can:
  1. Check comment counters - See at a glance which tasks have new activity
  2. Regularly review tasks - Open tasks to read new comments
  3. Use conventions - Prefix comments with “@Name” to indicate who should respond
Example:
"@John - Can you verify the client's delivery address?"

Database Relationships

Comments are linked to tasks via foreign key:
task_comments {
  task       Tasks    @relation(fields: [task_id], references: [id], onDelete: Cascade)
  task_id    Int
}
This relationship:
  • Ensures comments are always associated with a valid task
  • Automatically deletes comments when the parent task is deleted
  • Allows querying all comments for a task
  • Maintains referential integrity

Querying Comments

To retrieve all comments for a task:
const commentsWithTask = await prisma.task_comments.findMany({
  where: { task_id: 123 },
  orderBy: { created_at: 'asc' },
  include: {
    task: true  // Include parent task details
  }
});
To count comments without fetching them:
const commentCount = await prisma.task_comments.count({
  where: { task_id: 123 }
});
Use the amount_of_comments field on the task for better performance instead of counting comments each time.

Performance Considerations

Comment Counter Optimization

Storing amount_of_comments on the task:
  • Avoids counting queries every time
  • Displays count on Kanban cards without fetching comments
  • Improves performance on large boards

Lazy Loading

Comments are typically loaded only when:
  • User opens a task detail view
  • User explicitly requests to see comments
  • Not loaded on the Kanban board list view
This keeps the board fast even with many commented tasks.

API Reference Summary

EndpointMethodPurpose
/api/addCommentToTaskPOSTCreate new comment
/api/updateCommentFromTaskPOSTUpdate existing comment
/api/deleteCommentFromTaskPOSTDelete comment
All endpoints are located in src/routes/api/(comments)/.

Troubleshooting

  1. Check browser console for API errors
  2. Verify task_id is valid
  3. Ensure database connection is working
  4. Check Socket.io is connected for real-time updates
The counter should increment automatically. If it doesn’t:
  1. Verify the API is calling the increment operation
  2. Check for database errors in server logs
  3. Manually recalculate the counter if needed
  1. Verify you have the correct comment_id
  2. Check database permissions allow DELETE
  3. Ensure the comment exists
  4. Review API response for error messages
If comments don’t appear on other computers:
  1. Verify Socket.io connection
  2. Check VITE_SOCKET_URL configuration
  3. Ensure no firewall blocks WebSocket
  4. Test with browser console open to see errors

Future Enhancements

Potential features for comments (not currently implemented):
  • User attribution - Track which team member added each comment
  • Rich formatting - Markdown support for formatting
  • @mentions - Notify specific team members
  • Attachments - Add images or files to comments
  • Reactions - Quick emoji responses
  • Threading - Reply to specific comments
These could be added by extending the database schema and API.

Next Steps

Task Management

Learn about creating and managing tasks

Kanban Board

Explore the visual workflow interface

Database Setup

Understand the database schema

Network Setup

Configure real-time sync for your team

Build docs developers (and LLMs) love