refactor makeRequest
This commit is contained in:
parent
faa2cdb62a
commit
9e28031d9b
10
package.json
10
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@frontend/kitui",
|
||||
"version": "1.0.4",
|
||||
"version": "1.0.5",
|
||||
"description": "test",
|
||||
"main": "index.js",
|
||||
"types": "index.d.ts",
|
||||
@ -16,17 +16,19 @@
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
"react-dom": "^18.2.0",
|
||||
"zustand": "^4.3.8",
|
||||
"axios": "^1.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.2.5",
|
||||
"@types/react": "^18.2.7",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"typescript": "^5.0.4"
|
||||
"typescript": "^5.0.4",
|
||||
"zustand": "^4.3.8"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^1.4.0",
|
||||
"reconnecting-eventsource": "^1.6.2"
|
||||
}
|
||||
}
|
||||
|
@ -1,2 +1,2 @@
|
||||
export * from "./createMakeRequest";
|
||||
export * from "./makeRequest";
|
||||
export * from "./tickets";
|
@ -1,19 +1,34 @@
|
||||
import { create } from "zustand";
|
||||
import { persist } from "zustand/middleware";
|
||||
import axios, { AxiosResponse, Method } from "axios";
|
||||
|
||||
|
||||
interface MakeRequestArgs<T> {
|
||||
method?: Method;
|
||||
url: string;
|
||||
body?: T;
|
||||
/** Send access token */
|
||||
useToken?: boolean;
|
||||
contentType?: boolean;
|
||||
signal?: AbortSignal;
|
||||
/** Send refresh token */
|
||||
withCredentials?: boolean;
|
||||
interface AuthStore {
|
||||
token: string;
|
||||
}
|
||||
|
||||
export const createMakeRequest = (getToken: () => string, setToken: (token: string) => void) => async <TRequest = unknown, TResponse = unknown>({
|
||||
export const useAuthStore = create<AuthStore>()(
|
||||
persist(
|
||||
(set, get) => ({
|
||||
token: "",
|
||||
}),
|
||||
{
|
||||
name: "token",
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
export const getAuthToken = () => useAuthStore.getState().token;
|
||||
|
||||
export const setAuthToken = (token: string) => useAuthStore.setState({ token });
|
||||
|
||||
export const clearAuthToken = () => useAuthStore.setState({ token: "" });
|
||||
|
||||
export function useToken() {
|
||||
return useAuthStore(state => state.token);
|
||||
}
|
||||
|
||||
export async function makeRequest<TRequest = unknown, TResponse = unknown>({
|
||||
method = "post",
|
||||
url,
|
||||
body,
|
||||
@ -21,9 +36,19 @@ export const createMakeRequest = (getToken: () => string, setToken: (token: stri
|
||||
contentType = false,
|
||||
signal,
|
||||
withCredentials,
|
||||
}: MakeRequestArgs<TRequest>): Promise<TResponse> => {
|
||||
}: {
|
||||
method?: Method;
|
||||
url: string;
|
||||
body?: TRequest;
|
||||
/** Send access token */
|
||||
useToken?: boolean;
|
||||
contentType?: boolean;
|
||||
signal?: AbortSignal;
|
||||
/** Send refresh token */
|
||||
withCredentials?: boolean;
|
||||
}): Promise<TResponse> {
|
||||
const headers: Record<string, string> = {};
|
||||
if (useToken) headers["Authorization"] = `Bearer ${getToken()}`;
|
||||
if (useToken) headers["Authorization"] = `Bearer ${getAuthToken()}`;
|
||||
if (contentType) headers["Content-Type"] = "application/json";
|
||||
|
||||
try {
|
||||
@ -37,14 +62,14 @@ export const createMakeRequest = (getToken: () => string, setToken: (token: stri
|
||||
});
|
||||
|
||||
if (response.data?.accessToken) {
|
||||
setToken(response.data.accessToken);
|
||||
setAuthToken(response.data.accessToken);
|
||||
}
|
||||
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
if (axios.isAxiosError(error) && error.response?.status === 401 && !withCredentials) {
|
||||
const refreshResponse = await refresh(getToken());
|
||||
if (refreshResponse.data?.accessToken) setToken(refreshResponse.data.accessToken);
|
||||
const refreshResponse = await refresh(getAuthToken());
|
||||
if (refreshResponse.data?.accessToken) setAuthToken(refreshResponse.data.accessToken);
|
||||
|
||||
headers["Authorization"] = refreshResponse.data.accessToken;
|
||||
const response = await axios.request<TRequest, AxiosResponse<TResponse>>({
|
@ -1,9 +1,8 @@
|
||||
import { CreateTicketRequest, CreateTicketResponse } from "../model/ticket";
|
||||
import { createMakeRequest } from "./createMakeRequest";
|
||||
import { makeRequest } from "./makeRequest";
|
||||
|
||||
|
||||
export function createTicket({ makeRequest, url,body, useToken = true }: {
|
||||
makeRequest: ReturnType<typeof createMakeRequest>;
|
||||
export function createTicket({ url, body, useToken = true }: {
|
||||
url: string;
|
||||
body: CreateTicketRequest;
|
||||
useToken?: boolean;
|
||||
|
@ -1,11 +1,10 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import { createMakeRequest } from "../api";
|
||||
import { TicketMessage, GetMessagesRequest, GetMessagesResponse } from "../model";
|
||||
import { devlog } from "../utils";
|
||||
import { makeRequest } from "../api";
|
||||
|
||||
|
||||
export function useTicketMessages({ makeRequest, url, messageApiPage, messagesPerPage, ticketId, onNewMessages, onError, isUnauth = false }: {
|
||||
makeRequest: ReturnType<typeof createMakeRequest>;
|
||||
export function useTicketMessages({ url, messageApiPage, messagesPerPage, ticketId, onNewMessages, onError, isUnauth = false }: {
|
||||
url: string;
|
||||
ticketId: string | undefined;
|
||||
messagesPerPage: number;
|
||||
|
@ -1,11 +1,10 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import { createMakeRequest } from "../api";
|
||||
import { GetTicketsResponse, GetTicketsRequest } from "../model";
|
||||
import { devlog } from "../utils";
|
||||
import { makeRequest } from "../api";
|
||||
|
||||
|
||||
export function useTickets({ makeRequest, url, ticketsPerPage, ticketApiPage, onNewTickets, onError }: {
|
||||
makeRequest: ReturnType<typeof createMakeRequest>;
|
||||
export function useTickets({ url, ticketsPerPage, ticketApiPage, onNewTickets, onError }: {
|
||||
url: string;
|
||||
ticketsPerPage: number;
|
||||
ticketApiPage: number;
|
||||
|
12
yarn.lock
12
yarn.lock
@ -131,3 +131,15 @@ typescript@^5.0.4:
|
||||
version "5.0.4"
|
||||
resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.0.4.tgz#b217fd20119bd61a94d4011274e0ab369058da3b"
|
||||
integrity sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==
|
||||
|
||||
use-sync-external-store@1.2.0:
|
||||
version "1.2.0"
|
||||
resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
|
||||
integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
|
||||
|
||||
zustand@^4.3.8:
|
||||
version "4.3.8"
|
||||
resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.3.8.tgz#37113df8e9e1421b0be1b2dca02b49b76210e7c4"
|
||||
integrity sha512-4h28KCkHg5ii/wcFFJ5Fp+k1J3gJoasaIbppdgZFO4BPJnsNxL0mQXBSFgOgAdCdBj35aDTPvdAJReTMntFPGg==
|
||||
dependencies:
|
||||
use-sync-external-store "1.2.0"
|
||||
|
Loading…
Reference in New Issue
Block a user