Feat: added tag color widgt and changed tag popover design

frontend/src/hooks/api/tags/queries.tsx

@@ -7,7 +7,9 @@ import {
   CreateTagRes,
   DeleteTagDTO,
   DeleteWsTagRes,
-  UserWsTags
+  QueryTag,
+  UserWsTags,
+  WsTag
 } from "./types";
 
 const workspaceTags = {
@@ -34,14 +36,15 @@ export const useCreateWsTag = () => {
   const queryClient = useQueryClient();
 
   return useMutation<CreateTagRes, {}, CreateTagDTO>({
-    mutationFn: async ({ workspaceID, tagName, tagSlug }) => {
+    mutationFn: async ({ workspaceID, tagName, tagColor, tagSlug }: QueryTag) => {
       const { data } = await apiRequest.post(`/api/v2/workspace/${workspaceID}/tags`, {
         name: tagName,
+        tagColor: tagColor,
         slug: tagSlug
       })
       return data;
     },
-    onSuccess: (tagData) => {
+    onSuccess: (tagData: WsTag) => {
       queryClient.invalidateQueries(workspaceTags.getWsTags(tagData?.workspace));
     }
   });
@@ -51,11 +54,11 @@ export const useDeleteWsTag = () => {
   const queryClient = useQueryClient();
 
   return useMutation<DeleteWsTagRes, {}, DeleteTagDTO>({
-    mutationFn: async ({ tagID }) => {
+    mutationFn: async ({ tagID }: {tagID: string}) => {
       const { data } = await apiRequest.delete(`/api/v2/workspace/tags/${tagID}`);
       return data
     },
-    onSuccess: (tagData) => {
+    onSuccess: (tagData: WsTag) => {
       queryClient.invalidateQueries(workspaceTags.getWsTags(tagData?.workspace));
     }
   });

frontend/src/hooks/api/tags/types.ts

@@ -38,15 +38,24 @@ export type DeleteWsTagRes = {
   _id: string;
 };
 
-export type TagDesign  = {
-  tagBackground: string;
-  tagLabel: string
-}
-
 export type SecretTags = { 
   id: string;  
   _id: string;
   slug: string; 
-  tagBackground: string; 
-  tagLabel: string 
+  tagColor: string;
+}
+
+export type TagColor  =  {
+  id: number;
+  hex: string
+  rgba: string
+  name: string
+  selected: boolean
+}
+
+export type QueryTag =  {
+  workspaceID: string; 
+  tagName: string; 
+  tagColor: string;
+  tagSlug: string
 }