diff --git a/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx b/src/components/Claim/CreateClaim/ClaimSelectPersonality.tsx index 661545a33..11757d4d0 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 global 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")); + global.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 global.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..305dfde34 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 global 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( + global.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( + global.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..7339321c9 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 global 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 global.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); + global.showMessage("error", errorInfo) } else { - message.error(t("login:loginFailedMessage")); + global.showMessage("error", `${t("login:loginFailedMessage")}`); } setIsLoading(false); }; return ( - - + {isSignUp ? ( { isLoading={isLoading} onFinishTotp={onFinishTotp} /> - +

{t("login:signUpHeader")}

- + )} - - + + ); }; diff --git a/src/components/Profile/Totp.tsx b/src/components/Profile/Totp.tsx index 8aa81e03d..a121009f0 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 global 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")); + global.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")); + global.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/lib/orysdk/errors.ts b/src/lib/orysdk/errors.ts index 5c87dd1eb..19a11cf16 100644 --- a/src/lib/orysdk/errors.ts +++ b/src/lib/orysdk/errors.ts @@ -1,4 +1,4 @@ -import { message } from "antd"; +import global 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")); + global.showMessage("error", t("oryErrors:returnAddressForbidden")); await requestNewFlow(); return; case "self_service_flow_expired": - message.error(t("oryErrors:flowExpired")); + global.showMessage("error", t("oryErrors:flowExpired")); await requestNewFlow(); return; case "security_csrf_violation": - message.error(t("oryErrors:csrfViolation")); + global.showMessage("error", t("oryErrors:csrfViolation")); await requestNewFlow(); return;