diff --git a/public/locales/en/sources.json b/public/locales/en/sources.json index b1af64be5..1962c0470 100644 --- a/public/locales/en/sources.json +++ b/public/locales/en/sources.json @@ -4,5 +4,6 @@ "sourceCardButton": "Access the source", "sourceCreateCTAButton": "Create source", "sourcesCreateSuccess": "Source created successfully", - "sourcesCreateError": "Error while creating the source" + "sourcesCreateError": "Error while creating the source", + "sourcesErrorFetching": "Error fetching source" } diff --git a/public/locales/pt/sources.json b/public/locales/pt/sources.json index dde0e8c2c..fd0637518 100644 --- a/public/locales/pt/sources.json +++ b/public/locales/pt/sources.json @@ -4,5 +4,6 @@ "sourceCardButton": "Acesse a fonte", "sourceCreateCTAButton": "Incluir fonte", "sourcesCreateSuccess": "Fonte criado com sucesso", - "sourcesCreateError": "Erro ao criar a fonte" + "sourcesCreateError": "Erro ao criar a fonte", + "sourcesErrorFetching": "Erro ao buscar a fonte" } diff --git a/src/api/badgesApi.ts b/src/api/badgesApi.ts index a0c16726c..913400a14 100644 --- a/src/api/badgesApi.ts +++ b/src/api/badgesApi.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -10,11 +10,11 @@ const createBadge = (badge, users, t) => { return request .post(`/`, { ...badge, users }) .then((response) => { - message.success(t("badges:badgeSaved")); + MessageManager.showMessage("success", `${t("badges:badgeSaved")}`); return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -23,11 +23,11 @@ const updateBadge = (badge, users, t) => { return request .put(`/${badge._id}`, { ...badge, users }) .then((response) => { - message.success(t("badges:badgeSaved")); + MessageManager.showMessage("success", `${t("badges:badgeSaved")}`); return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -39,7 +39,7 @@ const getBadges = () => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; diff --git a/src/api/claim.ts b/src/api/claim.ts index 121a8c380..587a6e31e 100644 --- a/src/api/claim.ts +++ b/src/api/claim.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import { NameSpaceEnum } from "../types/Namespace"; const request = axios.create({ @@ -53,7 +53,7 @@ const getById = (id, t, params = {}) => { return response.data; }) .catch(() => { - message.error(t("claim:errorWhileFetching")); + MessageManager.showMessage("error", `${t("claim:errorWhileFetching")}`) }); }; @@ -62,7 +62,7 @@ const saveSpeech = (t, claim = {}) => { .post("/", claim) .then((response) => { const { title } = response.data; - message.success( + MessageManager.showMessage("success", `"${title}" ${t("claimForm:successCreateMessage")}` ); return response.data; @@ -73,7 +73,7 @@ const saveSpeech = (t, claim = {}) => { // TODO: Track errors with Sentry } const { data } = response; - message.error( + MessageManager.showMessage("error", data && data.message ? data.message : t("claimForm:errorCreateMessage") @@ -86,14 +86,14 @@ const saveImage = (t, claimImage = {}) => { .post("/image", claimImage) .then((response) => { const { title } = response.data; - message.success( + MessageManager.showMessage("success", `"${title}" ${t("claimForm:successCreateMessage")}` ); return response.data; }) .catch((err) => { const response = err && err.response; - message.error( + MessageManager.showMessage("error", response?.data && response?.data.message ? response?.data.message : t("claimForm:errorCreateMessage") @@ -106,7 +106,7 @@ const saveDebate = (t, debate = {}) => { .post("/debate", debate) .then((response) => { const { title } = response.data; - message.success( + MessageManager.showMessage("success", `"${title}" ${t("claimForm:successCreateMessage")}` ); return response.data; @@ -125,7 +125,7 @@ const saveUnattributed = (t, unattributed = {}) => { .post("/unattributed", unattributed) .then((response) => { const { title } = response.data; - message.success( + MessageManager.showMessage("success", `"${title}" ${t("claimForm:successCreateMessage")}` ); return response.data; @@ -155,7 +155,7 @@ const updateDebate = ( // TODO: Track errors with Sentry } const { data } = response; - message.error( + MessageManager.showMessage("error", data && data.message ? data.message : t("claimForm:errorUpdateMessage") @@ -167,11 +167,11 @@ const deleteClaim = (id: string, t: any) => { return request .delete(`/${id}`) .then(() => { - message.success(t("claim:deleteSuccess")); + MessageManager.showMessage("success", t("claim:deleteSuccess")); }) .catch((err) => { console.error(err); - message.error(t("claim:deleteError")); + MessageManager.showMessage("error", t("claim:deleteError")); }); }; @@ -189,13 +189,13 @@ const updateClaimHiddenStatus = ( description, }) .then(() => { - message.success( + MessageManager.showMessage("success", t(`claim:${isHidden ? "hideSuccess" : "unhideSuccess"}`) ); }) .catch((err) => { console.error(err); - message.error(t(`claim:${isHidden ? "hideError" : "unhideError"}`)); + MessageManager.showMessage("error", t(`claim:${isHidden ? "hideError" : "unhideError"}`)); }); }; diff --git a/src/api/claimReviewApi.ts b/src/api/claimReviewApi.ts index faef3a9a4..69fd0b301 100644 --- a/src/api/claimReviewApi.ts +++ b/src/api/claimReviewApi.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import axios from "axios"; import { NameSpaceEnum } from "../types/Namespace"; @@ -50,13 +50,13 @@ const updateClaimReviewHiddenStatus = ( return request .put(`/review/${id}`, { isHidden, description, recaptcha }) .then((response) => { - message.success( + MessageManager.showMessage("success", t(`claimReview:${isHidden ? "hideSuccess" : "unhideSuccess"}`) ); return response.data; }) .catch((err) => { - message.error( + MessageManager.showMessage("error", t(`claimReview:${isHidden ? "hideError" : "unhideError"}`) ); throw err; @@ -67,11 +67,11 @@ const deleteClaimReview = (id: string, t: any) => { return request .delete(`/review/${id}`) .then(() => { - message.success(t("claim:deleteSuccess")); + MessageManager.showMessage("success", t("claim:deleteSuccess")); }) .catch((err) => { console.error(err); - message.error(t("claim:deleteError")); + MessageManager.showMessage("error",t("claim:deleteError")); }); }; diff --git a/src/api/comment.ts b/src/api/comment.ts index 781c86716..ef672a65c 100644 --- a/src/api/comment.ts +++ b/src/api/comment.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -13,7 +13,7 @@ const createComment = (comment) => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -25,7 +25,7 @@ const updateComments = (comments) => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -37,7 +37,7 @@ const updateComment = (commentId, comment) => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -49,7 +49,7 @@ const createReplyComment = (commentId, newComment) => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -61,7 +61,7 @@ const deleteReplyComment = (commentId, replyCommentId) => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; diff --git a/src/api/dailyReport.ts b/src/api/dailyReport.ts index 785da871a..e86ae9adf 100644 --- a/src/api/dailyReport.ts +++ b/src/api/dailyReport.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import axios from "axios"; const request = axios.create({ @@ -10,11 +10,11 @@ const sendDailyReportEmail = (topic, nameSpace, t) => { return request .post(`/topic/${topic}/send/${nameSpace}`) .then((response) => { - message.success(t("notification:sendDailyReportSuccess")); + MessageManager.showMessage("success", t("notification:sendDailyReportSuccess")); return response.data; }) .catch((err) => { - message.error(t("notification:sendDailyReportError")); + MessageManager.showMessage("error",t("notification:sendDailyReportError")); throw err; }); }; diff --git a/src/api/editor.ts b/src/api/editor.ts index 11100675f..023d32fb8 100644 --- a/src/api/editor.ts +++ b/src/api/editor.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -13,7 +13,7 @@ const update = (reference, editorContentObject, t) => { return response; }) .catch((err) => { - message.error(t(`claim:${err.response.data?.message}`)); + MessageManager.showMessage("error", t(`claim:${err.response.data?.message}`)); throw err; }); }; diff --git a/src/api/image.ts b/src/api/image.ts index 4dcb64fe1..f8a217846 100644 --- a/src/api/image.ts +++ b/src/api/image.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -24,7 +24,7 @@ const uploadImage = (files, t) => { return response.data; }) .catch((err) => { - message.error(t(`claim:${err.response.data.message}`)); + MessageManager.showMessage("error", t(`claim:${err.response.data.message}`)); throw err; }); }; @@ -33,11 +33,11 @@ const createClaimTypeImage = (file) => { return request .post("/create", file) .then((response) => { - message.success("upload success"); + MessageManager.showMessage("success", "upload success"); return response.data; }) .catch((err) => { - message.error("upload failed"); + MessageManager.showMessage("error", "upload failed"); throw err; }); }; diff --git a/src/api/namespace.ts b/src/api/namespace.ts index 5ecee358d..7f2c68dbb 100644 --- a/src/api/namespace.ts +++ b/src/api/namespace.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -10,11 +10,11 @@ const createNameSpace = (nameSpace, t) => { return request .post(`/`, { ...nameSpace }) .then((response) => { - message.success(t("namespaces:nameSpaceSaved")); + MessageManager.showMessage("success", t("namespaces:nameSpaceSaved")); return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -23,11 +23,11 @@ const updateNameSpace = (nameSpace, t) => { return request .put(`/${nameSpace._id}`, { ...nameSpace }) .then((response) => { - message.success(t("namespaces:nameSpaceSaved")); + MessageManager.showMessage("success", t("namespaces:nameSpaceSaved")); return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; @@ -39,7 +39,7 @@ const getNameSpaces = () => { return response.data; }) .catch((err) => { - message.error(err.response.data?.message); + MessageManager.showMessage("error", err.response.data?.message); throw err; }); }; diff --git a/src/api/ory.ts b/src/api/ory.ts index 72b383a31..b5e01f088 100644 --- a/src/api/ory.ts +++ b/src/api/ory.ts @@ -2,7 +2,7 @@ import { ory } from "../lib/orysdk"; import { handleFlowError } from "../lib/orysdk/errors"; import { AxiosError } from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const oryGetLoginFlow = ({ router, setFlow, t }) => { const { return_to: returnTo, flow: flowId, refresh, aal } = router.query; @@ -59,10 +59,10 @@ const orySubmitLogin = ({ router, flow, setFlow, t, values, shouldGoBack }) => { }); }) .then(() => { - message.success(`${t("login:loginSuccessfulMessage")}`); + MessageManager.showMessage("success", `${t("login:loginSuccessfulMessage")}`); if (flow?.return_to) { window.location.href = flow?.return_to; - message.success(t("profile:changesSaved")); + MessageManager.showMessage("success", t("profile:changesSaved")); return; } if (shouldGoBack) { @@ -73,7 +73,7 @@ const orySubmitLogin = ({ router, flow, setFlow, t, values, shouldGoBack }) => { }) .catch(handleFlowError(router, "login", setFlow, t)) .catch(() => { - message.error(`${t("login:loginFailedMessage")}`); + MessageManager.showMessage("error", `${t("login:loginFailedMessage")}`); }); }; @@ -94,7 +94,7 @@ const orySubmitSettings = ({ router, flow, setFlow, t, values }) => { }) .then(() => { router.push("/"); - message.success(t("profile:changesSaved")); + MessageManager.showMessage("success", `${t("profile:changesSaved")}`); }) .catch(handleFlowError(router, "settings", setFlow, t)); }; @@ -107,7 +107,7 @@ const orySubmitTotp = ({ router, flow, setFlow, t, values }) => { }) .then(({ data }) => { setFlow(data); - message.success(t("profile:changesSaved")); + MessageManager.showMessage("success", `${t("profile:changesSaved")}`); }) .catch(handleFlowError(router, "settings", setFlow, t)); }; diff --git a/src/api/personality.ts b/src/api/personality.ts index 810238614..a92e3e9f8 100644 --- a/src/api/personality.ts +++ b/src/api/personality.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import { ActionTypes } from "../store/types"; import { NameSpaceEnum } from "../types/Namespace"; @@ -67,7 +67,7 @@ const getPersonality = (id, params, t) => { return response.data; }) .catch(() => { - message.error(t("personality:errorWhileFetching")); + MessageManager.showMessage("error", t("personality:errorWhileFetching")); }); }; @@ -78,7 +78,7 @@ const createPersonality = (personality, t) => { }) .then((response) => { const { name } = response.data; - message.success( + MessageManager.showMessage("success", `"${name}" ${t("personalityCreateForm:successMessage")}` ); return response.data; @@ -91,7 +91,7 @@ const createPersonality = (personality, t) => { // console.log(err); } const { data } = response; - message.error( + MessageManager.showMessage("error", data && data.message ? data.message : t("personalityCreateForm:errorMessage") @@ -103,11 +103,11 @@ const deletePersonality = (id: string, t: any) => { return axios .delete(`${baseUrl}/${id}`) .then(() => { - message.success(t("personality:deleteSuccess")); + MessageManager.showMessage("success", t("personality:deleteSuccess")); }) .catch((err) => { console.error(err); - message.error(t("personality:deleteError")); + MessageManager.showMessage("error", t("personality:deleteError")); }); }; @@ -125,13 +125,13 @@ const updatePersonalityHiddenStatus = ( description, }) .then(() => { - message.success( + MessageManager.showMessage("success", t(`personality:${isHidden ? "hideSuccess" : "unhideSuccess"}`) ); }) .catch((err) => { console.error(err); - message.error( + MessageManager.showMessage("error", t(`personality:${isHidden ? "hideError" : "unhideError"}`) ); }); diff --git a/src/api/reviewTaskApi.ts b/src/api/reviewTaskApi.ts index e4d54829e..10e5b0de2 100644 --- a/src/api/reviewTaskApi.ts +++ b/src/api/reviewTaskApi.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import axios from "axios"; import { NameSpaceEnum } from "../types/Namespace"; @@ -48,11 +48,11 @@ const createReviewTask = (params, t, type) => { return request .post("/", { ...params }) .then((response) => { - message.success(t(`reviewTask:${type}_SUCCESS`)); + MessageManager.showMessage("success", t(`reviewTask:${type}_SUCCESS`)); return response.data; }) .catch((err) => { - message.error(t(`reviewTask:${type}_ERROR`)); + MessageManager.showMessage("error", t(`reviewTask:${type}_ERROR`)); throw err; }); }; @@ -61,7 +61,7 @@ const autoSaveDraft = (params, t) => { return request .put(`/${params.data_hash}`, { ...params }) .then((response) => { - message.success(t(`reviewTask:SAVE_DRAFT_SUCCESS`)); + MessageManager.showMessage("success", t(`reviewTask:SAVE_DRAFT_SUCCESS`)); return response.data; }) .catch((err) => { diff --git a/src/api/sentenceApi.ts b/src/api/sentenceApi.ts index 579897dfb..e326abde7 100644 --- a/src/api/sentenceApi.ts +++ b/src/api/sentenceApi.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; const request = axios.create({ withCredentials: true, @@ -21,11 +21,11 @@ const deleteSentenceTopic = (topics, data_hash, t) => { return request .put(`/${data_hash}`, topics) .then((response) => { - message.success(t("topics:deleteTopics")); + MessageManager.showMessage("success", t("topics:deleteTopics")); return response.data; }) .catch((err) => { - message.error(t("topics:deleteTopicsError")); + MessageManager.showMessage("error", t("topics:deleteTopicsError")); throw err; }); }; diff --git a/src/api/sourceApi.ts b/src/api/sourceApi.ts index 235f965c1..0e385a082 100644 --- a/src/api/sourceApi.ts +++ b/src/api/sourceApi.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import axios from "axios"; import { NameSpaceEnum } from "../types/Namespace"; @@ -68,7 +68,7 @@ const createSource = (t, router, source: any = {}) => { return request .post("/", source) .then((response) => { - message.success(t("sources:sourcesCreateSuccess")); + MessageManager.showMessage("success", t("sources:sourcesCreateSuccess")); router.push( nameSpace === NameSpaceEnum.Main ? "/sources" @@ -78,7 +78,7 @@ const createSource = (t, router, source: any = {}) => { }) .catch((err) => { console.error(err); - message.error(t("sources:sourcesCreateError")); + MessageManager.showMessage("error", t("sources:sourcesCreateError")); }); }; @@ -89,7 +89,7 @@ const getById = (id, t, params = {}) => { return response.data; }) .catch(() => { - message.error("error"); //TODO: Improve feedback message + MessageManager.showMessage("error", t("sources:sourcesErrorFetching")); }); }; diff --git a/src/api/topicsApi.ts b/src/api/topicsApi.ts index 3cd2435fa..6660b6069 100644 --- a/src/api/topicsApi.ts +++ b/src/api/topicsApi.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import { ActionTypes } from "../store/types"; interface IGetTopicsOptions { @@ -13,7 +13,7 @@ const request = axios.create({ baseURL: `/api/topics`, }); -const searchTopics = ({ query, dispatch }) => { +const searchTopics = ({ query, dispatch, t }) => { const params = { query }; return request .get(`/search`, { params }) @@ -26,7 +26,7 @@ const searchTopics = ({ query, dispatch }) => { return topicResults; }) .catch((e) => { - message.error("Failed to fetch topics"); + MessageManager.showMessage("error", t("topics:getTopicsFailed")); return []; }); }; @@ -58,11 +58,11 @@ const createTopics = (params, t) => { return request .post("/", { ...params }) .then((response) => { - message.success(t("topics:createTopicsSuccess")); + MessageManager.showMessage("success", t("topics:createTopicsSuccess")); return response.data; }) .catch((err) => { - message.error(t("topics:createTopicsError")); + MessageManager.showMessage("error", t("topics:createTopicsError")); throw err; }); }; diff --git a/src/api/userApi.ts b/src/api/userApi.ts index d076f1253..550ecca83 100644 --- a/src/api/userApi.ts +++ b/src/api/userApi.ts @@ -1,5 +1,5 @@ import axios from "axios"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import { Roles, Status } from "../types/enums"; import { Badge } from "../types/Badge"; @@ -17,7 +17,7 @@ const getById = (id, params = {}) => { return response.data; }) .catch(() => { - message.error("Error while fetching User"); + MessageManager.showMessage("error", "Error while fetching User"); }); }; @@ -28,7 +28,7 @@ const getByOryId = (id) => { return response.data; }) .catch(() => { - message.error("Error while fetching User"); + MessageManager.showMessage("error", "Error while fetching User"); }); }; @@ -70,14 +70,14 @@ const register = (params, t) => { return request .post(`/register`, { ...params }) .then((response) => { - message.success(t("login:signupSuccessfulMessage")); + MessageManager.showMessage("success", t("login:signupSuccessfulMessage")); return response?.data; }) .catch((e) => { if (e.response?.status === 409) { - message.error(t("login:userAlreadyExists")); + MessageManager.showMessage("error", t("login:userAlreadyExists")); } else { - message.error(t("login:signupFailedMessage")); + MessageManager.showMessage("error", t("login:signupFailedMessage")); } return e?.response?.data; }); @@ -111,11 +111,11 @@ const update = ( return request .put(`/${userId}`, params) .then((response) => { - message.success(t("admin:roleUpdated")); + MessageManager.showMessage("success", t("admin:roleUpdated")); return response?.data; }) .catch((e) => { - message.error(t("admin:roleUpdateFailed")); + MessageManager.showMessage("error", t("admin:roleUpdateFailed")); return e?.response?.data; }); }; diff --git a/src/api/verificationRequestApi.ts b/src/api/verificationRequestApi.ts index 481be7fd6..65df273a7 100644 --- a/src/api/verificationRequestApi.ts +++ b/src/api/verificationRequestApi.ts @@ -1,6 +1,6 @@ import axios from "axios"; import { ActionTypes } from "../store/types"; -import { message } from "antd"; +import { MessageManager } from "../components/Messages"; import { NameSpaceEnum } from "../types/Namespace"; interface SearchOptions { searchText?: string; @@ -25,7 +25,7 @@ const createVerificationRequest = ( return request .post("/", verificationRequest) .then((response) => { - message.success( + MessageManager.showMessage("success", t("verificationRequest:verificationRequestCreateSuccess") ); router.push( @@ -37,7 +37,7 @@ const createVerificationRequest = ( }) .catch((err) => { console.error(err); - message.error( + MessageManager.showMessage("error", t("verificationRequest:verificationRequestCreateError") ); }); @@ -113,13 +113,13 @@ const updateVerificationRequest = (id, params, t) => { return request .put(`/${id}`, params) .then((response) => { - message.success( + MessageManager.showMessage("success", t("verificationRequest:addVerificationRequestSuccess") ); return response.data; }) .catch((e) => { - message.error(t("verificationRequest:addVerificationRequestError")); + MessageManager.showMessage("error", t("verificationRequest:addVerificationRequestError")); console.error("error while updating verification request", e); }); }; @@ -128,13 +128,13 @@ const removeVerificationRequestFromGroup = (id, params, t) => { return request .put(`/${id}/group`, params) .then((response) => { - message.success( + MessageManager.showMessage("success", t("verificationRequest:removeVerificationRequestSuccess") ); return response.data; }) .catch((e) => { - message.error( + MessageManager.showMessage("error", t("verificationRequest:removeVerificationRequestError") ); console.error("error while removing verification request", e); @@ -145,11 +145,11 @@ const deleteVerificationRequestTopic = (topics, data_hash, t) => { return request .put(`/${data_hash}/topics`, topics) .then((response) => { - message.success(t("topics:deleteTopics")); + MessageManager.showMessage("success", t("topics:deleteTopics")); return response.data; }) .catch((err) => { - message.error(t("topics:deleteTopicsError")); + MessageManager.showMessage("error", t("topics:deleteTopicsError")); throw err; }); }; diff --git a/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx b/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx index 661545a33..bf952f66b 100644 --- a/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx +++ b/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx @@ -1,5 +1,5 @@ -import { Card, CardActions, CardContent } from "@mui/material"; -import { Col, message, Row } from "antd"; +import { Grid, Card, CardActions, CardContent } from "@mui/material"; +import { MessageManager } from "../../../components/Messages"; import { useAtom } from "jotai"; import { useTranslation } from "next-i18next"; @@ -34,7 +34,7 @@ const ClaimSelectPersonality = () => { const addPersonality = (personality) => { if (claimData.personalities.some((p) => p._id === personality._id)) { - message.info(t("claimForm:personalityAlreadyAdded")); + MessageManager.showMessage("info", t("claimForm:personalityAlreadyAdded")); return; } send({ @@ -50,7 +50,7 @@ const ClaimSelectPersonality = () => { const continueWithPersonality = () => { if (claimData.personalities.length !== 0) { send(CreateClaimEvents.savePersonality); - } else message.warning(t("claimForm:selectPersonalityText")); + } else MessageManager.showMessage("warning", t("claimForm:selectPersonalityText")); }; const continueWithoutPersonality = () => { @@ -107,11 +107,11 @@ const ClaimSelectPersonality = () => { > {t("claimForm:selectedPersonalities")} - + {personalities && personalities.length > 0 && personalities.map((personality) => ( - + { - + ))} - - + { {t("claimForm:noPersonalityButton")} )} - + ); }; diff --git a/src/components/ImageUpload.tsx b/src/components/ImageUpload.tsx index ade89e045..fdbdb8a7e 100644 --- a/src/components/ImageUpload.tsx +++ b/src/components/ImageUpload.tsx @@ -1,6 +1,8 @@ /* eslint-disable @next/next/no-img-element */ import { FileUploadOutlined } from "@mui/icons-material"; -import { Col, message, Upload } from "antd"; +import { Upload } from "antd"; +import { Grid, Typography } from "@mui/material"; +import { MessageManager } from "../components/Messages"; import { RcFile, UploadChangeParam, UploadProps } from "antd/lib/upload"; import { useTranslation } from "next-i18next"; import React, { useState } from "react"; @@ -9,7 +11,6 @@ import AletheiaButton from "./Button"; import { AletheiaModal } from "./Modal/AletheiaModal.style"; import type { UploadFile } from "antd/lib/upload/interface"; -import Text from "antd/lib/typography/Text"; interface ImageUploadProps { onChange: (fileList: UploadFile[]) => void; @@ -64,7 +65,7 @@ const ImageUpload = ({ ); if (!isAllowedFormat) { - message.error( + MessageManager.showMessage("error", t("claimForm:fileTypeError", { types: ALLOWED_FORMATS.join("/"), }) @@ -72,7 +73,7 @@ const ImageUpload = ({ } const isAllowedSize = file.size < MAX_SIZE; if (!isAllowedSize) { - message.error( + MessageManager.showMessage("error", t("claimForm:fileSizeError", { size: `${ALLOWED_MB}MB` }) ); } @@ -96,7 +97,7 @@ const ImageUpload = ({ ); return ( - + = UPLOAD_LIMIT ? null : uploadButton} {error && ( - + {t("common:requiredFieldError")} - + )} - + ); }; diff --git a/src/components/Kanban/KanbanCard.tsx b/src/components/Kanban/KanbanCard.tsx index 2d36ecc68..432e2394e 100644 --- a/src/components/Kanban/KanbanCard.tsx +++ b/src/components/Kanban/KanbanCard.tsx @@ -1,6 +1,4 @@ -import { Avatar, Col, Row, Typography } from "antd"; import React from "react"; - import CardBase from "../CardBase"; import UserTag from "./UserTag"; import claimApi from "../../api/claim"; @@ -9,15 +7,14 @@ import { useTranslation } from "next-i18next"; import actions from "../../store/actions"; import { useDispatch } from "react-redux"; import { ContentModelEnum } from "../../types/enums"; -import PhotoOutlinedIcon from "@mui/icons-material/PhotoOutlined"; -import ArticleOutlinedIcon from "@mui/icons-material/ArticleOutlined"; +import { PhotoOutlined, ArticleOutlined } from "@mui/icons-material"; +import { AvatarGroup, Grid, Typography } from "@mui/material"; import { useAtom } from "jotai"; import { currentNameSpace } from "../../atoms/namespace"; import SourceApi from "../../api/sourceApi"; import { ReviewTaskTypeEnum } from "../../machines/reviewTask/enums"; import verificationRequestApi from "../../api/verificationRequestApi"; - -const { Text, Paragraph } = Typography; +import colors from "../../styles/colors"; const KanbanCard = ({ reviewTask, reviewTaskType }) => { const { t } = useTranslation(); @@ -72,48 +69,51 @@ const KanbanCard = ({ reviewTask, reviewTaskType }) => { style={{ borderRadius: 4, marginBottom: 0, - boxShadow: "0px 1px 1px rgba(0, 0, 0, 0.2)", + boxShadow: `0px 1px 1px ${colors.shadow}`, }} > - - + - {title || reviewTask.content.href} - - {reviewTask.personalityName} - - + {reviewTask.personalityName} + + {isImage ? ( - + ) : ( - + )} - + {reviewTask.usersName && reviewTask.usersName.map((user, index) => { return ; - })} - - - + })} + + + ); diff --git a/src/components/Login/LoginView.tsx b/src/components/Login/LoginView.tsx index 81ec34bbd..3ab9b04b4 100644 --- a/src/components/Login/LoginView.tsx +++ b/src/components/Login/LoginView.tsx @@ -3,7 +3,8 @@ import { UpdateLoginFlowBody, UpdateLoginFlowWithPasswordMethod as ValuesType, } from "@ory/client"; -import { Col, message, Row } from "antd"; +import Grid from "@mui/material/Grid"; +import { MessageManager } from "../Messages"; import { AxiosError } from "axios"; import { useTranslation } from "next-i18next"; import { useRouter } from "next/router"; @@ -73,7 +74,7 @@ const LoginView = ({ isSignUp = false, shouldGoBack = false }) => { if (err.response?.status === 400) { // Yup, it is! setFlow(err.response?.data); - return message.error(t("profile:totpIncorectCodeMessage")); + return MessageManager.showMessage("error", `${t("profile:totpIncorectCodeMessage")}`); } return Promise.reject(err); @@ -142,19 +143,19 @@ const LoginView = ({ isSignUp = false, shouldGoBack = false }) => { const onFinishFailed = (errorInfo) => { if (typeof errorInfo === "string") { - message.error(errorInfo); + MessageManager.showMessage("error", errorInfo) } else { - message.error(t("login:loginFailedMessage")); + MessageManager.showMessage("error", `${t("login:loginFailedMessage")}`); } setIsLoading(false); }; return ( - - + {isSignUp ? ( { isLoading={isLoading} onFinishTotp={onFinishTotp} /> - +

{t("login:signUpHeader")}

- + )} - - + + ); }; diff --git a/src/components/Messages.tsx b/src/components/Messages.tsx new file mode 100644 index 000000000..8769f441b --- /dev/null +++ b/src/components/Messages.tsx @@ -0,0 +1,48 @@ +import React, { useEffect, useState } from "react"; +import EventEmitter from "events"; +import { Snackbar, Alert } from "@mui/material"; + +type MessageType = { + type: "success" | "error" | "warning" | "info"; + text: string; +}; + +class GlobalMessageManager extends EventEmitter { + showMessage(type: MessageType["type"], text: string) { + this.emit("showMessage", { type, text }); + } +} + +export const MessageManager = new GlobalMessageManager(); + +export const GlobalMessage: React.FC = () => { + const [message, setMessage] = useState(null); + + useEffect(() => { + const handleShowMessage = (msg: MessageType) => { + setMessage(msg); + setTimeout(() => setMessage(null), 3000); + }; + + MessageManager.on("showMessage", handleShowMessage); + + return () => { + MessageManager.off("showMessage", handleShowMessage); + }; + }, []); + + return ( + <> + {message && ( + + {message.text} + + )} + + ); +}; + diff --git a/src/components/Profile/Totp.tsx b/src/components/Profile/Totp.tsx index 8aa81e03d..ae1ead94b 100644 --- a/src/components/Profile/Totp.tsx +++ b/src/components/Profile/Totp.tsx @@ -1,7 +1,9 @@ /* eslint-disable @next/next/no-img-element */ /* eslint-disable jsx-a11y/anchor-has-content */ import { UpdateSettingsFlowWithTotpMethod as ValuesType } from "@ory/client"; -import { Form, message, Row, Typography } from "antd"; +import { Form } from "antd"; +import { MessageManager } from "../Messages"; +import { Grid, Typography } from "@mui/material" import { Trans, useTranslation } from "next-i18next"; import React, { useEffect, useState } from "react"; import { orySubmitTotp } from "../../api/ory"; @@ -14,7 +16,6 @@ import userApi from "../../api/userApi"; export const Totp = ({ flow, setFlow }) => { const [imgSource, setImgSource] = useState(""); - const { Title } = Typography; const [textSource, setTextSource] = useState(""); const [showForm, setShowForm] = useState(true); const [isLoading, setIsLoading] = useState(false); @@ -67,7 +68,7 @@ export const Totp = ({ flow, setFlow }) => { }) .then(() => setIsLoading(false)) .catch(() => { - message.error(t("profile:totpIncorectCodeMessage")); + MessageManager.showMessage("error", `${t("profile:totpIncorectCodeMessage")}`); setIsLoading(false); }); }; @@ -83,7 +84,7 @@ export const Totp = ({ flow, setFlow }) => { }) .then(() => setIsLoading(false)) .catch(() => { - message.error(t("prifile:totpUnLinkErrorMessage")); + MessageManager.showMessage("error", `${t("profile:totpUnLinkErrorMessage")}`); setIsLoading(false); }); }; @@ -112,11 +113,11 @@ export const Totp = ({ flow, setFlow }) => { return ( <> - - + + {t("profile:totpSectionTittle")} - - + + {showForm && (
@@ -216,8 +217,8 @@ export const Totp = ({ flow, setFlow }) => { }} type={ButtonType.blue} > - { }} > {t("profile:totpUnLinkSubmit")} - + )} diff --git a/src/components/VerificationRequest/VerificationRequestList.tsx b/src/components/VerificationRequest/VerificationRequestList.tsx index 31b3a56f0..362483ebb 100644 --- a/src/components/VerificationRequest/VerificationRequestList.tsx +++ b/src/components/VerificationRequest/VerificationRequestList.tsx @@ -79,7 +79,7 @@ const VerificationRequestList = () => { const fetchTopicList = async (term) => { try { - await TopicsApi.searchTopics({ query: term, dispatch }); + await TopicsApi.searchTopics({ query: term, dispatch, t }); } catch (error) { console.error(`Error: ${error.message}`); } diff --git a/src/lib/orysdk/errors.ts b/src/lib/orysdk/errors.ts index 5c87dd1eb..6765bb36e 100644 --- a/src/lib/orysdk/errors.ts +++ b/src/lib/orysdk/errors.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import { MessageManager } from "../../components/Messages"; import { AxiosError } from "axios"; import { TFunction } from "i18next"; import { NextRouter } from "next/router"; @@ -29,15 +29,15 @@ export function handleGetFlowError( await router.push("/"); return; case "self_service_flow_return_to_forbidden": - message.error(t("oryErrors:returnAddressForbidden")); + MessageManager.showMessage("error", t("oryErrors:returnAddressForbidden")); await requestNewFlow(); return; case "self_service_flow_expired": - message.error(t("oryErrors:flowExpired")); + MessageManager.showMessage("error", t("oryErrors:flowExpired")); await requestNewFlow(); return; case "security_csrf_violation": - message.error(t("oryErrors:csrfViolation")); + MessageManager.showMessage("error", t("oryErrors:csrfViolation")); await requestNewFlow(); return; diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 9d1d66fd9..7f73c6414 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -4,6 +4,7 @@ import "../styles/app.css"; import "antd/dist/antd.css"; import { appWithTranslation, Trans, useTranslation } from "next-i18next"; import { Provider } from "react-redux"; +import { GlobalMessage } from "../components/Messages"; import { useStore } from "../store/store"; import MainApp from "../components/MainApp"; import * as umamiConfig from "../lib/umami"; @@ -63,6 +64,7 @@ function MyApp({ Component, pageProps }) { +