refactor: Update sales charts to be side-by-side

[gustavocodess]

Purpose

Based on the user's request, the goal of this pull request is to update the seller dashboard to display the "Product sales" and "Units ordered" line charts in a side-by-side layout, matching the visual representation from a provided screenshot.

Code changes

• src/pages/seller-dashboard/components/sales-section.tsx:

  • The main layout component was changed from <Grid> to <ColumnLayout columns={2}> to arrange the two charts horizontally.
  • The AreaChart components for "Product sales" and "Units ordered" were replaced with LineChart components.
  • The logic for generating chart series data was updated to support the LineChart component.
  • The summary metrics at the top of the section were also rearranged into a ColumnLayout.

• src/pages/seller-dashboard/components/forums-advertising-section.tsx:

  • Refactored the layout to use ColumnLayout instead of Grid.
  • The "Sponsored Products" metrics are now displayed using the KeyValuePairs component for improved readability and consistency.

• src/pages/seller-dashboard/app.tsx:

  • Simplified the content for inactive workspace tabs to render an empty div.

• .builderrules:

  • Added a new development rule to enforce the use of @cloudscape-design components.

🔗 Edit in Builder.io

👀 Preview LinkTo clone this PR locally use the Github CLI with command gh pr checkout 1

[builder-io-integration]

You can tag me at @builderio-bot for anything you want me to fix or change