feat(ui): added new react-query hooks for settings page

frontend/src/hooks/api/serviceTokens/index.ts

@@ -0,0 +1 @@
+export { useCreateServiceToken, useDeleteServiceToken, useGetUserWsServiceTokens } from './queries';

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

@@ -0,0 +1,60 @@
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+
+import { apiRequest } from '@app/config/request';
+
+import {
+  CreateServiceTokenDTO,
+  CreateServiceTokenRes,
+  DeleteServiceTokenRes,
+  ServiceToken
+} from './types';
+
+const serviceTokenKeys = {
+  getAllWorkspaceServiceToken: (workspaceID: string) => [{ workspaceID }, 'service-tokens'] as const
+};
+
+const fetchWorkspaceServiceTokens = async (workspaceID: string) => {
+  const { data } = await apiRequest.get<{ serviceTokenData: ServiceToken[] }>(
+    `/api/v2/workspace/${workspaceID}/service-token-data`
+  );
+
+  return data.serviceTokenData;
+};
+
+type UseGetWorkspaceServiceTokensProps = { workspaceID: string };
+
+export const useGetUserWsServiceTokens = ({ workspaceID }: UseGetWorkspaceServiceTokensProps) =>
+  useQuery({
+    queryKey: serviceTokenKeys.getAllWorkspaceServiceToken(workspaceID),
+    queryFn: () => fetchWorkspaceServiceTokens(workspaceID),
+    enabled: Boolean(workspaceID)
+  });
+
+// mutation
+export const useCreateServiceToken = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<CreateServiceTokenRes, {}, CreateServiceTokenDTO>({
+    mutationFn: async (body) => {
+      const { data } = await apiRequest.post('/api/v2/service-token/', body);
+      return data;
+    },
+    onSuccess: ({ serviceTokenData: { workspace } }) => {
+      queryClient.invalidateQueries(serviceTokenKeys.getAllWorkspaceServiceToken(workspace));
+    }
+  });
+};
+
+export const useDeleteServiceToken = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<DeleteServiceTokenRes, {}, string>({
+    mutationFn: async (serviceTokenId) => {
+      const { data } = await apiRequest.delete(`/api/v2/service-token/${serviceTokenId}`);
+      return data;
+    },
+    onSuccess: ({ serviceTokenData: { workspace } }) => {
+      queryClient.invalidateQueries(serviceTokenKeys.getAllWorkspaceServiceToken(workspace));
+    }
+  });
+};

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

@@ -0,0 +1,28 @@
+export type ServiceToken = {
+  _id: string;
+  name: string;
+  workspace: string;
+  environment: string;
+  user: string;
+  expiresAt: string;
+  createdAt: string;
+  updatedAt: string;
+  __v: number;
+};
+
+export type CreateServiceTokenDTO = {
+  name: string;
+  workspaceId: string;
+  environment: string;
+  expiresIn: number;
+  encryptedKey: string;
+  iv: string;
+  tag: string;
+};
+
+export type CreateServiceTokenRes = {
+  serviceToken: string;
+  serviceTokenData: ServiceToken;
+};
+
+export type DeleteServiceTokenRes = { serviceTokenData: ServiceToken };