@repzo/widget-react-native 1.0.5 → 1.0.7

package/src/ui/screens/chat/ChatView.tsx

@@ -45,6 +45,7 @@ import { AttachmentChips } from '../../components/AttachmentChips';
 import { AttachmentMenu, showNativeAttachmentMenu } from '../../components/AttachmentMenu';
 import { Avatar } from '../../components/Avatar';
 import { ImageViewer } from '../../components/ImageViewer';
+import { getRatingRequest, RatingCard } from '../../components/RatingCard';
 import { WidgetErrorBoundary } from '../../components/ErrorBoundary';
 import { GradientBackground } from '../../components/Gradient';
 import { ArrowUpIcon, ChatOutlineIcon, ChevronIcon, ClockIcon, PaperclipIcon } from '../../components/icons';
@@ -82,6 +83,8 @@ export function ChatView({
   onPickAttachments,
   onSendMessage,
   onIdentifyVisitor,
+  onRateConversation,
+  defaultLocale,
   onLoadMore,
   onTyping,
   onBack,
@@ -489,6 +492,8 @@ export function ChatView({
                   color={color}
                   labels={labels}
                   onOpenImage={setViewerImage}
+                  onRateConversation={onRateConversation}
+                  locales={[locale, defaultLocale]}
                   senderLabel={
                     isAgentMessage && (startsRun || startsDay)
                       ? message.senderName || agentName || labels.team
@@ -640,6 +645,8 @@ function MessageBubble({
   onSubmitProcedureForm,
   onAgentUiAction,
   onOpenImage,
+  onRateConversation,
+  locales,
 }: {
   message: Message;
   color: string;
@@ -650,6 +657,8 @@ function MessageBubble({
   onSubmitProcedureForm?: (body: string) => void;
   onAgentUiAction?: (action: AgentUiAction) => void | Promise<void>;
   onOpenImage: (image: { url: string; name: string }) => void;
+  onRateConversation?: ChatViewProps['onRateConversation'];
+  locales: Array<string | null | undefined>;
 }) {
   const joinedName = message.metadata?.event === 'agent_joined' ? message.metadata?.agentName : null;
   if (message.messageType === 'system' && typeof joinedName === 'string' && joinedName) {
@@ -668,6 +677,23 @@ function MessageBubble({
     );
   }
 
+  const ratingRequest = message.messageType === 'system' ? getRatingRequest(message.metadata) : null;
+  if (ratingRequest) {
+    return (
+      <RatingCard
+        ratingId={ratingRequest.ratingId}
+        initialRating={ratingRequest.rating}
+        initialComment={ratingRequest.comment}
+        initialReason={ratingRequest.reason}
+        reasons={ratingRequest.reasons}
+        locales={locales}
+        color={color}
+        labels={labels.rating}
+        onRate={onRateConversation ? (ratingId, data) => onRateConversation(message.id, ratingId, data) : undefined}
+      />
+    );
+  }
+
   if (message.messageType === 'system') {
     const text = message.bodyPlain || stripHtml(message.body || '') || labels.conversationUpdated;
     return (

package/src/ui/screens/chat/ChatView.types.ts

@@ -5,11 +5,13 @@ import type { DraftAttachment, PickResult } from '../../../attachments/pickers';
 import type {
   AgentUiAction,
   AttachmentSource,
+  ConversationRatingResult,
   Message,
   OutgoingAttachment,
 } from '../../../types';
 import type { AgentUiBlockLabels } from '../../components/AgentUiBlocks';
 import type { ImageViewerLabels } from '../../components/ImageViewer';
+import type { RatingCardLabels } from '../../components/RatingCard';
 
 export interface ChatLabels {
   back: string;
@@ -34,6 +36,7 @@ export interface ChatLabels {
   procedureSend: string;
   procedureSent: string;
   blocks: AgentUiBlockLabels;
+  rating: RatingCardLabels;
   attach: AttachLabels;
   viewer: ImageViewerLabels;
 }
@@ -88,6 +91,14 @@ export interface ChatViewProps {
     action?: AgentUiAction
   ) => Promise<void>;
   onIdentifyVisitor?: (data: { email?: string; name?: string; phone?: string }) => Promise<void>;
+  /** Answers a rating card; rejects with the server error (409 locked, 410 expired). */
+  onRateConversation?: (
+    messageId: string,
+    ratingId: string,
+    data: { rating: number; reason?: string; comment?: string }
+  ) => Promise<ConversationRatingResult>;
+  /** The widget's default language — rating reasons fall back to it. */
+  defaultLocale?: string;
   onLoadMore: () => void;
   onTyping: (isTyping: boolean) => void;
   onBack: () => void;