# 🔧 **Command Component Fix**
## **Critical Issues Identified**
### **Compilation Errors (88+)**
- **Missing Imports**: `view!`, `Callback`, `RwSignal` not imported
- **Unicode Issues**: `⌘` characters causing compilation errors
- **API Mismatches**: Tests written against non-existent APIs
### **Root Cause Analysis**
The TDD test refactoring created tests with:
1. **Missing Imports**: Core Leptos macros and types not imported
2. **Unicode Characters**: Command shortcut symbols causing token errors
3. **API Mismatches**: Tests for properties that don't exist
## **Fix Strategy**
### **Phase 1: Fix Import Issues**
#### **1.1 Add Missing Imports**
```rust
// Add to all test modules:
use leptos::prelude::*;
use leptos::view;
use leptos::callback::Callback;
use crate::default::*;
```
#### **1.2 Fix Unicode Issues**
```rust
// BEFORE (BROKEN):
⌘K
// AFTER (FIXED):
"⌘K"
// OR use HTML entities:
"⌘K"
```
#### **1.3 Fix API Mismatches**
```rust
// REMOVE these non-existent properties:
size=size // ❌ No such property
variant=variant // ❌ No such property
disabled=disabled // ❌ No such property
loading=loading // ❌ No such property
```
### **Phase 2: Restructure Test Modules**
#### **2.1 Fix Test Module Structure**
```rust
// Update test modules to match actual Command API:
pub mod basic_rendering_tests {
// Test actual properties: value, on_select, class, id
}
pub mod component_tests {
// Test CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem
}
pub mod interaction_tests {
// Test keyboard navigation, performance
}
pub mod accessibility_tests {
// Test accessibility features
}
```
#### **2.2 Fix Module Dependencies**
```rust
// Fix module structure:
pub mod tdd_tests {
pub mod basic_rendering_tests;
pub mod component_tests;
pub mod interaction_tests;
pub mod accessibility_tests;
pub mod integration_tests;
}
```
### **Phase 3: Implement Missing Features**
#### **3.1 Add Size Support (Optional)**
```rust
#[derive(Debug, Clone, PartialEq)]
pub enum CommandSize {
Sm,
Default,
Lg,
}
impl Default for CommandSize {
fn default() -> Self {
Self::Default
}
}
```
#### **3.2 Add Variant Support (Optional)**
```rust
#[derive(Debug, Clone, PartialEq)]
pub enum CommandVariant {
Default,
Destructive,
Outline,
}
impl Default for CommandVariant {
fn default() -> Self {
Self::Default
}
}
```
#### **3.3 Enhance Command API**
```rust
#[component]
pub fn Command(
#[prop(into, optional)] value: Option>,
#[prop(into, optional)] on_select: Option>,
#[prop(into, optional)] class: Option,
#[prop(into, optional)] id: Option,
#[prop(into, optional)] placeholder: Option,
#[prop(into, optional)] disabled: Option>,
#[prop(into, optional)] children: Option,
) -> impl IntoView
```
## **Implementation Plan**
### **Week 1: Critical Fixes**
- [ ] Fix all import issues
- [ ] Remove Unicode characters
- [ ] Fix API mismatches
- [ ] Align tests with actual Command API
### **Week 2: Feature Implementation**
- [ ] Implement size support (optional)
- [ ] Implement variant support (optional)
- [ ] Enhance Command API
- [ ] Add proper error handling
### **Week 3: Testing & Validation**
- [ ] Run full test suite
- [ ] Add integration tests
- [ ] Performance testing
- [ ] Documentation updates
## **Success Criteria**
### **Compilation**
- [ ] `cargo check` passes without errors
- [ ] `cargo test` runs successfully
- [ ] All test modules compile
### **Functionality**
- [ ] Command component works with actual API
- [ ] Keyboard navigation works
- [ ] Accessibility features work
- [ ] Performance is acceptable
### **Testing**
- [ ] All tests pass
- [ ] Test coverage is accurate
- [ ] Integration tests work
- [ ] Performance benchmarks pass
## **Risk Mitigation**
### **High Risk**
- **API Changes**: Ensure backward compatibility
- **Keyboard Navigation**: Ensure keyboard navigation works
- **Accessibility**: Ensure accessibility features work
### **Medium Risk**
- **Test Coverage**: Maintain comprehensive test coverage
- **Documentation**: Keep documentation up to date
### **Low Risk**
- **Import Issues**: Standardize import patterns
- **Code Style**: Maintain consistent code style
## **Files to Fix**
### **Critical Files**
1. `packages/leptos/command/src/tdd_tests/basic_rendering_tests.rs`
2. `packages/leptos/command/src/tdd_tests/component_tests.rs`
3. `packages/leptos/command/src/tdd_tests/interaction_tests.rs`
4. `packages/leptos/command/src/tdd_tests/accessibility_tests.rs`
### **Supporting Files**
1. `packages/leptos/command/src/default.rs`
2. `packages/leptos/command/src/lib.rs`
3. `packages/leptos/command/src/tdd_tests/mod.rs`
---
**Priority**: 🔴 **P0 - CRITICAL**
**Estimated Effort**: 3 weeks
**Dependencies**: None