feat: show/hide cu profiling

[C0mberry]

Description

• adding CollapsibleCard component
• refactoring of existing Collapse/Expand btns
• adding CollapsibleCard for CU profiling section

Type of change

• New feature

Screenshots

Testing

Storybook
Transaction Page

Related Issues

HOO-404

Checklist

• My code follows the project's style guidelines
• All tests pass locally and in CI
• I have run build:info script to update build information
• CI/CD checks pass
• I have included screenshots for protocol screens (if applicable)

[vercel]

@C0mberry is attempting to deploy a commit to the Solana Foundation Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Summary

This PR introduces a reusable CollapsibleCard component and migrates eight existing cards to use it, then wraps CUProfilingCard in it to deliver the show/hide feature. The refactor cleanly eliminates duplicated local expanded state across many components.

• InspectorInstructionCard gains an unintended Collapse/Expand button — collapsible is not passed, so it defaults to true, adding a toggle that was never present on the inspector page. Add collapsible={false} to restore the original behavior.

Confidence Score: 4/5

Safe to merge after fixing the InspectorInstructionCard collapsible default — all other changes are clean refactors.

One P1 issue: InspectorInstructionCard omits collapsible={false}, causing an unintended Collapse/Expand button to appear on the inspector page. The remaining findings are P2 style/UX concerns. The core CollapsibleCard abstraction and the CU profiling show/hide feature are well-implemented.

app/components/common/InspectorInstructionCard.tsx requires a one-line fix before merge.

Important Files Changed

Filename	Overview
app/components/shared/ui/collapsible-card.tsx	New reusable CollapsibleCard component with forwardRef, aria-expanded, and cn('card', className) merging — well-structured abstraction.
app/components/common/InspectorInstructionCard.tsx	Migrated to CollapsibleCard but omits collapsible={false}, adding an unintended Collapse/Expand button to inspector instruction cards that never had one.
app/components/common/BaseInstructionCard.tsx	Cleanly refactored to CollapsibleCard; local expanded state removed. Raw button is now enabled while card is collapsed (minor UX regression).
app/features/cu-profiling/ui/CUProfilingCard.tsx	Core feature: CU profiling card now wrapped in CollapsibleCard. className="e-card" results in "card e-card" due to cn() merge — may add unintended Bootstrap styles.
app/components/shared/ui/collapsible-card.stories.tsx	Comprehensive Storybook stories covering default, collapsed, non-collapsible, header-buttons, and badge-title variants.
app/components/inspector/AccountsCard.tsx	Clean migration to CollapsibleCard; original had a toggle button so the default collapsible=true is correct.
app/components/inspector/AddressTableLookupsCard.tsx	Clean migration to CollapsibleCard; original had a toggle button so the default collapsible=true is correct.
app/components/inspector/UnknownDetailsCard.tsx	Migrated to CollapsibleCard with defaultExpanded={false}, matching original collapsed-by-default behavior. React import correctly removed.
app/components/transaction/AccountsCard.tsx	Clean refactor; Raw button moved to headerButtons prop, expanded state removed, behavior preserved.
app/components/transaction/TokenBalancesCard.tsx	Straightforward migration to CollapsibleCard; original toggle button behavior preserved.
bench/BUILD.md	Updated build-size metrics reflecting the new bundle output; no code logic involved.

Class Diagram

%%{init: {'theme': 'neutral'}}%%
classDiagram
    class CollapsibleCard {
        +title: ReactNode
        +children: ReactNode
        +defaultExpanded: boolean
        +className?: string
        +headerButtons?: ReactNode
        +collapsible: boolean
        -expanded: boolean
        +setExpanded()
    }
    class BaseInstructionCard {
        +collapsible?: boolean
        +headerButtons?: ReactNode
        -showRaw: boolean
    }
    class InspectorInstructionCard {
        +defaultRaw?: boolean
        -showRaw: boolean
    }
    class CUProfilingCard {
        +instructions: InstructionCUData[]
        +unitsConsumed?: number
    }
    class AccountsCard_Transaction {
        -showRaw: boolean
    }
    class TokenBalancesCardInner {
        -tokenSymbols: Map
    }
    class AccountsCard_Inspector
    class AddressTableLookupsCard
    class UnknownDetailsCard {
        +defaultExpanded: false
    }
    CollapsibleCard <|-- BaseInstructionCard : uses
    CollapsibleCard <|-- InspectorInstructionCard : uses (collapsible=true by default)
    CollapsibleCard <|-- CUProfilingCard : uses (new feature)
    CollapsibleCard <|-- AccountsCard_Transaction : uses
    CollapsibleCard <|-- TokenBalancesCardInner : uses
    CollapsibleCard <|-- AccountsCard_Inspector : uses
    CollapsibleCard <|-- AddressTableLookupsCard : uses
    CollapsibleCard <|-- UnknownDetailsCard : uses

Loading

_{Reviews (2): Last reviewed commit: "resolve comments" | Re-trigger Greptile}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
explorer	Ready	Preview, Comment	Apr 13, 2026 6:27pm

[rogaldh]

This thing is again Static. The master should have the proper version to fix it

[C0mberry]

done