@rebasepro/studio 0.15.0 → 0.16.0

package/dist/{RLSEditor-CV8R1G3W.js → RLSEditor-CBX4uD66.js}

@@ -3,10 +3,18 @@ import { ErrorView, useApiBase, useApiConfig, useRebaseContext, useSnackbarContr
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { Alert, AlertTriangleIcon, Button, Chip, CircularProgress, DatabaseIcon, Dialog, DialogActions, DialogContent, DialogTitle, HelpCircleIcon, IconButton, KeyIcon, Link2Icon, LockIcon, MultiSelect, MultiSelectItem, Paper, RefreshCwIcon, ResizablePanels, Select, SelectItem, ShieldIcon, Tab, Tabs, TextField, Tooltip, Trash2Icon, Typography, cls, defaultBorderMixin, iconSize } from "@rebasepro/ui";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { isPostgresCollectionConfig } from "@rebasepro/types";
+import { RLS_JWT_SQL, RLS_ROLES_SQL, RLS_UID_SQL, isPostgresCollectionConfig, policy } from "@rebasepro/types";
 import { getPolicyNamesForRule, getPolicyNamesForRules, getPolicyOperations } from "@rebasepro/utils";
-import { JUNCTION_TABLES_SQL, REBASE_INTERNAL_PREFIXES, REBASE_INTERNAL_SCHEMAS, getEffectiveSecurityRules, getJunctionSecurityRules, resolveJunctionSpecs } from "@rebasepro/common";
-//#region src/components/RLSEditor/PolicyEditor.tsx
+import { JUNCTION_TABLES_SQL, REBASE_INTERNAL_PREFIXES, REBASE_INTERNAL_SCHEMAS, REBASE_USER_ROLE, getEffectiveSecurityRules, getJunctionSecurityRules, policyToPostgres, resolveJunctionSpecs } from "@rebasepro/common";
+//#region src/components/RLSEditor/policy-presets.ts
+/**
+* What the RLS editor offers before the user types anything: the roles a `TO`
+* list may name, and the ready-made policies.
+*
+* Separated from the component because these are the parts that have to agree
+* with the *server*, not with the UI — and the ways they can silently disagree
+* are the reason this file has tests.
+*/
 var COMMAND_OPTIONS = [
 	"ALL",
 	"SELECT",
@@ -14,12 +22,72 @@ var COMMAND_OPTIONS = [
 	"UPDATE",
 	"DELETE"
 ];
-var ROLE_OPTIONS = [
-	"public",
-	"authenticated",
-	"anon",
-	"admin"
-];
+/**
+* The roles a policy's `TO` list can name when nothing better is known.
+*
+* Not `authenticated` / `anon` / `admin`, which is what this list used to be.
+* The first two are Supabase's role names and Rebase never creates them, so
+* `CREATE POLICY ... TO authenticated` — which is literally what the editor
+* builds and executes — fails with `role "authenticated" does not exist`. The
+* driver's `validatePolicyPgRoles` rejects the same three names in
+* `SecurityRule.pgRoles` and says why: they are another platform's convention,
+* and application roles belong in a condition, not in the `TO` list.
+*
+* `admin` was the more dangerous entry, because it is a plausible *application*
+* role. Had one existed as a database role too, the policy would have been
+* created successfully and then matched nothing at all: requests run as
+* {@link REBASE_USER_ROLE} after a `SET LOCAL ROLE`, and a `TO` list naming a
+* role the request never assumes filters every row without erroring.
+*
+* So: `public` (what the framework's own generator emits) and the role requests
+* actually arrive as. "Signed-in users" and "admins" are not roles here — they
+* are conditions over `rebase.uid()` and `rebase.roles()`, which is what the
+* presets below now compile to.
+*/
+var FALLBACK_ROLE_OPTIONS = ["public", REBASE_USER_ROLE];
+/**
+* The `TO` list the editor offers, given what the database reported and what
+* the policy being edited already targets.
+*
+* Three sources, and each is there for a reason the others do not cover:
+*
+*  - {@link FALLBACK_ROLE_OPTIONS} always, because `public` is a **keyword, not
+*    a row in `pg_roles`** — `fetchAvailableRoles` cannot return it, so seeding
+*    from the live fetch alone would drop the one role every generated policy
+*    targets.
+*  - the live roles, so an operator's own `app_read` is reachable without
+*    hand-editing SQL.
+*  - the edited policy's own roles, because a `MultiSelect` silently drops a
+*    value with no matching item. That value is the `TO` list of a policy
+*    already enforcing something, so opening an unrelated policy for a one-word
+*    rename would have quietly rewritten who it applies to.
+*/
+function roleOptionsFor(fetched, policyRoles) {
+	return [.../* @__PURE__ */ new Set([
+		...FALLBACK_ROLE_OPTIONS,
+		...fetched ?? [],
+		...policyRoles ?? []
+	])];
+}
+/**
+* Preset conditions, compiled by the framework's own policy compiler rather
+* than written out here.
+*
+* `policyToPostgres` is the function `db push` generates policies with, so a
+* preset cannot drift from what the framework emits — and the one that matters
+* has drifted before: `authenticated()` used to compile to a bare
+* `IS NOT NULL`, which is true for anonymous visitors, and any copy of that
+* string sitting in a preset would still be handing out the old grant today.
+*/
+var SIGNED_IN_SQL = policyToPostgres(policy.authenticated());
+var IS_ADMIN_SQL = policyToPostgres(policy.rolesOverlap(["admin"]));
+var OWNS_ROW_SQL = policyToPostgres(policy.compare(policy.authUid(), "eq", policy.field("uid")));
+/**
+* Every preset targets `TO public`, which is what the framework's generator
+* emits and what actually reaches a request running as `rebase_user`. The part
+* that used to be expressed as a role — "authenticated", "admin" — is a
+* condition now, so it is enforced where Postgres will actually evaluate it.
+*/
 var POLICY_PRESETS = [
 	{
 		id: "public_read",
@@ -34,61 +102,74 @@ var POLICY_PRESETS = [
 	},
 	{
 		id: "auth_read",
-		label: "Enable read access for authenticated users only",
-		description: "Only logged-in users are allowed to read data.",
-		policyname: "Enable read access for authenticated users",
+		label: "Enable read access for signed-in users only",
+		description: "Only signed-in users are allowed to read data. Anonymous requests carry a sentinel uid, so the condition excludes them explicitly.",
+		policyname: "Enable read access for signed-in users",
 		cmd: "SELECT",
 		permissive: "PERMISSIVE",
-		roles: ["authenticated"],
-		qual: "true",
+		roles: ["public"],
+		qual: SIGNED_IN_SQL,
 		with_check: ""
 	},
 	{
 		id: "auth_insert",
-		label: "Enable insert for authenticated users only",
-		description: "Only logged-in users are allowed to insert new data.",
-		policyname: "Enable insert for authenticated users only",
+		label: "Enable insert for signed-in users only",
+		description: "Only signed-in users are allowed to insert new data.",
+		policyname: "Enable insert for signed-in users only",
 		cmd: "INSERT",
 		permissive: "PERMISSIVE",
-		roles: ["authenticated"],
+		roles: ["public"],
 		qual: "",
-		with_check: "true"
+		with_check: SIGNED_IN_SQL
+	},
+	{
+		id: "admin_all",
+		label: "Admins can do anything",
+		description: "Restricted to users holding the `admin` application role, matched inside the policy via rebase.roles().",
+		policyname: "Admins have full access",
+		cmd: "ALL",
+		permissive: "PERMISSIVE",
+		roles: ["public"],
+		qual: IS_ADMIN_SQL,
+		with_check: IS_ADMIN_SQL
 	},
 	{
 		id: "user_select_own",
 		label: "Users can read their own rows",
-		description: "Users can only read rows where the uid matches their auth.uid()",
+		description: "Users can only read rows whose uid column matches their rebase.uid()",
 		policyname: "Users can select their own data",
 		cmd: "SELECT",
 		permissive: "PERMISSIVE",
-		roles: ["authenticated"],
-		qual: "auth.uid() = uid",
+		roles: ["public"],
+		qual: OWNS_ROW_SQL,
 		with_check: ""
 	},
 	{
 		id: "user_update_own",
 		label: "Users can update their own rows",
-		description: "Users can only update rows where the uid matches their auth.uid()",
+		description: "Users can only update rows whose uid column matches their rebase.uid()",
 		policyname: "Users can update their own data",
 		cmd: "UPDATE",
 		permissive: "PERMISSIVE",
-		roles: ["authenticated"],
-		qual: "auth.uid() = uid",
-		with_check: "auth.uid() = uid"
+		roles: ["public"],
+		qual: OWNS_ROW_SQL,
+		with_check: OWNS_ROW_SQL
 	},
 	{
 		id: "user_delete_own",
 		label: "Users can delete their own rows",
-		description: "Users can only delete rows where the uid matches their auth.uid()",
+		description: "Users can only delete rows whose uid column matches their rebase.uid()",
 		policyname: "Users can delete their own data",
 		cmd: "DELETE",
 		permissive: "PERMISSIVE",
-		roles: ["authenticated"],
-		qual: "auth.uid() = uid",
+		roles: ["public"],
+		qual: OWNS_ROW_SQL,
 		with_check: ""
 	}
 ];
-var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
+//#endregion
+//#region src/components/RLSEditor/PolicyEditor.tsx
+var PolicyEditor = ({ policy, schema, table, roleOptions, onSave, onCancel }) => {
 	const { t } = useTranslation();
 	const [name, setName] = useState("");
 	const [helpOpen, setHelpOpen] = useState(false);
@@ -98,6 +179,7 @@ var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
 	const [usingExpr, setUsingExpr] = useState("");
 	const [checkExpr, setCheckExpr] = useState("");
 	const [selectedPreset, setSelectedPreset] = useState("");
+	const availableRoles = useMemo(() => roleOptionsFor(roleOptions, policy?.roles), [roleOptions, policy]);
 	useEffect(() => {
 		if (policy) {
 			setName(policy.policyname || "");
@@ -303,7 +385,7 @@ var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
 								value: roles,
 								onValueChange: setRoles,
 								placeholder: t("studio_policy_roles_placeholder"),
-								children: ROLE_OPTIONS.map((role) => /* @__PURE__ */ jsx(MultiSelectItem, {
+								children: availableRoles.map((role) => /* @__PURE__ */ jsx(MultiSelectItem, {
 									value: role,
 									children: role
 								}, role))
@@ -457,9 +539,13 @@ var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
 											className: "text-text-secondary dark:text-text-secondary-dark mb-1",
 											children: t("studio_policy_help_step3_desc")
 										}),
-										/* @__PURE__ */ jsx("div", {
+										/* @__PURE__ */ jsxs("div", {
 											className: cls("bg-surface-100 dark:bg-surface-950 px-3 py-2 rounded-md font-mono text-sm my-2", defaultBorderMixin),
-											children: "Example: auth.uid() = uid"
+											children: [
+												"Example: ",
+												RLS_UID_SQL,
+												" = uid"
+											]
 										}),
 										/* @__PURE__ */ jsx(Typography, {
 											variant: "caption",
@@ -481,9 +567,13 @@ var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
 											className: "text-text-secondary dark:text-text-secondary-dark mb-1",
 											children: t("studio_policy_help_step4_desc")
 										}),
-										/* @__PURE__ */ jsx("div", {
+										/* @__PURE__ */ jsxs("div", {
 											className: cls("bg-surface-100 dark:bg-surface-950 px-3 py-2 rounded-md font-mono text-sm my-2", defaultBorderMixin),
-											children: "Example: auth.uid() = uid"
+											children: [
+												"Example: ",
+												RLS_UID_SQL,
+												" = uid"
+											]
 										}),
 										/* @__PURE__ */ jsx(Typography, {
 											variant: "caption",
@@ -510,32 +600,36 @@ var PolicyEditor = ({ policy, schema, table, onSave, onCancel }) => {
 											children: [
 												/* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsx("code", {
 													className: "bg-surface-100 dark:bg-surface-950 px-1.5 py-0.5 rounded mr-1 whitespace-nowrap",
-													children: "auth.uid()"
+													children: RLS_UID_SQL
 												}), /* @__PURE__ */ jsxs("span", {
 													className: "block mt-0.5",
-													children: ["Returns the current user's ID as text. Example: ", /* @__PURE__ */ jsx("code", {
+													children: ["Returns the current user's ID as text. Example: ", /* @__PURE__ */ jsxs("code", {
 														className: "bg-surface-100 dark:bg-surface-950 px-1 py-0.5 rounded text-[11px]",
-														children: "auth.uid() = uid"
+														children: [RLS_UID_SQL, " = uid"]
 													})]
 												})] }),
 												/* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsx("code", {
 													className: "bg-surface-100 dark:bg-surface-950 px-1.5 py-0.5 rounded mr-1 whitespace-nowrap",
-													children: "auth.jwt()"
+													children: RLS_JWT_SQL
 												}), /* @__PURE__ */ jsxs("span", {
 													className: "block mt-0.5",
-													children: ["Returns the full JWT payload as JSONB so you can check custom claims. Example: ", /* @__PURE__ */ jsx("code", {
+													children: ["Returns the full JWT payload as JSONB so you can check custom claims. Example: ", /* @__PURE__ */ jsxs("code", {
 														className: "bg-surface-100 dark:bg-surface-950 px-1 py-0.5 rounded text-[11px]",
-														children: "auth.jwt() ->> 'email' = 'admin@example.com'"
+														children: [RLS_JWT_SQL, " ->> 'email' = 'admin@example.com'"]
 													})]
 												})] }),
 												/* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsx("code", {
 													className: "bg-surface-100 dark:bg-surface-950 px-1.5 py-0.5 rounded mr-1 whitespace-nowrap",
-													children: "auth.roles()"
+													children: RLS_ROLES_SQL
 												}), /* @__PURE__ */ jsxs("span", {
 													className: "block mt-0.5",
-													children: ["Returns the user's role IDs as a comma-separated string. Best used with: ", /* @__PURE__ */ jsx("code", {
+													children: ["Returns the user's role IDs as a comma-separated string. Best used with: ", /* @__PURE__ */ jsxs("code", {
 														className: "bg-surface-100 dark:bg-surface-950 px-1 py-0.5 rounded text-[11px]",
-														children: "string_to_array(auth.roles(), ',') @> ARRAY['admin']"
+														children: [
+															"string_to_array(",
+															RLS_ROLES_SQL,
+															", ',') @> ARRAY['admin']"
+														]
 													})]
 												})] })
 											]
@@ -729,6 +823,25 @@ var RLSEditor = ({ apiUrl = "" }) => {
 	const [activeTab, setActiveTab] = useState(0);
 	const [junctionTableNames, setJunctionTableNames] = useState(/* @__PURE__ */ new Set());
 	const [editingPolicy, setEditingPolicy] = useState(null);
+	/**
+	* Native PostgreSQL roles, for the policy editor's `TO` list.
+	*
+	* `fetchAvailableRoles` and not `fetchApplicationRoles`: a policy's `TO`
+	* clause names database roles, and an application role put there produces a
+	* policy that either fails to create or matches nothing. The editor falls
+	* back to a static pair when the driver cannot answer.
+	*/
+	const [pgRoleOptions, setPgRoleOptions] = useState([]);
+	useEffect(() => {
+		let mounted = true;
+		if (!databaseAdmin?.fetchAvailableRoles) return;
+		databaseAdmin.fetchAvailableRoles().then((roles) => {
+			if (mounted) setPgRoleOptions(roles);
+		}).catch((e) => console.error("Failed to fetch database roles", e));
+		return () => {
+			mounted = false;
+		};
+	}, [databaseAdmin]);
 	const [sidebarSize, setSidebarSize] = useState(() => {
 		try {
 			const saved = localStorage.getItem("rebase_rls_editor_sidebar_size");
@@ -899,7 +1012,7 @@ var RLSEditor = ({ apiUrl = "" }) => {
 					tablename: activeTableData.tableName,
 					permissive: (rule.mode || "permissive").toUpperCase(),
 					cmd: (ops[opIdx] ?? rule.operation ?? "ALL").toUpperCase(),
-					roles: [...rule.roles ?? ["public"]],
+					roles: [...rule.pgRoles ?? ["public"]],
 					qual: rule.using || null,
 					with_check: rule.withCheck || null,
 					status: policiesMap[policyName] ? "both" : "code_only"
@@ -968,7 +1081,7 @@ var RLSEditor = ({ apiUrl = "" }) => {
 							className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin),
 							children: [/* @__PURE__ */ jsx(Typography, {
 								variant: "caption",
-								className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark",
+								className: "font-semibold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark",
 								children: t("studio_schema_tables")
 							}), /* @__PURE__ */ jsx(IconButton, {
 								size: "small",
@@ -1060,7 +1173,7 @@ var RLSEditor = ({ apiUrl = "" }) => {
 							className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin),
 							children: /* @__PURE__ */ jsx(Typography, {
 								variant: "caption",
-								className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark",
+								className: "font-semibold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark",
 								children: "Overview"
 							})
 						}), /* @__PURE__ */ jsxs("div", {
@@ -1285,6 +1398,7 @@ var RLSEditor = ({ apiUrl = "" }) => {
 					policy: editingPolicy === "new" ? void 0 : editingPolicy,
 					schema: activeTableData.schemaName,
 					table: activeTableData.tableName,
+					roleOptions: pgRoleOptions,
 					onSave: async (newPolicy) => {
 						if (activeCollection && hasCodebase) {
 							const rule = {
@@ -1293,7 +1407,7 @@ var RLSEditor = ({ apiUrl = "" }) => {
 								mode: newPolicy.permissive?.toLowerCase(),
 								using: newPolicy.qual || void 0,
 								withCheck: newPolicy.with_check || void 0,
-								roles: newPolicy.roles
+								...newPolicy.roles && !(newPolicy.roles.length === 1 && newPolicy.roles[0] === "public") ? { pgRoles: newPolicy.roles } : {}
 							};
 							const existingRules = (isPostgresCollectionConfig(activeCollection) ? activeCollection.securityRules : void 0) || [];
 							let newRules;
@@ -1595,4 +1709,4 @@ var RLSEditor = ({ apiUrl = "" }) => {
 //#endregion
 export { RLSEditor };
 
-//# sourceMappingURL=RLSEditor-CV8R1G3W.js.map
+//# sourceMappingURL=RLSEditor-CBX4uD66.js.map