From 5556d1d6fc8f87f343669a36ba0b49745f57f6f9 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Tue, 29 Mar 2022 09:59:50 +0530
Subject: [PATCH] feat: tag value suggestion is updated

---
 .../AllTags/Tag/DebounceSelect/index.tsx      |  2 +-
 .../Trace/Search/AllTags/Tag/config.ts        | 12 ++++-------
 .../Trace/Search/AllTags/Tag/index.tsx        | 21 ++++++++++---------
 frontend/src/types/api/trace/getTagValue.ts   |  6 ++++--
 4 files changed, 20 insertions(+), 21 deletions(-)

diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/DebounceSelect/index.tsx b/frontend/src/container/Trace/Search/AllTags/Tag/DebounceSelect/index.tsx
index 19719478209b..2576e782e0ea 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/DebounceSelect/index.tsx
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/DebounceSelect/index.tsx
@@ -51,7 +51,7 @@ function DebounceSelect<
 			filterOption={false}
 			onSearch={debounceFetcher}
 			notFoundContent={fetching ? <Spin size="small" /> : null}
-			style={{ minWidth: '170px' }}
+			style={{ width: '170px' }}
 			// as all other props are from SelectProps only
 			// eslint-disable-next-line react/jsx-props-no-spreading
 			{...props}
diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/config.ts b/frontend/src/container/Trace/Search/AllTags/Tag/config.ts
index 07ee042621cb..ce414a5f1594 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/config.ts
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/config.ts
@@ -21,12 +21,8 @@ export async function fetchTag(
 		return [];
 	}
 
-	console.log(response.payload);
-
-	return [
-		{
-			label: 'asd',
-			value: 'asd',
-		},
-	];
+	return response.payload.map((e) => ({
+		label: e.tagValues,
+		value: e.tagValues,
+	}));
 }
diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/index.tsx b/frontend/src/container/Trace/Search/AllTags/Tag/index.tsx
index 8bcf15757a20..37b42347a18f 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/index.tsx
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/index.tsx
@@ -83,27 +83,22 @@ function SingleTags(props: AllTagsProps): JSX.Element {
 
 			<DebounceSelect
 				fetchOptions={(): Promise<TagValue[]> =>
-					fetchTag(globalReducer.minTime, globalReducer.maxTime, selectedKey[0])
+					fetchTag(globalReducer.minTime, globalReducer.maxTime, selectedKey[index])
 				}
 				debounceTimeout={300}
-				mode="tags"
-			/>
-
-			{/* <ValueSelect
-				value={selectedValues}
-				onChange={(value): void => {
+				onSelect={(value: Value): void => {
 					setLocalSelectedTags((tags) => [
 						...tags.slice(0, index),
 						{
 							Key: selectedKey,
 							Operator: selectedOperator,
-							Values: value as string[],
+							Values: [...selectedValues, value.value],
 						},
 						...tags.slice(index + 1, tags.length),
 					]);
 				}}
-				mode="tags"
-			/> */}
+				mode="multiple"
+			/>
 
 			<IconContainer role="button" onClick={(): void => onDeleteTagHandler(index)}>
 				<CloseOutlined />
@@ -121,4 +116,10 @@ interface AllTagsProps {
 	>;
 }
 
+interface Value {
+	key: string;
+	label: string;
+	value: string;
+}
+
 export default SingleTags;
diff --git a/frontend/src/types/api/trace/getTagValue.ts b/frontend/src/types/api/trace/getTagValue.ts
index 221be8dfba34..e90975d1d50b 100644
--- a/frontend/src/types/api/trace/getTagValue.ts
+++ b/frontend/src/types/api/trace/getTagValue.ts
@@ -6,6 +6,8 @@ export interface Props {
 	tagKey: string;
 }
 
-export interface PayloadProps {
-	key: string;
+interface Value {
+	tagValues: string;
 }
+
+export type PayloadProps = Value[];