Updated conversations/communities list ui

apps/web/src/features/conversation/modal/conversation.tsx

@@ -8,55 +8,26 @@ import {
   ContextMenuTrigger,
 } from "@tensamin/ui/cmp/context-menu";
 import { useNavigate } from "@tanstack/react-router";
-import { type User } from "@tensamin/user/context";
 
-/**
- * Renders the conversation modal user preview card.
- * @param user Loaded user data.
- * @returns Conversation preview card JSX.
- */
-function renderConversationUser(user: User) {
-  return <Basic user={user} />;
-}
-
-/**
- * Renders the conversation modal user preview card skeleton while loading user data.
- * @returns Conversation preview card skeleton JSX.
- */
-function renderConversationUserLoading() {
-  return <Loading />;
-}
-
-/**
- * Renders a conversation context-menu entry for a specific user.
- * @param props Component props with selected user id.
- * @returns Conversation modal trigger and menu JSX.
- */
-export default function ConversationModal(props: { userId: number }) {
+export default function ConversationModal({ userId }: { userId: number }) {
   const navigate = useNavigate();
 
-  /**
-   * Navigates to the selected conversation in chat view.
-   * @returns Void.
-   */
-  const onConversationClick = () => {
-    void navigate({ to: "/chat", search: { id: props.userId } });
-  };
-
   return (
     <ContextMenu>
-      <ContextMenuTrigger>
-        <div
-          className="select-none cursor-pointer"
-          onClick={onConversationClick}
-        >
-          <Wrapper
-            loading={renderConversationUserLoading()}
-            userId={props.userId}
-            component={renderConversationUser}
-          />
-        </div>
-      </ContextMenuTrigger>
+      <ContextMenuTrigger
+        render={
+          <div
+            className="select-none cursor-pointer"
+            onClick={() => navigate({ to: "/chat", search: { id: userId } })}
+          >
+            <Wrapper
+              loading={<Loading />}
+              userId={userId}
+              component={(user) => <Basic user={user} />}
+            />
+          </div>
+        }
+      ></ContextMenuTrigger>
       <ContextMenuContent>
         <ContextMenuGroup>
           <ContextMenuItem>Test</ContextMenuItem>