canvaslms-cli 1.4.2 → 1.4.3

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Canvas CLI Tool
+Copyright (c) 2025 Dang Duy Toan
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,182 +1,106 @@
 # Canvas CLI Tool
 
-A powerful command-line interface for interacting with Canvas LMS API. This tool allows you to manage courses, assignments, submissions, and more directly from your terminal.
+A modern, user-friendly command-line interface for Canvas LMS. Manage courses, assignments, submissions, grades, and more directly from your terminal.
+
+---
 
 ## Features
 
-- 📚 **Course Management**: List starred and enrolled courses
-- 📝 **Assignment Operations**: View assignments, grades, and submission status
-- 🚀 **File Submission**: Interactive file upload for assignments (single or multiple files)
-- 📢 **Announcements**: View course announcements
-- 👤 **Profile Management**: View user profile information
-- 🔧 **Raw API Access**: Direct access to Canvas API endpoints
+- List and filter enrolled/starred courses
+- View assignments, grades, and submission status
+- Interactive file upload for assignments
+- View course announcements
+- Display user profile information
+- Direct access to Canvas API endpoints
+
+---
 
 ## Installation
 
-### Global Installation (Recommended)
+### Global (Recommended)
 
 ```bash
 npm install -g canvas-cli-tool
 ```
 
-### Local Installation
+### Local (Project)
 
 ```bash
 npm install canvas-cli-tool
 ```
 
+---
+
 ## Setup
 
-1. **Get your Canvas API token**:
-   - Log into your Canvas instance
+1. **Get your Canvas API Token**
+   - Log in to Canvas
    - Go to Account → Settings
-   - Scroll down to "Approved Integrations"
-   - Click "+ New Access Token"
+   - Under Approved Integrations, click + New Access Token
    - Copy the generated token
 
-2. **Configure the CLI**:
+2. **Configure the CLI**
+
    ```bash
    canvas config
    ```
 
-3. **Create a `.env` file** in your project root:
+3. **Environment Variables**
+
+   Create a `.env` file in your project root:
+
    ```env
    CANVAS_DOMAIN=your-canvas-domain.instructure.com
    CANVAS_API_TOKEN=your-api-token
    ```
 
-## Usage
-
-### Basic Commands
-
-```bash
-# Show configuration help
-canvas config
-
-# List starred courses (default)
-canvas list
-
-# List all enrolled courses
-canvas list -a
-
-# List courses with detailed information
-canvas list -v
-
-# Show user profile
-canvas profile
-
-# Show detailed profile information
-canvas profile -v
-```
-
-### Assignment Operations
-
-```bash
-# List assignments for a course
-canvas assignments 12345
-
-# Show detailed assignment information
-canvas assignments 12345 -v
+---
 
-# Show only submitted assignments
-canvas assignments 12345 -s
-
-# Show only pending assignments
-canvas assignments 12345 -p
-```
-
-### File Submission
-
-```bash
-# Interactive assignment submission
-canvas submit
-
-# Submit with specific course ID
-canvas submit -c 12345
-
-# Submit with specific assignment ID
-canvas submit -a 67890
-
-# Submit specific file
-canvas submit -f myfile.pdf
-```
+## Usage
 
-### Grades and Announcements
+### Common Commands
 
 ```bash
-# Show grades for all courses
-canvas grades
-
-# Show grades for specific course
-canvas grades 12345
-
-# Show recent announcements
-canvas announcements
-
-# Show announcements for specific course
-canvas announcements 12345
+canvas config                # Configure domain and API token
+canvas list                  # List starred courses
+canvas list -a               # List all enrolled courses
+canvas assignments <course>  # List assignments for a course
+canvas grades                # Show grades for all courses
+canvas announcements         # Show recent announcements
+canvas profile               # Show user profile
+canvas submit                # Interactive assignment submission
 ```
 
-### Raw API Access
+### Assignment Submission
 
 ```bash
-# GET request
-canvas get users/self
-
-# GET with query parameters
-canvas get courses -q enrollment_state=active
-
-# POST request with data
-canvas post courses/123/assignments -d '{"assignment": {"name": "Test"}}'
-
-# POST with data from file
-canvas post courses/123/assignments -d @assignment.json
+canvas submit                        # Interactive mode
+canvas submit -c <courseId>          # Specify course
+canvas submit -a <assignmentId>      # Specify assignment
+canvas submit -f <file>              # Submit specific file
 ```
 
 ## Command Reference
 
-| Command | Alias | Description |
-|---------|-------|-------------|
-| `list` | `l` | List courses |
-| `assignments` | `assign` | List assignments |
-| `submit` | `sub` | Submit assignment files |
-| `grades` | `grade` | Show grades |
-| `announcements` | `announce` | Show announcements |
-| `profile` | `me` | Show user profile |
-| `config` | - | Show configuration |
-| `get` | `g` | GET API request |
-| `post` | `p` | POST API request |
-| `put` | - | PUT API request |
-| `delete` | `d` | DELETE API request |
-
-## File Structure
+| Command         | Alias      | Description                       |
+|-----------------|-----------|-----------------------------------|
+| `list`          | `l`       | List courses                      |
+| `assignments`   | `assign`  | List assignments                  |
+| `submit`        | `sub`     | Submit assignment files           |
+| `grades`        | `grade`   | Show grades                       |
+| `announcements` | `announce`| Show announcements                |
+| `profile`       | `me`      | Show user profile                 |
+| `config`        | -         | Show configuration                |
 
-```
-canvas-cli-tool/
-├── src/
-│   └── index.js          # Main CLI entry point
-├── lib/
-│   ├── api-client.js     # Canvas API client
-│   ├── config.js         # Configuration management
-│   ├── file-upload.js    # File upload utilities
-│   └── interactive.js    # Interactive prompt utilities
-├── commands/
-│   ├── list.js           # List courses command
-│   ├── assignments.js    # Assignments command
-│   ├── submit.js         # Submit command
-│   ├── grades.js         # Grades command
-│   ├── announcements.js  # Announcements command
-│   ├── profile.js        # Profile command
-│   ├── config.js         # Config command
-│   └── api.js            # Raw API commands
-└── package.json
-```
+---
 
 ## Requirements
 
-- Node.js >= 14.0.0
-- npm >= 6.0.0
-- Valid Canvas LMS access with API token
+- Node.js >= 14.x
+- npm >= 6.x
+- Valid Canvas LMS API token
+
+---
 
 ## Contributing
 
@@ -184,10 +108,12 @@ canvas-cli-tool/
 2. Create a feature branch: `git checkout -b feature-name`
 3. Make your changes
 4. Run tests: `npm test`
-5. Commit your changes: `git commit -am 'Add feature'`
-6. Push to the branch: `git push origin feature-name`
+5. Commit: `git commit -am 'Add feature'`
+6. Push: `git push origin feature-name`
 7. Submit a pull request
 
+---
+
 ## License
 
-MIT License - see [LICENSE](LICENSE) file for details.
+MIT License - see [LICENSE](LICENSE) for details.

package/commands/submit.js

@@ -5,7 +5,7 @@
 import fs from 'fs';
 import path from 'path';
 import { makeCanvasRequest } from '../lib/api-client.js';
-import { createReadlineInterface, askQuestion, askConfirmation, selectFilesImproved, selectFilesInteractive, pad } from '../lib/interactive.js';
+import { createReadlineInterface, askQuestion, askConfirmation, selectFilesImproved, selectFilesKeyboard, pad } from '../lib/interactive.js';
 import { uploadSingleFileToCanvas, submitAssignmentWithFiles } from '../lib/file-upload.js';
 import chalk from 'chalk';
 
@@ -137,16 +137,17 @@ export async function submitAssignment(options) {
         return;
       }
       assignmentId = selectedAssignment.id;
-      console.log(chalk.green(`Success: Selected ${selectedAssignment.name}\n`));
-      if (selectedAssignment.submission && selectedAssignment.submission.submitted_at) {
-        const resubmit = await askConfirmation(rl, chalk.yellow('This assignment has already been submitted. Do you want to resubmit?'), false);
+      console.log(chalk.green(`Success: Selected ${selectedAssignment.name}\n`));      if (selectedAssignment.submission && selectedAssignment.submission.submitted_at) {
+        const resubmit = await askConfirmation(rl, chalk.yellow('This assignment has already been submitted. Do you want to resubmit?'), true);
         if (!resubmit) {
           console.log(chalk.yellow('Submission cancelled.'));
           rl.close();
           return;
         }
       }
-    }    // Step 3: Choose file selection method and select files
+    }
+    
+    // Step 3: Choose file selection method and select files
     let filePaths = [];
     console.log(chalk.cyan.bold('-'.repeat(60)));
     console.log(chalk.cyan.bold('File Selection Method'));
@@ -155,7 +156,7 @@ export async function submitAssignment(options) {
     console.log(chalk.white('Assignment: ') + chalk.bold(selectedAssignment.name) + '\n');
     
     console.log(chalk.yellow('📁 Choose file selection method:'));
-    console.log(chalk.white('1. ') + chalk.cyan('Enhanced Interactive Selector') + chalk.gray(' (Recommended - Visual browser with search, filters, and navigation)'));
+    console.log(chalk.white('1. ') + chalk.cyan('Keyboard Navigator') + chalk.gray(' (NEW! - Use arrow keys and space bar to navigate and select)'));
     console.log(chalk.white('2. ') + chalk.cyan('Text-based Selector') + chalk.gray(' (Traditional - Type filenames and wildcards)'));
     console.log(chalk.white('3. ') + chalk.cyan('Basic Directory Listing') + chalk.gray(' (Simple - Select from numbered list)'));
     
@@ -166,7 +167,7 @@ export async function submitAssignment(options) {
     console.log(chalk.cyan('-'.repeat(60)));
     
     if (selectorChoice === '1') {
-      filePaths = await selectFilesInteractive(rl);
+      filePaths = await selectFilesKeyboard(rl);
     } else if (selectorChoice === '2') {
       filePaths = await selectFilesImproved(rl);
     } else {

package/lib/interactive.js

@@ -8,6 +8,19 @@ import path from 'path';
 import AdmZip from 'adm-zip';
 import chalk from 'chalk';
 
+// Key codes for raw terminal input
+const KEYS = {
+  UP: '\u001b[A',
+  DOWN: '\u001b[B',
+  LEFT: '\u001b[D',
+  RIGHT: '\u001b[C',
+  SPACE: ' ',
+  ENTER: '\r',
+  ESCAPE: '\u001b',
+  BACKSPACE: '\u007f',
+  TAB: '\t'
+};
+
 /**
  * Create readline interface for user input
  */
@@ -51,15 +64,26 @@ function askQuestionWithValidation(rl, question, validator, errorMessage) {
  * Ask for confirmation (Y/n format)
  */
 async function askConfirmation(rl, question, defaultYes = true) {
-  const suffix = defaultYes ? ' (Y/n)' : ' (y/N)';
-  const answer = await askQuestion(rl, question + suffix + ': ');
+  const suffix = defaultYes ? " (Y/n)" : " (y/N)";
+  const answer = await askQuestion(rl, question + suffix + ": ");
+
+  const lower = answer.toLowerCase();
   
-  if (answer.trim() === '') {
+  // If user presses Enter → return defaultYes (true by default)
+  if (lower === "") {
     return defaultYes;
   }
-  
-  const lower = answer.toLowerCase();
-  return lower === 'y' || lower === 'yes';
+
+  // Convert input to boolean
+  if (lower === "y" || lower === "yes") {
+    return true;
+  }
+  if (lower === "n" || lower === "no") {
+    return false;
+  }
+
+  // If input is something else, fallback to defaultYes
+  return defaultYes;
 }
 
 /**
@@ -360,58 +384,72 @@ async function selectFilesImproved(rl, currentDir = process.cwd()) {
 }
 
 /**
- * Enhanced interactive file selector with real-time preview and navigation
+ * Interactive file selector with tree view and keyboard navigation
  */
-async function selectFilesInteractive(rl, currentDir = process.cwd()) {
+async function selectFilesKeyboard(rl, currentDir = process.cwd()) {
   const selectedFiles = [];
-  let currentPath = currentDir;
+  let expandedFolders = new Set();
+  let fileTree = [];
   let fileList = [];
-  let currentPage = 0;
-  const itemsPerPage = 10;
+  let currentPath = currentDir;
+  let currentIndex = 0;
+  let isNavigating = true;
+  let viewStartIndex = 0;
+  const maxVisibleItems = 15;
 
-  // Helper function to refresh file list
-  function refreshFileList() {
+  // Setup raw mode for keyboard input
+  process.stdin.setRawMode(true);
+  process.stdin.resume();
+  process.stdin.setEncoding('utf8');
+
+  // Helper function to build file tree
+  function buildFileTree(basePath = currentDir, level = 0, parentPath = '') {
+    const tree = [];
     try {
-      const entries = fs.readdirSync(currentPath);
-      fileList = [];
-      
-      // Add parent directory option if not at root
-      if (currentPath !== currentDir) {
-        fileList.push({
-          name: '📁 .. (Parent Directory)',
-          path: path.dirname(currentPath),
-          type: 'parent',
-          size: 0
-        });
-      }
+      const entries = fs.readdirSync(basePath).sort();
       
       // Add directories first
       entries.forEach(entry => {
-        const fullPath = path.join(currentPath, entry);
+        const fullPath = path.join(basePath, entry);
+        const relativePath = parentPath ? `${parentPath}/${entry}` : entry;
+        
         try {
           const stats = fs.statSync(fullPath);
-          if (stats.isDirectory() && !['node_modules', '.git', 'dist', 'build', '.vscode'].includes(entry)) {
-            fileList.push({
-              name: `📁 ${entry}`,
+          if (stats.isDirectory() && !['node_modules', '.git', 'dist', 'build', '.vscode', '.next'].includes(entry)) {
+            const isExpanded = expandedFolders.has(fullPath);
+            tree.push({
+              name: entry,
               path: fullPath,
+              relativePath,
               type: 'directory',
+              level,
+              isExpanded,
               size: 0
             });
+            
+            // If expanded, add children
+            if (isExpanded) {
+              const children = buildFileTree(fullPath, level + 1, relativePath);
+              tree.push(...children);
+            }
           }
         } catch (e) {}
       });
       
       // Add files
       entries.forEach(entry => {
-        const fullPath = path.join(currentPath, entry);
+        const fullPath = path.join(basePath, entry);
+        const relativePath = parentPath ? `${parentPath}/${entry}` : entry;
+        
         try {
           const stats = fs.statSync(fullPath);
           if (stats.isFile()) {
-            const icon = getFileIcon(entry);
-            fileList.push({
-              name: `${icon} ${entry}`,
+            tree.push({
+              name: entry,
               path: fullPath,
+              relativePath,
               type: 'file',
+              level,
               size: stats.size
             });
           }
@@ -420,6 +458,8 @@ async function selectFilesInteractive(rl, currentDir = process.cwd()) {
     } catch (error) {
       console.log(chalk.red('Error reading directory: ' + error.message));
     }
+    
+    return tree;
   }
 
   // Helper function to get file icon based on extension
@@ -437,19 +477,45 @@ async function selectFilesInteractive(rl, currentDir = process.cwd()) {
     };
     return icons[ext] || '📋';
   }
+  // Helper function to build breadcrumb path
+  function buildBreadcrumb() {
+    const relativePath = path.relative(currentDir, currentPath);
+    if (!relativePath || relativePath === '.') {
+      return ''
+    }
+    
+    const parts = relativePath.split(path.sep);
+    const breadcrumb = parts.map((part, index) => {
+      if (index === parts.length - 1) {
+        return chalk.white.bold(part);
+      }
+      return chalk.gray(part);
+    }).join(chalk.gray(' › '));
+    
+    return chalk.yellow('📂 ') + breadcrumb;
+  }
 
-  // Helper function to display current page
-  function displayPage() {
-    console.clear();
-    console.log(chalk.cyan.bold('╭' + '─'.repeat(78) + '╮'));
-    console.log(chalk.cyan.bold('│') + chalk.white.bold(' Interactive File Selector'.padEnd(76)) + chalk.cyan.bold('│'));
-    console.log(chalk.cyan.bold('╰' + '─'.repeat(78) + '╯'));
+  // Helper function to display the file browser
+  function displayBrowser() {
+    // Header with keyboard controls at the top
+    console.log(chalk.cyan.bold('╭' + '─'.repeat(100) + '╮'));
+    console.log(chalk.cyan.bold('│') + chalk.white.bold(' Keyboard File Selector'.padEnd(98)) + chalk.cyan.bold('│'));    console.log(chalk.cyan.bold('├' + '─'.repeat(100) + '┤'));
+    // Keyboard controls - compact format at top
+    const controls = [
+      '↑↓←→:Navigate', 'Space:Select', 'Enter:Open/Finish', 'Backspace:Up', 'a:All', 'c:Clear', 'Esc:Exit'
+    ];
+    const controlLine = controls.map(c => {
+      const [key, desc] = c.split(':');
+      return chalk.white(key) + chalk.gray(':') + chalk.gray(desc);
+    }).join(chalk.gray(' │ '));
+    console.log(chalk.cyan.bold('│ ') + controlLine.padEnd(98) + chalk.cyan.bold(' │'));
+    console.log(chalk.cyan.bold('╰' + '─'.repeat(100) + '╯'));
     
-    // Display current path
-    const relativePath = path.relative(currentDir, currentPath) || '.';
-    console.log(chalk.yellow('📂 Current folder: ') + chalk.white.bold(relativePath));
+    console.log();
+      // Breadcrumb path
+    console.log(buildBreadcrumb());
     
-    // Display selected files count
+    // Selected files count
     if (selectedFiles.length > 0) {
       const totalSize = selectedFiles.reduce((sum, file) => {
         try {
@@ -458,7 +524,9 @@ async function selectFilesInteractive(rl, currentDir = process.cwd()) {
           return sum;
         }
       }, 0);
-      console.log(chalk.green(`✅ Selected: ${selectedFiles.length} files (${(totalSize / 1024).toFixed(1)} KB)`));
+      console.log(chalk.green(`✅ Selected: ${selectedFiles.length} files (${(totalSize / 1024).toFixed(1)} KB) - Press Enter to finish`));
+    } else {
+      console.log(chalk.gray('💡 Use Space to select files, then press Enter to finish'));
     }
     
     console.log();
@@ -468,311 +536,336 @@ async function selectFilesInteractive(rl, currentDir = process.cwd()) {
       return;
     }
     
-    const startIdx = currentPage * itemsPerPage;
-    const endIdx = Math.min(startIdx + itemsPerPage, fileList.length);
-    const pageItems = fileList.slice(startIdx, endIdx);
-    
-    // Display page header
-    console.log(chalk.cyan(`📋 Showing ${startIdx + 1}-${endIdx} of ${fileList.length} items (Page ${currentPage + 1}/${Math.ceil(fileList.length / itemsPerPage)})`));
-    console.log(chalk.gray('─'.repeat(80)));
+    // Display files with tree-like structure
+    displayFileTree();
+  }
+  // Helper function to display files in a horizontal grid layout
+  function displayFileTree() {
+    const terminalWidth = process.stdout.columns || 80;
+    const maxDisplayItems = 50; // Show more items in grid view
+    const startIdx = Math.max(0, currentIndex - Math.floor(maxDisplayItems / 2));
+    const endIdx = Math.min(fileList.length, startIdx + maxDisplayItems);
+    const visibleItems = fileList.slice(startIdx, endIdx);
     
-    // Display items
-    pageItems.forEach((item, index) => {
-      const globalIndex = startIdx + index + 1;
-      const isSelected = selectedFiles.includes(item.path);
-      const prefix = isSelected ? chalk.green('✓') : chalk.white(globalIndex.toString().padStart(2));
-      const sizeDisplay = item.type === 'file' ? chalk.gray(`(${(item.size / 1024).toFixed(1)} KB)`) : '';
-      
-      if (isSelected) {
-        console.log(`${prefix} ${chalk.green(item.name)} ${sizeDisplay}`);
-      } else if (item.type === 'parent') {
-        console.log(`${prefix} ${chalk.blue(item.name)}`);
-      } else if (item.type === 'directory') {
-        console.log(`${prefix} ${chalk.cyan(item.name)}`);
-      } else {
-        console.log(`${prefix} ${chalk.white(item.name)} ${sizeDisplay}`);
-      }
-    });
+    // Show scroll indicators
+    if (startIdx > 0) {
+      console.log(chalk.gray(`    ⋮ (${startIdx} items above)`));
+    }
     
-    console.log(chalk.gray('─'.repeat(80)));
-    displayCommands();
-  }
-  // Helper function to display available commands
-  function displayCommands() {
-    console.log(chalk.yellow.bold('Commands:'));
-    console.log(chalk.white('  1-9, 10+     ') + chalk.gray('Select/deselect file by number'));
-    console.log(chalk.white('  n/next/→    ') + chalk.gray('Next page'));
-    console.log(chalk.white('  p/prev/←    ') + chalk.gray('Previous page'));
-    console.log(chalk.white('  a/all       ') + chalk.gray('Select all files on current page'));
-    console.log(chalk.white('  c/clear     ') + chalk.gray('Clear all selections'));
-    console.log(chalk.white('  r/remove    ') + chalk.gray('Remove specific file from selection'));
-    console.log(chalk.white('  s/search    ') + chalk.gray('Search files by name or extension'));
-    console.log(chalk.white('  f/filter    ') + chalk.gray('Filter by file extension'));
-    console.log(chalk.white('  h/help      ') + chalk.gray('Show detailed help'));
-    console.log(chalk.white('  q/quit      ') + chalk.gray('Finish selection'));
-    console.log();
-  }
-
-  // Main interaction loop
-  while (true) {
-    refreshFileList();
-    displayPage();
+    // Calculate item width and columns
+    const maxItemWidth = Math.max(...visibleItems.map(item => {
+      const name = path.basename(item.path);
+      return name.length + 4; // 2 for icon + space, 2 for padding
+    }));
     
-    const input = await askQuestion(rl, chalk.cyan.bold('Enter command: '));
-    const cmd = input.trim().toLowerCase();
+    const itemWidth = Math.min(Math.max(maxItemWidth, 15), 25); // Min 15, max 25 chars
+    const columnsPerRow = Math.floor((terminalWidth - 4) / itemWidth); // Leave 4 chars margin
+    const actualColumns = Math.max(1, columnsPerRow);
     
-    if (!cmd || cmd === 'q' || cmd === 'quit') {
-      break;
-    }
-      // Handle navigation
-    if (cmd === 'n' || cmd === 'next' || cmd === '→') {
-      if ((currentPage + 1) * itemsPerPage < fileList.length) {
-        currentPage++;
-      } else {
-        console.log(chalk.yellow('Already on last page!'));
-        await new Promise(resolve => setTimeout(resolve, 1000));
-      }
-      continue;
-    }
+    // Group items into rows
+    let currentRow = '';
+    let itemsInCurrentRow = 0;
     
-    if (cmd === 'p' || cmd === 'prev' || cmd === '←') {
-      if (currentPage > 0) {
-        currentPage--;
+    visibleItems.forEach((item, index) => {
+      const actualIndex = startIdx + index;
+      const isSelected = selectedFiles.includes(item.path);
+      const isCurrent = actualIndex === currentIndex;
+      
+      // Get icon and name
+      let icon = '';
+      if (item.type === 'parent' || item.type === 'directory') {
+        icon = '📁';
       } else {
-        console.log(chalk.yellow('Already on first page!'));
-        await new Promise(resolve => setTimeout(resolve, 1000));
+        icon = getFileIcon(path.basename(item.path));
       }
-      continue;
-    }
-    
-    // Handle help
-    if (cmd === 'h' || cmd === 'help') {
-      console.clear();
-      console.log(chalk.cyan.bold('╭' + '─'.repeat(78) + '╮'));
-      console.log(chalk.cyan.bold('│') + chalk.white.bold(' Interactive File Selector - Help'.padEnd(76)) + chalk.cyan.bold('│'));
-      console.log(chalk.cyan.bold('╰' + '─'.repeat(78) + '╯'));
-      console.log();
-      console.log(chalk.yellow.bold('📋 File Selection:'));
-      console.log(chalk.white('  • Type a number (1-9999) to toggle file selection'));
-      console.log(chalk.white('  • Files show with checkmarks (✓) when selected'));
-      console.log(chalk.white('  • Directories and parent folders can be navigated into'));
-      console.log();
-      console.log(chalk.yellow.bold('📁 Navigation:'));
-      console.log(chalk.white('  • Use n/next/→ to go to next page'));
-      console.log(chalk.white('  • Use p/prev/← to go to previous page'));
-      console.log(chalk.white('  • Click on folder numbers to enter directories'));
-      console.log(chalk.white('  • Use .. (Parent Directory) to go up one level'));
-      console.log();
-      console.log(chalk.yellow.bold('🔍 Advanced Features:'));
-      console.log(chalk.white('  • s/search: Find files by name or extension'));
-      console.log(chalk.white('  • f/filter: Filter and select by file extension'));
-      console.log(chalk.white('  • a/all: Select all files on current page'));
-      console.log(chalk.white('  • c/clear: Remove all selections'));
-      console.log(chalk.white('  • r/remove: Remove specific files from selection'));
-      console.log();
-      console.log(chalk.yellow.bold('💡 Tips:'));
-      console.log(chalk.white('  • File sizes are shown in KB'));
-      console.log(chalk.white('  • Your current selection count and size is displayed at top'));
-      console.log(chalk.white('  • Use search for large directories to find files quickly'));
-      console.log(chalk.white('  • Filter by extension (e.g., .pdf, .docx) for specific file types'));
-      console.log();
-      console.log(chalk.green('Press Enter to continue...'));
-      await askQuestion(rl, '');
-      continue;
-    }
-    
-    // Handle selection commands
-    if (cmd === 'a' || cmd === 'all') {
-      const startIdx = currentPage * itemsPerPage;
-      const endIdx = Math.min(startIdx + itemsPerPage, fileList.length);
-      let addedCount = 0;
       
-      for (let i = startIdx; i < endIdx; i++) {
-        const item = fileList[i];
-        if (item.type === 'file' && !selectedFiles.includes(item.path)) {
-          selectedFiles.push(item.path);
-          addedCount++;
+      const name = item.name || path.basename(item.path);
+      const truncatedName = name.length > itemWidth - 4 ? name.slice(0, itemWidth - 7) + '...' : name;
+      
+      // Build item display string
+      let itemDisplay = `${icon} ${truncatedName}`;
+      
+      // Apply styling based on state
+      if (isCurrent) {
+        if (isSelected) {
+          itemDisplay = chalk.black.bgGreen(` ${itemDisplay}`.padEnd(itemWidth - 1));
+        } else if (item.type === 'parent') {
+          itemDisplay = chalk.white.bgBlue(` ${itemDisplay}`.padEnd(itemWidth - 1));
+        } else if (item.type === 'directory') {
+          itemDisplay = chalk.black.bgCyan(` ${itemDisplay}`.padEnd(itemWidth - 1));
+        } else {
+          itemDisplay = chalk.black.bgWhite(` ${itemDisplay}`.padEnd(itemWidth - 1));
+        }
+      } else {
+        if (isSelected) {
+          itemDisplay = chalk.green(`✓${itemDisplay}`.padEnd(itemWidth));
+        } else if (item.type === 'parent') {
+          itemDisplay = chalk.blue(` ${itemDisplay}`.padEnd(itemWidth));
+        } else if (item.type === 'directory') {
+          itemDisplay = chalk.cyan(` ${itemDisplay}`.padEnd(itemWidth));
+        } else {
+          itemDisplay = chalk.white(` ${itemDisplay}`.padEnd(itemWidth));
         }
       }
       
-      console.log(chalk.green(`Added ${addedCount} files to selection!`));
-      await new Promise(resolve => setTimeout(resolve, 1000));
-      continue;
+      // Add to current row
+      currentRow += itemDisplay;
+      itemsInCurrentRow++;
+      
+      // Check if we need to start a new row
+      if (itemsInCurrentRow >= actualColumns || index === visibleItems.length - 1) {
+        console.log(currentRow);
+        currentRow = '';
+        itemsInCurrentRow = 0;
+      }
+    });
+    
+    // Show scroll indicators
+    if (endIdx < fileList.length) {
+      console.log(chalk.gray(`    ⋮ (${fileList.length - endIdx} items below)`));
     }
     
-    if (cmd === 'c' || cmd === 'clear') {
-      const count = selectedFiles.length;
-      selectedFiles.length = 0;
-      console.log(chalk.yellow(`Cleared ${count} files from selection!`));
-      await new Promise(resolve => setTimeout(resolve, 1000));
-      continue;
+    console.log();
+    
+    // Show current position and navigation info
+    if (fileList.length > maxDisplayItems) {
+      console.log(chalk.gray(`Showing ${startIdx + 1}-${endIdx} of ${fileList.length} items | Current: ${currentIndex + 1}`));
+    } else {
+      console.log(chalk.gray(`${fileList.length} items | Current: ${currentIndex + 1}`));
     }
     
-    if (cmd === 'r' || cmd === 'remove') {
-      if (selectedFiles.length === 0) {
-        console.log(chalk.red('No files selected to remove!'));
-        await new Promise(resolve => setTimeout(resolve, 1000));
-        continue;
+    // Show grid info
+    console.log(chalk.gray(`Grid: ${actualColumns} columns × ${itemWidth} chars | Terminal width: ${terminalWidth}`));
+  }
+  // Helper function to refresh file list for current directory
+  function refreshFileList() {
+    fileList = [];
+    
+    try {
+      // Add parent directory option if not at root
+      if (currentPath !== currentDir) {
+        fileList.push({
+          type: 'parent',
+          path: path.dirname(currentPath),
+          name: '..'
+        });
       }
       
-      console.log(chalk.cyan('\nSelected files:'));
-      selectedFiles.forEach((file, index) => {
-        console.log(`${index + 1}. ${path.basename(file)}`);
+      // Read current directory
+      const entries = fs.readdirSync(currentPath).sort();
+      
+      // Add directories first
+      entries.forEach(entry => {
+        const fullPath = path.join(currentPath, entry);
+        const stat = fs.statSync(fullPath);
+        
+        if (stat.isDirectory()) {
+          fileList.push({
+            type: 'directory',
+            path: fullPath,
+            name: entry
+          });
+        }
       });
       
-      const removeInput = await askQuestion(rl, chalk.cyan('Enter number to remove (or press Enter to cancel): '));
-      const removeIndex = parseInt(removeInput) - 1;
+      // Add files
+      entries.forEach(entry => {
+        const fullPath = path.join(currentPath, entry);
+        const stat = fs.statSync(fullPath);
+        
+        if (stat.isFile()) {
+          fileList.push({
+            type: 'file',
+            path: fullPath,
+            name: entry,
+            size: stat.size
+          });
+        }
+      });
       
-      if (removeIndex >= 0 && removeIndex < selectedFiles.length) {
-        const removed = selectedFiles.splice(removeIndex, 1)[0];
-        console.log(chalk.green(`Removed: ${path.basename(removed)}`));
+      // Ensure currentIndex is within bounds
+      if (currentIndex >= fileList.length) {
+        currentIndex = Math.max(0, fileList.length - 1);
       }
       
-      await new Promise(resolve => setTimeout(resolve, 1000));
-      continue;
+    } catch (error) {
+      console.error('Error reading directory:', error.message);
+      fileList = [];
     }
+  }
+  // Main keyboard event handler
+  function handleKeyInput(key) {
+    // Calculate grid dimensions for navigation
+    const terminalWidth = process.stdout.columns || 80;
+    const maxItemWidth = Math.max(...fileList.map(item => {
+      const name = path.basename(item.path);
+      return name.length + 4;
+    }));
+    const itemWidth = Math.min(Math.max(maxItemWidth, 15), 25);
+    const columnsPerRow = Math.max(1, Math.floor((terminalWidth - 4) / itemWidth));
     
-    if (cmd === 's' || cmd === 'search') {
-      const searchTerm = await askQuestion(rl, chalk.cyan('Enter search term (filename or extension): '));
-      if (searchTerm) {
-        const matches = fileList.filter(item => 
-          item.type === 'file' && 
-          (item.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
-           path.extname(item.path).toLowerCase() === searchTerm.toLowerCase())
-        );
+    switch (key) {
+      case KEYS.UP:
+        // Move up by one row (subtract columns)
+        const newUpIndex = currentIndex - columnsPerRow;
+        if (newUpIndex >= 0) {
+          currentIndex = newUpIndex;
+          displayBrowser();
+        }
+        break;
         
-        if (matches.length > 0) {
-          console.log(chalk.cyan(`\nFound ${matches.length} matches:`));
-          matches.forEach((item, index) => {
-            const isSelected = selectedFiles.includes(item.path);
-            const prefix = isSelected ? chalk.green('✓') : chalk.white((index + 1).toString());
-            console.log(`${prefix} ${item.name} ${chalk.gray(`(${(item.size / 1024).toFixed(1)} KB)`)}`);
-          });
-          
-          const selectAll = await askConfirmation(rl, chalk.cyan('Select all search results?'), false);
-          if (selectAll) {
-            matches.forEach(item => {
-              if (!selectedFiles.includes(item.path)) {
-                selectedFiles.push(item.path);
-              }
-            });
-            console.log(chalk.green(`Added ${matches.length} files!`));
+      case KEYS.DOWN:
+        // Move down by one row (add columns)
+        const newDownIndex = currentIndex + columnsPerRow;
+        if (newDownIndex < fileList.length) {
+          currentIndex = newDownIndex;
+          displayBrowser();
+        }
+        break;
+        
+      case KEYS.LEFT:
+        // Move left by one column
+        if (currentIndex > 0) {
+          currentIndex--;
+          displayBrowser();
+        }
+        break;
+        
+      case KEYS.RIGHT:
+        // Move right by one column
+        if (currentIndex < fileList.length - 1) {
+          currentIndex++;
+          displayBrowser();
+        }
+        break;
+        
+      case KEYS.SPACE:
+        if (fileList.length > 0) {
+          const item = fileList[currentIndex];
+          if (item.type === 'file') {
+            const index = selectedFiles.indexOf(item.path);
+            if (index === -1) {
+              selectedFiles.push(item.path);
+            } else {
+              selectedFiles.splice(index, 1);
+            }
+            displayBrowser();
+          }
+        }
+        break;         
+      case KEYS.ENTER:
+        if (fileList.length > 0) {
+          const item = fileList[currentIndex];
+          if (item.type === 'parent' || item.type === 'directory') {
+            currentPath = item.path;
+            currentIndex = 0;
+            refreshFileList();
+            displayBrowser();
+          } else {
+            // When Enter is pressed on a file, finish selection if files are selected
+            if (selectedFiles.length > 0) {
+              isNavigating = false;
+            }
           }
         } else {
-          console.log(chalk.yellow('No matches found.'));
+          // Finish selection when directory is empty and Enter is pressed (if files selected)
+          if (selectedFiles.length > 0) {
+            isNavigating = false;
+          }
         }
+        break;
         
-        await new Promise(resolve => setTimeout(resolve, 2000));
-      }
-      continue;
+      case KEYS.BACKSPACE:
+        if (currentPath !== currentDir) {
+          currentPath = path.dirname(currentPath);
+          currentIndex = 0;
+          refreshFileList();
+          displayBrowser();
+        }
+        break;
+        
+      case 'a':
+        // Select all files in current directory
+        let addedCount = 0;
+        fileList.forEach(item => {
+          if (item.type === 'file' && !selectedFiles.includes(item.path)) {
+            selectedFiles.push(item.path);
+            addedCount++;
+          }
+        });
+        if (addedCount > 0) {
+          displayBrowser();
+        }
+        break;
+
+      case 'c':
+        // Clear all selections
+        selectedFiles.length = 0;
+        displayBrowser();
+        break;
+        
+      case KEYS.ESCAPE:
+      case '\u001b': // ESC key
+        isNavigating = false;
+        break;
+        
+      default:
+        // Ignore other keys
+        break;
     }
+  }
+
+  // Initialize and start navigation
+  return new Promise((resolve) => {
+    refreshFileList();
+    displayBrowser();
     
-    if (cmd === 'f' || cmd === 'filter') {
-      const allExtensions = [...new Set(
-        fileList
-          .filter(item => item.type === 'file')
-          .map(item => path.extname(item.path).toLowerCase())
-          .filter(ext => ext)
-      )].sort();
-      
-      if (allExtensions.length === 0) {
-        console.log(chalk.yellow('No file extensions found!'));
-        await new Promise(resolve => setTimeout(resolve, 1000));
-        continue;
+    process.stdin.on('data', (key) => {
+      if (!isNavigating) {
+        return;
       }
       
-      console.log(chalk.cyan('\nAvailable extensions:'));
-      allExtensions.forEach((ext, index) => {
-        const count = fileList.filter(item => 
-          item.type === 'file' && path.extname(item.path).toLowerCase() === ext
-        ).length;
-        console.log(`${index + 1}. ${ext} (${count} files)`);
-      });
-      
-      const extChoice = await askQuestion(rl, chalk.cyan('Enter extension number (or press Enter to cancel): '));
-      const extIndex = parseInt(extChoice) - 1;
+      const keyStr = key.toString();
+      handleKeyInput(keyStr);
       
-      if (extIndex >= 0 && extIndex < allExtensions.length) {
-        const selectedExt = allExtensions[extIndex];
-        const matches = fileList.filter(item => 
-          item.type === 'file' && path.extname(item.path).toLowerCase() === selectedExt
-        );
+      if (!isNavigating) {
+        // Cleanup
+        process.stdin.removeAllListeners('data');
+        process.stdin.setRawMode(false);
+        process.stdin.pause();
         
-        const selectAll = await askConfirmation(rl, chalk.cyan(`Select all ${selectedExt} files?`), false);
-        if (selectAll) {
-          matches.forEach(item => {
-            if (!selectedFiles.includes(item.path)) {
-              selectedFiles.push(item.path);
+        // Display completion summary
+        if (selectedFiles.length > 0) {
+          console.log(chalk.green.bold('✅ File Selection Complete!'));
+          console.log(chalk.cyan('-'.repeat(50)));
+          
+          const totalSize = selectedFiles.reduce((sum, file) => {
+            try {
+              return sum + fs.statSync(file).size;
+            } catch {
+              return sum;
+            }
+          }, 0);
+          
+          console.log(chalk.white(`Selected ${selectedFiles.length} files (${(totalSize / 1024).toFixed(1)} KB total):`));
+          selectedFiles.forEach((file, index) => {
+            try {
+              const stats = fs.statSync(file);
+              const size = (stats.size / 1024).toFixed(1) + ' KB';
+              console.log(pad(chalk.green(`${index + 1}.`), 5) + pad(path.basename(file), 35) + chalk.gray(size));
+            } catch (e) {
+              console.log(pad(chalk.red(`${index + 1}.`), 5) + chalk.red(path.basename(file) + ' (Error reading file)'));
             }
           });
-          console.log(chalk.green(`Added ${matches.length} ${selectedExt} files!`));
-        }
-      }
-      
-      await new Promise(resolve => setTimeout(resolve, 1000));
-      continue;
-    }
-    
-    // Handle numeric selection
-    const num = parseInt(cmd);
-    if (!isNaN(num) && num > 0 && num <= fileList.length) {
-      const item = fileList[num - 1];
-      
-      if (item.type === 'parent') {
-        currentPath = item.path;
-        currentPage = 0;
-        continue;
-      }
-      
-      if (item.type === 'directory') {
-        currentPath = item.path;
-        currentPage = 0;
-        continue;
-      }
-        if (item.type === 'file') {
-        const index = selectedFiles.indexOf(item.path);
-        if (index === -1) {
-          selectedFiles.push(item.path);
-          const size = (item.size / 1024).toFixed(1);
-          console.log(chalk.green(`✓ Added: ${path.basename(item.path)} (${size} KB)`));
+          console.log(chalk.cyan('-'.repeat(50)));
         } else {
-          selectedFiles.splice(index, 1);
-          console.log(chalk.yellow(`✗ Removed: ${path.basename(item.path)}`));
+          console.log(chalk.yellow('No files selected.'));
         }
-        await new Promise(resolve => setTimeout(resolve, 800));
-        continue;
-      }
-    }
-      console.log(chalk.red('Invalid command!'));
-    await new Promise(resolve => setTimeout(resolve, 1000));
-  }
-  
-  // Display completion summary
-  if (selectedFiles.length > 0) {
-    console.clear();
-    console.log(chalk.green.bold('✅ File Selection Complete!'));
-    console.log(chalk.cyan('-'.repeat(50)));
-    
-    const totalSize = selectedFiles.reduce((sum, file) => {
-      try {
-        return sum + fs.statSync(file).size;
-      } catch {
-        return sum;
+        
+        resolve(selectedFiles);
       }
-    }, 0);
-    
-    console.log(chalk.white(`Selected ${selectedFiles.length} files (${(totalSize / 1024).toFixed(1)} KB total):`));
-    selectedFiles.forEach((file, index) => {
-      const stats = fs.statSync(file);
-      const size = (stats.size / 1024).toFixed(1) + ' KB';
-      console.log(pad(chalk.green(`${index + 1}.`), 5) + pad(path.basename(file), 35) + chalk.gray(size));
     });
-    console.log(chalk.cyan('-'.repeat(50)));
-  } else {
-    console.log(chalk.yellow('No files selected.'));
-  }
-  
-  return selectedFiles;
+  });
 }
 
 export {
@@ -782,7 +875,7 @@ export {
   askConfirmation,
   selectFromList,
   selectFilesImproved,
-  selectFilesInteractive,
+  selectFilesKeyboard,
   getFilesMatchingWildcard,
   getSubfoldersRecursive,
   pad

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "canvaslms-cli",
-  "version": "1.4.2",
+  "version": "1.4.3",
   "description": "A command line tool for interacting with Canvas LMS API",
   "keywords": [
     "canvas",
@@ -38,8 +38,8 @@
     "CHANGELOG.md"
   ],
   "scripts": {
-    "start": "node src/index.js",
-    "dev": "node src/index.js",
+    "start": "bun src/index.js",
+    "dev": "bun src/index.js",
     "test": "echo \"Error: no test specified\" && exit 1",
     "lint": "echo \"Add linting here\"",
     "format": "echo \"Add formatting here\"",