@tellescope/chat 0.0.43 → 0.0.46

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tellescope/chat",
-  "version": "0.0.43",
+  "version": "0.0.46",
   "description": "",
   "main": "./lib/cjs/index.js",
   "module": "./lib/esm/index.js",
@@ -33,13 +33,13 @@
     "@fontsource/roboto": "^4.5.1",
     "@mui/icons-material": "^5.0.1",
     "@mui/material": "^5.0.2",
-    "@tellescope/constants": "^0.0.43",
-    "@tellescope/react-components": "^0.0.43",
-    "@tellescope/sdk": "^0.0.43",
-    "@tellescope/types-client": "^0.0.43",
-    "@tellescope/types-models": "^0.0.43",
-    "@tellescope/types-utilities": "^0.0.43",
-    "@tellescope/utilities": "^0.0.43",
+    "@tellescope/constants": "^0.0.46",
+    "@tellescope/react-components": "^0.0.46",
+    "@tellescope/sdk": "^0.0.46",
+    "@tellescope/types-client": "^0.0.46",
+    "@tellescope/types-models": "^0.0.46",
+    "@tellescope/types-utilities": "^0.0.46",
+    "@tellescope/utilities": "^0.0.46",
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
     "eslint": "^7.32.0",
@@ -50,7 +50,7 @@
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   },
-  "gitHead": "d53e712c2656de4b012c1e3ff2eb5ee8e80c653d",
+  "gitHead": "0e3c8c86f517e6efbb54b12688f8983e5dff3909",
   "publishConfig": {
     "access": "public"
   }

package/src/chat.tsx

@@ -243,14 +243,16 @@ const defaultMessagePreviewStyle: CSSProperties = {
 }
 
 export interface ConversationPreviewProps {
-  onClick?: (room: ChatRoom) => void;
   room: ChatRoom;
+  displayInfo: { [index: string]: UserDisplayInfo };
+  onClick?: (room: ChatRoom) => void;
   selected?: boolean;
-  resolveSenderName?: (room: ChatRoom) => React.ReactNode; 
   style?: CSSProperties;
   selectedStyle?: CSSProperties;
 }
 
+type PreviewComponentType = React.JSXElementConstructor<ConversationPreviewProps> 
+
 interface SidebarInfo {
   selectedRoom?: string;
   onRoomSelect: (roomId: string) => void;
@@ -258,16 +260,16 @@ interface SidebarInfo {
   selectedItemStyle?: CSSProperties;
   itemStyle?: CSSProperties;
   nameStyle?: CSSProperties;
-  PreviewComponent?: React.JSXElementConstructor<ConversationPreviewProps>
+  PreviewComponent?: PreviewComponentType,
   previewStyle?: CSSProperties;
 }
 
-const ConversationPreview = ({ onClick, selected, room, resolveSenderName, style, selectedStyle }: ConversationPreviewProps) => (
+const ConversationPreview = ({ onClick, selected, room, style, selectedStyle }: ConversationPreviewProps) => (
   <Flex flex={1} column onClick={() => !selected && onClick?.(room)} 
     style={selected ? (selectedStyle ?? defaultSidebarItemStyleSelected) : (style ?? defaultSidebarItemStyle) }
   >
     <Typography style={defaultMessageNameStyle}>
-      <Resolver item={room} resolver={resolveSenderName ?? (() => room.id)}/>
+
     </Typography>
 
     <Typography style={defaultMessagePreviewStyle}>
@@ -276,56 +278,39 @@ const ConversationPreview = ({ onClick, selected, room, resolveSenderName, style
   </Flex>
 )
 
+const PreviewWithData = ({ PreviewComponent=ConversationPreview, ...props }: Omit<ConversationPreviewProps, 'displayInfo'> & Pick<SidebarInfo, 'PreviewComponent'>) => {
+  const session = useResolvedSession()
+  const [displayInfo] = useChatRoomDisplayInfo(props.room.id, session.type)
+
+  return (
+    <PreviewComponent displayInfo={value_is_loaded(displayInfo) ? displayInfo.value : {} } 
+      {...props} 
+    />
+  )
+}
+
 interface ConversationsProps extends SidebarInfo {
-  resolveSenderName: (r: ChatRoom) => string;
   rooms: LoadedData<ChatRoom[]>;
 }
-export const Conversations = ({ rooms, selectedRoom, onRoomSelect, resolveSenderName, PreviewComponent=ConversationPreview, style, selectedItemStyle, itemStyle } : ConversationsProps) => ( 
-  <LoadingLinear data={rooms} render={rooms =>
-    <List style={style ?? defaultSidebarStyle} items={rooms} onClick={r => onRoomSelect(r.id)} render={(room, { onClick, index }) => 
-      <PreviewComponent key={room.id} room={room} onClick={onClick} selected={selectedRoom === room.id} 
-        resolveSenderName={resolveSenderName ?? (() => room.id)}
-        selectedStyle={selectedItemStyle} style={itemStyle}
-      />
-    }/>    
-  }/>
-)
-
-
-export const EndusersConversations = ({ enduserId, ...p } : SidebarInfo & { enduserId: string }) => {
-  const [rooms] = useChatRooms('enduser')
-  const [displayNames] = useUserDisplayInfo()
-
-  const resolveChatName = useCallback((r: ChatRoom) => {
-    if (r.title) return r.title
+export const Conversations = ({ rooms, selectedRoom, onRoomSelect, PreviewComponent=ConversationPreview, style, selectedItemStyle, itemStyle } : ConversationsProps) => {
 
-    if (displayNames.status === LoadingStatus.Loaded) {
-      const user = displayNames.value.find(u => u.id === r.userIds?.[0])
-      if (user) return user_display_name(user)
-    }
-    return ''
-  }, [displayNames])
-
-  return <Conversations {...p} rooms={rooms} resolveSenderName={resolveChatName}/>
+  return ( 
+    <LoadingLinear data={rooms} render={rooms =>
+      <List style={style ?? defaultSidebarStyle} items={rooms} onClick={r => onRoomSelect(r.id)} render={(room, { onClick, index }) => 
+        <PreviewWithData key={room.id} room={room} onClick={onClick} selected={selectedRoom === room.id} 
+          selectedStyle={selectedItemStyle} style={itemStyle} PreviewComponent={PreviewComponent}
+        />
+      }/>    
+    }/>
+  )
 }
 
-export const UsersConversations = ({ userId, ...p } : SidebarInfo & { userId: string }) => {
-  const [rooms] = useChatRooms('user')
-  const [endusers] = useEndusers()
 
-  const resolveChatName = useCallback((r: ChatRoom) => {
-    if (r.title) return r.title
-    
-    if (endusers.status === LoadingStatus.Loaded) {
-      const enduser = endusers.value.find(e => e.id ===  r.enduserIds?.[0])   
-      if (enduser) return user_display_name(enduser)
-    }
+// deprecated while Conversations relies on useResolvedSession
+export const EndusersConversations = ({ enduserId, ...p } : SidebarInfo & { enduserId: string }) => <Conversations {...p} rooms={useChatRooms('enduser')[0]} />
 
-    return ''
-  }, [endusers])
-
-  return <Conversations {...p} rooms={rooms} resolveSenderName={resolveChatName}/>
-}
+// deprecated while Conversations relies on useResolvedSession
+export const UsersConversations = ({ userId, ...p } : SidebarInfo & { userId: string }) => <Conversations {...p} rooms={useChatRooms('user')[0]}/>
 
 interface SendMessage_T {
   type: SessionType,