Merge branch 'dev' into aig

src/components/DomainPicker.tsx

@@ -53,7 +53,7 @@ import { PaidFeaturesAlert } from "@app/components/PaidFeaturesAlert";
 import { usePaidStatus } from "@/hooks/usePaidStatus";
 import { TierFeature, tierMatrix } from "@server/lib/billing/tierMatrix";
 import { toUnicode } from "punycode";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useUserContext } from "@app/hooks/useUserContext";
 
 type AvailableOption = {
@@ -166,8 +166,19 @@ export default function DomainPicker({
     const [selectedProvidedDomain, setSelectedProvidedDomain] =
         useState<AvailableOption | null>(null);
 
+    // Only run the initial base-domain selection once the domains have
+    // loaded. This must not re-run on later `defaultDomainId`/`defaultSubdomain`
+    // changes, because selecting a provided (namespace) domain calls
+    // onDomainChange(null), which the parent form echoes back as
+    // defaultDomainId/defaultSubdomain becoming undefined — re-running this
+    // effect on that change would immediately snap the selector back to the
+    // organization domain, making provided domains unselectable whenever one
+    // was already set.
+    const didSelectInitialDomainRef = useRef(false);
+
     useEffect(() => {
-        if (!loadingDomains) {
+        if (!loadingDomains && !didSelectInitialDomainRef.current) {
+            didSelectInitialDomainRef.current = true;
             let domainOptionToSelect: DomainOption | null = null;
             if (organizationDomains.length > 0) {
                 // Select the first organization domain or the one provided from props

src/components/OrgInfoCard.tsx

@@ -8,6 +8,7 @@ import {
     InfoSections,
     InfoSectionTitle
 } from "@app/components/InfoSection";
+import CopyToClipboard from "@app/components/CopyToClipboard";
 import { useTranslations } from "next-intl";
 
 type OrgInfoCardProps = {};
@@ -26,7 +27,9 @@ export default function OrgInfoCard({}: OrgInfoCardProps) {
                     </InfoSection>
                     <InfoSection>
                         <InfoSectionTitle>{t("orgId")}</InfoSectionTitle>
-                        <InfoSectionContent>{org.org.orgId}</InfoSectionContent>
+                        <InfoSectionContent>
+                            <CopyToClipboard text={org.org.orgId} />
+                        </InfoSectionContent>
                     </InfoSection>
                     <InfoSection>
                         <InfoSectionTitle>{t("subnet")}</InfoSectionTitle>

src/components/OrgRolesTagField.tsx

@@ -9,17 +9,15 @@ import {
     FormMessage
 } from "@app/components/ui/form";
 
-import { toast } from "@app/hooks/useToast";
 import { useTranslations } from "next-intl";
 
-import { useRef } from "react";
 import type { FieldValues, Path, UseFormReturn } from "react-hook-form";
 import { RolesSelector, type SelectedRole } from "./roles-selector";
 
 type OrgRolesTagFieldProps<TFieldValues extends FieldValues> = {
     form: Pick<
         UseFormReturn<TFieldValues>,
-        "control" | "getValues" | "setValue"
+        "control" | "getValues" | "setValue" | "clearErrors"
     >;
     orgId: string;
     /** Field in the form that holds Tag[] (role tags). Default: `"roles"`. */
@@ -42,46 +40,6 @@ export default function OrgRolesTagField<TFieldValues extends FieldValues>({
     disabled
 }: OrgRolesTagFieldProps<TFieldValues>) {
     const t = useTranslations();
-    const isPopoverOpenRef = useRef(false);
-    const lastValidRolesRef = useRef<SelectedRole[]>(
-        (form.getValues(name) as SelectedRole[]) ?? []
-    );
-
-    function validateRolesSelection() {
-        const current = form.getValues(name) as SelectedRole[];
-
-        if (current.length === 0 && lastValidRolesRef.current.length > 0) {
-            form.setValue(name, lastValidRolesRef.current as never, {
-                shouldDirty: true
-            });
-            toast({
-                variant: "destructive",
-                title: t("accessRoleRequired"),
-                description: t("accessRoleSelectPlease")
-            });
-            return false;
-        }
-
-        if (current.length > 0) {
-            lastValidRolesRef.current = current;
-        }
-
-        return true;
-    }
-
-    function handlePopoverOpenChange(open: boolean) {
-        isPopoverOpenRef.current = open;
-
-        if (open) {
-            const current = form.getValues(name) as SelectedRole[];
-            if (current.length > 0) {
-                lastValidRolesRef.current = current;
-            }
-            return;
-        }
-
-        validateRolesSelection();
-    }
 
     function setRoleTags(nextValue: SelectedRole[]) {
         const prev = form.getValues(name) as SelectedRole[];
@@ -99,15 +57,14 @@ export default function OrgRolesTagField<TFieldValues extends FieldValues>({
             form.setValue(name, [prev[prev.length - 1]] as never, {
                 shouldDirty: true
             });
+            form.clearErrors(name);
             return;
         }
 
         form.setValue(name, next as never, { shouldDirty: true });
 
-        if (next.length > 0 && !isPopoverOpenRef.current) {
-            lastValidRolesRef.current = next;
-        } else if (!isPopoverOpenRef.current) {
-            validateRolesSelection();
+        if (next.length > 0) {
+            form.clearErrors(name);
         }
     }
 
@@ -117,9 +74,6 @@ export default function OrgRolesTagField<TFieldValues extends FieldValues>({
             name={name}
             render={({ field }) => {
                 const selectedRoles = (field.value ?? []) as SelectedRole[];
-                if (!isPopoverOpenRef.current && selectedRoles.length > 0) {
-                    lastValidRolesRef.current = selectedRoles;
-                }
 
                 return (
                     <FormItem className="flex flex-col items-start">
@@ -129,7 +83,6 @@ export default function OrgRolesTagField<TFieldValues extends FieldValues>({
                                 orgId={orgId}
                                 selectedRoles={selectedRoles}
                                 onSelectRoles={setRoleTags}
-                                onPopoverOpenChange={handlePopoverOpenChange}
                                 disabled={disabled}
                             />
                         </FormControl>

src/components/PermissionsSelectBox.tsx

@@ -115,8 +115,11 @@ function getActionsCategories(root: boolean) {
         },
 
         "Resource Policy": {
+            [t("actionListResourcePolicies")]: "listResourcePolicies",
+            [t("actionCreateResourcePolicy")]: "createResourcePolicy",
             [t("actionGetResourcePolicy")]: "getResourcePolicy",
             [t("actionUpdateResourcePolicy")]: "updateResourcePolicy",
+            [t("actionDeleteResourcePolicy")]: "deleteResourcePolicy",
             [t("actionSetResourcePolicyUsers")]: "setResourcePolicyUsers",
             [t("actionSetResourcePolicyRoles")]: "setResourcePolicyRoles",
             [t("actionSetResourcePolicyPassword")]: "setResourcePolicyPassword",