Card Integration within Tabs

[jetienne]

Feature

I propose the ability to integrate cards within tabs. This would offer the flexibility to place cards anywhere within a tabbed interface.

Use Case

This feature would be incredibly useful for creating more dynamic and flexible UIs, allowing us to better organize content and improve the user experience by grouping related information within tabs, each potentially containing one or more cards.

Expected Behavior

• Cards should be seamlessly integrable within any tab.
• There should be no limitations on the number of cards per tab.

Looking forward to seeing this feature implemented. Thank you!

[adrianthedev]

How would the API look like for such a thing in your view?

[jetienne]

@adrianthedev I would place it as the same level as field or panel

It could look like :

tab 'Stats' do
   card Avo::Cards::MyCard
end

What do you think?

[adrianthedev]

Right now the cards will only appear above the panels on show and edit views. We already have some requests to make that customizable and enable adding cards mingled with other elements of a panel.

Here's a possible API that should re-use most code.

def fields
  main_panel do
    field :id, as: :id
    # more fields
    cards maybe_some_settings_here: true do
      card SomeCard
      card SomeOtherCard, arguments: {some: :arg}
    end

    sidebar do
      field :created_at, as: :date_time

      # this, below is still unclear to me if we should support adding just one card.
      # add one card
      card SomeCard
      # or add a group of cards
      cards do
        card SomeCard
      end
    end

    field :accounts, as: :has_many

    tabs do
      tab do
        panel do
          field :name, as: :text
        end

        cards do
          card SomeCard
          card SomeOtherCard
        end

        panel do
          field :address, as: :text
        end
      end
    end
  end
end

[jetienne]

@adrianthedev Is there any reason to have a cards block ?

[adrianthedev]

I think yes.
We'd like to give the ability to configure how many columns that row has, so you can configure how many columns should the card be.
We might add other setting in the future as well. Maybe configurable ranges and other things.

[github-actions]

This issue has been marked as stale because there was no activity for the past 15 days.