add @guardian to package name and improve variables in Metrics component

Author: i-hardy

ab-testing/package.json

@@ -1,5 +1,5 @@
 {
-	"name": "ab-testing",
+	"name": "@guardian/ab-testing",
 	"version": "1.0.0",
 	"description": "A/B test definitions and configuration",
 	"main": "index.ts",

dotcom-rendering/package.json

@@ -27,6 +27,7 @@
 		"@emotion/react": "11.14.0",
 		"@emotion/server": "11.11.0",
 		"@guardian/ab-core": "8.0.0",
+		"@guardian/ab-testing": "workspace:ab-testing",
 		"@guardian/braze-components": "22.2.0",
 		"@guardian/bridget": "8.7.0",
 		"@guardian/browserslist-config": "6.1.0",
@@ -98,7 +99,6 @@
 		"@types/webpack-env": "1.18.8",
 		"@types/webpack-node-externals": "3.0.4",
 		"@types/youtube": "0.0.50",
-		"ab-testing": "workspace:ab-testing",
 		"ajv": "8.17.1",
 		"ajv-formats": "2.1.1",
 		"amphtml-validator": "1.0.35",

dotcom-rendering/src/components/Metrics.importable.tsx

@@ -1,4 +1,5 @@
 import type { ABTest, ABTestAPI } from '@guardian/ab-core';
+import { ABTests } from '@guardian/ab-testing';
 import {
 	bypassCommercialMetricsSampling,
 	EventTimer,
@@ -9,7 +10,6 @@ import {
 	initCoreWebVitals,
 } from '@guardian/core-web-vitals';
 import { getCookie, isString, isUndefined } from '@guardian/libs';
-import { ABTests } from 'ab-testing';
 import { useCallback, useEffect, useState } from 'react';
 import { useAB, useBetaAB } from '../lib/useAB';
 import { useAdBlockInUse } from '../lib/useAdBlockInUse';
@@ -32,11 +32,11 @@ const clientSideTestsToForceMetrics: ABTest[] = [
 	/* keep array multi-line */
 ];
 
-const shouldCollectMetricsForBetaTests = (testParticipations: string[]) => {
-	const participationConfigs = ABTests.filter((test) =>
-		testParticipations.includes(test.name),
+const shouldCollectMetricsForBetaTests = (userTestParticipations: string[]) => {
+	const userParticipationConfigs = ABTests.filter((test) =>
+		userTestParticipations.includes(test.name),
 	);
-	return participationConfigs.some(
+	return userParticipationConfigs.some(
 		(test) => test.shouldForceMetricsCollection,
 	);
 };
@@ -99,10 +99,10 @@ export const Metrics = ({ commercialMetricsEnabled, tests }: Props) => {
 
 	const userInServerSideTest = Object.keys(tests).length > 0;
 
-	const betaParticipations = betaABTest?.getParticipations() ?? {};
+	const userBetaParticipations = betaABTest?.getParticipations() ?? {};
 
 	const collectBetaTestMetrics = shouldCollectMetricsForBetaTests(
-		Object.keys(betaParticipations),
+		Object.keys(userBetaParticipations),
 	);
 
 	const shouldBypassSampling = useCallback(