feat(ui): Add download size display to channel table (#1864)

[gajeshbhat]

Done

This addresses user need for bandwidth awareness on metered connections by showing accurate download sizes for each channel, since different channels can have different package sizes.

How to QA

1. Check out into my branch feat/show-package-size-1864 and run the server locally using dotrun
2. Navigate to any snap details page (e.g., /firefox, /code, /discord)
3. Click on the channel/version dropdown button (e.g., "latest/stable r1234") to open the channel map
4. Click on "All versions" tab to see the full channel table
5. Verify that the "Download Size" column appears between "Version" and "Published" columns
6. Confirm that sizes are displayed in human-readable format (e.g., "50.0 MB", "1.2 GB")
7. Test on different screen sizes - the Download Size column should be hidden on mobile/tablet views
8. Try different snaps to see varying package sizes across different channels
9. Verify that the size information matches what you'd expect for each package

Testing

• This PR has tests
  • Added unit test test_package_size_in_channel_map that verifies size data is correctly included in channel map data structure and HTML output
  • Manual Test confirms (see the attached screen recording) the "Download Size" column header appears in the rendered HTML
  • All existing tests continue to pass

Issue / Card

Fixes #1864

Screenshots

Screenshots and a screencast have been added below showing the new Download Size column in the channel table across different snap packages.

Screencast of me running the changes locally on a server and Download Sizes column working

Screencast-Downoad-Size-Snapcraft-1864.webm

[webteam-app]

gajeshbhat is not a collaborator of the repo

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 42.39%. Comparing base (b8b6b55) to head (1ca82a2).
⚠️ Report is 699 commits behind head on main.

Additional details and impacted files

@@             Coverage Diff             @@
##             main    #5353       +/-   ##
===========================================
- Coverage   66.80%   42.39%   -24.41%     
===========================================
  Files         113      328      +215     
  Lines        3714     8107     +4393     
  Branches      965     1279      +314     
===========================================
+ Hits         2481     3437      +956     
- Misses       1098     4381     +3283     
- Partials      135      289      +154     

Files with missing lines	Coverage Δ
static/js/public/snap-details/channelMap.ts	53.82% <100.00%> (ø)

... and 327 files with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[bartaz]

Thanks @gajeshbhat. I'll pass it through copilot first and we'll add it to our maintenance review list. As this is not a bug fix, but a new feature with a UI change, we'll also get a UX to review it, to confirm if the approach is good.

[Copilot]

Pull Request Overview

This PR adds a "Download Size" column to the channel table in the snap details page, allowing users to see package sizes for each channel to make informed decisions on metered connections.

• Adds a new column displaying download sizes in human-readable format (MB, GB) between Version and Published columns
• Implements size formatting utility function using decimal (1000-based) units
• Includes responsive design hiding the column on mobile/tablet views

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File	Description
tests/store/tests_details.py	Adds unit test verifying size data inclusion in channel map and HTML output
templates/store/snap-details/_channel_map.html	Updates table header and row template to include Download Size column
static/js/public/snap-details/channelMap.ts	Adds size property to interface and formatSize utility function

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[gajeshbhat]

Thanks @gajeshbhat. I'll pass it through Copilot first, and we'll add it to our maintenance review list. As this is not a bug fix, but a new feature with a UI change, we'll also get a UX to review it, to confirm if the approach is good.

Thank you for taking a look at this @bartaz . Copilot comments were minor, and I have replied to them and likely won't require a code change. No worries about the time, I understand that you folks are busy with higher priority items. Let's also get the clear from UX. Happy to wait. Please feel free to let me know if you have any questions for me. Cheers.

[gajeshbhat]

Hey @bartaz , Hope you have been well. Any chance we can get a review from UI/UX for this PR ?

[gajeshbhat]

Error unrelated to my change: https://github.com/canonical/snapcraft.io/actions/runs/19814162684/job/56761935802?pr=5353

[gajeshbhat]

@bartaz @edisile Any chance UI/UX can review this ? Happy to answer questions or help update the PR if required.

[gajeshbhat]

CI Checks failing after rebase because of issues test on main. Fixed lint issues in this PR and in #5352 and reported test failure to maintainers. CC: @edisile @bartaz

[edisile]

Hi there @gajeshbhat! Thank you for the PR and thank you for keeping it up to date with the main branch.

I'm sorry but our UX folks are quite busy so it's a bit difficult to get a review from them at the moment. Unlike your other PR, this feature isn't really aligned to our current roadmap so unfortunately it's been falling behind in the review queue.

[gajeshbhat]

Hi there @gajeshbhat! Thank you for the PR and thank you for keeping it up to date with the main branch.

I'm sorry but our UX folks are quite busy so it's a bit difficult to get a review from them at the moment. Unlike your other PR, this feature isn't really aligned to our current roadmap so unfortunately it's been falling behind in the review queue.

Sure. No worries. Let's let this sit here and come back to it when its closer in the Roadmap.