@vtex/faststore-plugin-buyer-portal 1.3.27 → 1.3.29

package/CHANGELOG.md

@@ -7,8 +7,20 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-## [1.3.27] - 2025-11-25
+## [1.3.29] - 2025-11-25
+
+### Added
+
+- Create tokens file with variables according with design system definition
+- Create typography mixins
+
+## [1.3.28] - 2025-11-25
 
+### Added
+
+- Setup business metrics and analytics events
+
+## [1.3.27] - 2025-11-25
 
 ### Changed
 
@@ -269,7 +281,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add CHANGELOG file
 - Add README file
 
-[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.27...HEAD
+[unreleased]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.29...HEAD
 [1.2.3]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.2.2...1.2.3
 [1.2.3]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.2.3
 [1.2.4]: https://github.com/vtex/faststore-plugin-buyer-portal/releases/tag/1.2.4
@@ -284,6 +296,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 # <<<<<<< HEAD
 
+[1.3.29]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.28...v1.3.29
+[1.3.28]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.27...v1.3.28
 [1.3.27]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.26...v1.3.27
 [1.3.26]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.25...v1.3.26
 [1.3.25]: https://github.com/vtex/faststore-plugin-buyer-portal/compare/v1.3.24...v1.3.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vtex/faststore-plugin-buyer-portal",
-  "version": "1.3.27",
+  "version": "1.3.29",
   "description": "A plugin for faststore with buyer portal",
   "main": "index.js",
   "scripts": {

package/src/features/addresses/components/AddRecipientsDrawer/AddRecipientsDrawer.tsx

@@ -6,7 +6,8 @@ import { useUI } from "@faststore/ui";
 
 import { RecipientsForm } from "..";
 import { type BasicDrawerProps, BasicDrawer } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { buyerPortalRoutes } from "../../../shared/utils/buyerPortalRoutes";
 import { useAddRecipientsToAddress } from "../../hooks/useAddRecipientsToAddress";
 
@@ -30,12 +31,24 @@ export const AddRecipientsDrawer = ({
   const router = useRouter();
   const { pushToast } = useUI();
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEvent, trackEntityCreateError } = useAnalytics({
+    entityType: "recipient",
+    defaultTimerName: "recipient_creation",
+    shouldTrackDefaultTimer: true,
+  });
 
   const { addRecipientsToAddress, isAddRecipientToAddressLoading } =
     useAddRecipientsToAddress({
       onSuccess: () => {
         const hasTabParam = router.query?.tab === "recipient-tab";
 
+        trackEvent(ANALYTICS_EVENTS.RECIPIENT_CREATED, {
+          recipients_count: recipients.length,
+          recipient_names: recipients.map((r) => r.recipientName),
+          address_id: addressId ?? router.query.addressId,
+          org_unit_id: currentOrgUnit?.id,
+        });
+
         pushToast({
           message: "Recipients added successfully ",
           status: "INFO",
@@ -63,7 +76,12 @@ export const AddRecipientsDrawer = ({
           refetchRecipients?.();
         }
       },
-      onError: () => {
+      onError: (error) => {
+        trackEntityCreateError(ANALYTICS_EVENTS.RECIPIENT_CREATE_ERROR, error, {
+          address_id: addressId ?? router.query.addressId,
+          org_unit_id: currentOrgUnit?.id,
+        });
+
         pushToast({
           message: "An error occurred while adding recipients",
           status: "ERROR",

package/src/features/addresses/components/CreateAddressDrawer/CreateAddressDrawer.tsx

@@ -12,7 +12,12 @@ import {
 import { TabBar } from "../../../shared/components/Tab/TabBar";
 import { TabContent } from "../../../shared/components/Tab/TabContent";
 import { TabOption } from "../../../shared/components/Tab/TabOption";
-import { useAddToScope, useBuyerPortal } from "../../../shared/hooks";
+import {
+  useAddToScope,
+  useAnalytics,
+  useBuyerPortal,
+} from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useCreateNewAddress } from "../../hooks";
 import { LocationInput } from "../../types/AddressData";
 
@@ -32,6 +37,13 @@ export const CreateAddressDrawer = ({
   const [isTouched, setIsTouched] = useState(false);
   const [useExistingAddress, setUseExistingAddress] = useState(false);
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEvent, trackEntityCreated, trackEntityCreateError } =
+    useAnalytics({
+      entityType: "address",
+      defaultTimerName: "address_creation",
+      shouldTrackDefaultTimer: true,
+    });
+
   const [completedAddress, setCompletedAddress] = useState<AddressData>(
     {} as AddressData
   );
@@ -52,8 +64,33 @@ export const CreateAddressDrawer = ({
   const [locations, setLocations] = useState<LocationInput[]>([{ name: "" }]);
   const [recipients, setRecipients] = useState<RecipientInput[]>([]);
   const [invalidAddress, setInvalidAddress] = useState(false);
+  const [currentTab, setCurrentTab] = useState<string>("address-tab");
+
+  const handleTabChange = (tabId: string) => {
+    if (currentTab !== tabId) {
+      trackEvent(ANALYTICS_EVENTS.ADDRESS_STEP_TIMING, {
+        flow_name: "address_creation",
+        from_step: currentTab,
+        to_step: tabId,
+        step_name: tabId,
+        org_unit_id: currentOrgUnit?.id,
+      });
+      setCurrentTab(tabId);
+    }
+  };
 
   const handleCreateNewAddressSuccess = () => {
+    trackEntityCreated(ANALYTICS_EVENTS.ADDRESS_CREATED, "address", {
+      address_name: address.name,
+      address_country: address.country,
+      address_city: address.city,
+      address_types: address.types,
+      locations_count: locations.filter((l) => l.name).length,
+      recipients_count: recipients.length,
+      use_existing_address: useExistingAddress,
+      org_unit_id: currentOrgUnit?.id,
+    });
+
     pushToast({
       message: "Address added successfully",
       status: "INFO",
@@ -64,7 +101,11 @@ export const CreateAddressDrawer = ({
 
   const { createNewAddress, isCreateNewAddressLoading } = useCreateNewAddress({
     onSuccess: handleCreateNewAddressSuccess,
-    onError: () => {
+    onError: (error) => {
+      trackEntityCreateError(ANALYTICS_EVENTS.ADDRESS_CREATE_ERROR, error, {
+        org_unit_id: currentOrgUnit?.id,
+      });
+
       pushToast({
         message: "An error occurred while creating the address",
         status: "ERROR",
@@ -74,7 +115,12 @@ export const CreateAddressDrawer = ({
 
   const { addToScope } = useAddToScope({
     onSuccess: handleCreateNewAddressSuccess,
-    onError: () => {
+    onError: (error) => {
+      trackEntityCreateError(ANALYTICS_EVENTS.ADDRESS_CREATE_ERROR, error, {
+        org_unit_id: currentOrgUnit?.id,
+        use_existing_address: true,
+      });
+
       pushToast({
         message: "An error occurred while creating the address",
         status: "ERROR",
@@ -124,7 +170,7 @@ export const CreateAddressDrawer = ({
   return (
     <BasicDrawer data-fs-bp-create-address-drawer close={close} {...props}>
       <BasicDrawer.Heading title="Add address" onClose={close} />
-      <Tab defaultTabId="address-tab">
+      <Tab defaultTabId="address-tab" onChange={handleTabChange}>
         <TabBar>
           <TabOption id="address-tab">Details</TabOption>
           <TabOption id="location-tab">Locations</TabOption>

package/src/features/addresses/components/DeleteAddressDrawer/DeleteAddressDrawer.tsx

@@ -7,7 +7,8 @@ import {
   BasicDrawer,
   InputText,
 } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useDeleteAddress } from "../../hooks";
 
 export type DeleteAddressDrawerProps = Omit<BasicDrawerProps, "children"> & {
@@ -26,9 +27,22 @@ export const DeleteAddressDrawer = ({
 }: DeleteAddressDrawerProps) => {
   const { pushToast } = useUI();
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEvent } = useAnalytics({
+    entityType: "address",
+    entityId: addressId,
+    defaultTimerName: "address_delete",
+    shouldTrackDefaultTimer: true,
+  });
   const [addressNameConfirmation, setAddressNameConfirmation] = useState("");
 
   const handleDeleteSuccess = () => {
+    trackEvent(ANALYTICS_EVENTS.ADDRESS_DELETED, {
+      address_id: addressId,
+      address_name: addressName,
+      org_unit_id: currentOrgUnit?.id,
+      entity_type: "address",
+    });
+
     pushToast({
       message: "Address deleted successfully",
       status: "INFO",
@@ -39,7 +53,17 @@ export const DeleteAddressDrawer = ({
 
   const { deleteAddress, isDeleteAddressLoading } = useDeleteAddress({
     onSuccess: handleDeleteSuccess,
-    onError: () => {
+    onError: (error) => {
+      const errorMessage = typeof error === "string" ? error : error.message;
+
+      trackEvent(ANALYTICS_EVENTS.ADDRESS_DELETE_ERROR, {
+        entity_type: "address",
+        entity_id: addressId,
+        address_name: addressName,
+        org_unit_id: currentOrgUnit?.id,
+        error_message: errorMessage,
+      });
+
       pushToast({
         message: "An error occurred while removing the address from the unit",
         status: "ERROR",

package/src/features/addresses/components/DeleteAddressLocationDrawer/DeleteAddressLocationDrawer.tsx

@@ -3,7 +3,8 @@ import { useState } from "react";
 import { useUI } from "@faststore/ui";
 
 import { BasicDrawer, BasicDrawerProps } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useAddressLocationDelete } from "../../hooks";
 import { LocationField } from "../LocationForm/LocationField/LocationField";
 
@@ -28,10 +29,24 @@ export const DeleteAddressLocationDrawer = ({
   const [confirmationValue, setConfirmationValue] = useState({ name: "" });
   const deleteIsDisable = confirmationValue.name !== location.value;
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEvent } = useAnalytics({
+    entityType: "location",
+    entityId: location.id,
+    defaultTimerName: "location_delete",
+    shouldTrackDefaultTimer: true,
+  });
 
   const { deleteLocationMutate, deleteLocationLoading } =
     useAddressLocationDelete({
       onSuccess: () => {
+        trackEvent(ANALYTICS_EVENTS.LOCATION_DELETED, {
+          location_id: location.id,
+          location_name: location.value,
+          address_id: location.auxId,
+          org_unit_id: currentOrgUnit?.id,
+          entity_type: "location",
+        });
+
         pushToast({
           message: "Location removed successfully",
           status: "INFO",
@@ -40,11 +55,22 @@ export const DeleteAddressLocationDrawer = ({
         onDeleteSuccess?.();
         close();
       },
-      onError: () =>
+      onError: (error) => {
+        const errorMessage = typeof error === "string" ? error : error.message;
+
+        trackEvent(ANALYTICS_EVENTS.LOCATION_DELETE_ERROR, {
+          entity_type: "location",
+          entity_id: location.id,
+          location_name: location.value,
+          org_unit_id: currentOrgUnit?.id,
+          error_message: errorMessage,
+        });
+
         pushToast({
           message: "An error occurred while removing location",
           status: "ERROR",
-        }),
+        });
+      },
     });
 
   const handleDeleteClick = () => {

package/src/features/addresses/components/DeleteRecipientAddressDrawer/DeleteRecipientAddressDrawer.tsx

@@ -9,7 +9,8 @@ import {
   BasicDrawer,
   InputText,
 } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useDeleteRecipientAddress } from "../../hooks/useDeleteRecipientAddress";
 
 export type DeleteRecipientAddressDrawerProps = Omit<
@@ -32,10 +33,24 @@ export const DeleteRecipientAddressDrawer = ({
   const { pushToast } = useUI();
   const router = useRouter();
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEvent } = useAnalytics({
+    entityType: "recipient",
+    entityId: recipientAddressId,
+    defaultTimerName: "recipient_delete",
+    shouldTrackDefaultTimer: true,
+  });
   const [recipientNameConfirmation, setRecipientNameConfirmation] =
     useState("");
 
   const handleDeleteSuccess = () => {
+    trackEvent(ANALYTICS_EVENTS.RECIPIENT_DELETED, {
+      recipient_id: recipientAddressId,
+      recipient_name: recipientAddressName,
+      address_id: router.query.addressId as string,
+      org_unit_id: currentOrgUnit?.id,
+      entity_type: "recipient",
+    });
+
     pushToast({
       message: "Recipient deleted successfully",
       status: "INFO",
@@ -47,7 +62,14 @@ export const DeleteRecipientAddressDrawer = ({
   const { deleteRecipientAddress, isDeleteRecipientAddressLoading } =
     useDeleteRecipientAddress({
       onSuccess: handleDeleteSuccess,
-      onError: () => {
+      onError: (error) => {
+        trackEvent(ANALYTICS_EVENTS.RECIPIENT_DELETE_ERROR, {
+          entity_id: recipientAddressId,
+          recipient_name: recipientAddressName,
+          error_message: error instanceof Error ? error.message : String(error),
+          org_unit_id: currentOrgUnit?.id,
+        });
+
         pushToast({
           message:
             "An error occurred while removing the recipient from address",

package/src/features/addresses/components/EditAddressDrawer/EditAddressDrawer.tsx

@@ -4,7 +4,8 @@ import { useUI } from "@faststore/ui";
 
 import { AddressForm } from "..";
 import { type BasicDrawerProps, BasicDrawer } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useEditAddress } from "../../hooks";
 
 import type { AddressInput, AddressData } from "../../types";
@@ -24,6 +25,12 @@ export const EditAddressDrawer = ({
   const { pushToast } = useUI();
   const [isTouched, setIsTouched] = useState(false);
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEntityEdited, trackEntityEditError } = useAnalytics({
+    entityType: "address",
+    entityId: currentAddress.id,
+    defaultTimerName: "address_edit",
+    shouldTrackDefaultTimer: true,
+  });
 
   const [address, setAddress] = useState<AddressInput>({
     ...currentAddress,
@@ -33,6 +40,15 @@ export const EditAddressDrawer = ({
   const [, setInvalidAddress] = useState(false);
 
   const handleUpdatedAddressSuccess = () => {
+    trackEntityEdited(ANALYTICS_EVENTS.ADDRESS_EDITED, {
+      address_id: currentAddress.id,
+      address_name: address.name,
+      address_country: address.country,
+      address_city: address.city,
+      address_types: address.types,
+      org_unit_id: currentOrgUnit?.id,
+    });
+
     pushToast({
       message: "Address updated successfully",
       status: "INFO",
@@ -43,7 +59,17 @@ export const EditAddressDrawer = ({
 
   const { editAddress, isEditAddressLoading } = useEditAddress({
     onSuccess: handleUpdatedAddressSuccess,
-    onError: () => {
+    onError: (error) => {
+      trackEntityEditError(
+        ANALYTICS_EVENTS.ADDRESS_EDIT_ERROR,
+        "address",
+        currentAddress.id ?? "",
+        error,
+        {
+          org_unit_id: currentOrgUnit?.id,
+        }
+      );
+
       pushToast({
         message: "An error occurred while updating the address",
         status: "ERROR",

package/src/features/addresses/components/EditAddressLocationDrawer/EditAddressLocationDrawer.tsx

@@ -1,9 +1,10 @@
-import { useEffect, useState } from "react";
+import { useState, useEffect } from "react";
 
 import { CheckboxField, useUI } from "@faststore/ui";
 
 import { BasicDrawer, BasicDrawerProps } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { LOCAL_STORAGE_LOCATION_EDIT_KEY } from "../../../shared/utils/constants";
 import { useAddressLocationEdit } from "../../hooks";
 import { LocationField } from "../LocationForm/LocationField/LocationField";
@@ -38,9 +39,23 @@ export const EditAddressLocationDrawer = ({
   const saveIsDisable = location.value === field.name;
   const drawerTitle = confirmView ? "Confirm location update" : "Edit location";
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEntityEdited, trackEntityEditError } = useAnalytics({
+    entityType: "location",
+    entityId: location.id,
+    defaultTimerName: "location_edit",
+    shouldTrackDefaultTimer: true,
+  });
 
   const { editLocationMutate, editLocationLoading } = useAddressLocationEdit({
     onSuccess: () => {
+      trackEntityEdited(ANALYTICS_EVENTS.LOCATION_EDITED, {
+        location_id: location.id,
+        location_old_name: location.value,
+        location_new_name: field.name,
+        address_id: location.auxId,
+        org_unit_id: currentOrgUnit?.id,
+      });
+
       pushToast({
         message: "Location edited successfully",
         status: "INFO",
@@ -49,11 +64,22 @@ export const EditAddressLocationDrawer = ({
       onEditSuccess();
       close();
     },
-    onError: () =>
+    onError: (error) => {
+      trackEntityEditError(
+        ANALYTICS_EVENTS.LOCATION_EDIT_ERROR,
+        "location",
+        location.id,
+        error,
+        {
+          org_unit_id: currentOrgUnit?.id,
+        }
+      );
+
       pushToast({
         message: "An error occurred while editing the location",
         status: "ERROR",
-      }),
+      });
+    },
   });
 
   const handleSaveClick = () => {

package/src/features/addresses/components/EditRecipientAddressDrawer/EditRecipientAddressDrawer.tsx

@@ -5,7 +5,8 @@ import { useRouter } from "next/router";
 import { CheckboxField, useUI } from "@faststore/ui";
 
 import { type BasicDrawerProps, BasicDrawer } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { LOCAL_STORAGE_RECIPIENT_EDIT_KEY } from "../../../shared/utils/constants";
 import { useEditRecipientsToAddress } from "../../hooks/useEditRecipientsToAddress";
 import { type RecipientData, RecipientInput } from "../../types";
@@ -29,6 +30,13 @@ export const EditRecipientAddressDrawer = ({
   const { pushToast } = useUI();
   const router = useRouter();
   const { currentOrgUnit } = useBuyerPortal();
+  const { trackEntityEdited, trackEntityEditError } = useAnalytics({
+    entityType: "recipient",
+    entityId: recipient.id,
+    defaultTimerName: "recipient_edit",
+    shouldTrackDefaultTimer: true,
+  });
+
   const initialRecipientName = recipient.firstName + " " + recipient.lastName;
   const [newRecipient, setNewRecipient] = useState({
     name: initialRecipientName,
@@ -45,6 +53,16 @@ export const EditRecipientAddressDrawer = ({
   }, []);
 
   const handleEditSuccess = () => {
+    trackEntityEdited(ANALYTICS_EVENTS.RECIPIENT_EDITED, {
+      recipient_id: recipient.id,
+      recipient_old_name: initialRecipientName,
+      recipient_new_name: newRecipient.name,
+      recipient_old_phone: recipient.phone,
+      recipient_new_phone: newRecipient.phone,
+      address_id: router.query.addressId as string,
+      org_unit_id: currentOrgUnit?.id,
+    });
+
     pushToast({
       message: "Recipient edited successfully",
       status: "INFO",
@@ -56,7 +74,17 @@ export const EditRecipientAddressDrawer = ({
   const { editRecipientsToAddress, isEditRecipientToAddressLoading } =
     useEditRecipientsToAddress({
       onSuccess: handleEditSuccess,
-      onError: () => {
+      onError: (error) => {
+        trackEntityEditError(
+          ANALYTICS_EVENTS.RECIPIENT_EDIT_ERROR,
+          "recipient",
+          recipient.id,
+          error,
+          {
+            org_unit_id: currentOrgUnit?.id,
+          }
+        );
+
         pushToast({
           message: "An error occurred while editing the recipient",
           status: "ERROR",

package/src/features/addresses/components/LocationsDrawer/LocationsDrawer.tsx

@@ -6,7 +6,8 @@ import { useUI } from "@faststore/ui";
 
 import { LocationForm } from "../";
 import { type BasicDrawerProps, BasicDrawer } from "../../../shared/components";
-import { useBuyerPortal } from "../../../shared/hooks";
+import { useAnalytics, useBuyerPortal } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { buyerPortalRoutes } from "../../../shared/utils/buyerPortalRoutes";
 import { useAddLocationsToAddress } from "../../hooks";
 
@@ -28,13 +29,34 @@ export const LocationDrawer = ({
   const [locations, setLocations] = useState<LocationInput[]>([{ name: "" }]);
   const { pushToast } = useUI();
   const router = useRouter();
+  const { trackEvent, trackEntityCreated, trackEntityCreateError } =
+    useAnalytics({
+      entityType: "location",
+      defaultTimerName: "location_creation",
+      shouldTrackDefaultTimer: true,
+    });
 
   const saveIsDisabled = locations.filter(({ name }) => !!name).length === 0;
 
   const { addLocationsMutate, addLocationsLoading } = useAddLocationsToAddress({
     onSuccess: () => {
+      const validLocations = locations.filter(({ name }) => !!name);
       const hasTabParam = router.query?.tab === "location-tab";
 
+      trackEvent(ANALYTICS_EVENTS.LOCATION_CREATED, {
+        locations_count: validLocations.length,
+        location_names: validLocations.map((l) => l.name),
+        address_id: addressId ?? router.query.addressId,
+        org_unit_id: currentOrgUnit?.id,
+      });
+
+      trackEntityCreated(ANALYTICS_EVENTS.LOCATION_CREATED, "location", {
+        locations_count: validLocations.length,
+        location_names: validLocations.map((l) => l.name),
+        address_id: addressId ?? router.query.addressId,
+        org_unit_id: currentOrgUnit?.id,
+      });
+
       pushToast({
         message: "Locations added successfully ",
         status: "INFO",
@@ -62,7 +84,12 @@ export const LocationDrawer = ({
         onAddLocationSuccess?.();
       }
     },
-    onError: () => {
+    onError: (error) => {
+      trackEntityCreateError(ANALYTICS_EVENTS.LOCATION_CREATE_ERROR, error, {
+        address_id: addressId ?? router.query.addressId,
+        org_unit_id: currentOrgUnit?.id,
+      });
+
       pushToast({
         message: "An error occurred while adding locations",
         status: "ERROR",

package/src/features/budgets/components/BudgetDeleteDrawer/BudgetDeleteDrawer.tsx

@@ -10,7 +10,8 @@ import {
   ErrorMessage,
   InputText,
 } from "../../../shared/components";
-import { useDebounce } from "../../../shared/hooks";
+import { useAnalytics, useDebounce } from "../../../shared/hooks";
+import { ANALYTICS_EVENTS } from "../../../shared/services/logger/analytics/constants";
 import { useDeleteBudget } from "../../hooks/useDeleteBudget";
 
 export interface BudgetDeleteDrawerProps
@@ -33,6 +34,12 @@ export function BudgetDeleteDrawer({
 }: BudgetDeleteDrawerProps) {
   const { pushToast } = useUI();
   const router = useRouter();
+  const { trackEvent } = useAnalytics({
+    entityType: "budget",
+    entityId: budgetId,
+    defaultTimerName: "budget_delete",
+    shouldTrackDefaultTimer: true,
+  });
 
   const [inputValue, setInputValue] = useState<string>("");
   const [isTouched, setIsTouched] = useState<boolean>(false);
@@ -47,21 +54,42 @@ export function BudgetDeleteDrawer({
     return debouncedValue && debouncedValue !== budgetName
       ? "Budget name is invalid"
       : null;
-  }, [debouncedValue, isTouched]);
+  }, [debouncedValue, isTouched, inputValue, budgetName]);
 
   const { mutate: deleteBudget, isLoading: isLoadingDeleteBudget } =
     useDeleteBudget({
       options: {
         onSuccess: handleDeleteSuccess,
-        onError: () =>
+        onError: (error: Error) => {
+          const errorMessage =
+            typeof error === "string" ? error : error.message;
+
+          trackEvent(ANALYTICS_EVENTS.BUDGET_DELETE_ERROR, {
+            entity_type: "budget",
+            entity_id: budgetId,
+            budget_name: budgetName,
+            org_unit_id: orgUnitId,
+            contract_id: contractId,
+            error_message: errorMessage,
+          });
+
           pushToast({
             status: "ERROR",
             message: "An error occurred while removing the budget",
-          }),
+          });
+        },
       },
     });
 
   function handleDeleteSuccess() {
+    trackEvent(ANALYTICS_EVENTS.BUDGET_DELETED, {
+      budget_id: budgetId,
+      budget_name: budgetName,
+      org_unit_id: orgUnitId,
+      contract_id: contractId,
+      entity_type: "budget",
+    });
+
     pushToast({
       status: "INFO",
       message: "Budget deleted successfully",