From 8fe2597da4a232c4d8264ff7852e512027e7c1b7 Mon Sep 17 00:00:00 2001
From: Riya Jethwa <76566868+RiyaJethwa@users.noreply.github.com>
Date: Mon, 18 Sep 2023 20:06:54 +0530
Subject: [PATCH] fix(pie-donut): formatter not recieving entire value

---
 packages/core/src/components/graphs/pie.ts | 15 ++++++++++---
 packages/core/src/tools.ts                 | 26 +++++++++++++---------
 2 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/packages/core/src/components/graphs/pie.ts b/packages/core/src/components/graphs/pie.ts
index 9a915fafff..2f2cf3b450 100644
--- a/packages/core/src/components/graphs/pie.ts
+++ b/packages/core/src/components/graphs/pie.ts
@@ -131,7 +131,9 @@ export class Pie extends Component {
 
 		// Draw the slice labels
 		const renderLabels = options.pie.labels.enabled
-		const labelData = renderLabels ? pieLayoutData.filter((x) => (x.data as any)[valueMapsTo] > 0) : []
+		const labelData = renderLabels
+			? pieLayoutData.filter(x => (x.data as any)[valueMapsTo] > 0)
+			: []
 		const labelsGroup = DOMUtils.appendOrSelect(svg, 'g.labels')
 			.attr('role', Roles.GROUP)
 			.attr('data-name', 'labels')
@@ -153,9 +155,16 @@ export class Pie extends Component {
 			.style('text-anchor', 'middle')
 			.text((d: any) => {
 				if (options.pie.labels.formatter) {
-					return options.pie.labels.formatter(d)
+					return options.pie.labels.formatter({
+						...d,
+						percentageValue: convertValueToPercentage(
+							d.data[valueMapsTo],
+							displayData,
+							valueMapsTo,
+							true
+						)
+					})
 				}
-
 				return convertValueToPercentage(d.data[valueMapsTo], displayData, valueMapsTo) + '%'
 			})
 			// Calculate dimensions in order to transform
diff --git a/packages/core/src/tools.ts b/packages/core/src/tools.ts
index 04de21aaf9..f9b9d4a05c 100644
--- a/packages/core/src/tools.ts
+++ b/packages/core/src/tools.ts
@@ -1,15 +1,11 @@
 import { pointer, type Numeric } from 'd3'
-import {
-	merge,
-	cloneDeep,
-	unionBy,
-} from 'lodash-es'
+import { merge, cloneDeep, unionBy } from 'lodash-es'
 import { CartesianOrientations, ScaleTypes, TruncationTypes } from '@/interfaces/enums'
 import { defaultLegendAdditionalItems } from './configuration-non-customizable'
 
 export function debounceWithD3MousePosition(fn: any, delay: number, holder: any) {
 	let timer: any = null
-	return function(...args: any) {
+	return function (...args: any) {
 		const context = this
 
 		// Get D3 event here
@@ -199,11 +195,21 @@ export function capitalizeFirstLetter(word: string) {
  * @param {string} key
  * @returns The percentage in the form of a number (1 significant digit if necessary)
  */
-export function convertValueToPercentage(item: any, fullData: any, key = 'value') {
+export function convertValueToPercentage(
+	item: any,
+	fullData: any,
+	key = 'value',
+	entireValue = false
+) {
 	const percentage =
 		(item / fullData.reduce((accum: number, val: any) => accum + val[key], 0)) * 100
-	// if the value has any significant figures, keep 1
-	return percentage % 1 !== 0 ? parseFloat(percentage.toFixed(1)) : percentage
+	//in need for entire float percentage value
+	if (entireValue) {
+		return percentage
+	} else {
+		// if the value has any significant figures, keep 1
+		return percentage % 1 !== 0 ? parseFloat(percentage.toFixed(1)) : percentage
+	}
 }
 
 /**
@@ -244,7 +250,7 @@ export function updateLegendAdditionalItems(defaultOptions: any, providedOptions
 
 		// Get default items in default options but not in provided options
 		const updatedDefaultItems = defaultLegendAdditionalItems.filter(
-			(item) => defaultTypes.includes(item.type) && !providedTypes.includes(item.type)
+			item => defaultTypes.includes(item.type) && !providedTypes.includes(item.type)
 		)
 
 		defaultOptions.legend.additionalItems = updatedDefaultItems