Dinner With Lucy is a recipe and cookbook manager built for real daily use. It covers browsing and creating recipes, organizing them into ordered cookbook collections, and rating both. The kind of tool that replaces a pile of bookmarked pages and screenshot recipes with something actually organized.
Ingredient scaling
Most recipe apps store quantities as decimals, which means scaling "1/3 cup" to 3× gives you "1.0 cup", floating-point math bleeding through to the UI. Dinner With Lucy stores quantities as integer fraction pairs instead. Scaling multiplies the stored fractions, simplifies with the GCD algorithm, and formats the result as a mixed number, so the math stays exact at any multiple.
All four scale options (½×, 1×, 2×, 3×) are pre-computed on the server and embedded in the page. Switching between them is entirely client-side with no server round-trip. This was a deliberate choice: a Livewire re-render would reset any ingredient checkboxes the user had already ticked while cooking.
Cookbooks
Cookbooks are ordered collections of recipes. The order is preserved in a pivot table and respected on every fetch, so rearranging a cookbook sticks. Cascade constraints handle cleanup automatically when a cookbook is deleted, leaving no orphaned recipes, images, ratings, or tags.
Star ratings
Recipes and cookbooks both support star ratings through a shared polymorphic trait. Clicking the same star again removes the rating.
The star display has two modes. Read-only renders a two-layer SVG where the filled layer is clipped to a percentage width matching the average (3.7 stars renders as 74% filled). Interactive mode tracks hover state in Alpine and persists the selection through Livewire. The SVG clip approach means fractional averages display correctly without any client-side math.
Tags
58 built-in theme tags come pre-seeded with paired colors. Their colors are locked in the admin UI so the visual system stays consistent no matter how many custom tags get added. The tag search field in the recipe editor creates new tags on save, so adding one never requires leaving the form.
Livewire compiler bug
Livewire 4.2.2's component detector uses a greedy regex with the s (dotall) flag to check for class-based components. It spans past the closing PHP tag into the Blade template, so any Volt component whose HTML contained the word "new" (a "new cookbook" button, a "new recipe" link) was misidentified as a class-based component and broke the page. The fix, PatchedLivewireFinder in app/Support/, extracts just the PHP block with a separate regex first, then runs the class-detection check on that substring only. It's swapped into the container in AppServiceProvider.
Architecture and theming
Every page is a Livewire Volt single-file component (PHP class and Blade template together in one file) with no traditional controllers. Dark and light modes use CSS custom properties rather than Tailwind's dark: variant. The preference is stored per user; toggling the theme swaps one attribute on <html> and every color in the UI updates.
