Merge pull request #954 from Nishant-k-sagar/issue-903-img-to-next-image

perf: replace img with Next.js Image for avatars
This commit is contained in:
Rohan Verma 2026-03-24 20:34:41 -07:00 committed by GitHub
commit c2bcc038dc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 8 additions and 2 deletions

View file

@ -1,6 +1,7 @@
import { ActionBarPrimitive, MessagePrimitive, useAssistantState } from "@assistant-ui/react"; import { ActionBarPrimitive, MessagePrimitive, useAssistantState } from "@assistant-ui/react";
import { useAtomValue } from "jotai"; import { useAtomValue } from "jotai";
import { FileText, Pen } from "lucide-react"; import { FileText, Pen } from "lucide-react";
import Image from "next/image";
import { type FC, useState } from "react"; import { type FC, useState } from "react";
import { messageDocumentsMapAtom } from "@/atoms/chat/mentioned-documents.atom"; import { messageDocumentsMapAtom } from "@/atoms/chat/mentioned-documents.atom";
import { TooltipIconButton } from "@/components/assistant-ui/tooltip-icon-button"; import { TooltipIconButton } from "@/components/assistant-ui/tooltip-icon-button";
@ -24,9 +25,11 @@ const UserAvatar: FC<AuthorMetadata> = ({ displayName, avatarUrl }) => {
if (avatarUrl && !hasError) { if (avatarUrl && !hasError) {
return ( return (
<img <Image
src={avatarUrl} src={avatarUrl}
alt={displayName || "User"} alt={displayName || "User"}
width={32}
height={32}
className="size-8 rounded-full object-cover" className="size-8 rounded-full object-cover"
referrerPolicy="no-referrer" referrerPolicy="no-referrer"
onError={() => setHasError(true)} onError={() => setHasError(true)}

View file

@ -8,6 +8,7 @@ import {
useAssistantState, useAssistantState,
} from "@assistant-ui/react"; } from "@assistant-ui/react";
import { CheckIcon, CopyIcon } from "lucide-react"; import { CheckIcon, CopyIcon } from "lucide-react";
import Image from "next/image";
import { type FC, type ReactNode, useState } from "react"; import { type FC, type ReactNode, useState } from "react";
import { MarkdownText } from "@/components/assistant-ui/markdown-text"; import { MarkdownText } from "@/components/assistant-ui/markdown-text";
import { ToolFallback } from "@/components/assistant-ui/tool-fallback"; import { ToolFallback } from "@/components/assistant-ui/tool-fallback";
@ -75,9 +76,11 @@ const UserAvatar: FC<AuthorMetadata & { hasError: boolean; onError: () => void }
if (avatarUrl && !hasError) { if (avatarUrl && !hasError) {
return ( return (
<img <Image
src={avatarUrl} src={avatarUrl}
alt={displayName || "User"} alt={displayName || "User"}
width={32}
height={32}
className="size-8 rounded-full object-cover" className="size-8 rounded-full object-cover"
referrerPolicy="no-referrer" referrerPolicy="no-referrer"
onError={onError} onError={onError}