feature: result share button

[rugeli]

Problem

What is the problem this work solves, including
closes #173

Solution

What I/we did to solve this problem

• added a Share link to the navbar

• clicking Share opens an antd modal displaying the copiable URL

updates

following feedback from @thao-do:

• moved the Share button to the bottom Status bar matching the design)
• the Share button follows the same behavior as Download packing result button
• in the modal, switched to sentence case and use Share packing result as suggested

note: the button color isn't quite matching the design yet, we're planning to do a broader color alignment in a follow-up ticket #183

next steps:

• Color Cleanup #183
• Enable Download packing result button for example recipes #182

Type of change

Please delete options that are not relevant.

• New feature (non-breaking change which adds functionality)

[github-actions]

Coverage Report

Status	Category	Percentage	Covered / Total
🔵	Lines	32.81%	659 / 2008
🔵	Statements	32.81%	659 / 2008
🔵	Functions	40.59%	41 / 101
🔵	Branches	73.33%	143 / 195

File Coverage

File	Stmts	% Branch	% Funcs	% Lines	Uncovered Lines
Changed Files
src/App.tsx	0%	0%	0%	0%	1-8, 17-20, 22, 24-25, 27-37, 39, 41-43, 45-51, 53-66, 68-112, 114-122, 124-160, 162-166, 168-172, 174-194, 196, 198
src/components/StatusBar/index.tsx	0%	0%	0%	0%	1-7, 9-13, 24-25, 27-28, 32-37, 39-43, 45, 47-53, 55-56, 59-68, 70-78, 80-87, 89-93, 95-99, 101, 103

Generated in workflow #241

[github-actions]

PR Preview Action v1.8.1
🚀 View preview at https://AllenCell.github.io/cellpack-client/pr-preview/pr-176/
Built to branch gh-pages at 2026-02-23 20:34 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[rugeli]

with vite-plugin-svgr, we treat svgs as react components, so styles (e.g. stroke="currentColor") inherit correctly

[interim17]

If/when the designs match it can also be convenient to use the antd icons directly:
https://ant.design/components/icon

But in this case the download icon looks a little diffferent.

[interim17]

Left a couple questions but I think they are non-blocking.

[interim17]

If/when the designs match it can also be convenient to use the antd icons directly:
https://ant.design/components/icon

But in this case the download icon looks a little diffferent.

[rugeli]

switched to using antd icons (removed two svg files, uninstalled vite-plugin-svgr), the code is much cleaner, thanks to @interim17 !

@thao-do the download icon is slightly different from the design, would love to hear what you think;)

[rugeli]

update:

• replaced Modal with Popover, now the popup is above the Share button instead of centered on screen
• click-away close (Popover closes on outside clicks natively, and a window blur listener handles clicks inside the iFrame)
• Share button is now self-contained in StatusBar

[ascibisz]

Looks good!!