focus-productivity-cli/src/ui.js

An ADHD-friendly productivity CLI tool built to run inside Warp terminal

const chalk = require('chalk');
const Gamification = require('./gamification');
const TaskManager = require('./tasks');

// Display welcome message with colorful ASCII art
function displayWelcome() {
  console.log();
  console.log(chalk.cyan('┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓'));
  console.log(chalk.cyan('┃') + chalk.yellow('                   🎯 FocusCLI 🎯                    ') + chalk.cyan('┃'));
  console.log(chalk.cyan('┃') + chalk.green('        ADHD-Friendly Productivity Terminal         ') + chalk.cyan('┃'));
  console.log(chalk.cyan('┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛'));
  console.log();

  console.log(chalk.cyan('🚀 ') + chalk.bold('Welcome to your productivity journey!'));
  console.log(chalk.gray('   Built specially for ADHD minds and Warp terminal lovers\n'));

  console.log(chalk.yellow('📚 Quick Start Guide:'));
  console.log(chalk.white('   • ') + chalk.green('focus add "task name"') + chalk.gray(' → Add a new task'));
  console.log(chalk.white('   • ') + chalk.green('focus list') + chalk.gray(' → See your tasks'));
  console.log(chalk.white('   • ') + chalk.green('focus done 1') + chalk.gray(' → Complete task #1'));
  console.log(chalk.white('   • ') + chalk.green('focus start 25') + chalk.gray(' → Start 25min focus session'));
  console.log(chalk.white('   • ') + chalk.green('focus stats') + chalk.gray(' → View your progress'));
  console.log();

  console.log(chalk.magenta('✨ Features:'));
  console.log(chalk.white('   🎮 ') + chalk.cyan('Gamified with XP, levels & achievements'));
  console.log(chalk.white('   ⏱️  ') + chalk.cyan('Pomodoro timer with live progress'));
  console.log(chalk.white('   🔥 ') + chalk.cyan('Daily streaks to build habits'));
  console.log(chalk.white('   🎯 ') + chalk.cyan('One-task-at-a-time focus'));
  console.log();

  console.log(chalk.blue('💡 Pro Tips:'));
  console.log(chalk.gray('   • Start with small tasks to build momentum'));
  console.log(chalk.gray('   • Use 15-25 minute focus sessions'));
  console.log(chalk.gray('   • Check your stats daily for motivation'));
  console.log();

  console.log(chalk.green('Ready to focus? Try: ') + chalk.yellow('focus add "My first task"'));
  console.log();
}

// Display comprehensive stats
async function displayStats() {
  try {
    const gamification = new Gamification();
    const taskManager = new TaskManager();
    
    // Wait for database to initialize
    await new Promise(resolve => setTimeout(resolve, 100));
    
    const stats = await gamification.getUserStats();
    const levelProgress = gamification.getLevelProgress(stats.total_xp);
    const achievements = await gamification.getUnlockedAchievements();
    
    console.log();
    console.log(chalk.bgCyan.black.bold(' 📊 YOUR PRODUCTIVITY STATS '));
    console.log();
    
    // Level and XP Section
    console.log(chalk.bold('🎯 Level & Progress:'));
    const levelBar = '█'.repeat(Math.floor(levelProgress.progressPercent / 5)) + 
                     '░'.repeat(20 - Math.floor(levelProgress.progressPercent / 5));
    console.log(`   Level ${levelProgress.currentLevel} [${levelBar}] ${levelProgress.progressPercent}%`);
    console.log(chalk.gray(`   XP: ${stats.total_xp} | Next level in ${levelProgress.xpForNextLevel} XP\n`));
    
    // Tasks Section
    console.log(chalk.bold('📋 Task Statistics:'));
    console.log(`   ${chalk.green('✅ Completed:')} ${stats.completed_tasks || 0}`);
    console.log(`   ${chalk.yellow('⏳ Pending:')} ${(stats.total_tasks || 0) - (stats.completed_tasks || 0)}`);
    console.log(`   ${chalk.blue('📅 Today:')} ${stats.completed_today || 0}`);
    console.log(`   ${chalk.cyan('📊 Total:')} ${stats.total_tasks || 0}\n`);
    
    // Streaks Section
    console.log(chalk.bold('🔥 Streak Information:'));
    console.log(`   ${chalk.yellow('Current Streak:')} ${stats.current_streak || 0} days`);
    console.log(`   ${chalk.red('Best Streak:')} ${stats.best_streak || 0} days\n`);
    
    // Focus Sessions
    if (stats.total_focus_sessions > 0) {
      console.log(chalk.bold('⏱️ Focus Sessions:'));
      console.log(`   ${chalk.magenta('Total Sessions:')} ${stats.total_focus_sessions}`);
      console.log(`   ${chalk.magenta('Total Focus Time:')} ${Math.floor(stats.total_focus_time || 0)} minutes\n`);
    }
    
    // Recent Achievements
    if (achievements.length > 0) {
      console.log(chalk.bold('🏆 Recent Achievements:'));
      achievements.slice(0, 3).forEach(achievement => {
        console.log(`   ${achievement.icon} ${chalk.yellow(achievement.name)} - ${achievement.description}`);
      });
      if (achievements.length > 3) {
        console.log(chalk.gray(`   ... and ${achievements.length - 3} more!`));
      }
      console.log();
    }
    
    // Motivational message based on stats
    displayMotivationalMessage(stats, levelProgress);
    
  } catch (error) {
    console.error(chalk.red('Error displaying stats:'), error.message);
  }
}

function displayMotivationalMessage(stats, levelProgress) {
  console.log(chalk.bold('💪 Motivation Corner:'));
  
  if (stats.completed_tasks === 0) {
    console.log(chalk.cyan('   🌱 Every expert was once a beginner. Add your first task!'));
  } else if (stats.completed_tasks < 5) {
    console.log(chalk.cyan('   🚀 You\'re building momentum! Keep adding and completing tasks.'));
  } else if (stats.current_streak === 0) {
    console.log(chalk.cyan('   🔥 Start a new streak today! Complete one task to begin.'));
  } else if (stats.current_streak < 3) {
    console.log(chalk.cyan(`   ⚡ ${stats.current_streak} day streak! Can you make it to 3?`));
  } else {
    console.log(chalk.cyan(`   🏆 Amazing ${stats.current_streak} day streak! You're unstoppable!`));
  }
  
  if (levelProgress.xpForNextLevel <= 25) {
    console.log(chalk.yellow(`   🎯 You're just ${levelProgress.xpForNextLevel} XP away from level ${levelProgress.currentLevel + 1}!`));
  }
  
  console.log();
}

// Display achievement notification
function displayAchievementUnlocked(achievement) {
  console.log();
  console.log(chalk.bgYellow.black.bold(' 🏆 ACHIEVEMENT UNLOCKED! 🏆 '));
  console.log();
  console.log(`${achievement.icon} ${chalk.bold.yellow(achievement.name)}`);
  console.log(chalk.cyan(achievement.description));
  console.log(chalk.magenta(`+${achievement.xp_reward} XP earned!`));
  console.log();
}

// Display task list with beautiful formatting
async function displayTaskList(tasks, showCompleted = false) {
  if (tasks.length === 0) {
    console.log(chalk.yellow('🎉 No tasks found!'));
    if (!showCompleted) {
      console.log(chalk.gray('   Use "focus add <task>" to add your first task.'));
    }
    return;
  }
  
  console.log(chalk.bold('\n📋 Your Tasks:\n'));
  
  const pendingTasks = tasks.filter(task => !task.completed);
  const completedTasks = tasks.filter(task => task.completed);
  
  if (pendingTasks.length > 0) {
    console.log(chalk.bold.yellow('⏳ Pending:'));
    pendingTasks.forEach((task, index) => {
      const priority = task.priority === 'high' ? chalk.red('🔥') : 
                      task.priority === 'medium' ? chalk.yellow('⚡') : chalk.blue('💧');
      console.log(`   ${priority} ${index + 1}. ${task.description}`);
    });
    console.log();
  }
  
  if (showCompleted && completedTasks.length > 0) {
    console.log(chalk.bold.green('✅ Completed:'));
    completedTasks.forEach((task) => {
      const completedDate = new Date(task.completedAt).toLocaleDateString();
      console.log(`   ✅ ${task.description} ${chalk.gray(`(${completedDate})`)}`);
    });
    console.log();
  }
}

// Display focus session start
function displayFocusStart(duration) {
  console.log();
  console.log(chalk.bgBlue.white.bold(' 🎯 FOCUS MODE ACTIVATED 🎯 '));
  console.log();
  console.log(chalk.blue(`⏱️  Duration: ${duration} minutes`));
  console.log(chalk.gray(`📅 Started: ${new Date().toLocaleTimeString()}`));
  console.log();
  console.log(chalk.yellow('💡 Focus Tips:'));
  console.log(chalk.gray('   • Turn off notifications'));
  console.log(chalk.gray('   • Stay hydrated'));
  console.log(chalk.gray('   • Take deep breaths when distracted'));
  console.log();
}

// Create progress bar
function createProgressBar(current, total, width = 20) {
  const percentage = Math.min(current / total, 1);
  const filled = Math.floor(percentage * width);
  const empty = width - filled;
  
  const filledBar = '█'.repeat(filled);
  const emptyBar = '░'.repeat(empty);
  
  return `[${filledBar}${emptyBar}] ${Math.floor(percentage * 100)}%`;
}

// Display timer with progress
function displayTimerProgress(remaining, total) {
  const minutes = Math.floor(remaining / 60000);
  const seconds = Math.floor((remaining % 60000) / 1000);
  const elapsed = total - remaining;
  const progressBar = createProgressBar(elapsed, total);
  
  process.stdout.write('\r');
  process.stdout.write(chalk.cyan(`⏱️  ${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')} `));
  process.stdout.write(chalk.blue(progressBar));
  
  // Encouraging messages
  if (minutes === 0 && seconds <= 10) {
    process.stdout.write(chalk.red.bold(' 🔥 FINAL COUNTDOWN!'));
  } else if (remaining < 300000) { // Less than 5 minutes
    process.stdout.write(chalk.yellow(' 💪 Almost there!'));
  } else if (elapsed > total * 0.5) {
    process.stdout.write(chalk.green(' 🌟 Great focus!'));
  }
}

// Display help information
function displayHelp() {
  console.log();
  console.log(chalk.bold('🎯 FocusCLI - Command Reference'));
  console.log();
  
  console.log(chalk.yellow('📋 Task Management:'));
  console.log(`   ${chalk.green('focus add <task>')}          Add a new task`);
  console.log(`   ${chalk.green('focus add <task> -p high')}  Add high priority task`);
  console.log(`   ${chalk.green('focus list')}                List pending tasks`);
  console.log(`   ${chalk.green('focus list -a')}             List all tasks (including completed)`);
  console.log(`   ${chalk.green('focus done <id>')}           Mark task as complete`);
  console.log();
  
  console.log(chalk.yellow('⏱️ Focus Sessions:'));
  console.log(`   ${chalk.green('focus start')}               Start 25-minute session (default)`);
  console.log(`   ${chalk.green('focus start <minutes>')}     Start custom duration session`);
  console.log(`   ${chalk.green('focus stop')}                Stop current session`);
  console.log();
  
  console.log(chalk.yellow('📊 Progress & Stats:'));
  console.log(`   ${chalk.green('focus stats')}               View your productivity stats`);
  console.log(`   ${chalk.green('focus welcome')}             Show welcome message`);
  console.log();
  
  console.log(chalk.blue('💡 Pro Tips:'));
  console.log('   • Start with 15-minute sessions if 25 feels overwhelming');
  console.log('   • Break large tasks into smaller ones');
  console.log('   • Use high priority for your most important tasks');
  console.log('   • Check stats daily for motivation!');
  console.log();
}

module.exports = {
  displayWelcome,
  displayStats,
  displayAchievementUnlocked,
  displayTaskList,
  displayFocusStart,
  displayTimerProgress,
  displayHelp,
  createProgressBar
};