Paleta de Comandos de JMatrixPlatform para Navegación UI

# Paleta de comandos en JMatrixPlatform: simplificando la navegación en sistemas multimódulo

Los sistemas multimódulo como JMatrixPlatform suelen sufrir de sobrecarga en la interfaz de usuario: cientos de comandos, botones y pestañas convierten la navegación en una pesadilla, incluso para los administradores. Inspirándonos en la paleta de comandos de VSCode, hemos implementado una solución universal: una sola barra de búsqueda para todos los comandos accesibles al usuario. Esto reduce la dependencia de menús anidados y acelera el acceso a las funciones.

El problema clásico de navegación

En sistemas con docenas de módulos, el panel principal se satura de atajos, categorías y submenús. Los usuarios con acceso a más de 10 flujos de trabajo pierden tiempo buscando: Inicio -> Mis acciones -> Gestión de requisitos -> Asignación. Las guías paso a paso son obligatorias: "Expande la categoría A, ve a B, haz clic en C".

Las tareas administrativas (actualizar caché, sincronizar, informes) son especialmente complicadas: es difícil ubicarlas y recordarlas. Todas las soluciones se reducen a agruparlas, lo que solo oculta la funcionalidad.

Inspiración en VSCode

La paleta de comandos de VSCode ofrece acceso impulsado por teclado a cualquier función del IDE mediante búsqueda por nombre. Elimina debates sobre la ubicación en la UI y permite invocaciones instantáneas.

En JMatrixPlatform, la arquitectura ya está preparada: cada acción de UI es un JCommand con href, etiqueta, descripción y permisos de acceso. Los comandos impulsan el panel principal, barras de herramientas y paneles.

Ejemplo del comando Projects:

@JModelPart
public final class ACDProjectsDesk extends JCommand {
  public static ACDProjectsDesk COMMAND = new ACDProjectsDesk();

  @Override
  public JHref getHref(JContext ctx, JRequestParams requestParams) {
    return new JHrefTable(
        ATBProjectsDesk.TABLE,
        JTarget.CONTENT,
        Actions.TOOLBAR,
        null,
        AIQProjectsAll.INQUIRY,
        JHrefTable.RowSelection.MULTI);
  }
}

Localización en messages_en.properties:

en.demo.matrix.schema.ui.command.ACDProjectsDesk=Projects

Implementación con hashtags

La paleta usa hashtags para filtrar accesos y búsqueda semántica por sinónimos (ej. "empresas" -> "organizaciones").

@Override
public Set<String> getHashTags() {
  return Set.of(
    "document-management",
    "demo",
    "projects",
    "kits");
}

El controlador devuelve los comandos disponibles:

@GetMapping("/navigator/paletteCommands")
public ResponseEntity<List<JDTOCommand>> getCommands(
    @JPathContextVariable JContext ctx,
    @RequestParam Map<String, String> requestParamsMap) {
  
  JRequestParams requestParams = new JRequestParams(requestParamsMap);

  Set<JCommand> commands = JModel.getAdminListByClass(JCommand.class);

  List<JDTOCommand> results = commands
      .stream()
      .filter(cmd -> cmd.getHashTags() != null && !cmd.getHashTags().isEmpty() && cmd.show(ctx, requestParams))
      .map(cmd -> new JDTOCommand(ctx, requestParams, cmd))
      .toList();

  return ResponseEntity.ok(results);
}

Filtrado en el cliente para mayor velocidad (hasta 1000 comandos). Ejemplo JSON:

[
   {
      "name":"ACPersonDesk",
      "description":"Registro de usuarios de la plataforma",
      "label":"Usuarios",
      "icon":null,
      "settings":{},
      "href":{
         "url":"../table/ATBPersonDesk",
         "requestParams":{
            "toolbar":"AMPersonDeskTableActions",
            "rowSelection":"MULTI",
            "inquiry":"AIQPersonsDesk",
            "target":"CONTENT"
         }
      },
      "hashTags":["usuarios", "estructura-org"]
   }
]

Buscar "proyectos" abre instantáneamente el href correcto, sin importar cuán profundo esté en el menú.

Beneficios clave

• Acceso instantáneo: Búsqueda por etiqueta, descripción, hashtags.
• Consciente del contexto: Los hashtags añaden sinónimos y filtran comandos relevantes.
• Versátil: Funciona para ver componentes y acciones directas.
• Escalable: Independiente de la estructura de UI, ideal para más de 100 módulos.
• Alto rendimiento: El servidor envía la lista, el cliente filtra en tiempo real.

La paleta complementa los menús sin reemplazarlos. Los administradores obtienen acceso rápido a funciones poco usadas, sin necesidad de manuales.

Lecciones clave

• La arquitectura JCommand permite implementar la paleta de forma trivial, sin refactorizaciones.
• Los hashtags manejan filtrado y búsqueda semántica de una vez.
• El filtrado en cliente mantiene la respuesta con más de 1000 comandos.
• La paleta reduce la carga cognitiva en ecosistemas multimódulo.
• Perfecta para sistemas de ingeniería con usuarios conservadores.

— Editorial Team