telosnetwork / open-block-explorer

The Open Block Explorer (OBE) is the first open source block explorer that is designed to support all AntelopeIO-based blockchains.
https://explorer.telos.net
Apache License 2.0
27 stars 24 forks source link

Feature Request - Expand all transaction data #749

Open donnyquixotic opened 1 year ago

donnyquixotic commented 1 year ago

Feature: Toggle All Transaction Data in TX Table

Overview

Implement a "Toggle All" feature for transaction data in the TX table, allowing users to expand or collapse all transaction data simultaneously.

Example of an action that is truncated and there is no way to view the full data: https://explorer-test.telos.net/transaction/712d8c06109bfcb5d93d4f84a08d5eee9ef19898fbdebfc168be866cd7053881

Current Behavior

Desired Behavior

Detailed Requirements

Toggle Functionality

  1. Add a chevron icon in the "Data" header of the TX table.
  2. Clicking the chevron should toggle all transaction data:
    • Chevron pointing down: expand all data
    • Chevron pointing up: collapse all data

Default State

User Interactions

State Management

Chevron State

Acceptance Criteria

  1. The "Data" header includes a clickable chevron icon.
  2. Clicking the chevron expands or collapses all transaction data.
  3. The chevron icon changes direction based on the current global state.
  4. The global toggle state is remembered across page navigation.
  5. Individual row expansions/collapses do not affect the global toggle state or chevron direction.
  6. The feature works correctly with varying amounts of data in the table.
  7. Add tooltip to chevron explaining actions : "Collapse Data", "Expand Data"
kylanhurt commented 1 year ago

And I assume this option would be somewhere right above the table in this area? image

donnyquixotic commented 1 year ago

And I assume this option would be somewhere right above the table in this area? image

Yea, a toggle should do the trick. There's a related bug where if you expand one row, that row remains expanded on data update and/or page navigation. We want the following behavior: