feat: display user email below name in multi-member-select dropdown

- Added email field to user items mapping
- Updated renderMultiSelectOption to show email in smaller, dimmed text
- Email only displays for user type options, not groups

apps/client/src/features/editor/page-editor.tsx

@@ -1,5 +1,10 @@
 import "@/features/editor/styles/index.css";
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import React, {
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import { IndexeddbPersistence } from "y-indexeddb";
 import * as Y from "yjs";
 import {
@@ -126,15 +131,7 @@ export default function PageEditor({
           const now = Date.now().valueOf() / 1000;
           const isTokenExpired = now >= payload.exp;
           if (isTokenExpired) {
-            refetchCollabToken().then((result) => {
-              if (result.data?.token) {
-                remote.disconnect();
-                setTimeout(() => {
-                  remote.configuration.token = result.data.token;
-                  remote.connect();
-                }, 100);
-              }
-            });
+            refetchCollabToken();
           }
         },
         onStatus: (status) => {
@@ -160,21 +157,6 @@ export default function PageEditor({
     };
   }, [pageId]);
 
-  /*
-  useEffect(() => {
-    // Handle token updates by reconnecting with new token
-    if (providersRef.current?.remote && collabQuery?.token) {
-      const currentToken = providersRef.current.remote.configuration.token;
-      if (currentToken !== collabQuery.token) {
-        // Token has changed, need to reconnect with new token
-        providersRef.current.remote.disconnect();
-        providersRef.current.remote.configuration.token = collabQuery.token;
-        providersRef.current.remote.connect();
-      }
-    }
-  }, [collabQuery?.token]);
-   */
-
   // Only connect/disconnect on tab/idle, not destroy
   useEffect(() => {
     if (!providersReady || !providersRef.current) return;
@@ -369,10 +351,7 @@ export default function PageEditor({
     <div style={{ position: "relative" }}>
       <div ref={menuContainerRef}>
         <EditorContent editor={editor} />
-
-        {editor && (
-          <SearchAndReplaceDialog editor={editor} editable={editable} />
-        )}
+        <SearchAndReplaceDialog editor={editor} editable={editable} />
 
         {editor && editor.isEditable && (
           <div>

apps/client/src/features/space/components/multi-member-select.tsx

@@ -26,6 +26,9 @@ const renderMultiSelectOption: MultiSelectProps["renderOption"] = ({
     {option["type"] === "group" && <IconGroupCircle />}
     <div>
       <Text size="sm" lineClamp={1}>{option.label}</Text>
+      {option["type"] === "user" && option["email"] && (
+        <Text size="xs" c="dimmed" lineClamp={1}>{option["email"]}</Text>
+      )}
     </div>
   </Group>
 );
@@ -47,6 +50,7 @@ export function MultiMemberSelect({ onChange }: MultiMemberSelectProps) {
       const userItems = suggestion?.users.map((user: IUser) => ({
         value: `user-${user.id}`,
         label: user.name,
+        email: user.email,
         avatarUrl: user.avatarUrl,
         type: "user",
       }));

apps/server/src/core/search/search.service.ts

@@ -140,7 +140,7 @@ export class SearchService {
     if (suggestion.includeUsers) {
       users = await this.db
         .selectFrom('users')
-        .select(['id', 'name', 'avatarUrl'])
+        .select(['id', 'name', 'email', 'avatarUrl'])
         .where((eb) => eb(sql`LOWER(users.name)`, 'like', `%${query}%`))
         .where('workspaceId', '=', workspaceId)
         .where('deletedAt', 'is', null)