B2B-30: adds personal code to account, company admins invites members

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

@@ -87,7 +87,8 @@ export function AccountMembersTable({
 
       return (
         displayName.includes(searchString) ||
-        member.role.toLowerCase().includes(searchString)
+        member.role.toLowerCase().includes(searchString) || 
+        (member.personal_code || '').includes(searchString)
       );
     })
     .sort((prev, next) => {
@@ -160,6 +161,13 @@ function useGetColumns(
           return row.original.email ?? '-';
         },
       },
+      {
+        header: t('personalCode'),
+        accessorKey: 'personal_code',
+        cell: ({ row }) => {
+          return row.original.personal_code ?? '-';
+        },
+      },
       {
         header: t('roleLabel'),
         cell: ({ row }) => {

packages/features/team-accounts/src/components/members/invite-members-dialog-container.tsx

@@ -66,7 +66,7 @@ export function InviteMembersDialogContainer({
     <Dialog open={isOpen} onOpenChange={setIsOpen} modal>
       <DialogTrigger asChild>{children}</DialogTrigger>
 
-      <DialogContent onInteractOutside={(e) => e.preventDefault()}>
+      <DialogContent className="max-w-[800px]" onInteractOutside={(e) => e.preventDefault()}>
         <DialogHeader>
           <DialogTitle>
             <Trans i18nKey={'teams:inviteMembersHeading'} />
@@ -142,13 +142,39 @@ function InviteMembersForm({
           {fieldArray.fields.map((field, index) => {
             const isFirst = index === 0;
 
+            const personalCodeInputName = `invitations.${index}.personal_code` as const;
             const emailInputName = `invitations.${index}.email` as const;
             const roleInputName = `invitations.${index}.role` as const;
 
             return (
               <div data-test={'invite-member-form-item'} key={field.id}>
                 <div className={'flex items-end gap-x-1 md:space-x-2'}>
-                  <div className={'w-7/12'}>
+                  <div className={'w-4/12'}>
+                    <FormField
+                      name={personalCodeInputName}
+                      render={({ field }) => {
+                        return (
+                          <FormItem>
+                            <If condition={isFirst}>
+                              <FormLabel>{t('Personal code')}</FormLabel>
+                            </If>
+
+                            <FormControl>
+                              <Input
+                                placeholder={t('personalCode')}
+                                type="text"
+                                required
+                                {...field}
+                              />
+                            </FormControl>
+
+                            <FormMessage />
+                          </FormItem>
+                        );
+                      }}
+                    />
+                  </div>
+                  <div className={'w-4/12'}>
                     <FormField
                       name={emailInputName}
                       render={({ field }) => {
@@ -273,5 +299,5 @@ function InviteMembersForm({
 }
 
 function createEmptyInviteModel() {
-  return { email: '', role: 'member' as Role };
+  return { email: '', role: 'member' as Role, personal_code: '' };
 }