Refatoração da API: adição de interceptores para configuração de headers e baseURL, criação de apiGlobal, e atualização das chamadas de API para utilizar a nova instância. Inclusão de novos tokens no enum TOKEN_ID e armazenamento de informações da instância no localStorage.

Author: DavidsonGomes

src/lib/queries/api.ts

@@ -7,6 +7,31 @@ export const api = axios.create({
 });
 
 api.interceptors.request.use(
+  async (config) => {
+    const apiUrl = getToken(TOKEN_ID.API_URL);
+    if (apiUrl) {
+      config.baseURL = apiUrl.toString();
+    }
+
+    if (!config.headers.apiKey || config.headers.apiKey === "") {
+      const token = getToken(TOKEN_ID.INSTANCE_TOKEN);
+      if (token) {
+        config.headers.apikey = `${token}`;
+      }
+    }
+
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  },
+);
+
+export const apiGlobal = axios.create({
+  timeout: 30000,
+});
+
+apiGlobal.interceptors.request.use(
   async (config) => {
     const apiUrl = getToken(TOKEN_ID.API_URL);
     if (apiUrl) {

src/lib/queries/instance/fetchInstance.ts

@@ -1,6 +1,6 @@
 import { useQuery } from "@tanstack/react-query";
 
-import { api } from "../api";
+import { apiGlobal } from "../api";
 import { UseQueryParams } from "../types";
 import { FetchInstanceResponse } from "./types";
 
@@ -15,7 +15,7 @@ const queryKey = (params: Partial<IParams>) => [
 ];
 
 export const fetchInstance = async ({ instanceId }: IParams) => {
-  const response = await api.get(`/instance/fetchInstances`, {
+  const response = await apiGlobal.get(`/instance/fetchInstances`, {
     params: { instanceId },
   });
   if (Array.isArray(response.data)) {

src/lib/queries/instance/fetchInstances.ts

@@ -1,13 +1,13 @@
 import { useQuery } from "@tanstack/react-query";
 
-import { api } from "../api";
+import { apiGlobal } from "../api";
 import { UseQueryParams } from "../types";
 import { FetchInstancesResponse } from "./types";
 
 const queryKey = ["instance", "fetchInstances"];
 
 export const fetchInstances = async () => {
-  const response = await api.get(`/instance/fetchInstances`);
+  const response = await apiGlobal.get(`/instance/fetchInstances`);
   return response.data;
 };
 

src/lib/queries/instance/manageInstance.tsx

@@ -1,10 +1,10 @@
 import { NewInstance, Settings } from "@/types/evolution.types";
 
-import { api } from "../api";
+import { api, apiGlobal } from "../api";
 import { useManageMutation } from "../mutateQuery";
 
 const createInstance = async (instance: NewInstance) => {
-  const response = await api.post("/instance/create", instance);
+  const response = await apiGlobal.post("/instance/create", instance);
   return response.data;
 };
 
@@ -19,7 +19,7 @@ const logout = async (instanceName: string) => {
 };
 
 const deleteInstance = async (instanceName: string) => {
-  const response = await api.delete(`/instance/delete/${instanceName}`);
+  const response = await apiGlobal.delete(`/instance/delete/${instanceName}`);
   return response.data;
 };
 

src/lib/queries/token.ts

@@ -2,6 +2,9 @@
 export enum TOKEN_ID {
   API_URL = "apiUrl",
   TOKEN = "token",
+  INSTANCE_ID = "instanceId",
+  INSTANCE_NAME = "instanceName",
+  INSTANCE_TOKEN = "instanceToken",
   VERSION = "version",
   FACEBOOK_APP_ID = "facebookAppId",
   FACEBOOK_CONFIG_ID = "facebookConfigId",

src/pages/instance/DashboardInstance/index.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import { CircleUser, MessageCircle, RefreshCw, UsersRound } from "lucide-react";
-import { useMemo, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import QRCode from "react-qr-code";
 
@@ -42,6 +42,14 @@ function DashboardInstance() {
   const { connect, logout, restart } = useManageInstance();
   const { instance, reloadInstance } = useInstance();
 
+  useEffect(() => {
+    if (instance) {
+      localStorage.setItem(TOKEN_ID.INSTANCE_ID, instance.id);
+      localStorage.setItem(TOKEN_ID.INSTANCE_NAME, instance.name);
+      localStorage.setItem(TOKEN_ID.INSTANCE_TOKEN, instance.token);
+    }
+  }, [instance]);
+
   const handleReload = async () => {
     await reloadInstance();
   };