Improve: error handling and data fetching in PastePanel and useData hooks
This commit is contained in:
@@ -60,19 +60,35 @@ const PastePanel = ({ onSubmit, publicPastes }) => {
|
|||||||
? `https://api.miarma.net/v2/mpaste/pastes/${key}`
|
? `https://api.miarma.net/v2/mpaste/pastes/${key}`
|
||||||
: `http://localhost:8081/v2/mpaste/pastes/${key}`;
|
: `http://localhost:8081/v2/mpaste/pastes/${key}`;
|
||||||
|
|
||||||
const data = await getData(url, { password: pwd }, false);
|
const headers = pwd ? { "X-Paste-Password": pwd } : {};
|
||||||
|
|
||||||
if (!data) return;
|
try {
|
||||||
|
const response = await getData(url, null, false, headers);
|
||||||
|
|
||||||
setSelectedPaste(data);
|
if (response) {
|
||||||
setFormData({
|
setSelectedPaste(response);
|
||||||
title: data.title ?? "",
|
setShowPasswordModal(false);
|
||||||
content: data.content ?? "",
|
setFormData({
|
||||||
syntax: data.syntax || "plaintext",
|
title: response.title ?? "",
|
||||||
burnAfter: data.burnAfter || false,
|
content: response.content ?? "",
|
||||||
isPrivate: data.isPrivate || false,
|
syntax: response.syntax || "plaintext",
|
||||||
password: ""
|
burnAfter: response.burnAfter || false,
|
||||||
});
|
isPrivate: response.isPrivate || false,
|
||||||
|
password: ""
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
const status = error?.status ?? error?.response?.status;
|
||||||
|
if (status === 403) {
|
||||||
|
setShowPasswordModal(true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (status === 404) {
|
||||||
|
setShowPasswordModal(false);
|
||||||
|
navigate("/", { replace: true });
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => { if (pasteKey) fetchPaste(pasteKey); }, [pasteKey]);
|
useEffect(() => { if (pasteKey) fetchPaste(pasteKey); }, [pasteKey]);
|
||||||
|
|||||||
@@ -92,10 +92,15 @@ export const useData = (config, onError) => {
|
|||||||
if (config?.baseUrl) fetchData();
|
if (config?.baseUrl) fetchData();
|
||||||
}, [config, fetchData]);
|
}, [config, fetchData]);
|
||||||
|
|
||||||
const requestWrapper = async (method, endpoint, payload = null, refresh = false) => {
|
const requestWrapper = async (method, endpoint, payload = null, refresh = false, extraHeaders = {}) => {
|
||||||
try {
|
try {
|
||||||
const isFormData = payload instanceof FormData;
|
const isFormData = payload instanceof FormData;
|
||||||
const headers = getAuthHeaders(isFormData);
|
|
||||||
|
const headers = {
|
||||||
|
...getAuthHeaders(isFormData),
|
||||||
|
...extraHeaders
|
||||||
|
};
|
||||||
|
|
||||||
const cfg = { headers };
|
const cfg = { headers };
|
||||||
let response;
|
let response;
|
||||||
|
|
||||||
@@ -115,11 +120,11 @@ export const useData = (config, onError) => {
|
|||||||
} catch (err) {
|
} catch (err) {
|
||||||
const error = handleAxiosError(err);
|
const error = handleAxiosError(err);
|
||||||
|
|
||||||
if (error.status !== 422 && onError) {
|
if (error.status !== 403 && error.status !== 422) {
|
||||||
onError(error);
|
if (onError) onError(error);
|
||||||
|
setError(error);
|
||||||
}
|
}
|
||||||
|
|
||||||
setError(error);
|
|
||||||
throw error;
|
throw error;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -131,7 +136,7 @@ export const useData = (config, onError) => {
|
|||||||
dataLoading,
|
dataLoading,
|
||||||
dataError,
|
dataError,
|
||||||
clearError,
|
clearError,
|
||||||
getData: (url, params, refresh = true) => requestWrapper("get", url, params, refresh),
|
getData: (url, params, refresh = true, headers = {}) => requestWrapper("get", url, params, refresh, headers),
|
||||||
postData: (url, body, refresh = true) => requestWrapper("post", url, body, refresh),
|
postData: (url, body, refresh = true) => requestWrapper("post", url, body, refresh),
|
||||||
putData: (url, body, refresh = true) => requestWrapper("put", url, body, refresh),
|
putData: (url, body, refresh = true) => requestWrapper("put", url, body, refresh),
|
||||||
deleteData: (url, refresh = true) => requestWrapper("delete", url, null, refresh),
|
deleteData: (url, refresh = true) => requestWrapper("delete", url, null, refresh),
|
||||||
|
|||||||
@@ -34,12 +34,10 @@ const HomeContent = ({ reqConfig }) => {
|
|||||||
const { searchTerm } = useSearch();
|
const { searchTerm } = useSearch();
|
||||||
|
|
||||||
if (dataLoading) return <p><LoadingIcon /></p>;
|
if (dataLoading) return <p><LoadingIcon /></p>;
|
||||||
if (dataError) return <p>Error loading data</p>;
|
|
||||||
|
|
||||||
const filtered = data.filter(paste =>
|
const filtered = (data && Array.isArray(data)) ? data.filter(paste =>
|
||||||
paste.title.toLowerCase().includes((searchTerm ?? "").toLowerCase()) ||
|
paste.title.toLowerCase().includes((searchTerm ?? "").toLowerCase())
|
||||||
paste.content.toLowerCase().includes((searchTerm ?? "").toLowerCase())
|
) : [];
|
||||||
);
|
|
||||||
|
|
||||||
const handleSubmit = async (paste) => {
|
const handleSubmit = async (paste) => {
|
||||||
try {
|
try {
|
||||||
@@ -63,7 +61,7 @@ const HomeContent = ({ reqConfig }) => {
|
|||||||
<span>
|
<span>
|
||||||
Tu paste privado ha sido creado. Puedes acceder a él mediante el siguiente enlace:
|
Tu paste privado ha sido creado. Puedes acceder a él mediante el siguiente enlace:
|
||||||
<br /><br />
|
<br /><br />
|
||||||
<a href={`https://paste.miarma.net/${key}`}>https://paste.miarma.net/${key}</a>
|
<a href={`https://paste.miarma.net/${key}`}>https://paste.miarma.net/{key}</a>
|
||||||
<br /><br />
|
<br /><br />
|
||||||
Recuerda que este enlace es único y no se puede recuperar si se pierde.
|
Recuerda que este enlace es único y no se puede recuperar si se pierde.
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user