Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/appsrn 318 agregar canales de notificacion #6

Merged

Conversation

GonzaFran
Copy link
Contributor

@GonzaFran GonzaFran commented Jun 13, 2024

LINK DE TICKET:

https://janiscommerce.atlassian.net/browse/APPSRN-315

LINK DE SUBTAREA:

https://janiscommerce.atlassian.net/browse/APPSRN-318

DESCRIPCIÓN DEL REQUERIMIENTO:

Contexto

Contamos con el pkg para administrar las notificaciones en cada app y esta faltando que el mismo, pueda recibir informacion adiciones como tambien canales a usar en las subscripciones. Los canales nos permite poder mostrar las notificaciones cuando la app esta en segundo plano y la informacion adicional, es necesaria para poder enviar las notificaciones segun ciertos criterios.

Por ejemplo, un dato adicional que hay que enviar ante cada suscripcion seria el warehouse activo para que el usuario estando en Palermo, no reciba notificaciones que correspondan a una sesion de Belgrano

Necesidad

Que el provider del pkg, reciba información adicional y canales. En caso de recibirlos, debe subscribirse con dicha informacion

DESCRIPCIÓN DE LA SOLUCIÓN:

Se agregó la dependencia notifee, que es la que permite que se creen los canales de notificación.

Se agregó una nueva prop al componente NotificationProvider, que se llama channelConfigs: esta prop espera recibir un array de objetos o strings que representen los canales de notificación que el package deberá crear.

La prop está preparada para recibir un array con strings y/u objetos, pero, en caso de pasarle un objeto, este debe contener obligatoriamente una key "name" que reciba un string como valor, que será la que se use para crear el canal de notificación.

Además, se armaron utils que son particulares para los canales y que sirven para analizar la información y crear los canales de notificación en base a lo que se reciba a traves de la prop 'channelConfigs'.

También, se agregó la configuración necesaria para crear un canal de notificaciones por default que recibe el nombre de "Commons" y que se crea una vez que se monta el componente.

DATOS A TENER EN CUENTA:

Los canales creados sólo son visibles en dispositivos fisicos; aún así, si se envía una notificación a un canal se recibirá la notificación tanto en emuladores como en celulares fisicos.

Todos los canales que sean creados lo harán con el mayor nivel de importancia posible, lo que permitirá que vea notificaciones emergentes en su dispositivo.

¿CÓMO PROBARLO?:

Es recomendable probarlo en picking para agilizar la prueba.
Primero se necesita vincular el package y además instalar la dependencia de notifee: https://notifee.app/react-native/docs/installation#1-install-via-npm (la versión debería ser la 7.8.2)

Una vez hecho esto, deberá agregar la nueva prop en dónde se esté usando el provider (el index.js de la pantalla Main) y pasarle un array de strings o de objetos que tengan el siguiente formato:

{
name: string,
id?: string,
description?:string
}

El array debe ser incluido al provider en la prop channelConfigs:

const channels = ['session_channel', {name:'canal de prueba', id: 'test_channel',description: 'canal al que enviaré la notificacion'}]

<NotificationProvider
	appName="PickingApp"
	environment={JANIS_ENV}
	events={eventsToSuscribe}
	channelConfigs={channels}> //esta prop
	<MainStack />
</NotificationProvider>

Luego de agregar esto, levante la aplicación y después, si está usando un celular fisico con android 8 o mayor, entre en la información de la aplicación y acceda al apartado de notificaciones, en él debería poder ver los canales creados (ver video en las screenshots)

Ahora deberá configurar (en views) el canal al que se deben enviar las notificaciones del evento picker-assigned. Para eso, en https://app.janisdev.in/notification/default-event/edit/6662190b0389e407bb7b7101, agregue el id del canal en el input Notification channel:

Si el elemento que pasó en el array de channelConfigs fue un string, entonces copie y pegue en el input el string tal cual lo escribió.
Si el elemento fue un objeto y tenía una key id entonces copie y peguelo en el input.

Ahora, mantenga la aplicación en segundo plano y asignele una sesión a su usuario picker; después de un rato debería llegarle una notificación emergente tal cual se muestra en las screenshots.

También puede hacer la prueba apuntando la notificación al canal default_channel

De esta manera habrá logrado probar los canales de notificación.
Si necesita más data de qué son y para qué funciona esto puede ver:

https://janiscommerce.atlassian.net/wiki/spaces/JAPP/pages/2973990913/Las+notificaciones+emergentes+y+la+prioridad
https://janiscommerce.atlassian.net/wiki/spaces/JAPP/pages/2974875651/La+prioridad+los+canales+de+notificaciones+y+sus+configuraciones

SCREENSHOTS:

screen-20240613-161905.mp4

Screenshot_20240613-150123
Captura desde 2024-06-12 12-37-27

@pablodamianberdun pablodamianberdun merged commit 3a84613 into master Jun 25, 2024
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants