Cars: arrange the garage, and choose what a car's page shows

Three things you can now set up rather than live with.

The garage takes a drag: cards reorder as you drag across them and the
arrangement saves on drop — or on dragend, since a card released in the
gap between cards never produces a drop and would otherwise revert on
the next load. It is a per-user list of car ids on the profile, so it
covers cars shared with you and never reorders anybody else's garage;
the API returns /api/cars in that order, so a client only sends the new
one back. Pointer-only: touch browsers don't fire the native drag
events, and this is not worth a dependency.

A car's page is now configurable from the gear in its header: which tabs
it shows, and which of the 14 Information rows. Both belong to the car,
so everyone it is shared with sees the same page — Fuel off on an EV
stays off for all of them — and setting them needs write access. Stored
as the hidden sets, so anything added in a later release is on by
default. PUT /api/cars/{id}/view is its own endpoint precisely so an
ordinary save of the car form, which sends every other field, can never
reveal something that was deliberately switched off. Information itself
can't be hidden: a page with no tabs left would be a dead end.

The connected-service cards fold away, remembered per device, so a
provider that reports eight sections can be trimmed to the two worth
watching. A failed section keeps a short badge in its collapsed header
and puts the provider's own message — a few hundred characters of JSON,
which used to stretch the page sideways — inside the body with
everything else.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

API Server/internal/api/me.go

@@ -35,6 +35,28 @@ type userRecord struct {
 	Role                string `json:"role"`
 	Organization        string `json:"organization"`
 	Created             string `json:"created"`
+
+	// Garage arrangement. Raw because PocketBase hands back whatever a json field
+	// holds — null on a record that has never been arranged, and "" on one
+	// PocketBase stored as an empty value — neither of which is a []string.
+	CarOrder json.RawMessage `json:"car_order"`
+}
+
+// carOrder decodes the stored garage arrangement, treating anything unexpected
+// as "not arranged yet" rather than failing the whole profile read.
+func (rec userRecord) carOrder() []string { return decodeStringList(rec.CarOrder) }
+
+// decodeStringList reads a PocketBase json field that holds a list of strings,
+// treating anything unexpected as empty rather than failing the whole read.
+func decodeStringList(raw json.RawMessage) []string {
+	if len(raw) == 0 {
+		return nil
+	}
+	var out []string
+	if err := json.Unmarshal(raw, &out); err != nil {
+		return nil
+	}
+	return out
 }
 
 func (rec userRecord) toModel() models.User {
@@ -54,6 +76,7 @@ func (rec userRecord) toModel() models.User {
 		Created:    rec.Created,
 
 		Organization: rec.Organization,
+		CarOrder:     rec.carOrder(),
 	}
 	if t := parsePBDate(rec.DeletionRequestedAt); !t.IsZero() {
 		u.DeletionRequestedAt = &t
@@ -102,13 +125,41 @@ func (s *Server) handleGetMe(w http.ResponseWriter, r *http.Request) {
 }
 
 type updateMeRequest struct {
-	Name       *string `json:"name"`
-	Bio        *string `json:"bio"`
-	Theme      *string `json:"theme"`
-	Locale     *string `json:"locale"`
-	DateFormat *string `json:"dateFormat"`
-	Currency   *string `json:"currency"`
-	FontSize   *string `json:"fontSize"`
+	Name       *string   `json:"name"`
+	Bio        *string   `json:"bio"`
+	Theme      *string   `json:"theme"`
+	Locale     *string   `json:"locale"`
+	DateFormat *string   `json:"dateFormat"`
+	Currency   *string   `json:"currency"`
+	FontSize   *string   `json:"fontSize"`
+	CarOrder   *[]string `json:"carOrder"`
+}
+
+// maxCarOrder bounds the stored arrangement. listCars fetches at most 200 owned
+// plus 200 shared cars, so this leaves room without letting a client park an
+// unbounded blob on the record.
+const maxCarOrder = 500
+
+// normalizeCarOrder cleans a client-supplied garage arrangement: blanks out,
+// duplicates dropped (first position wins), length capped. The ids are not
+// checked against real cars — that would cost a lookup per entry, and an id for
+// a car the user no longer has is harmless: listCars ignores what it can't
+// match, and the next drag rewrites the list anyway.
+func normalizeCarOrder(in []string) ([]string, error) {
+	if len(in) > maxCarOrder {
+		return nil, fmt.Errorf("carOrder is too long (max %d)", maxCarOrder)
+	}
+	out := make([]string, 0, len(in))
+	seen := make(map[string]bool, len(in))
+	for _, id := range in {
+		id = strings.TrimSpace(id)
+		if id == "" || seen[id] {
+			continue
+		}
+		seen[id] = true
+		out = append(out, id)
+	}
+	return out, nil
 }
 
 var validThemes = map[string]bool{"light": true, "dark": true, "system": true}
@@ -189,6 +240,14 @@ func (s *Server) handleUpdateMe(w http.ResponseWriter, r *http.Request) {
 		}
 		payload["font_size"] = *in.FontSize
 	}
+	if in.CarOrder != nil {
+		ids, err := normalizeCarOrder(*in.CarOrder)
+		if err != nil {
+			writeError(w, http.StatusBadRequest, err.Error())
+			return
+		}
+		payload["car_order"] = ids
+	}
 
 	var rec userRecord
 	if err := s.pb.Update(r.Context(), s.usersCollection(), claims.ID, payload, &rec); err != nil {