BlueSky & more on desktop
lazurite.stormlightlabs.org/
tauri
rust
typescript
bluesky
appview
atproto
solid
1---
2title: Code Quality Audits
3updated: 2026-04-15
4---
5
6There is a ton of repeated code in this project. This document tracks repeated patterns
7for future refactoring.
8
9## Dialogs
10
11### Inventory (2026-04-15)
12
13| Component | File (relative to `src/components/`) | Overlay style | Dialog semantics | Notes |
14| --------------------------- | ---------------------------------------------- | ---------------------------------------------- | ------------------------------------- | ---------------------------------------------------------------- |
15| Image gallery overlay | `/feeds/ImageGallery.tsx` | Fullscreen glass overlay, centered media stage | `role="dialog"` + `aria-modal="true"` | Handles image navigation/download + keyboard controls. |
16| Report dialog | `/moderation/ReportDialog.tsx` | Centered card on fullscreen scrim | Missing `role="dialog"`/`aria-modal` | Uses shared backdrop/surface naming but local implementation. |
17| Settings confirmation modal | `/settings/SettingsPanel.tsx` | Centered confirmation card | Missing `role="dialog"`/`aria-modal` | Inline modal implementation nested inside settings panel. |
18| Add column panel | `/deck/AddColumnPanel.tsx` | Right drawer with backdrop | `role="dialog"` + `aria-modal="true"` | Drawer-style overlay, good semantic baseline. |
19| Profile actor list overlay | `/profile/ProfileActorList.tsx` | Bottom sheet style overlay | `role="dialog"` + `aria-modal="true"` | Focus target is set on open; closes on scrim click and `Escape`. |
20| Follow hygiene panel | `/profile/FollowHygienePanel.tsx` | Right sheet/panel | `role="dialog"` + `aria-modal="true"` | Large panel overlay with keyboard and progress handling. |
21| Follow hygiene confirmation | `/profile/FollowHygeineConfirmationDialog.tsx` | Centered danger confirmation card | Missing `role="dialog"`/`aria-modal` | Standalone confirmation overlay implementation. |
22| Feed composer | `/feeds/FeedComposer.tsx` | Fullscreen composer dialog overlay | Missing `role="dialog"`/`aria-modal` | Uses custom panel and scrim; keyboard handling managed outside. |
23| Drafts list overlay | `/feeds/DraftsList.tsx` | Bottom-aligned panel over fullscreen scrim | Missing `role="dialog"`/`aria-modal` | Similar layering/animation style to composer. |
24| Thread drawer | `/posts/ThreadDrawer.tsx` | Right drawer over fullscreen scrim | Missing `role="dialog"`/`aria-modal` | Uses close button + escape handler, but no dialog semantics yet. |
25| Context menu (non-dialog) | `/shared/ContextMenu.tsx` | Fullscreen hit target + positioned menu | `role="menu"` | Not a modal dialog; still part of overlay infrastructure. |
26
27### Repeated Patterns
28
29- Scrim/backdrop classes are duplicated across multiple files with slight class/token variations.
30- Dialog/card enter-exit animation values are redefined in each component.
31- Escape-key listener setup/teardown appears in several overlays and drawers.
32- Many overlays still rely on click-to-close behavior without consistent semantic attributes.
33
34### Refactor Candidates
35
36- Extract a shared `OverlayBackdrop` primitive for fullscreen scrim + portal + optional click-to-close.
37- Extract a shared `DialogSurface` primitive for animated card/sheet containers.
38- Standardize dialog semantics (`role`, `aria-modal`, labeling) across all modal-like overlays.
39- Centralize escape-key wiring in an overlay utility hook to reduce per-component lifecycle code.