feat(group): add to group combobox working

seed-hypermedia · Nov 23, 2023 · 914c4fa · 914c4fa
1 parent a930db7
commit 914c4fa
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 7 deletions.
diff --git a/frontend/packages/app/components/accounts-combobox.css b/frontend/packages/app/components/accounts-combobox.css
@@ -10,7 +10,7 @@
 .combobox {
   font-family: var(--f-fa);
   appearance: none;
-  height: 2.5rem;
+  height: 2rem;
   /* width: 250px;  */
   border-radius: 0.375rem;
   border-style: none;

diff --git a/frontend/packages/app/pages/group.tsx b/frontend/packages/app/pages/group.tsx
@@ -676,7 +676,10 @@ function InviteMemberDialog({
             {matches.length == 0 ? (
               <TagInputItem
                 onClick={() => {
-                  setMemberSelection((values) => [...values, value])
+                  let unpackedId = unpackHmId(value)
+                  if (unpackedId && unpackedId.type == 'a') {
+                    setMemberSelection((values) => [...values, unpackedId.eid])
+                  }
                 }}
               >
                 Add &quot;{value}&quot;
@@ -934,6 +937,10 @@ export const TagInput = forwardRef<HTMLInputElement, TagInputProps>(
         >
           {selectedValues.map((value) => {
             let account = accountsMap[value]
+            let alias =
+              account && account.profile?.alias ? account.profile.alias : value
+            let avatar =
+              account && account.profile?.avatar ? account.profile.avatar : '?'
             return (
 <<<<<<< HEAD
               <AccountCard accountId={value} key={value}>
@@ -970,6 +977,7 @@ export const TagInput = forwardRef<HTMLInputElement, TagInputProps>(
                   <XStack
                     gap="$2"
                     padding="$1.5"
+                    minHeight="2rem"
                     borderRadius="$1"
                     backgroundColor="$backgroundFocus"
                     borderColor="$borderColor"
@@ -982,14 +990,16 @@ export const TagInput = forwardRef<HTMLInputElement, TagInputProps>(
                 }
               >
                 <UIAvatar
-                  label={account?.alias}
+                  label={alias}
                   id={value}
-                  url={`${BACKEND_FILE_URL}/${account.profile?.avatar}`}
+                  url={avatar ? `${BACKEND_FILE_URL}/${avatar}` : undefined}
                 />
                 <SizableText size="$3">
-                  {account?.alias
-                    ? account.alias
-                    : `${value?.slice(0, 5)}...${value?.slice(-5)}`}
+                  {alias
+                    ? alias
+                    : value.length > 20
+                    ? `${value?.slice(0, 5)}...${value?.slice(-5)}`
+                    : value}
                 </SizableText>
                 {/* <span className="tag-remove"></span> */}
                 <X size={12} />