react-api-kit 1.0.1 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -5
- package/dist/react-api-kit.mjs +13 -12
- package/dist/react-api-kit.umd.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -44,7 +44,7 @@ export function AppProviders({ children }) {
|
|
|
44
44
|
Call `setupApi` **once**, ideally at application startup.
|
|
45
45
|
|
|
46
46
|
```ts
|
|
47
|
-
import { setupApi } from "
|
|
47
|
+
import { setupApi } from "react-api-kit";
|
|
48
48
|
import { toast } from "react-toastify";
|
|
49
49
|
|
|
50
50
|
setupApi({
|
|
@@ -90,20 +90,44 @@ You pass your own implementation.
|
|
|
90
90
|
|
|
91
91
|
## 🪝 Hooks
|
|
92
92
|
|
|
93
|
-
### `
|
|
93
|
+
### `api`
|
|
94
94
|
|
|
95
95
|
```ts
|
|
96
|
-
import {
|
|
96
|
+
import { api } from "react-api-kit";
|
|
97
97
|
|
|
98
98
|
const fetchUsers = () => api.get("/users").then((res) => res.data);
|
|
99
99
|
```
|
|
100
100
|
|
|
101
|
-
|
|
101
|
+
### useApiQuery get
|
|
102
|
+
|
|
103
|
+
const { data, isLoading } = useApiQuery(
|
|
104
|
+
["users"],"GET","/ENDPOINT/,{parems:value},{ ...options} );
|
|
102
105
|
|
|
103
106
|
### `useApiMutation`
|
|
104
107
|
|
|
105
108
|
```ts
|
|
106
109
|
import { useApiMutation, api } from "react-api-kit";
|
|
107
110
|
|
|
108
|
-
|
|
111
|
+
// POST Req
|
|
112
|
+
const { mutate, isPending } = useApiMutation(["POST KEY"], "POST", "/users", [
|
|
113
|
+
"Validate",
|
|
114
|
+
]);
|
|
115
|
+
|
|
116
|
+
// GET Req
|
|
117
|
+
const { mutate, isPending } = useApiMutation(["GET KEY"], "GET", "/users", [
|
|
118
|
+
"Validate",
|
|
119
|
+
]);
|
|
120
|
+
|
|
121
|
+
// PATCH Req
|
|
122
|
+
const { mutate, isPending } = useApiMutation(["PATCH KEY"], "PATCH", "/users", [
|
|
123
|
+
"Validate",
|
|
124
|
+
]);
|
|
125
|
+
|
|
126
|
+
//Delete Feq
|
|
127
|
+
const { mutate, isPending } = useApiMutation(
|
|
128
|
+
["DELETE KEY"],
|
|
129
|
+
"DELETE",
|
|
130
|
+
"/users",
|
|
131
|
+
["Validate"]
|
|
132
|
+
);
|
|
109
133
|
```
|
package/dist/react-api-kit.mjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useQuery as
|
|
1
|
+
import c from "axios";
|
|
2
|
+
import { useQuery as p, useQueryClient as d, useMutation as l } from "@tanstack/react-query";
|
|
3
3
|
let o;
|
|
4
4
|
const h = (e) => {
|
|
5
5
|
o = e;
|
|
6
|
-
}, n =
|
|
6
|
+
}, n = c.create();
|
|
7
7
|
n.interceptors.request.use((e) => {
|
|
8
8
|
o?.baseURL && (e.baseURL = o.baseURL);
|
|
9
9
|
const t = o?.getToken?.();
|
|
@@ -30,25 +30,26 @@ const u = {
|
|
|
30
30
|
PATCH: (e, t) => n.patch(e, t).then((s) => s.data),
|
|
31
31
|
DELETE: (e) => n.delete(e).then((t) => t.data)
|
|
32
32
|
};
|
|
33
|
-
function
|
|
34
|
-
return
|
|
33
|
+
function g(e, t, s, r, a) {
|
|
34
|
+
return p({
|
|
35
35
|
queryKey: e,
|
|
36
36
|
queryFn: () => u[t](s, r),
|
|
37
37
|
...a
|
|
38
38
|
});
|
|
39
39
|
}
|
|
40
|
-
function
|
|
41
|
-
const
|
|
42
|
-
return
|
|
43
|
-
|
|
40
|
+
function y(e, t, s, r) {
|
|
41
|
+
const a = d();
|
|
42
|
+
return l({
|
|
43
|
+
mutationKey: e,
|
|
44
|
+
mutationFn: (i) => u[t](s, i),
|
|
44
45
|
onSuccess: () => {
|
|
45
|
-
|
|
46
|
+
r && a.invalidateQueries({ queryKey: r });
|
|
46
47
|
}
|
|
47
48
|
});
|
|
48
49
|
}
|
|
49
50
|
export {
|
|
50
51
|
n as api,
|
|
51
52
|
h as setupApi,
|
|
52
|
-
|
|
53
|
-
|
|
53
|
+
y as useApiMutation,
|
|
54
|
+
g as useApiQuery
|
|
54
55
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(s,r){typeof exports=="object"&&typeof module<"u"?r(exports,require("axios"),require("@tanstack/react-query")):typeof define=="function"&&define.amd?define(["exports","axios","@tanstack/react-query"],r):(s=typeof globalThis<"u"?globalThis:s||self,r(s.ReactApiKit={},s.axios,s.reactQuery))})(this,(function(s,r,u){"use strict";let o;const d=e=>{o=e},i=r.create();i.interceptors.request.use(e=>{o?.baseURL&&(e.baseURL=o.baseURL);const t=o?.getToken?.();return t&&(e.headers.Authorization=`Token ${t}`),e}),i.interceptors.response.use(e=>(o?.onSuccess?.(e.data),e),e=>{const t=e?.response?.status,n={400:"Bad request. Please check your input.",401:"Session expired. Please login again.",403:"You do not have permission to perform this action.",404:"Requested resource not found.",409:"Conflict occurred. Please try again.",422:"Validation error. Please check the form.",500:"Server error. Please try again later."},a=e?.response?.data?.message||t&&o?.errorMessages?.[t]||t&&n[t]||e?.message||"Network Error";return o?.toast?.error(a,o.toastOptions),o?.onError?.(e,a),t===401&&o?.onLogout?.(),Promise.reject(e)});const p={GET:(e,t)=>i.get(e,{params:t}).then(n=>n.data),POST:(e,t)=>i.post(e,t).then(n=>n.data),PATCH:(e,t)=>i.patch(e,t).then(n=>n.data),DELETE:e=>i.delete(e).then(t=>t.data)};function f(e,t,n,a,c){return u.useQuery({queryKey:e,queryFn:()=>p[t](n,a),...c})}function l(e,t,n,a){const c=u.useQueryClient();return u.useMutation({mutationKey:e,mutationFn:y=>p[t](n,y),onSuccess:()=>{a&&c.invalidateQueries({queryKey:a})}})}s.api=i,s.setupApi=d,s.useApiMutation=l,s.useApiQuery=f,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})}));
|