Helpium

Añade el chat de soporte nativo de Helpium a tu aplicación React Native o Expo. El paquete es un puente delgado sobre los SDK de Helpium para iOS y Android, por lo que tus clientes obtienen un chat completamente nativo, no una vista web.

Antes de empezar

En Helpium, abre Canales → Chat en vivo y copia tu clave de widget.

1. Instala el paquete

npm install @helpium/react-native
cd ios && pod install

Con Expo, utiliza una compilación de desarrollo (npx expo run:ios, npx expo run:android o EAS Build). El SDK contiene código nativo, por lo que no se ejecuta en Expo Go. No se necesita un plugin de configuración.

En iOS, añade una descripción del uso de la cámara para que los clientes puedan adjuntar fotos (en Expo, bajo ios.infoPlist en app.json):

"NSCameraUsageDescription": "Toma una foto para enviar a nuestro equipo de soporte."

2. Configura, identifica y abre

import { Helpium } from '@helpium/react-native';

// Al iniciar
Helpium.configure({ widgetKey: 'YOUR_WIDGET_KEY' });

// Después de iniciar sesión, con un token que tu servidor firma
Helpium.identify({ userJwt: token });

// Desde tu botón de ayuda
<Button title="Ayuda" onPress={() => Helpium.present()} />

// Al cerrar sesión
Helpium.logout();

Consulta Verifica la identidad de tus clientes para saber cómo firmar el token.

3. Mostrar respuestas no leídas

useEffect(() => {
  const subscription = Helpium.addUnreadCountListener(setUnread);
  return () => subscription.remove();
}, []);

Colores

Helpium.setAppearance({
  light: { primary: '#0ea5e9', headerBackground: '#0ea5e9', headerText: '#ffffff' },
  dark: { primary: '#38bdf8', background: '#0f172a', surface: '#1e293b' },
});

Notificaciones push con expo-notifications

Helpium necesita el token push en bruto del dispositivo, no el token push de Expo:

import * as Notifications from 'expo-notifications';

const { data } = await Notifications.getDevicePushTokenAsync();
Helpium.setPushToken(String(data));

Notifications.addNotificationResponseReceivedListener((response) => {
  const data = response.notification.request.content.data;
  if (Helpium.isHelpiumPush(data)) Helpium.handlePush(data);
});

Luego conecta tus credenciales de Apple y Firebase como se describe en Envía notificaciones push para respuestas de agentes.

Agrega chat en vivo a tu app de React Native