grain.social
Grain#
The next version of Grain, a photo sharing app built on the AT Protocol.
Development#
npm install
npm run dev
Build#
npm run build
npm run preview
WIP PWA for Grain
next.grain.social
JavaScript
96.6%
Shell
2.6%
CSS
0.5%
HTML
0.3%
Other
0.1%
code
Clone this repository
https://tangled.org/grain.social/grain-pwa
git@tangled.org:grain.social/grain-pwa
For self-hosted knots, clone URLs may differ based on your setup.
Find scrollable parent instead of using window.scrollY, which is
always 0 now that outlet is the scroll container. Prevents accidental
refresh triggers when scrolling up mid-content.
馃 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Change header from sticky to fixed positioning
- Make outlet the scroll container between header and bottom nav
- Remove redundant padding from feed-layout
- Scrollbar now starts below header for PWA feel
馃 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Subscribe grain-profile to cache updates for reactive UI
- Only update cache if it exists (preserves galleries)
- Handle avatar URL correctly based on change type
- Add defensive check for missing galleries
馃 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Integrate grain-avatar-crop component into edit profile page for
consistent avatar selection experience across the app.
馃 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add ability to change avatar directly from profile page when viewing
own profile. Includes custom crop component with drag-to-position,
zoom slider, pinch-to-zoom, and keyboard accessibility.
馃 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
README.md