File Explorer: Complete Interview Checklist

Core (tree data, recursive render, expand/collapse, icons, indentation, stopPropagation), advanced (expand/collapse all, file type icons, search, context menu, active highlight, drag and drop), CSS (hover, cursor, scrollable), and testing (expand/collapse, nesting, empty folders, root files, no parent toggle on child click).

Tree data structure, recursive rendering, expand/collapse on click, icons for files/folders, indentation by depth, and stopPropagation to prevent child clicks from toggling parents. These are the minimum required features.

Expand/collapse all buttons, file type icons by extension, search files, context menu (right-click with rename/delete/new), active file highlight, and drag and drop to move files. Add these after the core works.

Test expand/collapse on folders, nested folders (3+ levels), empty folders (should not expand), files at root level, and verify clicking a child does not toggle the parent (stopPropagation).

Hover state (.tree-node:hover { background: #e0e0e0; }), cursor: pointer for folders, font-weight: bold for folders, a scrollable container (overflow: auto), and consistent indentation (paddingLeft: depth * 20).