User Guide Dashboard - anubissbe/ProjectHub-Mcp GitHub Wiki

🏠 User Guide: Dashboard

The ProjectHub-MCP Dashboard is your command center for project management. This guide will help you navigate and utilize all dashboard features effectively.

🌐 Accessing the Dashboard

  1. Open your browser and navigate to:

  2. Login with your credentials:

  3. Dashboard loads automatically after successful authentication

🎯 Dashboard Overview

Main Navigation Bar

Located at the top of the screen with the signature black and orange theme:

Section Description Access Level
Projects Manage projects and view project details All Users
Board Kanban-style task management All Users
Analytics Performance metrics and reports All Users
Webhooks External integrations Admin/Manager
Users User management Admin Only

Project Overview Section

  • Active Projects: Quick access to your current projects
  • Recent Activity: Latest updates and changes
  • Task Summary: Overview of pending and completed tasks
  • Progress Indicators: Visual progress bars for active projects

📊 Dashboard Components

1. Project Statistics

Location: Top section of dashboard Features:

  • Total number of projects
  • Active vs. completed projects ratio
  • Recent project activity timeline
  • Quick project creation button
┌─────────────────────────────────────────────────┐
│ 📁 Total Projects: 12    ✅ Completed: 8       │
│ ⚡ Active: 4             📋 Total Tasks: 156   │
└─────────────────────────────────────────────────┘

2. Quick Actions Panel

Location: Right sidebar Available Actions:

  • ➕ Create New Project: Start a new project immediately
  • 📋 Add Task: Quick task creation for existing projects
  • 👥 Invite Team Member: Send team invitations
  • 📊 View Reports: Access detailed analytics

3. Recent Activity Feed

Location: Center panel Shows:

  • Latest task completions
  • Project status changes
  • Team member activities
  • System notifications

Example Activity Items:

🎉 John completed "Database Setup" in Project Alpha
📝 Sarah updated "API Integration" status to In Progress
👥 Mike joined the Frontend Team workspace
📊 Weekly report generated for Q3 Analytics

4. Task Management Widget

Location: Lower center Features:

  • My Tasks: Tasks assigned to you
  • Overdue Tasks: Tasks past their deadline
  • Priority Tasks: High and critical priority items
  • Quick Status Updates: One-click status changes

🎨 Interface Elements

Theme and Branding

  • Primary Colors: Black (#0a0a0a) background with Orange (#ff6500) accents
  • Typography: Clean, professional fonts optimized for readability
  • Icons: Consistent icon set with intuitive meanings
  • Responsive Design: Adapts to desktop, tablet, and mobile screens

Navigation Patterns

  • Breadcrumbs: Always show current location
  • Back Buttons: Easy navigation to previous screens
  • Search: Global search functionality in header
  • Shortcuts: Keyboard shortcuts for power users

🔧 Customization Options

Dashboard Layout

  1. Rearrange Widgets: Drag and drop dashboard components
  2. Hide/Show Sections: Toggle visibility of different panels
  3. Theme Switching: Light/Dark mode toggle (maintains orange accents)
  4. Workspace Selector: Switch between different workspaces

Personal Settings

  • Profile Information: Update name, email, avatar
  • Notification Preferences: Control what alerts you receive
  • Default View: Set preferred starting page
  • Time Zone: Configure for accurate scheduling

📱 Mobile Dashboard

Mobile-Optimized Features

  • Responsive Layout: Automatic adaptation to mobile screens
  • Touch-Friendly: Large buttons and touch targets
  • Swipe Navigation: Intuitive mobile gestures
  • Offline Capability: Limited functionality without internet

Mobile-Specific Views

  • Compact Project Cards: Condensed project information
  • Simplified Navigation: Hamburger menu with essential items
  • Quick Actions: Easy access to most common tasks
  • Pull-to-Refresh: Update data with simple gesture

🔍 Search and Filtering

Global Search

Location: Header search bar Search Scope:

  • Project names and descriptions
  • Task titles and content
  • User names and emails
  • Comments and notes

Search Syntax:

project:alpha          # Find projects with "alpha"
task:urgent            # Find tasks with "urgent"
assigned:john          # Find items assigned to John
status:completed       # Find completed items

Advanced Filtering

  • Date Ranges: Filter by creation or completion dates
  • Status Filters: Show only specific project/task statuses
  • Priority Levels: Filter by task priority
  • Assignee Filters: Show work for specific team members

📊 Dashboard Analytics

Key Metrics Display

  • Productivity Score: Overall team/personal performance
  • Completion Rates: Percentage of completed tasks
  • Time Tracking: Average time to complete tasks
  • Trend Analysis: Performance over time

Visual Indicators

  • Progress Bars: Visual representation of project completion
  • Status Badges: Color-coded status indicators
  • Priority Icons: Visual priority level indicators
  • Health Meters: Project health at a glance

🔔 Notifications and Alerts

Notification Types

  • Task Assignments: When tasks are assigned to you
  • Due Date Reminders: Upcoming deadlines
  • Status Changes: When project/task statuses change
  • Team Updates: Team member joins/leaves
  • System Alerts: Maintenance or important updates

Notification Management

  • In-App Notifications: Toast messages in the interface
  • Email Notifications: Configurable email alerts
  • Badge Counts: Unread notification indicators
  • Notification History: View past notifications

🚀 Getting Started Tips

For New Users

  1. Take the Tour: Use the built-in guided tour
  2. Create First Project: Start with a simple project
  3. Invite Team Members: Add colleagues to collaborate
  4. Explore Analytics: Understand your productivity patterns

For Administrators

  1. Set Up Workspaces: Configure team workspaces
  2. Configure User Roles: Assign appropriate permissions
  3. Customize Branding: Adjust theme and company branding
  4. Set Up Integrations: Configure webhooks and external tools

🔧 Troubleshooting

Common Issues

Dashboard Not Loading

  1. Check Connection: Ensure internet connectivity
  2. Clear Cache: Refresh browser cache (Ctrl+Shift+R)
  3. Check URL: Verify correct dashboard URL
  4. Login Status: Ensure you're still logged in

Slow Performance

  1. Browser Check: Use latest Chrome, Firefox, or Safari
  2. Network Speed: Check internet connection speed
  3. Data Volume: Large projects may load slower
  4. System Resources: Close other browser tabs

Missing Data

  1. Refresh Page: Simple page refresh often resolves
  2. Check Permissions: Ensure you have access to the data
  3. Database Status: Verify backend connectivity
  4. Recent Changes: Check if data was recently modified

Performance Optimization

  • Regular Cleanup: Archive completed projects
  • Browser Maintenance: Clear cache periodically
  • Network Quality: Use stable internet connection
  • Hardware: Ensure adequate RAM and CPU

📋 Keyboard Shortcuts

Navigation Shortcuts

  • Ctrl+1: Switch to Projects view
  • Ctrl+2: Switch to Board view
  • Ctrl+3: Switch to Analytics view
  • Ctrl+/: Global search focus
  • Ctrl+N: Create new project
  • Ctrl+T: Create new task
  • Esc: Close current modal/popup

Task Management

  • Space: Toggle task completion
  • E: Edit selected task
  • D: Delete selected task
  • C: Comment on selected task
  • A: Assign selected task

🆘 Need Help?

Quick Help Options

  • ❓ Help Button: Click the help icon in the top right
  • 📚 Documentation: Access this wiki directly from dashboard
  • 🎥 Video Tutorials: Watch how-to videos
  • 💬 Community: Join discussions with other users

Support Channels

  • 📧 Email Support: Contact support team
  • 🐛 Bug Reports: Report issues via GitHub
  • 💡 Feature Requests: Suggest improvements
  • 📞 Live Chat: Real-time support (if available)

Last Updated: July 3, 2025 • Version: 4.7.1

💡 Pro Tip: Bookmark your dashboard URL and set up browser notifications for the best ProjectHub-MCP experience!