Tables are not consistent accross the admin application

[SubxX]

💬 Proposal: Standardizing Tables in Admin Application

Hi everyone,

I wanted to bring up an inconsistency I’ve noticed across our admin application regarding how tabular data is implemented.

❗ Current Issues

• Table structures are not consistent:

  • In some places, we are using proper <table> elements.
  • In other places, we are using <div>-based layouts for tabular data.

• A specific example is the Categories section:

  • It includes a nesting feature, which is inherently tabular in nature.
  • However, it is currently implemented using <div> elements instead of a structured table.

⚠️ Why This Matters

• Inconsistent UI/UX patterns across the admin panel
• Reduced accessibility (semantic HTML matters)
• Harder to maintain and extend
• Repeated custom implementations instead of reuse

💡 Proposed Solution

I suggest we introduce a generalized, reusable Table component that can be used across the admin application.

Since we are already using TanStack Query, it might be a good idea to align with the ecosystem and adopt TanStack Table as well.

🚀 Benefits of TanStack Table

• Highly flexible and customizable
• Supports complex use cases (sorting, filtering, pagination, nested rows)
• Works well with server-side data (pairs nicely with TanStack Query)
• Encourages consistent patterns across the app

🙋 Proposal

• Introduce a shared Table component built on TanStack Table
• Gradually refactor existing table implementations to use it
• Use it as a standard going forward for all tabular data

I’d be happy to take ownership of this and start working on:

• Creating the reusable component
• Setting up initial patterns and documentation
• Refactoring a couple of key sections as examples (like Categories)

Let me know your thoughts or concerns. If this gets approval, I’ll go ahead and start working on it.

Thanks!