Gallery view component

[edlu77]

• Add stories for database app layout variant - Gallery view #1822

[nx-cloud]

🤖 Nx Cloud AI Fix Eligible

An automatically generated fix could have helped fix failing tasks for this run, but Self-healing CI is disabled for this workspace. Visit workspace settings to enable it and get automatic fixes in future runs.

_{To disable these notifications, a workspace admin can disable them in workspace settings.}

---

View your CI Pipeline Execution ↗ for commit f5091f3

Command	Status	Duration	Result
nx affected --targets=lint,test,compodoc --conf...	❌ Failed	2m 46s	View ↗
nx affected --target=build,build-webcomponent,b...	✅ Succeeded	4m 5s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-12-19 21:16:01 UTC

[github-actions]

🚀 Preview Deploy Report

✅ Successfully deployed preview here

[LibbyUX]

Thank you for making this happen @edlu77 !

I could have been clearer in my issue when I submitted #1822 - I was envisioning this story being a full page layout, including a header and footer, rather than a portion of the page. No worries if this isn't possible. If it is, should I edit #1822 to mention this?

It could be nice to see this as a full page layout, potentially, so that the background color, padding, cards behave responsively as specified in the Figma Gallery View layout component, with the whole layout entirely squared away. For me, this is a helpful layout template to have, so I don't have to worry about styles, margin, padding, responsive, and colors everytime I am specifying a new datapase page in Figma. Would this be a helpful component for our devs? What do you think?

Preview

Figma

[edlu77]

Okay sure, I can make it this way. Does the filtering in the sidebar need to work here as well?

[LibbyUX]

@edlu77 It could be a mock filter menu, just like we have here: https://cdn.humanatlas.io/ui/storybook/design-system/?path=/story/design-system-filter-menu--default

No expectations of the buttons actually filtering data down in the story, as we don't have real data here.

If it could showcase the whole page's responsive behavior, though, that would be fantastic. The responsiveness can almost be borrowed from the KG currently, but make sure to reference the gallery view breakpoints from the design system, as that is most current for this layout.

The only other difference from the KG is that we'll now have the toggle show/hide menu button in the header, so the whole menu will collapse and folks can view more of page and it's better for mobile.