@mohasinac/appkit 4.30.19 → 4.31.0

package/dist/features/account/hooks/useProfile.d.ts

@@ -12,7 +12,11 @@ export interface UserProfile {
     googleLinked?: boolean;
     googleLinkedEmail?: string | null;
     uiPreferences?: {
+        /** @deprecated Superseded by `sectionState`. Still written during the
+         * migration window so an existing user's layout carries over. */
         collapsedSections?: string[];
+        /** scope -> ids that are OPEN. See useSectionState. */
+        sectionState?: Record<string, string[]>;
         dataViewMode?: "table" | "grid" | "list";
         handMode?: "left" | "right";
     };
@@ -32,7 +36,11 @@ export interface UpdateCurrentProfileInput {
     bio?: string;
     profileIsPublic?: boolean;
     uiPreferences?: {
+        /** @deprecated Superseded by `sectionState`. Still written during the
+         * migration window so an existing user's layout carries over. */
         collapsedSections?: string[];
+        /** scope -> ids that are OPEN. See useSectionState. */
+        sectionState?: Record<string, string[]>;
         dataViewMode?: "table" | "grid" | "list";
         handMode?: "left" | "right";
     };

package/dist/features/account/index.d.ts

@@ -3,14 +3,11 @@ export * from "./schemas";
 export * from "./columns";
 export * from "./hooks/useAccount";
 export * from "./hooks/useAddresses";
-export * from "./hooks/useAddressForm";
 export * from "./hooks/useAddressSelector";
 export * from "./hooks/useNotifications";
 export * from "./hooks/useProfileStats";
 export * from "./hooks/useCollapsedSections";
 export { useCurrentProfile as useProfile, useUpdateCurrentProfile as useUpdateProfile, } from "./hooks/useProfile";
 export * from "./hooks/usePublicProfile";
-export * from "./constants/addresses";
-export * from "./address-validation";
 export * from "./components";
 export { manifest } from "./manifest";

package/dist/features/account/index.js

@@ -3,14 +3,11 @@ export * from "./schemas";
 export * from "./columns";
 export * from "./hooks/useAccount";
 export * from "./hooks/useAddresses";
-export * from "./hooks/useAddressForm";
 export * from "./hooks/useAddressSelector";
 export * from "./hooks/useNotifications";
 export * from "./hooks/useProfileStats";
 export * from "./hooks/useCollapsedSections";
 export { useCurrentProfile as useProfile, useUpdateCurrentProfile as useUpdateProfile, } from "./hooks/useProfile";
 export * from "./hooks/usePublicProfile";
-export * from "./constants/addresses";
-export * from "./address-validation";
 export * from "./components";
 export { manifest } from "./manifest";

package/dist/features/account/schemas/index.d.ts

@@ -1,39 +1,5 @@
 export * from "./firestore";
 import { z } from "zod";
-export declare const userAddressSchema: z.ZodObject<{
-    id: z.ZodString;
-    label: z.ZodOptional<z.ZodString>;
-    line1: z.ZodString;
-    line2: z.ZodOptional<z.ZodString>;
-    city: z.ZodString;
-    state: z.ZodString;
-    postalCode: z.ZodString;
-    country: z.ZodString;
-    isDefault: z.ZodOptional<z.ZodBoolean>;
-    phone: z.ZodOptional<z.ZodString>;
-}, "strip", z.ZodTypeAny, {
-    country: string;
-    id: string;
-    city: string;
-    state: string;
-    postalCode: string;
-    line1: string;
-    label?: string | undefined;
-    isDefault?: boolean | undefined;
-    phone?: string | undefined;
-    line2?: string | undefined;
-}, {
-    country: string;
-    id: string;
-    city: string;
-    state: string;
-    postalCode: string;
-    line1: string;
-    label?: string | undefined;
-    isDefault?: boolean | undefined;
-    phone?: string | undefined;
-    line2?: string | undefined;
-}>;
 export declare const notificationPreferencesSchema: z.ZodObject<{
     orderUpdates: z.ZodOptional<z.ZodBoolean>;
     promotions: z.ZodOptional<z.ZodBoolean>;
@@ -71,40 +37,6 @@ export declare const userProfileSchema: z.ZodObject<{
     phone: z.ZodOptional<z.ZodString>;
     photoURL: z.ZodOptional<z.ZodString>;
     bio: z.ZodOptional<z.ZodString>;
-    addresses: z.ZodOptional<z.ZodArray<z.ZodObject<{
-        id: z.ZodString;
-        label: z.ZodOptional<z.ZodString>;
-        line1: z.ZodString;
-        line2: z.ZodOptional<z.ZodString>;
-        city: z.ZodString;
-        state: z.ZodString;
-        postalCode: z.ZodString;
-        country: z.ZodString;
-        isDefault: z.ZodOptional<z.ZodBoolean>;
-        phone: z.ZodOptional<z.ZodString>;
-    }, "strip", z.ZodTypeAny, {
-        country: string;
-        id: string;
-        city: string;
-        state: string;
-        postalCode: string;
-        line1: string;
-        label?: string | undefined;
-        isDefault?: boolean | undefined;
-        phone?: string | undefined;
-        line2?: string | undefined;
-    }, {
-        country: string;
-        id: string;
-        city: string;
-        state: string;
-        postalCode: string;
-        line1: string;
-        label?: string | undefined;
-        isDefault?: boolean | undefined;
-        phone?: string | undefined;
-        line2?: string | undefined;
-    }>, "many">>;
     notificationPreferences: z.ZodOptional<z.ZodObject<{
         orderUpdates: z.ZodOptional<z.ZodBoolean>;
         promotions: z.ZodOptional<z.ZodBoolean>;
@@ -132,18 +64,6 @@ export declare const userProfileSchema: z.ZodObject<{
     displayName?: string | undefined;
     createdAt?: string | undefined;
     updatedAt?: string | undefined;
-    addresses?: {
-        country: string;
-        id: string;
-        city: string;
-        state: string;
-        postalCode: string;
-        line1: string;
-        label?: string | undefined;
-        isDefault?: boolean | undefined;
-        phone?: string | undefined;
-        line2?: string | undefined;
-    }[] | undefined;
     photoURL?: string | undefined;
     bio?: string | undefined;
     phone?: string | undefined;
@@ -160,18 +80,6 @@ export declare const userProfileSchema: z.ZodObject<{
     displayName?: string | undefined;
     createdAt?: string | undefined;
     updatedAt?: string | undefined;
-    addresses?: {
-        country: string;
-        id: string;
-        city: string;
-        state: string;
-        postalCode: string;
-        line1: string;
-        label?: string | undefined;
-        isDefault?: boolean | undefined;
-        phone?: string | undefined;
-        line2?: string | undefined;
-    }[] | undefined;
     photoURL?: string | undefined;
     bio?: string | undefined;
     phone?: string | undefined;

package/dist/features/account/schemas/index.js

@@ -1,18 +1,16 @@
 export * from "./firestore";
 import { z } from "zod";
+import { annotate } from "../../shell/field-ui-meta";
 // --- Sub-schemas --------------------------------------------------------------
-export const userAddressSchema = z.object({
-    id: z.string(),
-    label: z.string().optional(),
-    line1: z.string(),
-    line2: z.string().optional(),
-    city: z.string(),
-    state: z.string(),
-    postalCode: z.string(),
-    country: z.string(),
-    isDefault: z.boolean().optional(),
-    phone: z.string().optional(),
-});
+/*
+ * `userAddressSchema` is DELETED (W5 / D19).
+ *
+ * It carried the `line1`/`line2` naming — one of the eleven address shapes,
+ * and the only one that disagreed with `AddressDocument` on field NAMES rather
+ * than just on rules. Zero consumers outside the barrel that re-exported it.
+ * The one shape is `addressFormSchema` in
+ * `features/addresses/schemas/address-form.ts`.
+ */
 export const notificationPreferencesSchema = z.object({
     orderUpdates: z.boolean().optional(),
     promotions: z.boolean().optional(),
@@ -39,7 +37,6 @@ export const userProfileSchema = z.object({
     phone: z.string().optional(),
     photoURL: z.string().optional(),
     bio: z.string().optional(),
-    addresses: z.array(userAddressSchema).optional(),
     notificationPreferences: notificationPreferencesSchema.optional(),
     createdAt: z.string().optional(),
     updatedAt: z.string().optional(),
@@ -51,10 +48,23 @@ export const userProfileSchema = z.object({
  * validation too.
  */
 export const updateProfileSchema = z.object({
-    displayName: z.string().min(1, "Enter your name").optional(),
-    phoneNumber: z.string().optional(),
-    bio: z.string().max(500, "Bio must be 500 characters or fewer").optional(),
-    profileIsPublic: z.boolean().optional(),
+    displayName: annotate(z.string().min(1, "Enter your name").optional(), {
+        section: "profile", sectionLabel: "Your details", sectionRequired: true,
+        quick: true, order: 1, row: "pair", label: "Display name",
+    }),
+    phoneNumber: annotate(z.string().optional(), {
+        section: "profile", quick: true, order: 2, row: "pair",
+        label: "Phone number", inputType: "tel",
+    }),
+    bio: annotate(z.string().max(500, "Bio must be 500 characters or fewer").optional(), {
+        section: "profile", order: 3, row: "full", kind: "textarea",
+        label: "Bio", help: "Up to 500 characters. Buyers see this on your public profile.",
+    }),
+    profileIsPublic: annotate(z.boolean().optional(), {
+        section: "visibility", sectionLabel: "Visibility", order: 1, row: "full",
+        label: "Public profile",
+        help: "When on, your profile is visible to other LetItRip users.",
+    }),
 });
 /**
  * Changing the account email.
@@ -69,11 +79,23 @@ export const updateProfileSchema = z.object({
  * credential, not chosen here.
  */
 export const changeEmailSchema = z.object({
-    newEmail: z
+    newEmail: annotate(z
         .string()
         .trim()
         .toLowerCase()
         .min(1, "Enter the new email address.")
-        .email("That doesn't look like an email address."),
-    emailPassword: z.string().min(1, "Enter your current password to confirm."),
+        .email("That doesn't look like an email address."), {
+        section: "basics", sectionLabel: "Change email", sectionRequired: true,
+        order: 1, row: "full", label: "New email address", inputType: "email",
+    }),
+    /*
+     * 🛑 `inputType: "password"` is not cosmetic. Without it the generated
+     * control is a bare `<FieldInput>` with no `type`, which renders a password
+     * IN PLAINTEXT — the defect found the first time this generator met a
+     * credential field.
+     */
+    emailPassword: annotate(z.string().min(1, "Enter your current password to confirm."), {
+        section: "basics", order: 2, row: "full", label: "Current password",
+        inputType: "password",
+    }),
 });

package/dist/features/addresses/components/AddressLocationFields.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import type { JsonValue } from "@mohasinac/appkit/client";
+export interface AddressLocationFieldsProps {
+    country: string;
+    state: string;
+    postalCode: string;
+    errors: Record<string, string>;
+    isLooking?: boolean;
+    onChange: (partial: Record<string, JsonValue>) => void;
+    /** Called with (postalCode, country) whenever either settles. */
+    onPostalSettled: (postalCode: string, country: string) => void;
+}
+export declare function AddressLocationFields({ country, state, postalCode, errors, isLooking, onChange, onPostalSettled, }: AddressLocationFieldsProps): React.JSX.Element;

package/dist/features/addresses/components/AddressLocationFields.js

@@ -0,0 +1,41 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PaginatedSelect, Stack, Text } from "../../../ui";
+import { FieldInput } from "../../../ui/forms/FieldInput";
+import { FormGroup } from "../../../ui/components/Form";
+import { countryFor, postalLabelFor, COUNTRIES } from "../../../constants/geo/countries";
+import { subdivisionsFor } from "../../../constants/geo/subdivisions";
+const COUNTRY_OPTIONS = Object.values(COUNTRIES).map((c) => ({
+    value: c.code,
+    label: c.name,
+}));
+export function AddressLocationFields({ country, state, postalCode, errors, isLooking = false, onChange, onPostalSettled, }) {
+    const def = countryFor(country);
+    const states = subdivisionsFor(def?.code);
+    const postalLabel = postalLabelFor(country);
+    return (_jsxs(Stack, { gap: "sm", children: [_jsxs(FormGroup, { columns: 2, children: [_jsx(PaginatedSelectField, { label: "Country", value: def?.code ?? "", error: errors.country, onChange: (next) => {
+                            /*
+                             * Changing country invalidates the state: "Karnataka" is not a
+                             * Canadian province. Cleared rather than carried, because a state
+                             * that no longer belongs to its country is a row nothing can
+                             * group or ship.
+                             */
+                            onChange({ country: next, state: "" });
+                            onPostalSettled(postalCode, next);
+                        } }), states.length > 0 ? (_jsx(PaginatedSelectField, { label: "State / region", value: state, error: errors.state, options: states.map((s) => ({ value: s, label: s })), onChange: (next) => onChange({ state: next }) })) : (_jsx(FieldInput, { name: "state", label: "State / region", required: true, value: state, error: errors.state, onChange: (v) => onChange({ state: v }) }))] }), _jsx(FieldInput, { name: "postalCode", label: postalLabel, required: true, value: postalCode, error: errors.postalCode, hint: isLooking
+                    ? "Looking up your city…"
+                    : "We fill in the city and state when we recognise it.", onChange: (v) => {
+                    onChange({ postalCode: v });
+                    onPostalSettled(v, country);
+                }, onBlur: () => onPostalSettled(postalCode, country) }), !def && country.trim() && (_jsx(Text, { size: "xs", color: "muted", children: "We do not know the postal format for that country, so anything plausible is accepted." }))] }));
+}
+/**
+ * A labelled `PaginatedSelect`.
+ *
+ * The primitive takes no `label` or `error` of its own — the generator wraps
+ * it the same way at `build-sections.tsx:392`. This is that wrapper, named,
+ * so the two country pickers in this file do not each rebuild it.
+ */
+function PaginatedSelectField({ label, value, error, options = COUNTRY_OPTIONS, onChange, }) {
+    return (_jsxs(Stack, { gap: "xs", children: [_jsxs(Text, { size: "sm", weight: "medium", color: "muted", children: [label, " *"] }), _jsx(PaginatedSelect, { value: value, options: options, onChange: (next) => onChange(next ?? ""), ariaLabel: label, placeholder: `Select ${label.toLowerCase()}…` }), error && (_jsx(Text, { size: "xs", color: "error", role: "alert", children: error }))] }));
+}

package/dist/features/addresses/hooks/usePostalLookup.d.ts

@@ -0,0 +1,17 @@
+export interface PostalLookupResult {
+    city: string;
+    state: string;
+}
+export interface UsePostalLookupOptions {
+    /** Called with the resolved place. Only ever fires on a hit. */
+    onResolved: (result: PostalLookupResult) => void;
+    /** Skip the lookup entirely — e.g. while the form is submitting. */
+    enabled?: boolean;
+}
+export interface UsePostalLookupResult {
+    /** Feed it the current postal code and country on every change or blur. */
+    lookup: (postalCode: string, country: string) => void;
+    /** True while a request is in flight. Purely for a spinner; never gates. */
+    isLooking: boolean;
+}
+export declare function usePostalLookup({ onResolved, enabled, }: UsePostalLookupOptions): UsePostalLookupResult;

package/dist/features/addresses/hooks/usePostalLookup.js

@@ -0,0 +1,133 @@
+"use client";
+/*
+ * WHY: "Typing a zipcode should fill in the city" — and there was **no lookup
+ *      anywhere in the codebase**. Two dead modules carried the shape of one
+ *      that had been removed (`useAddressForm`, `address-validation`, both
+ *      with an unused `validatePostalCode` extension point and zero
+ *      consumers), which is what made it look built.
+ * WHAT: `usePostalLookup` — resolve a postal code to its place and region.
+ *
+ * ## Zippopotam, and one code path for every country
+ *
+ * `https://api.zippopotam.us/{country}/{postal}` is free, needs no key and
+ * covers ~60 countries. It returns place + state, not district — which is fine:
+ * the user writes the locality, this fills the two fields they would otherwise
+ * copy off an envelope.
+ *
+ * India Post's own API would be more complete for India, but it is one country
+ * behind a different contract; a second provider is a second failure mode and a
+ * second set of field names for a form that just spent this wave collapsing
+ * eleven shapes into one.
+ *
+ * ## 🛑 Three rules, and each one is the difference between help and damage
+ *
+ * 1. **Never overwrite what the user typed.** Autofill lands only in an EMPTY
+ *    city or state. A lookup that corrects a deliberately unusual address is a
+ *    bug the user cannot even report — they watch their own typing vanish.
+ * 2. **Fail silently and OPEN.** A network error, a 404, an unsupported
+ *    country: all leave the fields exactly as they were and never block the
+ *    submit. Zippopotam's India coverage is thinner than India Post's, so a
+ *    miss is the common case and must be a non-event.
+ * 3. **Abort in flight.** A user typing "560001" fires on every keystroke past
+ *    the debounce; without an `AbortController` the answer for "56000" can
+ *    land after the answer for "560001" and fill the wrong city.
+ *
+ * EXPORTS: usePostalLookup, type PostalLookupResult
+ *
+ * @tag domain:addresses
+ * @tag layer:hook
+ * @tag pattern:none
+ * @tag access:client
+ * @tag consumers:AddressForm,AdminAddressEditorView
+ * @tag sideEffects:network
+ */
+import * as React from "react";
+import { normalizeError } from "../../../errors/normalize";
+import { countryFor, isValidPostalCode } from "../../../constants/geo/countries";
+const ENDPOINT = "https://api.zippopotam.us";
+const DEBOUNCE_MS = 400;
+/**
+ * Per-session cache, keyed `{country}:{postal}`.
+ *
+ * Module scope rather than component state: the same postal code is looked up
+ * again every time the user opens the address form, and a miss is cached too —
+ * re-asking for a code Zippopotam does not have is a round trip that can only
+ * fail again.
+ */
+const CACHE = new Map();
+export function usePostalLookup({ onResolved, enabled = true, }) {
+    const [isLooking, setIsLooking] = React.useState(false);
+    const timerRef = React.useRef(null);
+    const abortRef = React.useRef(null);
+    /*
+     * The callback in a ref so `lookup` is stable across renders. Without it
+     * every keystroke re-creates the debounced function and the timer never
+     * survives long enough to fire.
+     */
+    const onResolvedRef = React.useRef(onResolved);
+    onResolvedRef.current = onResolved;
+    React.useEffect(() => () => {
+        if (timerRef.current)
+            clearTimeout(timerRef.current);
+        abortRef.current?.abort();
+    }, []);
+    const lookup = React.useCallback((postalCode, country) => {
+        if (!enabled)
+            return;
+        if (timerRef.current)
+            clearTimeout(timerRef.current);
+        abortRef.current?.abort();
+        const code = postalCode.trim();
+        const def = countryFor(country);
+        // Only ask once the code is plausibly complete for this country, so a
+        // half-typed PIN does not spend a round trip proving itself wrong.
+        if (!def || !isValidPostalCode(country, code))
+            return;
+        const key = `${def.code}:${code}`;
+        const cached = CACHE.get(key);
+        if (cached !== undefined) {
+            if (cached)
+                onResolvedRef.current(cached);
+            return;
+        }
+        timerRef.current = setTimeout(() => {
+            const controller = new AbortController();
+            abortRef.current = controller;
+            setIsLooking(true);
+            void fetch(`${ENDPOINT}/${def.code.toLowerCase()}/${encodeURIComponent(code)}`, {
+                signal: controller.signal,
+            })
+                .then((res) => (res.ok ? res.json() : null))
+                .then((json) => {
+                const place = json?.places?.[0];
+                const result = place
+                    ? {
+                        city: place["place name"] ?? "",
+                        state: place.state ?? place["state abbreviation"] ?? "",
+                    }
+                    : null;
+                CACHE.set(key, result);
+                if (result)
+                    onResolvedRef.current(result);
+            })
+                .catch((err) => {
+                const normalized = normalizeError(err);
+                /*
+                 * Deliberately silent. An abort is the expected path when the user
+                 * keeps typing, and a real failure must leave the fields editable
+                 * rather than tell the buyer their postcode is wrong when it is
+                 * our upstream that is down. Not cached, so a transient failure
+                 * does not poison the code for the session.
+                 */
+                void normalized;
+            })
+                .finally(() => {
+                if (abortRef.current === controller) {
+                    abortRef.current = null;
+                    setIsLooking(false);
+                }
+            });
+        }, DEBOUNCE_MS);
+    }, [enabled]);
+    return { lookup, isLooking };
+}