@developer_tribe/react-native-comnyx 0.3.6 → 0.3.7

package/src/components/MessageItem.tsx

@@ -30,7 +30,7 @@ export function MessageItem({
   onShowPopup: () => void;
 }) {
   const themeColors = useThemeColors();
-  const isDeviceOwner = !!item.user;
+  const isDeviceOwner = !item.user && !item.bot;
   const formattedDate = new Date(item.created_at).toLocaleTimeString([], {
     hour: '2-digit',
     minute: '2-digit',
@@ -102,7 +102,7 @@ export function MessageItem({
   // A single line message with enough space for the timestamp
   const isSingleLineWithSpace =
     layoutRef.current.lines === 1 &&
-    layoutRef.current.lastLineWidth < layoutRef.current.totalWidth * 0.8;
+    layoutRef.current.lastLineWidth > layoutRef.current.totalWidth * 0.8;
 
   // For multi-line messages, check if the last line has space
   const isMultiLineWithSpace =
@@ -126,8 +126,8 @@ export function MessageItem({
         style={[
           styles.messageBubble,
           isDeviceOwner
-            ? [styles.rightBubble, { backgroundColor: themeColors.light_green }]
-            : [styles.leftBubble, { backgroundColor: themeColors.ghost }],
+            ? { backgroundColor: themeColors.light_green }
+            : { backgroundColor: themeColors.ghost },
         ]}
       >
         <View
@@ -173,7 +173,6 @@ export function MessageItem({
 
 const styles = ScaledSheet.create({
   messageItem: {
-    marginVertical: '5@vs',
     maxWidth: '80%',
     minHeight: 60,
     minWidth: 100,
@@ -189,12 +188,6 @@ const styles = ScaledSheet.create({
     paddingHorizontal: '12@s',
     borderRadius: '20@vs',
   },
-  leftBubble: {
-    borderTopLeftRadius: 4,
-  },
-  rightBubble: {
-    borderTopRightRadius: 4,
-  },
   inlineContainer: {
     flexDirection: 'row',
     justifyContent: 'space-between',
@@ -250,7 +243,6 @@ const styles = ScaledSheet.create({
     width: '12@vs',
     height: '12@vs',
     marginLeft: '4@s',
-    tintColor: '#000000',
   },
   infoIcon: {
     width: '12@vs',

package/src/constants/activeOpacity.ts

@@ -0,0 +1 @@
+export const activeOpacity = 0.8;

package/src/constants/translations.ts

@@ -3,11 +3,12 @@ import type { LanguageCode } from '../types/Language';
 
 export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
   en: {
-    'customer.form.title': 'Name',
-    'customer.form.email': 'Email',
-    'customer.form.phone': 'Phone',
+    'customer.form.title': 'Hello👋',
+    'customer.form.name': 'Your name',
+    'customer.form.email': 'Your e-mail address',
+    'customer.form.phone': 'Your phone number',
     'customer.form.country': 'Country',
-    'customer.form.submit': 'Submit',
+    'customer.form.submit': 'Contact Now',
     'customer.form.error': 'Please fill in all required fields',
     'customer.form.instructions':
       'Complete the form below to receive personalized service',
@@ -18,7 +19,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Enter your country',
     'customer.form.placeholder.email': 'Enter your email',
     'customer.form.placeholder.phone': 'Enter your phone number',
-    'chat.messageInput.placeholder': 'Type your message...',
+    'chat.messageInput.placeholder': 'Ask me a question...',
     'app.initialization.required': 'Please initialize first',
     'chat.load.error': 'Failed to load messages. Tap to retry',
     'chat.init.error': 'Failed to initialize chat. Tap to retry',
@@ -38,7 +39,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.resend': 'Resend',
     'chat.list-failed-message.title': 'Failed to send',
     'chat.list-failed-message.description':
-      "The message couldn't be sent veya Message failed to send. Please try again.",
+      "The message couldn't be sent. Please try again.",
     'chat.list-cancel': 'Cancel',
     'customer.form.failed.name': 'Wrong name',
     'customer.form.failed.name.desc': 'Please fix your name.',
@@ -46,13 +47,15 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email.desc': 'Please fix your email.',
     'customer.form.failed.phone': 'Wrong phone number',
     'customer.form.failed.phone.desc': 'Please fix your phone number.',
+    'customer.form.cancel': 'Close',
   },
   tr: {
-    'customer.form.title': 'Ad',
+    'customer.form.title': 'Merhaba👋',
+    'customer.form.name': 'Ad',
     'customer.form.email': 'E-posta',
     'customer.form.phone': 'Telefon',
     'customer.form.country': 'Ülke',
-    'customer.form.submit': 'Gönder',
+    'customer.form.submit': 'Şimdi İletişime Geç',
     'customer.form.error': 'Lütfen tüm zorunlu alanları doldurun',
     'customer.form.instructions':
       'Kişiselleştirilmiş hizmet almak için aşağıdaki formu doldurun',
@@ -63,7 +66,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Ülkenizi girin',
     'customer.form.placeholder.email': 'E-posta adresinizi girin',
     'customer.form.placeholder.phone': 'Telefon numaranızı girin',
-    'chat.messageInput.placeholder': 'Mesajınızı yazın...',
+    'chat.messageInput.placeholder': 'Bana bir soru sorun...',
     'app.initialization.required': 'Lütfen önce başlatın',
     'chat.load.error': 'Mesajlar yüklenemedi. Tekrar denemek için dokunun',
     'chat.init.error': 'Sohbet başlatılamadı. Tekrar denemek için dokunun',
@@ -91,13 +94,15 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email.desc': 'Lütfen e-posta adresinizi düzeltin.',
     'customer.form.failed.phone': 'Yanlış telefon numarası',
     'customer.form.failed.phone.desc': 'Lütfen telefon numaranızı düzeltin.',
+    'customer.form.cancel': 'Kapat',
   },
   es: {
-    'customer.form.title': 'Nombre',
+    'customer.form.title': 'Hola👋',
+    'customer.form.name': 'Nombre',
     'customer.form.email': 'Correo Electrónico',
     'customer.form.phone': 'Teléfono',
     'customer.form.country': 'País',
-    'customer.form.submit': 'Enviar',
+    'customer.form.submit': 'Contactar Ahora',
     'customer.form.error': 'Por favor complete todos los campos requeridos',
     'customer.form.instructions':
       'Complete el formulario a continuación para recibir un servicio personalizado',
@@ -108,7 +113,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Ingrese su país',
     'customer.form.placeholder.email': 'Ingrese su correo electrónico',
     'customer.form.placeholder.phone': 'Ingrese su número de teléfono',
-    'chat.messageInput.placeholder': 'Escribe tu mensaje...',
+    'chat.messageInput.placeholder': 'Hazme una pregunta...',
     'app.initialization.required': 'Por favor inicialice primero',
     'chat.load.error': 'Error al cargar mensajes. Toque para reintentar',
     'chat.init.error': 'Error al inicializar el chat. Toque para reintentar',
@@ -133,16 +138,20 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.name': 'Nombre incorrecto',
     'customer.form.failed.name.desc': 'Por favor corrija su nombre.',
     'customer.form.failed.email': 'Correo electrónico incorrecto',
-    'customer.form.failed.email.desc': 'Por favor corrija su correo electrónico.',
+    'customer.form.failed.email.desc':
+      'Por favor corrija su correo electrónico.',
     'customer.form.failed.phone': 'Número de teléfono incorrecto',
-    'customer.form.failed.phone.desc': 'Por favor corrija su número de teléfono.',
+    'customer.form.failed.phone.desc':
+      'Por favor corrija su número de teléfono.',
+    'customer.form.cancel': 'Cerrar',
   },
   fr: {
-    'customer.form.title': 'Nom',
+    'customer.form.title': 'Bonjour👋',
+    'customer.form.name': 'Nom',
     'customer.form.email': 'Email',
     'customer.form.phone': 'Téléphone',
     'customer.form.country': 'Pays',
-    'customer.form.submit': 'Envoyer',
+    'customer.form.submit': 'Contacter Maintenant',
     'customer.form.error': 'Veuillez remplir tous les champs obligatoires',
     'customer.form.instructions':
       'Complétez le formulaire ci-dessous pour recevoir un service personnalisé',
@@ -153,7 +162,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Entrez votre pays',
     'customer.form.placeholder.email': 'Entrez votre email',
     'customer.form.placeholder.phone': 'Entrez votre numéro de téléphone',
-    'chat.messageInput.placeholder': 'Tapez votre message...',
+    'chat.messageInput.placeholder': 'Posez-moi une question...',
     'app.initialization.required': "Veuillez initialiser d'abord",
     'chat.load.error':
       'Échec du chargement des messages. Appuyez pour réessayer',
@@ -173,23 +182,26 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'chat.live': 'Chat en Direct',
     'chat.support-team': 'Équipe de Support',
     'customer.form.resend': 'Renvoyer',
-    'chat.list-failed-message.title': 'Échec de l\'envoi',
+    'chat.list-failed-message.title': "Échec de l'envoi",
     'chat.list-failed-message.description':
-      'Le message n\'a pas pu être envoyé. Veuillez réessayer.',
+      "Le message n'a pas pu être envoyé. Veuillez réessayer.",
     'chat.list-cancel': 'Annuler',
     'customer.form.failed.name': 'Nom incorrect',
     'customer.form.failed.name.desc': 'Veuillez corriger votre nom.',
     'customer.form.failed.email': 'Email incorrect',
     'customer.form.failed.email.desc': 'Veuillez corriger votre email.',
     'customer.form.failed.phone': 'Numéro de téléphone incorrect',
-    'customer.form.failed.phone.desc': 'Veuillez corriger votre numéro de téléphone.',
+    'customer.form.failed.phone.desc':
+      'Veuillez corriger votre numéro de téléphone.',
+    'customer.form.cancel': 'Fermer',
   },
   de: {
-    'customer.form.title': 'Name',
+    'customer.form.title': 'Hallo👋',
+    'customer.form.name': 'Name',
     'customer.form.email': 'E-Mail',
     'customer.form.phone': 'Telefon',
     'customer.form.country': 'Land',
-    'customer.form.submit': 'Absenden',
+    'customer.form.submit': 'Jetzt Kontaktieren',
     'customer.form.error': 'Bitte füllen Sie alle erforderlichen Felder aus',
     'customer.form.instructions':
       'Füllen Sie das folgende Formular aus, um einen personalisierten Service zu erhalten',
@@ -200,7 +212,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Geben Sie Ihr Land ein',
     'customer.form.placeholder.email': 'Geben Sie Ihre E-Mail-Adresse ein',
     'customer.form.placeholder.phone': 'Geben Sie Ihre Telefonnummer ein',
-    'chat.messageInput.placeholder': 'Geben Sie Ihre Nachricht ein...',
+    'chat.messageInput.placeholder': 'Stellen Sie mir eine Frage...',
     'app.initialization.required': 'Bitte initialisieren Sie zuerst',
     'chat.load.error':
       'Nachrichten konnten nicht geladen werden. Tippen Sie zum Wiederholen',
@@ -230,14 +242,17 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email': 'Falsche E-Mail',
     'customer.form.failed.email.desc': 'Bitte korrigieren Sie Ihre E-Mail.',
     'customer.form.failed.phone': 'Falsche Telefonnummer',
-    'customer.form.failed.phone.desc': 'Bitte korrigieren Sie Ihre Telefonnummer.',
+    'customer.form.failed.phone.desc':
+      'Bitte korrigieren Sie Ihre Telefonnummer.',
+    'customer.form.cancel': 'Schließen',
   },
   it: {
-    'customer.form.title': 'Nome',
+    'customer.form.title': 'Ciao👋',
+    'customer.form.name': 'Nome',
     'customer.form.email': 'Email',
     'customer.form.phone': 'Telefono',
     'customer.form.country': 'Paese',
-    'customer.form.submit': 'Invia',
+    'customer.form.submit': 'Contatta Ora',
     'customer.form.error': 'Si prega di compilare tutti i campi obbligatori',
     'customer.form.instructions':
       'Completa il modulo sottostante per ricevere un servizio personalizzato',
@@ -248,7 +263,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Inserisci il tuo paese',
     'customer.form.placeholder.email': 'Inserisci la tua email',
     'customer.form.placeholder.phone': 'Inserisci il tuo numero di telefono',
-    'chat.messageInput.placeholder': 'Scrivi il tuo messaggio...',
+    'chat.messageInput.placeholder': 'Fammi una domanda...',
     'app.initialization.required': 'Si prega di inizializzare prima',
     'chat.load.error': 'Impossibile caricare i messaggi. Tocca per riprovare',
     'chat.init.error': 'Impossibile inizializzare la chat. Tocca per riprovare',
@@ -275,14 +290,17 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email': 'Email errata',
     'customer.form.failed.email.desc': 'Per favore correggi la tua email.',
     'customer.form.failed.phone': 'Numero di telefono errato',
-    'customer.form.failed.phone.desc': 'Per favore correggi il tuo numero di telefono.',
+    'customer.form.failed.phone.desc':
+      'Per favore correggi il tuo numero di telefono.',
+    'customer.form.cancel': 'Chiudi',
   },
   pt: {
-    'customer.form.title': 'Nome',
+    'customer.form.title': 'Olá👋',
+    'customer.form.name': 'Nome',
     'customer.form.email': 'Email',
     'customer.form.phone': 'Telefone',
     'customer.form.country': 'País',
-    'customer.form.submit': 'Enviar',
+    'customer.form.submit': 'Contactar Agora',
     'customer.form.error': 'Por favor, preencha todos os campos obrigatórios',
     'customer.form.instructions':
       'Complete o formulário abaixo para receber um serviço personalizado',
@@ -293,7 +311,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Digite seu país',
     'customer.form.placeholder.email': 'Digite seu email',
     'customer.form.placeholder.phone': 'Digite seu número de telefone',
-    'chat.messageInput.placeholder': 'Digite sua mensagem...',
+    'chat.messageInput.placeholder': 'Faça-me uma pergunta...',
     'app.initialization.required': 'Por favor, inicialize primeiro',
     'chat.load.error':
       'Falha ao carregar mensagens. Toque para tentar novamente',
@@ -322,14 +340,17 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email': 'Email incorreto',
     'customer.form.failed.email.desc': 'Por favor, corrija seu email.',
     'customer.form.failed.phone': 'Número de telefone incorreto',
-    'customer.form.failed.phone.desc': 'Por favor, corrija seu número de telefone.',
+    'customer.form.failed.phone.desc':
+      'Por favor, corrija seu número de telefone.',
+    'customer.form.cancel': 'Fechar',
   },
   ru: {
-    'customer.form.title': 'Имя',
+    'customer.form.title': 'Привет👋',
+    'customer.form.name': 'Имя',
     'customer.form.email': 'Электронная почта',
     'customer.form.phone': 'Телефон',
     'customer.form.country': 'Страна',
-    'customer.form.submit': 'Отправить',
+    'customer.form.submit': 'Связаться Сейчас',
     'customer.form.error': 'Пожалуйста, заполните все обязательные поля',
     'customer.form.instructions':
       'Заполните форму ниже, чтобы получить персонализированное обслуживание',
@@ -340,7 +361,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': 'Введите вашу страну',
     'customer.form.placeholder.email': 'Введите ваш email',
     'customer.form.placeholder.phone': 'Введите ваш номер телефона',
-    'chat.messageInput.placeholder': 'Введите ваше сообщение...',
+    'chat.messageInput.placeholder': 'Задайте мне вопрос...',
     'app.initialization.required': 'Пожалуйста, сначала инициализируйте',
     'chat.load.error':
       'Не удалось загрузить сообщения. Нажмите, чтобы повторить попытку',
@@ -369,14 +390,17 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email': 'Неверный email',
     'customer.form.failed.email.desc': 'Пожалуйста, исправьте ваш email.',
     'customer.form.failed.phone': 'Неверный номер телефона',
-    'customer.form.failed.phone.desc': 'Пожалуйста, исправьте ваш номер телефона.',
+    'customer.form.failed.phone.desc':
+      'Пожалуйста, исправьте ваш номер телефона.',
+    'customer.form.cancel': 'Закрыть',
   },
   ja: {
-    'customer.form.title': '名前',
+    'customer.form.title': 'こんにちは👋',
+    'customer.form.name': '名前',
     'customer.form.email': 'メールアドレス',
     'customer.form.phone': '電話番号',
     'customer.form.country': '国',
-    'customer.form.submit': '送信',
+    'customer.form.submit': '今すぐ連絡する',
     'customer.form.error': '必須項目をすべて入力してください',
     'customer.form.instructions':
       'パーソナライズされたサービスを受けるには、以下のフォームに記入してください',
@@ -387,7 +411,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': '国を入力してください',
     'customer.form.placeholder.email': 'メールアドレスを入力してください',
     'customer.form.placeholder.phone': '電話番号を入力してください',
-    'chat.messageInput.placeholder': 'メッセージを入力...',
+    'chat.messageInput.placeholder': '質問を入力してください...',
     'app.initialization.required': 'まず初期化してください',
     'chat.load.error': 'メッセージの読み込みに失敗しました。タップして再試行',
     'chat.init.error': 'チャットの初期化に失敗しました。タップして再試行',
@@ -415,13 +439,15 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email.desc': 'メールアドレスを修正してください。',
     'customer.form.failed.phone': '電話番号が間違っています',
     'customer.form.failed.phone.desc': '電話番号を修正してください。',
+    'customer.form.cancel': '閉じる',
   },
   zh: {
-    'customer.form.title': '姓名',
+    'customer.form.title': '你好👋',
+    'customer.form.name': '姓名',
     'customer.form.email': '电子邮件',
     'customer.form.phone': '电话',
     'customer.form.country': '国家',
-    'customer.form.submit': '提交',
+    'customer.form.submit': '立即联系',
     'customer.form.error': '请填写所有必填字段',
     'customer.form.instructions': '填写以下表格以获取个性化服务',
     'customer.form.error.country': '国家为必填项',
@@ -431,7 +457,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.placeholder.country': '请输入您的国家',
     'customer.form.placeholder.email': '请输入您的电子邮件',
     'customer.form.placeholder.phone': '请输入您的电话号码',
-    'chat.messageInput.placeholder': '输入您的消息...',
+    'chat.messageInput.placeholder': '向我提问...',
     'app.initialization.required': '请先初始化',
     'chat.load.error': '加载消息失败。点击重试',
     'chat.init.error': '初始化聊天失败。点击重试',
@@ -446,8 +472,7 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'chat.support-team': '支持团队',
     'customer.form.resend': '重新发送',
     'chat.list-failed-message.title': '发送失败',
-    'chat.list-failed-message.description':
-      '消息无法发送。请重试。',
+    'chat.list-failed-message.description': '消息无法发送。请重试。',
     'chat.list-cancel': '取消',
     'customer.form.failed.name': '名字错误',
     'customer.form.failed.name.desc': '请修正您的名字。',
@@ -455,5 +480,6 @@ export const LocalizationList: Record<LanguageCode, LocalizationKeys> = {
     'customer.form.failed.email.desc': '请修正您的电子邮件。',
     'customer.form.failed.phone': '电话号码错误',
     'customer.form.failed.phone.desc': '请修正您的电话号码。',
+    'customer.form.cancel': '关闭',
   },
 } as const;

package/src/data/fake/messages.ts

@@ -10,6 +10,8 @@ export function getFakeMessageResponse(content: string): MessageResponse {
       created_at: new Date().toISOString(),
       id: Math.floor(Math.random() * 1000),
       user: null,
+      customer: null,
+      bot: null ,
       conversation: {
         id: 1,
         project_id: 1,

package/src/hooks/useThemeColors.ts

@@ -1,10 +1,5 @@
-import { useAppStore } from '../store';
-import { lightTheme, darkTheme, type ThemeColors } from '../types/Theme';
+import { lightTheme, type ThemeColors } from '../types/Theme';
 
 export function useThemeColors(): ThemeColors {
-  const { theme } = useAppStore((s) => ({
-    theme: s.theme,
-  }));
-
-  return theme === 'light' ? lightTheme : darkTheme;
+  return lightTheme;
 }

package/src/types/Conversation.ts

@@ -2,7 +2,9 @@ export interface ConversationMessage {
   id: number;
   content: string;
   created_at: string;
-  user: any | null;
+  user?: any | null;
+  bot?: any | null;
+  customer?: { name: string; profile_photo_url: null } | null;
 }
 
 export interface AppConversationMessage

package/src/types/LocalizationKeys.ts

@@ -36,4 +36,6 @@ export type LocalizationKeys = {
   'customer.form.failed.email.desc': string;
   'customer.form.failed.phone': string;
   'customer.form.failed.phone.desc': string;
+  'customer.form.name': string;
+  'customer.form.cancel': string;
 };

package/src/types/MessageResponse.ts

@@ -7,6 +7,8 @@ export interface MessageResponse {
     created_at: string;
     id: number;
     user: null | any;
+    customer: null | any;
+    bot: null | any;
     conversation: {
       id: number;
       project_id: number;

package/src/types/Theme.ts

@@ -17,6 +17,7 @@ export interface ThemeColors {
   ghost: string;
   navy: string;
   lavender: string;
+  silver: string;
 }
 
 export const lightTheme: ThemeColors = {
@@ -38,6 +39,7 @@ export const lightTheme: ThemeColors = {
   ghost: '#EFEFEF',
   navy: '#191A21',
   lavender: '#E0E0E0',
+  silver: '#C7C7C7',
 };
 
 export const darkTheme: ThemeColors = {
@@ -59,6 +61,7 @@ export const darkTheme: ThemeColors = {
   ghost: '#202129',
   navy: '#F5F5F5',
   lavender: '#262730',
+  silver: '#44454D',
 };
 
 export interface Theme {