Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed for task management, featuring automated reminders and multi-workspace collaboration specifically for Vietnamese-speaking users. The application allows users to efficiently manage multiple organizations or branches from a single account, providing a seamless experience without the need for logout.

## CORE FEATURES
1. **Multi Workspace System**: Users can create and switch between multiple workspaces from a single account using a navigation menu at the top.
2. **Task Board**: A Kanban-style board with columns for "To Do", "In Progress", and "Completed". Users can quickly create tasks, assign them to team members, set deadlines, and prioritize tasks with color-coded labels.
3. **Automated Reminders & Notifications**: The system sends automated deadline reminders directly to employees via Telegram Bot and Zalo Bot, with a settings page to connect each workspace to these bots.
4. **Visual Reporting Dashboard**: An analytics dashboard featuring charts (bar/line/pie) that display task completion rates, team performance, and a visual timeline of project progress.
5. **User Role Management**: Four levels of access (Owner, Admin, Manager, Employee) with a dedicated page for managing user profiles, roles, and permissions within each workspace.
6. **Notification Channel Settings**: A dedicated settings section for "Notification Channels" that lists integrations (Telegram Bot, Zalo Bot) with options to connect or configure each channel.

## DESIGN SPECIFICATIONS
- Visual Style: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- Color Mode: Light theme with dark text on light backgrounds
- Primary Color: #1978E5 (accent for buttons, links, highlights)
- Typography: Use Inter from Google Fonts for headings, Inter for body text and UI elements
- Border Radius: 8px (moderately rounded) for buttons, cards, and inputs
- Layout: The layout will feature a responsive sidebar navigation (collapsible on mobile) with sections for Overview, Task Board, Users, Reports, Notification Channels, and Settings.

## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Zustand (or any preferred state management library)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS for styling.
2. **Configure Supabase**: Set up Supabase for database management, authentication, and real-time capabilities.
3. **Design Layout**: Create a responsive layout with a sidebar navigation and main content area. Ensure the layout adapts to various screen sizes.
4. **Develop Core Features**:
   - Implement the multi workspace system allowing users to create and switch workspaces.
   - Build the Kanban task board with task creation, assignment, deadline, and priority features.
   - Integrate Telegram and Zalo bots for automated reminders and notifications.
   - Create the analytics dashboard with visual reports and a clear timeline view.
   - Set up user role management with a user-friendly interface for profile and permission management.
   - Develop the notification channel settings for easy integration with messaging bots.
5. **Testing**: Conduct thorough testing to ensure all features function correctly and the application is responsive across devices.
6. **Deployment**: Deploy the application to a suitable hosting service and ensure that the connection to Supabase is secure and functional.

## USER EXPERIENCE
Users will be guided through a smooth onboarding process when first accessing the app, with clear instructions for setting up their workspace and integrating notifications. The interface will provide intuitive navigation through the sidebar, allowing users to easily switch workspaces, manage tasks, and access reports. The design will emphasize clarity, with ample white space and visual hierarchy to enhance usability and ensure a pleasant user experience.