@rebasepro/app 0.14.0 → 0.14.1

package/dist/components/LoginView/LoginView.d.ts

@@ -105,11 +105,18 @@ export interface LoginViewProps {
      */
     defaultPassword?: string;
     /**
-     * When set, the email/password forms render a "Join the newsletter"
-     * opt-in checkbox. Called with the address that just authenticated —
-     * sign-in or registration — if the box was ticked. Wire it to whatever
-     * stores the subscription; failures are the callback's problem, the
-     * login flow never waits on it.
+     * When set, a "Join the newsletter" opt-in checkbox is offered. Called with
+     * the address that just authenticated — by any method — if the box was
+     * ticked. Wire it to whatever stores the subscription; failures are the
+     * callback's problem, the login flow never waits on it.
+     *
+     * The checkbox sits on the **provider screen**, beside the buttons that
+     * choose how to sign in, rather than on the credentials form. It is a
+     * decision about the visitor, not about the password: asking on the
+     * credentials form put it in front of only the people who got that far by
+     * typing an address, so anyone signing in with Google was never offered it
+     * at all. Bootstrap mode is the exception — there is no provider screen
+     * there, so the form keeps it.
      */
     onNewsletterOptIn?: (email: string) => void;
 }

package/dist/hooks/data/collectionQuery.d.ts

@@ -1,4 +1,4 @@
-import type { FindParams, FilterValues, LogicalCondition } from "@rebasepro/types";
+import type { FindParams, FilterValues, LogicalCondition, OrderBySpec } from "@rebasepro/types";
 /**
  * The one place a collection read's parameters are assembled.
  *
@@ -23,12 +23,12 @@ export interface CollectionQueryInput<M extends Record<string, unknown>> {
     logical?: LogicalCondition;
     /**
      * Loosened from `FindParams["orderBy"]` on purpose: callers hold the sort
-     * as a plain `[string, direction]` read off user config or a URL, where the
-     * column is not statically known. Narrowing it here would push a cast onto
-     * every call site, which is the kind of friction that sends people back to
-     * hand-building the object this exists to replace.
+     * as plain `[string, direction]` pairs read off user config or a URL, where
+     * the columns are not statically known. Narrowing it here would push a cast
+     * onto every call site, which is the kind of friction that sends people back
+     * to hand-building the object this exists to replace.
      */
-    orderBy?: [string, "asc" | "desc"];
+    orderBy?: OrderBySpec;
     limit?: number;
     offset?: number;
     page?: number;

package/dist/hooks/useTranslation.d.ts

@@ -12,6 +12,6 @@
  * @internal
  */
 export declare function useTranslation(): {
-    t: (key: string, vars?: Record<string, string>) => string;
+    t: (key: string, vars?: Record<string, string | number>) => string;
     i18n: import("i18next").i18n;
 };

package/dist/index.es.js

@@ -4,7 +4,7 @@ import { ALL_WHERE_FILTER_OPS, DEFAULT_DATA_SOURCE_KEY, DEFAULT_FILTERABLE_RELAT
 import { UNRENDERED_SLOTS, resolveAdminCollection } from "@rebasepro/admin-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { SnackbarProvider as SnackbarProvider$1, useSnackbar } from "notistack";
-import { buildRebaseData, canCreateEntity, canDeleteEntity, canEditEntity, canReadCollection, evaluateCondition, getChildViewDeclaringProperties, getChildViewRelationPropertyKeys, getEntityChildViews, getLabelOrConfigFrom, getPrimaryKeys, getSubcollections, isPropertyBuilder, resolveStorageFilenameString, resolveStoragePathString, resolveStorageSource, stripCollectionPath, wrapAsEntityData, wrapAsSdkData } from "@rebasepro/common";
+import { buildRebaseData, canCreateEntity, canDeleteEntity, canEditEntity, canReadCollection, evaluateCondition, getChildViewDeclaringProperties, getChildViewRelationPropertyKeys, getEntityChildViews, getLabelOrConfigFrom, getPrimaryKeys, getSubcollections, isPropertyBuilder, normalizeOrderBy, resolveStorageFilenameString, resolveStoragePathString, resolveStorageSource, serializeOrderBy, stripCollectionPath, wrapAsEntityData, wrapAsSdkData } from "@rebasepro/common";
 import { getTitlePropertyKey as getTitlePropertyKey$1, removeInitialAndTrailingSlashes as removeInitialAndTrailingSlashes$1 } from "@rebasepro/app";
 import { Link, Routes, createBrowserRouter, useBlocker, useLocation } from "react-router";
 import { generateForeignKeyName, hashString, isArrayValue, isObject, isPlainObject, isRecordValue, mergeDeep, randomString, readStoredJson, slugify, writeStoredJson } from "@rebasepro/utils";
@@ -2227,6 +2227,11 @@ function useTranslation() {
 	* Also supports i18next interpolation variables, e.g.
 	*   t("add_to_field", { fieldName: "Tags" })
 	*   t("error_deleting", { message: err.message })
+	*   t("sort_key_position", { position: 2 })
+	*
+	* Numbers are accepted as well as strings: i18next interpolates them
+	* either way, and a signature that took only strings pushed a `String()`
+	* onto every call site with a count in it — `{{count}}`, `{{position}}`.
 	*/
 	const typedT = useCallback((key, vars) => t(key, vars), [t]);
 	return useMemo(() => ({
@@ -2859,11 +2864,12 @@ function useDataTableController({ path, collection, scrollRestoration, entitiesD
 		return true;
 	}, []);
 	const sortInternal = useMemo(() => {
-		if (sort && fixedFilter && !checkFilterCombination(fixedFilter, sort)) {
+		const keys = normalizeOrderBy(sort);
+		if (keys && fixedFilter && !checkFilterCombination(fixedFilter, keys)) {
 			console.warn("Initial sort is not compatible with the force filter. Ignoring initial sort");
 			return;
 		}
-		return sort;
+		return keys;
 	}, [sort, fixedFilter]);
 	const { filterValues: filterUrl, sortBy: sortUrl } = parseFilterAndSort(location.search);
 	const [filterValues, setFilterValues] = React.useState(fixedFilter ?? (updateUrl ? filterUrl : void 0) ?? defaultFilter ?? void 0);
@@ -2900,8 +2906,7 @@ function useDataTableController({ path, collection, scrollRestoration, entitiesD
 		});
 	}, []);
 	const [itemCount, setItemCount] = React.useState(paginationEnabled ? initialItemCount : void 0);
-	const sortByProperty = sortBy ? sortBy[0] : void 0;
-	const currentSort = sortBy ? sortBy[1] : void 0;
+	const sortKey = sortBy ? serializeOrderBy(sortBy) : void 0;
 	const context = useRebaseContext();
 	const [rawData, setRawData] = useState(collectionScroll?.data ?? []);
 	const onScroll = useCallback(({ scrollOffset }) => {
@@ -2965,7 +2970,7 @@ function useDataTableController({ path, collection, scrollRestoration, entitiesD
 		};
 		const accessor = dataClient.collection(path);
 		const whereParams = filterValues && Object.keys(filterValues).length > 0 ? filterValues : void 0;
-		const orderByParams = sortBy ? [String(sortBy[0]), sortBy[1]] : void 0;
+		const orderByParams = sortBy && sortBy.length > 0 ? sortBy.map(([field, direction]) => [String(field), direction]) : void 0;
 		let unsubscribe;
 		const includeParams = getRelationIncludeParams(collection);
 		if (accessor.listen) unsubscribe = accessor.listen(toFindParams({
@@ -2990,8 +2995,7 @@ function useDataTableController({ path, collection, scrollRestoration, entitiesD
 		dataClient,
 		path,
 		itemCount,
-		currentSort,
-		sortByProperty,
+		sortKey,
 		filterValues,
 		searchString
 	]);
@@ -3067,9 +3071,9 @@ function useUpdateUrl(filterValues, sortBy, searchString, updateUrl) {
 }
 function encodeFilterAndSort(filterValues, sortBy) {
 	const entries = {};
-	if (sortBy) {
-		entries["__sort"] = encodeURIComponent(sortBy[0]);
-		entries["__sort_order"] = encodeURIComponent(sortBy[1]);
+	if (sortBy && sortBy.length > 0) {
+		entries["__sort"] = sortBy.map(([field]) => encodeURIComponent(field)).join(",");
+		entries["__sort_order"] = sortBy.map(([, direction]) => direction).join(",");
 	}
 	if (filterValues) Object.entries(filterValues).forEach(([key, value]) => {
 		if (value) {
@@ -3105,8 +3109,11 @@ function parseFilterAndSort(search) {
 	const filterValues = {};
 	let sortBy = void 0;
 	entries.forEach((value, key) => {
-		if (key === "__sort") sortBy = [decodeURIComponent(value), entries.get("__sort_order")];
-		else if (key.endsWith("_op")) {
+		if (key === "__sort") {
+			const directions = (entries.get("__sort_order") ?? "").split(",");
+			const keys = value.split(",").map((field) => decodeURIComponent(field).trim()).filter(Boolean).map((field, index) => [field, directions[index] === "desc" ? "desc" : "asc"]);
+			sortBy = keys.length > 0 ? keys : void 0;
+		} else if (key.endsWith("_op")) {
 			const field = key.replace("_op", "");
 			const filterOp = decodeURIComponent(value);
 			const filterValStr = entries.get(`${field}_value`);
@@ -3408,6 +3415,7 @@ var UIStyleGuide = () => {
 							children: variant
 						}), /* @__PURE__ */ jsxs(Typography, {
 							variant,
+							component: "p",
 							children: [
 								"The quick brown fox jumps over the lazy dog (",
 								variant,
@@ -5899,10 +5907,10 @@ function CrmDashboardDemo() {
 				children: [
 					/* @__PURE__ */ jsxs("div", {
 						className: "flex flex-col sm:flex-row sm:items-end justify-between mb-6 gap-4",
-						children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(Typography, {
+						children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Typography, {
 							variant: "h4",
 							className: "tracking-tight",
-							children: [getGreeting(), " 👋"]
+							children: getGreeting()
 						}), /* @__PURE__ */ jsxs(Typography, {
 							variant: "body2",
 							color: "secondary",
@@ -7800,6 +7808,7 @@ function UIReferenceView() {
 									children: v
 								}), /* @__PURE__ */ jsx(Typography, {
 									variant: v,
+									component: "p",
 									children: "The quick brown fox jumps over the lazy dog"
 								})]
 							}, v))
@@ -9529,6 +9538,21 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 	const [fadeIn, setFadeIn] = useState(false);
 	const [viewVisible, setViewVisible] = useState(true);
 	const [newsletterOptIn, setNewsletterOptIn] = useState(false);
+	const authControllerRef = useRef(authController);
+	authControllerRef.current = authController;
+	/**
+	* Subscribe the address that just authenticated, if the visitor asked for
+	* it. Every sign-in path calls this, which is the point: the checkbox sits
+	* beside the provider buttons, so it has to mean the same thing whichever
+	* one is pressed.
+	*
+	* Only ever from a resolution path — a ticked box on a *failed* attempt
+	* must not subscribe an address nobody proved they control.
+	*/
+	const subscribeIfOptedIn = useCallback((email) => {
+		if (!newsletterOptIn || !onNewsletterOptIn || !email) return;
+		onNewsletterOptIn(email);
+	}, [newsletterOptIn, onNewsletterOptIn]);
 	const switchMode = (newMode) => {
 		setViewVisible(false);
 		setTimeout(() => {
@@ -9657,9 +9681,10 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 						bootstrapMode: true,
 						defaultEmail,
 						defaultPassword,
-						onNewsletterOptIn,
+						onSignedIn: subscribeIfOptedIn,
 						newsletterOptIn,
-						setNewsletterOptIn
+						setNewsletterOptIn,
+						showNewsletterOptIn: Boolean(onNewsletterOptIn)
 					}), !isBootstrapMode && /* @__PURE__ */ jsxs(Fragment, { children: [
 						mode === "buttons" && /* @__PURE__ */ jsxs("div", {
 							className: "w-full flex flex-col gap-3 mt-2",
@@ -9681,6 +9706,19 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 									className: "w-full",
 									children: topComponent
 								}),
+								onNewsletterOptIn && /* @__PURE__ */ jsxs("label", {
+									className: cls("flex items-center gap-2 cursor-pointer", (topComponent || title || subtitle) && "-mt-3"),
+									children: [/* @__PURE__ */ jsx(Checkbox, {
+										checked: newsletterOptIn,
+										onCheckedChange: (checked) => setNewsletterOptIn(checked === true),
+										size: "small"
+									}), /* @__PURE__ */ jsx(Typography, {
+										variant: "caption",
+										color: "secondary",
+										className: "select-none",
+										children: t("join_newsletter")
+									})]
+								}),
 								/* @__PURE__ */ jsx(LoginButton, {
 									disabled,
 									text: "Sign in with email",
@@ -9690,7 +9728,8 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 								hasGoogleLogin && googleClientId && /* @__PURE__ */ jsx(GoogleLoginButton, {
 									disabled,
 									googleClientId,
-									authController
+									authController,
+									onSignedIn: () => subscribeIfOptedIn(authControllerRef.current.user?.email)
 								}),
 								hasGitHubLogin && githubClientId && /* @__PURE__ */ jsx(GitHubLoginButton, {
 									disabled,
@@ -9729,9 +9768,7 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 							switchToRegister: showRegistration ? () => switchMode("register") : void 0,
 							defaultEmail,
 							defaultPassword,
-							onNewsletterOptIn,
-							newsletterOptIn,
-							setNewsletterOptIn
+							onSignedIn: subscribeIfOptedIn
 						}),
 						mode === "register" && /* @__PURE__ */ jsx(LoginForm, {
 							authController,
@@ -9743,9 +9780,7 @@ function LoginView({ logo, authController, noUserComponent, disableSignupScreen
 							switchToLogin: () => switchMode("login"),
 							defaultEmail,
 							defaultPassword,
-							onNewsletterOptIn,
-							newsletterOptIn,
-							setNewsletterOptIn
+							onSignedIn: subscribeIfOptedIn
 						}),
 						mode === "forgot" && authController.forgotPassword && /* @__PURE__ */ jsx(ForgotPasswordForm, {
 							authController,
@@ -9803,8 +9838,10 @@ var GoogleIcon = () => /* @__PURE__ */ jsxs("svg", {
 		})
 	]
 });
-function GoogleLoginButton({ disabled, googleClientId, authController }) {
+function GoogleLoginButton({ disabled, googleClientId, authController, onSignedIn }) {
 	const codeClientRef = useRef(null);
+	const onSignedInRef = useRef(onSignedIn);
+	onSignedInRef.current = onSignedIn;
 	useEffect(() => {
 		if (!authController.googleLogin) return;
 		const google = window.google;
@@ -9823,6 +9860,7 @@ function GoogleLoginButton({ disabled, googleClientId, authController }) {
 						code: response.code,
 						redirectUri: "postmessage"
 					});
+					onSignedInRef.current?.();
 				} catch (err) {
 					console.error("Google login error:", err);
 				}
@@ -9891,7 +9929,7 @@ function LinkedInLoginButton({ disabled, linkedinClientId }) {
 		onClick: handleClick
 	});
 }
-function LoginForm({ onClose, onForgotPassword, authController, registrationMode, noUserComponent, disableSignupScreen, bootstrapMode = false, switchToRegister, switchToLogin, defaultEmail, defaultPassword, onNewsletterOptIn, newsletterOptIn = false, setNewsletterOptIn }) {
+function LoginForm({ onClose, onForgotPassword, authController, registrationMode, noUserComponent, disableSignupScreen, bootstrapMode = false, switchToRegister, switchToLogin, defaultEmail, defaultPassword, onSignedIn, newsletterOptIn = false, setNewsletterOptIn, showNewsletterOptIn = false }) {
 	const passwordRef = useRef(null);
 	const { t } = useTranslation();
 	const emailId = useId();
@@ -9910,14 +9948,14 @@ function LoginForm({ onClose, onForgotPassword, authController, registrationMode
 			document.removeEventListener("keydown", escFunction, false);
 		};
 	}, [onClose]);
-	function subscribeIfOptedIn(email) {
-		if (newsletterOptIn && onNewsletterOptIn) onNewsletterOptIn(email);
+	function reportSignedIn(email) {
+		onSignedIn?.(email);
 	}
 	function handleEnterPassword() {
-		if (email && password && authController.emailPasswordLogin) Promise.resolve(authController.emailPasswordLogin(email, password)).then(() => subscribeIfOptedIn(email)).catch(() => void 0);
+		if (email && password && authController.emailPasswordLogin) Promise.resolve(authController.emailPasswordLogin(email, password)).then(() => reportSignedIn(email)).catch(() => void 0);
 	}
 	function handleRegistration() {
-		if (email && password && authController.register) Promise.resolve(authController.register(email, password, displayName)).then(() => subscribeIfOptedIn(email)).catch(() => void 0);
+		if (email && password && authController.register) Promise.resolve(authController.register(email, password, displayName)).then(() => reportSignedIn(email)).catch(() => void 0);
 	}
 	const handleSubmit = (event) => {
 		event.preventDefault();
@@ -10038,7 +10076,7 @@ function LoginForm({ onClose, onForgotPassword, authController, registrationMode
 					children: "Forgot password?"
 				})
 			}),
-			onNewsletterOptIn && /* @__PURE__ */ jsxs("label", {
+			showNewsletterOptIn && /* @__PURE__ */ jsxs("label", {
 				className: "flex items-center gap-2 cursor-pointer mt-1 mb-1",
 				children: [/* @__PURE__ */ jsx(Checkbox, {
 					checked: newsletterOptIn,
@@ -10300,6 +10338,16 @@ var en = {
 	clear_sort: "Clear sort",
 	sort: "Sort",
 	sort_by: "Sort by",
+	sort_then_by: "Then by",
+	sort_ascending: "Sort ascending",
+	sort_descending: "Sort descending",
+	sort_remove: "Remove sort",
+	sort_move_up: "Make this key more important",
+	sort_move_down: "Make this key less important",
+	sort_remove_key: "Remove this sort key",
+	sort_key_position: "Sort key {{position}}",
+	sort_shift_click_hint: "Shift-click to add a column under the current sort",
+	save_entity_before_subcollections: "You need to save your entity before adding additional collections",
 	clear_all: "Clear all",
 	no_items: "No items",
 	no_entries_found: "No entries found",
@@ -11202,6 +11250,16 @@ var es = {
 	clear_sort: "Borrar orden",
 	sort: "Ordenar",
 	sort_by: "Ordenar por",
+	sort_then_by: "Luego por",
+	sort_ascending: "Ordenar ascendente",
+	sort_descending: "Ordenar descendente",
+	sort_remove: "Quitar orden",
+	sort_move_up: "Dar más importancia a esta clave",
+	sort_move_down: "Dar menos importancia a esta clave",
+	sort_remove_key: "Quitar esta clave de orden",
+	sort_key_position: "Clave de orden {{position}}",
+	sort_shift_click_hint: "Mayús+clic para añadir una columna bajo el orden actual",
+	save_entity_before_subcollections: "Debes guardar la entidad antes de añadir colecciones adicionales",
 	clear_all: "Borrar todo",
 	no_items: "Sin elementos",
 	no_entries_found: "No se encontraron entradas",
@@ -12060,6 +12118,16 @@ var de = {
 	clear_sort: "Sortierung löschen",
 	sort: "Sortieren",
 	sort_by: "Sortieren nach",
+	sort_then_by: "Dann nach",
+	sort_ascending: "Aufsteigend sortieren",
+	sort_descending: "Absteigend sortieren",
+	sort_remove: "Sortierung entfernen",
+	sort_move_up: "Diesen Schlüssel wichtiger machen",
+	sort_move_down: "Diesen Schlüssel weniger wichtig machen",
+	sort_remove_key: "Diesen Sortierschlüssel entfernen",
+	sort_key_position: "Sortierschlüssel {{position}}",
+	sort_shift_click_hint: "Umschalt+Klick, um eine Spalte unter der aktuellen Sortierung hinzuzufügen",
+	save_entity_before_subcollections: "Du musst den Eintrag speichern, bevor du weitere Sammlungen hinzufügst",
 	clear_all: "Alle löschen",
 	no_items: "Keine Elemente",
 	no_entries_found: "Keine Einträge gefunden",
@@ -12908,6 +12976,16 @@ var fr = {
 	clear_sort: "Effacer le tri",
 	sort: "Trier",
 	sort_by: "Trier par",
+	sort_then_by: "Puis par",
+	sort_ascending: "Trier par ordre croissant",
+	sort_descending: "Trier par ordre décroissant",
+	sort_remove: "Supprimer le tri",
+	sort_move_up: "Rendre cette clé plus importante",
+	sort_move_down: "Rendre cette clé moins importante",
+	sort_remove_key: "Supprimer cette clé de tri",
+	sort_key_position: "Clé de tri {{position}}",
+	sort_shift_click_hint: "Maj+clic pour ajouter une colonne sous le tri actuel",
+	save_entity_before_subcollections: "Vous devez enregistrer l'entité avant d'ajouter des collections supplémentaires",
 	clear_all: "Tout effacer",
 	no_items: "Aucun élément",
 	no_entries_found: "Aucune entrée trouvée",
@@ -13756,6 +13834,16 @@ var it = {
 	clear_sort: "Cancella ordinamento",
 	sort: "Ordina",
 	sort_by: "Ordina per",
+	sort_then_by: "Poi per",
+	sort_ascending: "Ordina in modo crescente",
+	sort_descending: "Ordina in modo decrescente",
+	sort_remove: "Rimuovi ordinamento",
+	sort_move_up: "Rendi questa chiave più importante",
+	sort_move_down: "Rendi questa chiave meno importante",
+	sort_remove_key: "Rimuovi questa chiave di ordinamento",
+	sort_key_position: "Chiave di ordinamento {{position}}",
+	sort_shift_click_hint: "Maiusc+clic per aggiungere una colonna sotto l'ordinamento attuale",
+	save_entity_before_subcollections: "Devi salvare l'entità prima di aggiungere altre raccolte",
 	clear_all: "Cancella tutto",
 	no_items: "Nessun elemento",
 	no_entries_found: "Nessuna voce trovata",
@@ -14604,6 +14692,16 @@ var hi = {
 	clear_sort: "सॉर्ट साफ़ करें",
 	sort: "क्रमबद्ध करें",
 	sort_by: "इसके अनुसार क्रमबद्ध करें",
+	sort_then_by: "फिर इसके अनुसार",
+	sort_ascending: "आरोही क्रम में लगाएँ",
+	sort_descending: "अवरोही क्रम में लगाएँ",
+	sort_remove: "क्रम हटाएँ",
+	sort_move_up: "इस कुंजी को अधिक महत्व दें",
+	sort_move_down: "इस कुंजी को कम महत्व दें",
+	sort_remove_key: "यह क्रम कुंजी हटाएँ",
+	sort_key_position: "क्रम कुंजी {{position}}",
+	sort_shift_click_hint: "वर्तमान क्रम के नीचे कॉलम जोड़ने के लिए Shift+क्लिक करें",
+	save_entity_before_subcollections: "अतिरिक्त संग्रह जोड़ने से पहले आपको एंटिटी सहेजनी होगी",
 	clear_all: "सभी साफ़ करें",
 	no_items: "कोई आइटम नहीं",
 	no_entries_found: "कोई प्रविष्टि नहीं मिली",
@@ -15457,6 +15555,16 @@ var pt = {
 	clear_sort: "Limpar ordenação",
 	sort: "Ordenar",
 	sort_by: "Ordenar por",
+	sort_then_by: "Depois por",
+	sort_ascending: "Ordenar ascendente",
+	sort_descending: "Ordenar descendente",
+	sort_remove: "Remover ordenação",
+	sort_move_up: "Tornar esta chave mais importante",
+	sort_move_down: "Tornar esta chave menos importante",
+	sort_remove_key: "Remover esta chave de ordenação",
+	sort_key_position: "Chave de ordenação {{position}}",
+	sort_shift_click_hint: "Shift+clique para adicionar uma coluna sob a ordenação atual",
+	save_entity_before_subcollections: "Precisas de guardar a entidade antes de adicionar coleções adicionais",
 	clear_all: "Limpar tudo",
 	no_items: "Sem itens",
 	no_entries_found: "Nenhum registo encontrado",