Reformat with Prettier's updated line-wrapping for ternaries and JSX.

web/frontend/app/features/account/hooks/useSectionError.ts

@@ -2,7 +2,10 @@ import { useEffect } from 'react';
 import { showErrorToast } from '../../../components/ui/toast/toast';
 import type { ActionResult } from '../types';
 
-export const useSectionError = (result: ActionResult | undefined, intent: ActionResult['intent']) => {
+export const useSectionError = (
+    result: ActionResult | undefined,
+    intent: ActionResult['intent'],
+) => {
     useEffect(() => {
         if (!result || result.intent !== intent) return;
         showErrorToast(result.error);

web/frontend/app/features/breweries/components/BreweryMap.tsx

@@ -61,7 +61,13 @@ const CurrentLocationMarker = ({ position }: { position: LatLngTuple }) => (
 
 const CURRENT_LOCATION_ZOOM = 6;
 
-const RecenterMap = ({ bounds, currentLocation }: { bounds: LatLngTuple[]; currentLocation: LatLngTuple | null }) => {
+const RecenterMap = ({
+    bounds,
+    currentLocation,
+}: {
+    bounds: LatLngTuple[];
+    currentLocation: LatLngTuple | null;
+}) => {
     const map = useMap();
 
     useEffect(() => {
@@ -77,10 +83,7 @@ const RecenterMap = ({ bounds, currentLocation }: { bounds: LatLngTuple[]; curre
 
 const BreweryMap = ({ breweries }: BreweryMapProps) => {
     const currentLocation = useCurrentLocation();
-    const bounds: LatLngTuple[] = breweries.map((brewery) => [
+    const bounds: LatLngTuple[] = breweries.map((brewery) => [brewery.latitude, brewery.longitude]);
-        brewery.latitude,
-        brewery.longitude,
-    ]);
 
     return (
         <MapContainer

web/frontend/app/features/breweries/components/FeaturedBreweryCard.tsx

@@ -7,8 +7,7 @@ interface FeaturedBreweryCardProps {
     onShowOnMap: () => void;
 }
 
-// Founded year, beers-listed count, and house style aren't tracked anywhere yet -
+// see BREWERY_INDEX_HANDOFF.md
-// see BREWERY_INDEX_HANDOFF.md. Filler until those fields/queries exist.
 const FILLER_STATS = [
     { label: 'Founded', value: '2014' },
     { label: 'Beers listed', value: '18' },

web/frontend/app/features/breweries/components/NearbyBreweryMap.tsx

@@ -98,7 +98,9 @@ const NearbyBreweryMap = ({
             >
                 <Popup>
                     <p className="font-semibold font-serif">{pin.name}</p>
-                    {pin.cityLabel && <p className="text-sm text-base-content/70">{pin.cityLabel}</p>}
+                    {pin.cityLabel && (
+                        <p className="text-sm text-base-content/70">{pin.cityLabel}</p>
+                    )}
                     <a href={`/breweries/${pin.id}`} className="link link-primary text-sm">
                         View brewery &rarr;
                     </a>

web/frontend/app/features/breweries/routes/breweries.tsx

@@ -24,9 +24,8 @@ const Breweries = ({ loaderData }: Route.ComponentProps) => {
     const { featured, recent } = loaderData;
     const [selectedId, setSelectedId] = useState<string | null>(null);
 
-    const featuredPin =
+    const featuredPin = featured?.location?.coordinates
-        featured?.location?.coordinates ?
+        ? {
-            {
               id: featured.breweryPostId,
               name: featured.breweryName,
               latitude: featured.location.coordinates.latitude,
@@ -34,9 +33,8 @@ const Breweries = ({ loaderData }: Route.ComponentProps) => {
           }
         : null;
 
-    const fallbackCenter =
+    const fallbackCenter = featured?.location?.coordinates
-        featured?.location?.coordinates ?
+        ? {
-            {
               latitude: featured.location.coordinates.latitude,
               longitude: featured.location.coordinates.longitude,
               label: featured.location.cityName,
@@ -85,7 +83,9 @@ const Breweries = ({ loaderData }: Route.ComponentProps) => {
             <section className="max-w-7xl mx-auto px-5 pt-11">
                 <div className="bg-[var(--color-highlight)] text-[var(--color-highlight-content)] rounded-box p-7 flex items-center justify-between gap-6 flex-wrap">
                     <div>
-                        <h2 className="font-serif text-2xl mb-1">Looking for something specific?</h2>
+                        <h2 className="font-serif text-2xl mb-1">
+                            Looking for something specific?
+                        </h2>
                         <p className="m-0">
                             All {FILLER_TOTAL_BREWERY_COUNT} partner breweries, filterable by
                             country, region, and beer style.

web/frontend/app/features/breweries/routes/brewery-directory.tsx

@@ -103,10 +103,7 @@ const Breweries = ({ loaderData }: Route.ComponentProps) => {
                         ))}
                         {fetcher.state !== 'idle' &&
                             Array.from({ length: PAGE_SIZE }).map((_, index) => (
-                                <div
+                                <div key={index} className="skeleton h-32 w-full rounded-box" />
-                                    key={index}
-                                    className="skeleton h-32 w-full rounded-box"
-                                />
                             ))}
                     </div>
                 )}

web/frontend/stories/PasswordSection.stories.tsx

@@ -14,7 +14,11 @@ const PasswordSectionRoute = () => {
 
     return (
         <div className="w-full max-w-md">
-            <PasswordSection open={open} onToggle={() => setOpen((value) => !value)} result={result} />
+            <PasswordSection
+                open={open}
+                onToggle={() => setOpen((value) => !value)}
+                result={result}
+            />
         </div>
     );
 };