particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Wizard: add segment tracking

Browse source
This commit is contained in:
Katarina Sieklova 2025-03-26 16:30:38 +01:00 • committed by Klara Simickova
parent c99157216f
commit d18f25e331
9 changed files with 344 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/Components/Blueprints/BuildImagesButton.tsx
View file

@ -1,4 +1,4 @@
import React, { useState } from 'react';
import React, { useEffect, useState } from 'react';
import {
Dropdown,
@ -15,10 +15,12 @@ import {
Button,
} from '@patternfly/react-core';
import { MenuToggleElement } from '@patternfly/react-core/dist/esm/components/MenuToggle/MenuToggle';
import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
import { addNotification } from '@redhat-cloud-services/frontend-components-notifications/redux';
import { ChromeUser } from '@redhat-cloud-services/types';
import { skipToken } from '@reduxjs/toolkit/query';
import { targetOptions } from '../../constants';
import { AMPLITUDE_MODULE_NAME, targetOptions } from '../../constants';
import {
useGetBlueprintQuery,
useComposeBlueprintMutation,
@ -38,6 +40,16 @@ export const BuildImagesButton = ({ children }: BuildImagesButtonPropTypes) => {
const [buildBlueprint, { isLoading: imageBuildLoading }] =
useComposeBlueprintMutation();
const dispatch = useAppDispatch();
const { analytics, auth } = useChrome();
const [userData, setUserData] = useState<ChromeUser | void>(undefined);
useEffect(() => {
(async () => {
const data = await auth?.getUser();
setUserData(data);
})();
}, [auth]);
const onBuildHandler = async () => {
if (selectedBlueprintId) {
@ -50,6 +62,11 @@ export const BuildImagesButton = ({ children }: BuildImagesButtonPropTypes) => {
),
},
});
analytics.track(`${AMPLITUDE_MODULE_NAME} - Image Requested`, {
module: AMPLITUDE_MODULE_NAME,
trigger: 'synchronize images',
account_id: userData?.identity.internal?.account_id || 'Not found',
});
} catch (imageBuildError) {
dispatch(
addNotification({

23
src/Components/Blueprints/DeleteBlueprintModal.tsx
View file

@ -1,4 +1,4 @@
import React from 'react';
import React, { useEffect, useState } from 'react';
import {
ActionGroup,
@ -6,8 +6,14 @@ import {
Modal,
ModalVariant,
} from '@patternfly/react-core';
import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
import { ChromeUser } from '@redhat-cloud-services/types';
import { PAGINATION_LIMIT, PAGINATION_OFFSET } from '../../constants';
import {
AMPLITUDE_MODULE_NAME,
PAGINATION_LIMIT,
PAGINATION_OFFSET,
} from '../../constants';
import {
backendApi,
useDeleteBlueprintMutation,
@ -36,6 +42,15 @@ export const DeleteBlueprintModal: React.FunctionComponent<
const blueprintsOffset = useAppSelector(selectOffset) || PAGINATION_OFFSET;
const blueprintsLimit = useAppSelector(selectLimit) || PAGINATION_LIMIT;
const dispatch = useAppDispatch();
const { analytics, auth } = useChrome();
const [userData, setUserData] = useState<ChromeUser | void>(undefined);
useEffect(() => {
(async () => {
const data = await auth?.getUser();
setUserData(data);
})();
}, [auth]);
const searchParams: GetBlueprintsApiArg = {
limit: blueprintsLimit,
@ -59,6 +74,10 @@ export const DeleteBlueprintModal: React.FunctionComponent<
});
const handleDelete = async () => {
if (selectedBlueprintId) {
analytics.track(`${AMPLITUDE_MODULE_NAME} - Blueprint Deleted`, {
module: AMPLITUDE_MODULE_NAME,
account_id: userData?.identity.internal?.account_id || 'Not found',
});
setShowDeleteModal(false);
await deleteBlueprint({ id: selectedBlueprintId });
dispatch(setBlueprintId(undefined));