[PLAYER-25] adding api to track event

[jparez]

Description

Store

Refacto store to subscribe only part of store change. Most likely React useEffect hook, we can now supply an array of dependencies. If no array is supply then the callback will be trigger on each store change

this callback will be trigger only on isKeyboardEventsEnabled change

   this.instance.store.subscribe(
            ({isKeyboardEventsEnabled}) => {
                ...
            },
            ['isKeyboardEventsEnabled'],
        );

nested object

   this.instance.store.subscribe(
            ({isKeyboardEventsEnabled}) => {
                ...
            },
            ['overlay.widgetOpened'],
        );

Trigger on all change

   this.instance.store.subscribe(
            ({isKeyboardEventsEnabled}) => {
                ...
            }
        );

new feature

Adding functions to ApiManager to track events

Events currently tracked

• opengapps installed
• gamepad plug / unplug
• widget opened / closed

Type of change

• New feature (non-breaking change which adds functionality)

Checklist

• I've read & comply with the contributing guidelines
• I have tested my code for new features & regressions on both mobile & desktop devices, using the latest version of major browsers.
• I have made corresponding changes to the documentation (README.md).
• I've checked my modifications for any breaking changes.

[pgivel]

this is promising. Nice architecture as always

[pgivel]

le name: 'true' me paraît étrange. ça devrait pas être un truc genre value: 'true' ou details: 'true' ?

[pgivel]

It would be nice for readibility to refactor this function in order to avoid such deep nesting of conditions & loops. For example by extracting to a function the array check ?

Suggested change

	const findChangedKeys = (newState, oldState, path = []) => {
	let changedKeys = [];
	const isObject = (obj) => obj && typeof obj === 'object';
	for (const key in newState) {
	const fullPath = [...path, key].join('.');
	if (!Object.prototype.hasOwnProperty.call(oldState, key)) {
	changedKeys.push(fullPath);
	} else if (isObject(newState[key]) && isObject(oldState[key])) {
	if (Array.isArray(newState[key]) && Array.isArray(oldState[key])) {
	if (newState[key].length !== oldState[key].length) {
	changedKeys.push(fullPath);
	} else {
	let arrayHasChanged = false;
	for (let i = 0; i < newState[key].length; i++) {
	if (newState[key][i] !== oldState[key][i]) {
	arrayHasChanged = true;
	}
	}
	if (arrayHasChanged) {
	changedKeys.push(fullPath);
	}
	}
	} else {
	changedKeys = changedKeys.concat(findChangedKeys(newState[key], oldState[key], [...path, key]));
	}
	} else if (newState[key] !== oldState[key]) {
	changedKeys.push(fullPath);
	}
	}
	return changedKeys;
	};
	const arraysAreEqual = (firstArray, secondArray) => {
	if (firstArray.length !== secondArray.length) {
	return true;
	}
	for (let i = 0; i < firstArray.length; i++) {
	if (firstArray[i] !== secondArray[i]) {
	return true;
	}
	}
	return false;
	}
	const findChangedKeys = (newState, oldState, path = []) => {
	let changedKeys = [];
	const isObject = (obj) => obj && typeof obj === 'object';
	for (const key in newState) {
	const fullPath = [...path, key].join('.');
	if (!Object.prototype.hasOwnProperty.call(oldState, key)) {
	changedKeys.push(fullPath);
	} else if (isObject(newState[key]) && isObject(oldState[key])) {
	if (Array.isArray(newState[key]) && Array.isArray(oldState[key]) && !arraysAreEqual(newState[key], oldState[key])) {
	changedKeys.push(fullPath);
	} else {
	changedKeys = changedKeys.concat(findChangedKeys(newState[key], oldState[key], [...path, key]));
	}
	} else if (newState[key] !== oldState[key]) {
	changedKeys.push(fullPath);
	}
	}
	return changedKeys;
	};

But there's probably ways to reduce even more the nesting.

[pgivel]

I don't think this should have been commited