Finish API Key V2

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

@@ -0,0 +1,4 @@
+export {
+  useCreateAPIKeyV2,
+  useDeleteAPIKeyV2,
+  useUpdateAPIKeyV2} from "./queries";

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

@@ -0,0 +1,62 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { userKeys } from "../users/queries";
+import {
+  APIKeyDataV2,
+  CreateAPIKeyDataV2DTO,
+  CreateServiceTokenDataV3Res,
+  DeleteAPIKeyDataV2DTO,
+  UpdateAPIKeyDataV2DTO} from "./types";
+
+export const useCreateAPIKeyV2 = () => {
+  const queryClient = useQueryClient();
+  return useMutation<CreateServiceTokenDataV3Res, {}, CreateAPIKeyDataV2DTO>({
+    mutationFn: async ({
+      name
+    }) => {
+      const { data } = await apiRequest.post("/api/v3/api-key", {
+        name
+      });
+
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries(userKeys.myAPIKeysV2);
+    }
+  });
+};
+
+export const useUpdateAPIKeyV2 = () => {
+  const queryClient = useQueryClient();
+  return useMutation<APIKeyDataV2, {}, UpdateAPIKeyDataV2DTO>({
+    mutationFn: async ({
+      apiKeyDataId,
+      name
+    }) => {
+      const { data: { apiKeyData } } = await apiRequest.patch(`/api/v3/api-key/${apiKeyDataId}`, {
+        name
+      });
+      return apiKeyData;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries(userKeys.myAPIKeysV2);
+    }
+  });
+};
+
+export const useDeleteAPIKeyV2 = () => {
+  const queryClient = useQueryClient();
+  return useMutation<APIKeyDataV2, {}, DeleteAPIKeyDataV2DTO>({
+    mutationFn: async ({
+      apiKeyDataId
+    }) => {
+      const { data: { apiKeyData } } = await apiRequest.delete(`/api/v3/api-key/${apiKeyDataId}`);
+      return apiKeyData;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries(userKeys.myAPIKeysV2);
+    }
+  });
+};

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

@@ -0,0 +1,27 @@
+export type APIKeyDataV2 = {
+    _id: string;
+    name: string;
+    user: string;
+    lastUsed?: string;
+    usageCount: number;
+    createdAt: string;
+    updatedAt: string;
+  };
+
+export type CreateAPIKeyDataV2DTO = {
+    name: string;
+}
+
+export type CreateServiceTokenDataV3Res = {
+    apiKeyData: APIKeyDataV2;
+    apiKey: string;
+}
+
+export type UpdateAPIKeyDataV2DTO = {
+    apiKeyDataId: string;
+    name: string;
+}
+
+export type DeleteAPIKeyDataV2DTO = {
+    apiKeyDataId: string;
+}

frontend/src/hooks/api/index.tsx

@@ -1,3 +1,4 @@
+export * from "./apiKeys";
 export * from "./auditLogs";
 export * from "./auth";
 export * from "./bots";

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

@@ -4,4 +4,5 @@ export {
     useDeleteServiceToken, 
     useDeleteServiceTokenV3,
     useGetUserWsServiceTokens,
-    useUpdateServiceTokenV3} from "./queries";
+    useUpdateServiceTokenV3
+} from "./queries";

frontend/src/hooks/api/users/index.tsx

@@ -7,6 +7,7 @@ export {
   useDeleteOrgMembership,
   useDeleteUser,
   useGetMyAPIKeys,
+  useGetMyAPIKeysV2,
   useGetMyIp,
   useGetMyOrganizationProjects,
   useGetMySessions,

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

@@ -7,6 +7,7 @@ import {
 import { apiRequest } from "@app/config/request";
 import { setAuthToken } from "@app/reactQuery";
 
+import { APIKeyDataV2 } from "../apiKeys/types";
 import { useUploadWsKey } from "../keys/queries";
 import { workspaceKeys } from "../workspace/queries";
 import {
@@ -24,12 +25,13 @@ import {
   User
 } from "./types";
 
-const userKeys = {
+export const userKeys = {
   getUser: ["user"] as const,
   userAction: ["user-action"] as const,
   getOrgUsers: (orgId: string) => [{ orgId }, "user"],
   myIp: ["ip"] as const,
   myAPIKeys: ["api-keys"] as const,
+  myAPIKeysV2: ["api-keys-v2"] as const,
   mySessions: ["sessions"] as const,
   myOrganizationProjects: (orgId: string) => [{ orgId }, "organization-projects"] as const
 };
@@ -270,7 +272,7 @@ export const useGetMyIp = () => {
   });
 };
 
-export const useGetMyAPIKeys = () => {
+export const useGetMyAPIKeys = () => { // TODO: deprecate (moving to API Key V2)
   return useQuery({
     queryKey: userKeys.myAPIKeys,
     queryFn: async () => {
@@ -281,7 +283,18 @@ export const useGetMyAPIKeys = () => {
   });
 };
 
-export const useCreateAPIKey = () => {
+export const useGetMyAPIKeysV2 = () => {
+  return useQuery({
+    queryKey: userKeys.myAPIKeysV2,
+    queryFn: async () => {
+      const { data: { apiKeyData } } = await apiRequest.get<{ apiKeyData: APIKeyDataV2[] }>("/api/v3/users/me/api-keys");
+      return apiKeyData;
+    },
+    enabled: true
+  });
+};
+
+export const useCreateAPIKey = () => { // TODO: deprecate (moving to API Key V2)
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async ({ name, expiresIn }: { name: string; expiresIn: number }) => {
@@ -298,7 +311,7 @@ export const useCreateAPIKey = () => {
   });
 };
 
-export const useDeleteAPIKey = () => {
+export const useDeleteAPIKey = () => { // TODO: deprecate (moving to API Key V2)
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async (apiKeyDataId: string) => {