Skip to content

Instantly share code, notes, and snippets.

@rcapeto
Last active October 23, 2023 13:10
Show Gist options
  • Save rcapeto/c40ae8845af8cf2e14fe4b5231c6d9a1 to your computer and use it in GitHub Desktop.
Save rcapeto/c40ae8845af8cf2e14fe4b5231c6d9a1 to your computer and use it in GitHub Desktop.

Event Manager

  • Documentação para a utilização do event-manager

O que é?

  • Orquestrador de eventos dentro do aplicativo da meutudo, ou seja, ele vai ter as responsabilidade para enviar os eventos para cada plataforma e a plataforma que é responsável por tratar os dados e disparar corretamente.

Como utilizar?

1. Cadastrar novo evento genérico

  • É preciso cadastrar um novo evento genérico para ele ser disparado corretamente.
  • No arquivo ~/core/events existe um type chamado GenericEvents nele é onde vai ser cadastrado um evento novo.

Exemplo:

type GenericEvents = Partial<{
  register_event_example: string | null
}>;

2. Cadastrar novo evento nas plataformas

  • Atualmente existem 3 plataformas no App: Firebase, Insider e Adjust então precisamos cadastrar em todas as plataformas para o evento ser disparado
  • No arquivo ~/core/[firebase | adjust | insider] é onde vai estar o objeto dos eventos
  • Como foi cadastrado o evento genérico, a própria IDE identifica os eventos cadastrados:

Captura de Tela 2023-10-16 às 11 09 53

  • O valor da chave cadastrada deve ser o nome do evento que o time de Analytics passa em sua documentação;
  • Se a plataforma não deve disparar algum evento específico é só não cadastra-lo ou cadastrar ele como : "" ou null

Exemplo:

// Firebase
const firebaseEvents: GenericEvents = {
  register_event_example: 'firebase_event',
};

// Insider
const insiderEvents: GenericEvents = {
  register_event_example: 'funil_insider_event',
};

// Adjust
const adjustEvents: GenericEvents = {
   register_event_example: null, // não deve ser disparado
};

3. Disparo do evento

  • Apenas importar a função dispatchAnalyticsEvent e disparar o evento, conforme o exemplo abaixo:
import { View, Text, TouchableOpacity } from 'react-native';
import { useDispatch } from 'react-redux';
import { dispatchAnalyticsEvent } from '~/store/analyticsEvent';

const screenId = config.events?.screen_name ?? '';

function Component() {
  const dispatch = useDispatch();

  function handleOnPress() {
    dispatch(
      dispatchAnalyticsEvent('register_event_example', {
        screenId: 'ScreenExample',
      }),
    );
  }

  return (
    <View>
      <TouchableOpacity onPress={handleOnPress}>
        <Text>Dispatch event here</Text>
      </TouchableOpacity>
    </View>
  );
}
Parâmetros dispatchAnalyticsEvent
Parâmetro Type Description Required
event string Evento para ser disparado, nome do evento cadastrado no Generic true
params EventManagerParams Parâmetros para o evento true
platforms EventManagerPlatform[] Plataformas para o disparo false
EventManagerParams
Parâmetro Type Description Required
screenId string Tela onde está sendo disparado o evento true
isInteraction boolean Utilizar true quando o evento do firebase for interaction false
params EventParams Parâmetros dos eventos false
isInteraction como true
  • Firebase: O evento passa a ser interaction e é adicionado um parâmetro novo chamado: event_name com o valor do evento cadastrado
  • Outras: Sem alteração de comportamento
import { EventManagerPlatform } from '~/app/factories';

dispatch(
  dispatchAnalyticsEvent(
    'register_event_example',
    {
      screenId: 'Example',
      isInteraction: true,
    }
  ),
);
EventParams
  • São os parâmetros padrões para serem disparados, então por exemplo: convenio, produto, valor_receber e etc;
  • É possível adicionar outros parâmetros;
  • Os parâmetros convenio e produto são enum's, verificar o arquivo: ~/core/events
import { EventManagerPlatform } from '~/app/factories';
import { Insurance, Product } from '~/core/events';

dispatch(
  dispatchAnalyticsEvent(
    'register_event_example',
    {
      screenId: 'Example',
      params: {
        convenio: Insurance.INSS,
        produto: Product.NEW
      }
    }
  ),
);
Platforms
  • Caso o disparo deve ser apenas em 1 plataforma, deve passar o terceiro parâmetro informando qual, conforme o exemplo abaixo:
import { EventManagerPlatform } from '~/app/factories';

dispatch(
  dispatchAnalyticsEvent(
    'register_event_example',
    {
      screenId: 'Example',
    },
    [EventManagerPlatform.firebase],
  ),
);

4. Cadastrando nova plataforma com apenas eventos genéricos

  • Passo 1: Dentro da pasta: ~/core criar uma pasta para a plataforma;
  • Passo 2: Criar um arquivo: eventManager.ts
import {
  EventManagerParams,
  EventManagerPlatform,
  EventParams,
} from '~/core/eventManager';
import { GenericEvents } from '~/core/events';

export class PlatformEventManager<
  Events extends GenericEvents = GenericEvents,
  Params extends EventParams = EventParams,
> extends EventManagerPlatform<Events, Params> {
  platform = 'PlatformName';

  sendEvent = (params: EventManagerParams<Params, Events>) => {};
}
  • Passo 3: Criar um arquivo events.ts:
import { GenericEvents } from '~/core/events';

export const platformEvents: GenericEvents = {
  register_event_example: 'firebase_event',
};
  • Passo 4: adcionar plataforma dentro de factories no arquivo: ~/app/factories/eventManagers.ts
import { PlatformEventManager } from '~/core/example/eventManager';
import { platformEvents } from '~/core/example/events';

// adicionar ao enum
enum EventManagerPlatform {
  example = 'examplePlatform',
}

export const makeEventManagers = () => {
  const baseOptions: Options = {
    debug: Boolean(__DEV__),
    refusedEventParams: [],
  };

  return {
    // adicionar plataforma
    [EventManagerPlatform.example]: new PlatformEventManager(
      platformEvents,
      baseOptions,
    ),
  };
};

5. Cadastrando nova plataforma com eventos personalizados e parâmetros personalizados

  • Alterar os arquivos do passo 1 e 2 do tópico anterior;
  • Arquivo eventManager:
import {
  EventManagerParams,
  EventManagerPlatform,
  EventParams,
} from '~/core/eventManager';
import { GenericEvents } from '~/core/events';

export type NewPlatformEvents = GenericEvents & {
  example: string | null;
};

type NewPlataformCustomParams = EventParams & {
  custom_param?: string;
};

export class PlatformEventManager<
  Events extends NewPlatformEvents = NewPlatformEvents,
  Params extends NewPlataformCustomParams = NewPlataformCustomParams,
> extends EventManagerPlatform<Events, Params> {
  platform = 'PlatformName';

  sendEvent = (params: EventManagerParams<Params, Events>) => {
    const { params: eventParams } = params;
    console.log('custom param =>>', eventParams?.custom_param);
  };
}
  • Arquivo events:
import { NewPlatformEvents } from './eventManager';

export const platformEvents: NewPlatformEvents = {
  example: '',
  register_event_example: '',
};

6. Cadastrar parâmetros não utilizados

  • Como todas as plataformas recebem os mesmos parâmetros, podemos passar por configuração parâmetros para serem "ignorados";
  • Caminho: ~/app/factories/eventManagers;

Exemplo:

 [EventManagerPlatform.adjust]: new AdjustEventManager(adjustEvents, {
      ...baseOptions,
      refusedEventParams: ['convenio'],
    }),
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment