Unverified Commit 4f77e8c1 authored by benguedj's avatar benguedj Committed by GitHub
Browse files

feat: 🎸 Ajoute des stats dans Matomo (#542)

* feat: 🎸 Ajoute des stats dans Matomo

 Closes: #517, #518, #523

* refactor: 💡 PR Ajoute des stats dans Matomo
parent acf9a96a
......@@ -7,16 +7,18 @@ import { MatomoProvider, useMatomo } from "matomo-tracker-react-native";
import type { FC } from "react";
import * as React from "react";
import { useEffect, useRef, useState } from "react";
import type { AppStateStatus } from "react-native";
import { AppState } from "react-native";
import { SafeAreaProvider } from "react-native-safe-area-context";
import IcomoonFont from "./assets/icomoon/icomoon.ttf";
import { initLocales } from "./config/calendar-config";
import { StorageKeysConstants } from "./constants";
import { Labels, StorageKeysConstants } from "./constants";
import useCachedResources from "./hooks/useCachedResources";
import useColorScheme from "./hooks/useColorScheme";
import Navigation from "./navigation";
import { StorageUtils, TrackerUtils } from "./utils";
import { initMonitoring, reportError } from "./utils/logging.util";
import { initMonitoring } from "./utils/logging.util";
import { registerForPushNotificationsAsync } from "./utils/notification.util";
Notifications.setNotificationHandler({
......@@ -41,6 +43,7 @@ initMonitoring();
const customFonts = { IcoMoon: IcomoonFont };
const App: FC = () => {
const { trackScreenView } = useMatomo();
const isLoadingComplete = useCachedResources();
const colorScheme = useColorScheme();
......@@ -52,6 +55,33 @@ const App: FC = () => {
const notificationListener = useRef<Subscription>();
const responseListener = useRef<Subscription>();
const updateAppActiveCounter = async () => {
const appActiveCounterStr = await StorageUtils.getStringValue(
StorageKeysConstants.appActiveCounter
);
const appActiveCounter = appActiveCounterStr
? Number(appActiveCounterStr)
: 0;
const newAppActiveCounter = appActiveCounter + 1;
void StorageUtils.storeStringValue(
StorageKeysConstants.appActiveCounter,
newAppActiveCounter.toString()
);
trackScreenView(
`${TrackerUtils.TrackingEvent.APP_ACTIVE} - ${newAppActiveCounter}`
);
};
const appState = useRef(AppState.currentState);
const handleAppStateChange = (nextAppState: AppStateStatus) => {
if (
/inactive|background/.exec(appState.current) &&
nextAppState === "active"
) {
void updateAppActiveCounter();
}
};
useEffect(() => {
trackAppStart();
Font.loadAsync(customFonts)
......@@ -59,9 +89,12 @@ const App: FC = () => {
setFontsLoaded(true);
})
.catch((error) => {
reportError(error);
console.log(error);
});
// Permet de détecter lorsque l'app change d'état ('active' | 'background' | 'inactive' | 'unknown' | 'extension')
AppState.addEventListener("change", handleAppStateChange);
// Notifications
void registerForPushNotificationsAsync();
// Se déclenche lorsque l'on reçoit une notification et que l'app est ouverte
......@@ -72,10 +105,17 @@ const App: FC = () => {
// Se déclenche lorsque l'on clique sur la notification native
responseListener.current =
Notifications.addNotificationResponseReceivedListener((response) => {
const notificationType =
response.notification.request.content.data.type ?? "";
trackScreenView(
`${TrackerUtils.TrackingEvent.NOTIFICATION} (${notificationType}) - ${Labels.notification.openTheApp}`
);
setNotification(response.notification);
});
return () => {
AppState.removeEventListener("change", handleAppStateChange);
if (notificationListener.current)
Notifications.removeNotificationSubscription(
notificationListener.current
......
import type { NavigationContainerRef } from "@react-navigation/native";
import type { Notification as ExpoNotificaiton } from "expo-notifications";
import { useMatomo } from "matomo-tracker-react-native";
import * as React from "react";
import { useEffect, useState } from "react";
import { Modal, StyleSheet, TouchableOpacity } from "react-native";
......@@ -7,6 +8,7 @@ import { Modal, StyleSheet, TouchableOpacity } from "react-native";
import { Colors, FontWeight, Paddings, Sizes } from "../../constants";
import type { NotificationStyle } from "../../types";
import { NotificationType } from "../../utils/notification.util";
import { TrackingEvent } from "../../utils/tracker.util";
import { SecondaryText } from "../StyledText";
import { View } from "../Themed";
import Button from "./button.component";
......@@ -37,12 +39,17 @@ const Notification: React.FC<Props> = ({
notification,
onDismiss,
}) => {
const { trackScreenView } = useMatomo();
const notificationType = notification.request.content.data
.type as NotificationType;
const [modalVisible, setModalVisible] = useState(true);
const action = () => {
const buttonTitle = notification.request.content.data.redirectTitle ?? "";
trackScreenView(
`${TrackingEvent.NOTIFICATION} (${notificationType}) - ${buttonTitle}`
);
const redirectTo = notification.request.content.data.redirectTo as string;
if (redirectTo) {
......
......@@ -364,6 +364,9 @@ export default {
myProfil: "Mon profil",
title: "Menu",
},
notification: {
openTheApp: "Ouverture de l'app",
},
onboarding: {
slidesText: [
{
......
export const appActiveCounter = "@appActiveCounter";
export const isFirstLaunchKey = "@isFirstLaunch";
export const currentStepId = "@currentStepId";
export const userSituationsKey = "@userSituations";
......@@ -14,6 +15,7 @@ export const notifIdsEvents = "@notifIdsEvents";
export const eventsCalcFromBirthday = "@eventsCalcFromBirthday";
export const allStorageKeys = [
appActiveCounter,
isFirstLaunchKey,
currentStepId,
userSituationsKey,
......
......@@ -282,7 +282,12 @@ const Profile: FC<Props> = ({ navigation }) => {
color={Colors.primaryBlue}
/>
}
action={navigateToRoot}
action={() => {
trackScreenView(
`${TrackerUtils.TrackingEvent.PROFILE} - ${Labels.buttons.pass}`
);
navigateToRoot();
}}
/>
</View>
<View style={[styles.buttonContainer]}>
......
......@@ -8,6 +8,7 @@ export const matomoInstance = new MatomoTracker({
});
export enum TrackingEvent {
APP_ACTIVE = "Ouverture de l'app",
ONBOARDING = "Onboarding",
PROFILE = "Profil",
HOME = "Accueil",
......@@ -16,11 +17,5 @@ export enum TrackingEvent {
CALENDAR = "Calendrier",
CARTO = "Cartographie",
EPDS = "EPDS",
NOTIFICATION = "Notification",
}
export const TrackingActions = {
UPDATE_PROFILE: {
action: "Mise à jour du profil",
name: "Situation",
},
};
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment