Explorer

The Explorer provides a unified, Finder-style interface for managing your notes and files. It replaces separate tabs with a single, powerful view that supports nested folders, drag-and-drop organization, and intuitive navigation.

Overview

The Explorer tab (Tab 2) combines notes, files, and bookmarks in a file-system-like interface:

• Folders for organization at any depth
• Notes for rich text content
• Files for attachments and documents
• Bookmarks for saved web links with metadata

All four types live together, allowing flexible organization that matches how you think.

Navigation

Breadcrumbs

The breadcrumb bar at the top shows your current location:

Home > Projects > Website Redesign > Design Assets

• Click any breadcrumb to jump to that folder
• Click "Home" to return to root level

Opening Items

Keyboard Navigation

Creating Content

New Folder

1. Click New Folder in the toolbar
2. Enter a folder name
3. Press Enter or click Create

Folders are created in the current directory.

New Note

1. Click New Note in the toolbar
2. Enter a title
3. Add rich text content
4. Click Create

Notes are created in the current directory.

Upload File

1. Click Upload File in the toolbar
2. Select a file from your computer
3. Optionally edit the name
4. Click Create

Files are uploaded to the current directory.

New Bookmark

1. Click New Bookmark in the toolbar
2. Paste the URL
3. Optionally add a title and comments
4. Click Create

Bookmarks are created in the current directory. Page metadata is fetched automatically in the background.

Drag and Drop

Move items between folders by dragging:

How to Drag

1. Click and hold an item
2. Drag to a folder or breadcrumb
3. Release to drop

Drop Targets

• Folders - Drop onto any folder icon
• Breadcrumbs - Drop onto any breadcrumb level
• Root - Drop on "Home" breadcrumb for root level

Visual Feedback

• Dragging item - Slightly faded with grab cursor
• Valid drop zone - Dashed outline
• Active drop target - Solid outline, highlighted

Touch Devices

On touch devices:
1. Long-press (500ms) to start dragging
2. Drag to target folder
3. Release to drop

Sorting

Click the sort dropdown in the toolbar to change order:

The default sort is Type (folders first, then alphabetically by name).

Your sort preference is preserved in the URL, so you can bookmark sorted views.

View Modes

The Explorer offers two view modes to suit different preferences:

Grid View (Default)

The grid view displays items as cards in a responsive grid:
- Large icons for visual recognition
- Names displayed below icons
- Good for visual browsing

List View

The list view displays items in a compact, single-column layout:
- Inline icons with full names
- Metadata (date, tags) visible at a glance
- Better for dense content and scanning

Switching Views

On desktop, use the toggle buttons in the toolbar:
- Grid icon - Switch to grid view
- List icon - Switch to list view

On mobile, the Explorer always uses list view for better touch interaction.

Setting Default View

1. Go to Preferences
2. Find Default Explorer View
3. Select Grid or List
4. Save

Your preference applies across all projects. URL parameters override your preference temporarily.

Mobile Experience

On mobile devices, the Explorer uses list view exclusively for a better touch experience.

Swipe Actions

On touch devices, swipe items for quick actions:

Responsive Layout

The Explorer adapts to screen size:
- Mobile - Always list view, swipe actions
- Tablet - Grid or list view with larger touch targets
- Desktop - Full toolbar with view toggle

Folder Management

Renaming Folders

1. Click the three-dot menu on a folder
2. Select Rename
3. Enter the new name
4. Press Enter

Or swipe right on mobile.

Deleting Folders

Deleting a folder removes all contents recursively:

1. Click the three-dot menu
2. Select Delete
3. Confirm the deletion

Warning: This permanently deletes all notes and files inside the folder.

Moving Folders

Drag folders to reorganize:
- Drop into another folder to nest
- Drop on a breadcrumb to move up
- Cannot drop a folder into itself or its descendants

Working with Notes

Viewing Notes

Click a note to open the preview modal:
- Full content displayed
- Attachments visible
- View Full Page link for dedicated view

Editing Notes

1. Click the three-dot menu
2. Select Edit
3. Make changes
4. Save

Or swipe right on mobile.

Note Attachments

Notes can contain embedded files:
- Images display inline
- Documents show as download links
- PDFs can be previewed

Working with Files

Viewing Files

Click a file to open the inline previewer:

• Images display a resized preview (:preview variant up to 1600×1600)
• PDFs open in an embedded PDF.js viewer with pagination, zoom, and search
• Videos and audio play directly in the modal via HTML5 controls
• Markdown is rendered as sanitized HTML with syntax-highlighted code fences
• Code/text files (Ruby, Python, Go, JS, JSON, YAML, SQL, shell, etc.) show syntax-highlighted source via Rouge, theme-aware
• Other files show a generic icon plus the content type and a download button

Text and code previews are capped at the first 1 MB; a banner appears when truncated.

Inside the previewer:
- Esc closes the modal
- ← / → navigate to the previous/next file in the current directory
- The toolbar exposes the same prev/next buttons

Downloading Files

• Click Download in the preview modal
• Or swipe right on mobile for direct download
• Or use the three-dot menu

File Types

All file types are supported:

Transferring Items

Move items to a different project:

1. Open the item (note or file)
2. Click Move
3. Search for the destination project
4. Select the project

The item moves to the root level of the destination project.

Public Sharing

Share folders publicly with read-only access:

1. Navigate to a folder
2. Click Share in the toolbar
3. Create a share link

Shared folders include:
- All subfolders (recursive)
- All notes with their content
- All files with download access

Public viewers can navigate within the shared scope but cannot access parent folders or edit anything.

See Public Sharing for more details.

Collaboration

When a project is shared with collaborators:

• All collaborators can view the Explorer
• All collaborators can create folders, notes, and files
• All collaborators can move and organize items
• Changes trigger notifications to other collaborators

See Collaboration for more details.

Search

Find items using global search (Cmd+K):

• Search by folder name, note title, or file name
• Results show the folder path for context
• Click a result to navigate directly to it

The Explorer also appears as a "Folders" tab in search results.

Tips and Best Practices

Organizing Projects

1. Use folders for phases - "Planning", "Design", "Development"
2. Keep related items together - Notes and files for the same topic
3. Don't over-nest - 2-3 levels is usually enough
4. Use clear names - Descriptive folder and file names

Naming Conventions

Good folder names:
- Meeting Notes
- Design Assets
- Reference Materials
- Archive - 2024

Good file names:
- meeting-notes-2024-01-15.md
- logo-final-v2.png
- budget-q4-2024.xlsx

Quick Access

• Bookmark frequently used folders (URL contains folder path)
• Use keyboard navigation for speed
• Use search for deep items

Related Topics

• Notes - Rich text note details
• Files - File management details
• Bookmarks - Web link saving
• Tags - Cross-cutting organization
• Public Sharing - Sharing externally
• Search - Finding content