Refactor team accounts feature and improve form validation

Updated several components within the team accounts feature to use more specific schema definitions and provide clearer form validation. Several schema files were renamed to better reflect their usage and additional properties were included. The commit also introduces handling for a new accountId property, which provides more accurate user account tracking. Autocomplete was turned off on deletion actions for better security. Changes related to account ownership transfer were also made, including transaction logging and error handling improvements.

packages/features/team-accounts/src/components/members/account-members-table.tsx

@@ -37,6 +37,7 @@ interface Permissions {
 type AccountMembersTableProps = {
   members: Members;
   currentUserId: string;
+  currentAccountId: string;
   userRoleHierarchy: number;
   isPrimaryOwner: boolean;
   canManageRoles: boolean;
@@ -45,6 +46,7 @@ type AccountMembersTableProps = {
 export function AccountMembersTable({
   members,
   currentUserId,
+  currentAccountId,
   isPrimaryOwner,
   userRoleHierarchy,
   canManageRoles,
@@ -60,7 +62,10 @@ export function AccountMembersTable({
     canTransferOwnership: isPrimaryOwner,
   };
 
-  const columns = useGetColumns(permissions, currentUserId);
+  const columns = useGetColumns(permissions, {
+    currentUserId,
+    currentAccountId,
+  });
 
   const filteredMembers = members.filter((member) => {
     const searchString = search.toLowerCase();
@@ -87,7 +92,10 @@ export function AccountMembersTable({
 
 function useGetColumns(
   permissions: Permissions,
-  currentUserId: string,
+  params: {
+    currentUserId: string;
+    currentAccountId: string;
+  },
 ): ColumnDef<Members[0]>[] {
   const { t } = useTranslation('teams');
 
@@ -99,7 +107,7 @@ function useGetColumns(
         cell: ({ row }) => {
           const member = row.original;
           const displayName = member.name ?? member.email.split('@')[0];
-          const isSelf = member.user_id === currentUserId;
+          const isSelf = member.user_id === params.currentUserId;
 
           return (
             <span className={'flex items-center space-x-4 text-left'}>
@@ -168,12 +176,13 @@ function useGetColumns(
           <ActionsDropdown
             permissions={permissions}
             member={row.original}
-            currentUserId={currentUserId}
+            currentUserId={params.currentUserId}
+            accountId={params.currentAccountId}
           />
         ),
       },
     ],
-    [permissions, currentUserId, t],
+    [t, params, permissions],
   );
 }
 
@@ -181,10 +190,12 @@ function ActionsDropdown({
   permissions,
   member,
   currentUserId,
+  accountId,
 }: {
   permissions: Permissions;
   member: Members[0];
   currentUserId: string;
+  accountId: string;
 }) {
   const [isRemoving, setIsRemoving] = useState(false);
   const [isTransferring, setIsTransferring] = useState(false);
@@ -268,7 +279,7 @@ function ActionsDropdown({
           isOpen
           setIsOpen={setIsTransferring}
           targetDisplayName={member.name ?? member.email}
-          accountId={member.id}
+          accountId={accountId}
           userId={member.user_id}
         />
       </If>

packages/features/team-accounts/src/components/members/transfer-ownership-dialog.tsx

@@ -77,25 +77,12 @@ function TransferOrganizationOwnershipForm({
   const [pending, startTransition] = useTransition();
   const [error, setError] = useState<boolean>();
 
-  const onSubmit = () => {
-    startTransition(async () => {
-      try {
-        await transferOwnershipAction({
-          accountId,
-          userId,
-        });
-
-        setIsOpen(false);
-      } catch (error) {
-        setError(true);
-      }
-    });
-  };
-
   const form = useForm({
     resolver: zodResolver(TransferOwnershipConfirmationSchema),
     defaultValues: {
       confirmation: '',
+      accountId,
+      userId,
     },
   });
 
@@ -103,7 +90,17 @@ function TransferOrganizationOwnershipForm({
     <Form {...form}>
       <form
         className={'flex flex-col space-y-4 text-sm'}
-        onSubmit={form.handleSubmit(onSubmit)}
+        onSubmit={form.handleSubmit((data) => {
+          startTransition(async () => {
+            try {
+              await transferOwnershipAction(data);
+
+              setIsOpen(false);
+            } catch (error) {
+              setError(true);
+            }
+          });
+        })}
       >
         <If condition={error}>
           <TransferOwnershipErrorAlert />
@@ -129,7 +126,12 @@ function TransferOrganizationOwnershipForm({
                 </FormLabel>
 
                 <FormControl>
-                  <Input type={'text'} required {...field} />
+                  <Input
+                    autoComplete={'off'}
+                    type={'text'}
+                    required
+                    {...field}
+                  />
                 </FormControl>
 
                 <FormDescription>
@@ -176,11 +178,11 @@ function TransferOwnershipErrorAlert() {
   return (
     <Alert variant={'destructive'}>
       <AlertTitle>
-        <Trans i18nKey={'teams:transferOrganizationErrorHeading'} />
+        <Trans i18nKey={'teams:transferTeamErrorHeading'} />
       </AlertTitle>
 
       <AlertDescription>
-        <Trans i18nKey={'teams:transferOrganizationErrorMessage'} />
+        <Trans i18nKey={'teams:transferTeamErrorMessage'} />
       </AlertDescription>
     </Alert>
   );

packages/features/team-accounts/src/components/members/update-member-role-dialog.tsx

@@ -25,7 +25,7 @@ import {
 import { If } from '@kit/ui/if';
 import { Trans } from '@kit/ui/trans';
 
-import { UpdateRoleSchema } from '../../schema/update-role-schema';
+import { RoleSchema } from '../../schema/update-member-role-schema';
 import { updateMemberRoleAction } from '../../server/actions/team-members-server-actions';
 import { MembershipRoleSelector } from './membership-role-selector';
 import { RolesDataProvider } from './roles-data-provider';
@@ -107,7 +107,7 @@ function UpdateMemberForm({
 
   const form = useForm({
     resolver: zodResolver(
-      UpdateRoleSchema.refine(
+      RoleSchema.refine(
         (data) => {
           return data.role !== userRole;
         },