FLOW LGX · PART 3 · DECEMBER 2025
With the design understood, December 2025 was about turning it into working React screens. The goal was not to build pages quickly — it was to build pieces that would make every later page quick.
Month by month, how a logistics platform for a Toronto client went from a simple brief to a live, multi-company SaaS product.
We built a small set of shared parts — buttons, forms, tables, status labels — and made every dashboard from them. It keeps a large product consistent and cheaper to change.
Every shared component lives in one place and is imported the same way. A rule we kept for the whole project: no page uses a plain browser button, input or home-made modal when a shared component exists. It sounds strict, but it is what keeps a large dashboard looking like one product instead of twenty.
Forms were built on Formik with shared field components — text input, select, date picker, checkbox, radio, and text area — so validation messages, spacing and error colours behave identically everywhere.
Jobs, warehouses, vendors, invoices, users, exceptions — nearly every operational screen is a table with filters. We built one data table component with search, sorting, paging, row actions (view, edit, delete) and a consistent empty state, then configured it per page with a list of columns.
Status deserved special care. Freight moves through many stages, and people scan a table by colour before they read it. Each stage got a badge with a fixed meaning: neutral for waiting, blue for in progress, amber for needs attention, red for a problem, green for done.
Dashboards that jump while they load feel broken even when they are fast. We used skeleton placeholders the same size as the final content for tables, cards and charts, so the layout stays still and the data simply appears.
Office users work on wide screens; warehouse users often do not. We built mobile-first with Tailwind breakpoints, and for very wide tables chose horizontal scrolling with sticky key columns rather than squeezing twelve columns into a phone width.
Give status colours a fixed meaning on day one and never reuse them for decoration. Operators learn to read the colour long before they read the label.