Adds a Settings > Users screen where members can be added, turned off
and removed, and fixes three defects found while auditing the app on
a phone.
User management
- Settings is a real page with a Users section: add a member (name,
email, password), flip "Can sign in" to block or restore access
without deleting their history, or remove them outright.
- The app has no roles - membership is just the active flag - so the
Settings route no longer requires the "admin" role, which left it
unreachable for every real member. Settings is now in the sidebar.
- New members are created with active: true. AuthContext refuses to
sign in a user whose active flag is false, and the field had no
default, so previously created users were locked out of the app.
Live PocketBase rules for the `users` collection (see
scripts/fix-users-collection.mjs):
- createRule was "" which means PUBLIC - any anonymous visitor could
create an account on the instance. It now requires an authenticated
member.
- listRule was "id = @request.auth.id", so a member could only ever
see their own record and no member list could be rendered. It now
matches every other collection in the app: @request.auth.id != "".
Totals always showed R0.00
- form.watch("items") returns the same array instance that
react-hook-form mutates in place, so the useMemo keyed on it never
recomputed. Both the quote and purchase order totals stayed at zero
however many items were added. Switched to useWatch with compute,
which re-runs whenever the watched field really changes.
Mobile layout
- The page was zoomed out on phones: flex items default to
min-width:auto, so a wide table stretched the layout past the
viewport. Added min-w-0 to the layout chain.
- The sr-only labels inside the tables are position:absolute with no
positioned ancestor, so they escaped the table's overflow-x-auto
clip and stretched the document. Made the scroll containers
relative.
- DialogContent was w-full plus an mx-4 gutter, which overflowed the
viewport by 16px and clipped the right edge of every form. The
component now owns the gutter itself.
Verified at 390x844: all pages and the quote, purchase order and add
user dialogs fit the viewport with no horizontal overflow.
Quotes and purchase orders were silently losing their line items.
Quote items field was a multi-relation to stock_items, but PocketBase
stored only the last id as a plain string no matter how it was sent
(JSON string via FormData, raw array, or repeated FormData entries).
Every quote created through the UI had `items: ""` or `items: "<id>"`.
Recreated the field as JSON so an array of stock_item ids round-trips
(companion fields quantities/unitPrices already line up with it).
PO snapshot_items had the same class of bug from the other direction:
String(obj) coerced the snapshot array to "[object Object]", which
PocketBase stored verbatim, rendering the PO as N rows of
"Unknown / £0.00". The form now sends JSON-stringified arrays, and
the reader only trusts a snapshot whose rows actually carry a name.
Also fixes:
- Quote item lines are hydrated from stock_items; the parallel
quantities/unitPrices arrays are the source of truth, so quotes
written before the schema fix still render and total correctly.
- Quote form rejects stock rows where no item was actually picked
from the dropdown, instead of saving an empty stockItemId.
- PO PDF filename is now the plain order number (PO-20261015-001.pdf).
Adds the quotes.items schema migration plus three dev scripts for
creating a quote, re-applying the field fix and rendering a test PDF.
- Introduced `generate-icons.mjs` script to automate the creation of PWA icons and favicons from the provided SVG logo.
- Generated icons include:
- PWA icons: 192x192 and 512x512
- Maskable icon with 12% padding: 512x512
- Favicons: 32x32, 16x16
- Apple-touch icon: 180x180
- Added a new PNG file for the maskable icon.
