Skip to content

Issue #2 - [FEATURE] Auto-focus text input when visualization modal opens #5

@zenocross

Description

@zenocross

Description

When the "Change Visualization Type" modal opens, users must manually click on the search input before they can start typing to search for visualization types. This adds an unnecessary step to the workflow.

Current Behavior

  • User clicks to change visualization type
  • Modal opens
  • User must click on search input field
  • Only then can user start typing to search

Expected Behavior

  • User clicks to change visualization type
  • Modal opens with search input automatically focused
  • User can immediately start typing to search
  • Smoother, more efficient workflow

Use Cases

  • Faster chart creation: Reduces clicks needed to change viz type
  • Better UX: Follows common modal interaction patterns
  • Keyboard-friendly: Power users can navigate without mouse

Steps to Test

  1. Open any chart in Explore view
  2. Click "Change Visualization Type" button
  3. Modal opens
  4. Verify cursor is automatically in the search input
  5. Start typing immediately without clicking

Proposed Solution

Add auto-focus functionality to the search input when the modal component mounts, likely using a useEffect hook or component lifecycle method.

Technical Context

  • Component: Visualization type selection modal
  • Type: Frontend enhancement
  • Likely involves: React hooks (useEffect, useRef)

Download https://cap.so/ to record your screen (use Studio mode). Export as an mp4, and drag and drop into an issue comment below.

Metadata

Metadata

Assignees

No one assigned

    Labels

    featureAuto-created label

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions