Skip to content

[Feature]: Add sorting options for instances (alphabetical, status, date) #22

@salomonamiga

Description

@salomonamiga

Prerequisites

  • I have searched existing issues to ensure this feature hasn't been requested before
  • I have read the documentation
  • This feature request is related to Evolution Manager (not Evolution API)

Problem Statement

Currently, instances in the Manager dashboard are displayed in UUID order (internal database ID), which appears completely random to users.

When managing 10+ instances, it's frustrating and time-consuming to find a specific instance because they're not organized in any logical way - not alphabetically, not by status, not by creation date.

I have to visually scan through all cards every time I need to find one specific instance.

Proposed Solution

Add a sorting dropdown next to the existing "Status" filter with these options:

  1. Name (A-Z) ← Default
  2. Name (Z-A)
  3. Status (Connected first)
  4. Creation Date (Newest first)
  5. Creation Date (Oldest first)
  6. Message Count (Most active first)

The user's preference should be saved in localStorage so it persists between sessions.

Alternative Solutions

  1. At minimum, just sort alphabetically by default - this alone would solve 90% of the problem
  2. Allow drag-and-drop manual reordering (more complex)
  3. Add a "favorites" or "pin" feature to keep important instances at top

Feature Category

UI/UX Improvement

Priority

Medium - Would be helpful

Use Case

I manage WhatsApp instances for different projects. Every time I need to configure or check a specific instance, Im lost when scanning through randomly ordered cards.

With alphabetical sorting, I could instantly locate them without hunting through the entire dashboard.

Mockups/Screenshots

No response

Technical Details

This can be implemented entirely in the frontend without backend changes:

  1. The fetchInstances API already returns all necessary data (name, status, createdAt, message count)
  2. Simply sort the array client-side before rendering
  3. Store sort preference in localStorage
  4. Add a dropdown component next to the Status filter

Example implementation:

const sortedInstances = instances.sort((a, b) =>
  a.name.localeCompare(b.name)
);


### Impact Assessment

- [x] This feature would benefit many users
- [x] This feature is backward compatible
- [ ] This feature requires breaking changes
- [ ] This feature affects security
- [ ] This feature affects performance

### Additional Context

This is a standard UX pattern in virtually every dashboard interface (AWS, Vercel, Netlify, etc.). Users expect to be able to sort lists.

The current UUID-based ordering makes the dashboard feel unpolished and difficult to use at scale.

### Contribution

- [ ] I would like to work on implementing this feature
- [ ] I can provide design mockups
- [x] I can help with testing

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions