diff --git a/src/components/CardBase.tsx b/src/components/CardBase.tsx index 0cd1b5864..5fc5fdec7 100644 --- a/src/components/CardBase.tsx +++ b/src/components/CardBase.tsx @@ -1,9 +1,9 @@ -import { Row } from "antd"; +import { Grid } from "@mui/material" import colors from "../styles/colors"; const CardBase = ({ children, style = {} }) => { return ( - { ...style }}> {children} - + ) } diff --git a/src/components/Claim/ClaimListView.tsx b/src/components/Claim/ClaimListView.tsx index 1faec849b..d9f8853e0 100644 --- a/src/components/Claim/ClaimListView.tsx +++ b/src/components/Claim/ClaimListView.tsx @@ -1,4 +1,4 @@ -import { Row, Col } from "antd"; +import { Grid } from "@mui/material" import React from "react"; import ClaimList from "./ClaimList"; import SourceList from "../Source/SourceList"; @@ -8,19 +8,19 @@ const ClaimListView = () => { const { t } = useTranslation(); return ( <> - - + +

{t("claim:claimListTitle")}

- - + + - - + + - - + + ); }; diff --git a/src/components/Claim/ClaimSummary.tsx b/src/components/Claim/ClaimSummary.tsx index bb8d125e4..3514332ea 100644 --- a/src/components/Claim/ClaimSummary.tsx +++ b/src/components/Claim/ClaimSummary.tsx @@ -1,8 +1,8 @@ -import { Row } from "antd"; +import { Grid } from "@mui/material" import styled from "styled-components"; import colors from "../../styles/colors"; -const ClaimSummary = styled(Row)` +const ClaimSummary = styled(Grid)` position: relative; background: ${colors.lightNeutralSecondary}; display:flex; diff --git a/src/components/Claim/CreateClaim/ClaimSelectType.tsx b/src/components/Claim/CreateClaim/ClaimSelectType.tsx index ac40a26ab..6b4c7075b 100644 --- a/src/components/Claim/CreateClaim/ClaimSelectType.tsx +++ b/src/components/Claim/CreateClaim/ClaimSelectType.tsx @@ -53,8 +53,9 @@ const ClaimSelectType = () => {

- { isLoading={isLoading} dateExtraText={t("claimForm:dateFieldHelpImage")} content={ - + - + } /> diff --git a/src/components/Claim/CreateClaim/CreateClaimView.tsx b/src/components/Claim/CreateClaim/CreateClaimView.tsx index efe85b96a..f161d22c2 100644 --- a/src/components/Claim/CreateClaim/CreateClaimView.tsx +++ b/src/components/Claim/CreateClaim/CreateClaimView.tsx @@ -1,4 +1,4 @@ -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import { useAtom } from "jotai"; import React, { useState } from "react"; @@ -77,8 +77,8 @@ const CreateClaimView = () => { }; return ( - - + + {!isLoading && claimData?.group && claimData?.group?.content?.length > 0 && ( @@ -101,7 +101,7 @@ const CreateClaimView = () => { {addDebate && } {isLoading && } {addUnattributed && } - + { onCloseDrawer={onCloseDrawer} onRemove={onRemove} /> - + ); }; diff --git a/src/components/ClaimReview/ClaimReviewDrawer.tsx b/src/components/ClaimReview/ClaimReviewDrawer.tsx index 651897ff9..314626d3e 100644 --- a/src/components/ClaimReview/ClaimReviewDrawer.tsx +++ b/src/components/ClaimReview/ClaimReviewDrawer.tsx @@ -2,7 +2,7 @@ import { ArrowLeftOutlined, ExclamationCircleOutlined, } from "@ant-design/icons"; -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import { useTranslation } from "next-i18next"; import React, { useEffect, useState } from "react"; import { useDispatch } from "react-redux"; @@ -62,16 +62,16 @@ const ClaimReviewDrawer = () => { } > - - + } onClick={() => @@ -82,7 +82,7 @@ const ClaimReviewDrawer = () => { > {t("common:back_button")} - + { > {t("reviewTask:seeFullPage")} - - + + {enableCopilotChatBot && ( - { > {t("copilotChatBot:copilotWarning")} - + )} - + - + {formCollapsed && ( )} @@ -90,8 +91,8 @@ const ClaimReviewForm = ({ target={target?._id} /> )} - - + + ); }; diff --git a/src/components/ClaimReview/ClaimReviewHeader.tsx b/src/components/ClaimReview/ClaimReviewHeader.tsx index 2dcd058cc..a7816d64a 100644 --- a/src/components/ClaimReview/ClaimReviewHeader.tsx +++ b/src/components/ClaimReview/ClaimReviewHeader.tsx @@ -1,5 +1,5 @@ import { useSelector } from "@xstate/react"; -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import React, { useContext } from "react"; import { ReviewTaskMachineContext } from "../../machines/reviewTask/ReviewTaskMachineProvider"; @@ -45,8 +45,9 @@ const ClaimReviewHeader = ({ reviewTaskType === ReviewTaskTypeEnum.VerificationRequest; return ( - - - - + + )} - + - - - + + + ); }; diff --git a/src/components/ClaimReview/ClaimReviewView.tsx b/src/components/ClaimReview/ClaimReviewView.tsx index 6d405c619..4afe2b98c 100644 --- a/src/components/ClaimReview/ClaimReviewView.tsx +++ b/src/components/ClaimReview/ClaimReviewView.tsx @@ -55,13 +55,11 @@ const ClaimReviewView = (props: ClaimReviewViewProps) => { const isSourceOrVerificationRequest = reviewTaskType === "Source" || reviewTaskType === "VerificationRequest"; const componentStyle = { - span: 18, - offset: 3, + span: 9, }; if (!reviewDrawerCollapsed) { - componentStyle.span = 22; - componentStyle.offset = 1; + componentStyle.span = 11; } const reviewContentPath = generateReviewContentPath( diff --git a/src/components/ClaimReview/ReportModelButtons.tsx b/src/components/ClaimReview/ReportModelButtons.tsx index 106b9a9ba..ad837e889 100644 --- a/src/components/ClaimReview/ReportModelButtons.tsx +++ b/src/components/ClaimReview/ReportModelButtons.tsx @@ -1,4 +1,4 @@ -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import React, { useContext } from "react"; import Button, { ButtonType } from "../Button"; import { @@ -28,15 +28,15 @@ const ReportModelButtons = ({ setFormCollapsed }) => { }; return ( - - { )} )} - - + + ); }; diff --git a/src/components/ClaimReview/form/DynamicReviewTaskForm.tsx b/src/components/ClaimReview/form/DynamicReviewTaskForm.tsx index fe78831d5..b43b12e9c 100644 --- a/src/components/ClaimReview/form/DynamicReviewTaskForm.tsx +++ b/src/components/ClaimReview/form/DynamicReviewTaskForm.tsx @@ -12,7 +12,7 @@ import { VisualEditorContext } from "../../Collaborative/VisualEditorProvider"; import DynamicForm from "../../Form/DynamicForm"; import { ReviewTaskEvents } from "../../../machines/reviewTask/enums"; import { ReviewTaskMachineContext } from "../../../machines/reviewTask/ReviewTaskMachineProvider"; -import { Row } from "antd"; +import { Grid } from "@mui/material" import Text from "antd/lib/typography/Text"; import { isUserLoggedIn, @@ -118,9 +118,9 @@ const DynamicReviewTaskForm = ({ data_hash, personality, target }) => { const isValidReviewer = event === ReviewTaskEvents.sendToCrossChecking ? !data.crossCheckerId || - !reviewData.usersId.includes(data.crossCheckerId) + !reviewData.usersId.includes(data.crossCheckerId) : !data.reviewerId || - !reviewData.usersId.includes(data.reviewerId); + !reviewData.usersId.includes(data.reviewerId); setReviewerError(!isValidReviewer); return isValidReviewer; @@ -244,10 +244,11 @@ const DynamicReviewTaskForm = ({ data_hash, personality, target }) => { )} {showButtons && ( - {events?.map((event) => { @@ -266,7 +267,7 @@ const DynamicReviewTaskForm = ({ data_hash, personality, target }) => { ); })} - + )} { ]); return ( - { )} - + ); }; diff --git a/src/components/Collaborative/Form/CardStyle.tsx b/src/components/Collaborative/Form/CardStyle.tsx index f23faf839..9af4ed569 100644 --- a/src/components/Collaborative/Form/CardStyle.tsx +++ b/src/components/Collaborative/Form/CardStyle.tsx @@ -1,8 +1,8 @@ -import { Row } from "antd"; +import { Grid } from "@mui/material" import styled from "styled-components"; import colors from "../../../styles/colors"; -const CardStyle = styled(Row)` +const CardStyle = styled(Grid)` width: 100%; display: flex; justify-content: space-between; diff --git a/src/components/Collaborative/Form/EditorCard.tsx b/src/components/Collaborative/Form/EditorCard.tsx index 3f9054e61..6caaa5f9e 100644 --- a/src/components/Collaborative/Form/EditorCard.tsx +++ b/src/components/Collaborative/Form/EditorCard.tsx @@ -21,9 +21,9 @@ const EditorCard = ({ inputSize = 100, }: EditorCardProps) => { return ( - + - +
{ forwardRef={forwardRef} inputSize={40} extra={ - )} - + ); }; diff --git a/src/components/Footer/FooterInfo.tsx b/src/components/Footer/FooterInfo.tsx index e3fd8a302..dd5310d43 100644 --- a/src/components/Footer/FooterInfo.tsx +++ b/src/components/Footer/FooterInfo.tsx @@ -1,5 +1,5 @@ import { FileTextOutlined } from "@ant-design/icons"; -import { Row } from "antd"; +import { Grid } from "@mui/material" import { useTranslation } from "next-i18next"; import React from "react"; import { useAppSelector } from "../../store/store"; @@ -14,7 +14,7 @@ const FooterInfo = () => { const href = " https://github.com/AletheiaFact/aletheia"; return ( - + {t("about:alertInfo")} { ) : null} - + ); }; diff --git a/src/components/Form/DynamicForm.tsx b/src/components/Form/DynamicForm.tsx index e4a01fb79..dcad8dd5b 100644 --- a/src/components/Form/DynamicForm.tsx +++ b/src/components/Form/DynamicForm.tsx @@ -1,4 +1,4 @@ -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import { Controller } from "react-hook-form"; import DynamicInput from "./DynamicInput"; @@ -31,8 +31,8 @@ const DynamicForm = ({ const defaultValue = machineValues[fieldName]; return ( - - + +

{t(label)}

- - + + )} - - + + ); })}
diff --git a/src/components/Home/CTA/CTASection.style.tsx b/src/components/Home/CTA/CTASection.style.tsx index f4f6c3901..6fee60202 100644 --- a/src/components/Home/CTA/CTASection.style.tsx +++ b/src/components/Home/CTA/CTASection.style.tsx @@ -1,9 +1,9 @@ -import { Row } from "antd"; +import { Grid } from "@mui/material" import styled from "styled-components"; import { queries } from "../../../styles/mediaQueries"; import colors from "../../../styles/colors"; -const CTASectionStyle = styled(Row)` +const CTASectionStyle = styled(Grid)` display: flex; width: 100%; margin-top: 24px; @@ -20,7 +20,7 @@ const CTASectionStyle = styled(Row)` display: flex; flex-wrap: wrap; justify-content: ${({ isloggedin }) => - isloggedin === "true" ? "flex-end" : "space-between"}; + isloggedin === "true" ? "flex-end" : "space-between"}; } @media ${queries.md} { diff --git a/src/components/Home/CTA/CTASection.tsx b/src/components/Home/CTA/CTASection.tsx index b0dc3116e..6286eb58e 100644 --- a/src/components/Home/CTA/CTASection.tsx +++ b/src/components/Home/CTA/CTASection.tsx @@ -9,7 +9,7 @@ const CTASection = () => { const [isLoggedIn] = useAtom(isUserLoggedIn); return ( - + diff --git a/src/components/Home/CTA/CTASectionButtons.tsx b/src/components/Home/CTA/CTASectionButtons.tsx index ba2f37d76..5738a1cda 100644 --- a/src/components/Home/CTA/CTASectionButtons.tsx +++ b/src/components/Home/CTA/CTASectionButtons.tsx @@ -21,7 +21,7 @@ const CTASectionButtons = () => { }; return ( - { const { t } = useTranslation(); - const [isLoggedIn] = useAtom(isUserLoggedIn); return ( - +

{t("home:statsFooter")}

 ); diff --git a/src/components/Home/HomeContent.tsx b/src/components/Home/HomeContent.tsx index 90bedc5b0..d9344364d 100644 --- a/src/components/Home/HomeContent.tsx +++ b/src/components/Home/HomeContent.tsx @@ -1,6 +1,6 @@ import React from "react"; import CTARegistration from "./CTARegistration"; -import { Row, Col } from "antd"; +import { Grid } from "@mui/material" import SocialMediaShare from "../SocialMediaShare"; import { isUserLoggedIn } from "../../atoms/currentUser"; import { useAtom } from "jotai"; @@ -26,52 +26,53 @@ const HomeContent = ({ personalities, href, title, debateClaims, reviews }) => { return ( <> - - + - - + + - + {Array.isArray(debateClaims) && debateClaims.length > 0 && ( - - + )} - + - + {!isLoggedIn && ( - + - + )} - + - - + + ); }; diff --git a/src/components/InputTextList.tsx b/src/components/InputTextList.tsx index 296be4a47..0c8c5b38b 100644 --- a/src/components/InputTextList.tsx +++ b/src/components/InputTextList.tsx @@ -1,6 +1,6 @@ import * as React from "react"; -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import { DeleteOutlined, PlusOutlined } from "@ant-design/icons"; import { useFieldArray, useForm } from "react-hook-form"; @@ -59,14 +59,14 @@ export default function InputTextList({
{controlledFields.map((_field, index) => { return ( - - 0 ? 20 : 24}> + 0 ? 10 : 12}> - + {index > 0 && ( - + - + )} - + ); })} diff --git a/src/components/SentenceReport/SentenceReportPreviewView.tsx b/src/components/SentenceReport/SentenceReportPreviewView.tsx index f817b77f2..2d6aada7f 100644 --- a/src/components/SentenceReport/SentenceReportPreviewView.tsx +++ b/src/components/SentenceReport/SentenceReportPreviewView.tsx @@ -1,5 +1,5 @@ import { useSelector } from "@xstate/react"; -import { Col, Row } from "antd"; +import { Grid } from "@mui/material" import React, { useContext } from "react"; import { ReviewTaskMachineContext } from "../../machines/reviewTask/ReviewTaskMachineProvider"; @@ -91,7 +91,7 @@ const SentenceReportPreviewView = ({ return ( reviewTaskType !== ReviewTaskTypeEnum.VerificationRequest && ( - - - + )} - + ) ); }; diff --git a/src/components/SharedFormFooter.tsx b/src/components/SharedFormFooter.tsx index b47ca5ca1..70bc08ffb 100644 --- a/src/components/SharedFormFooter.tsx +++ b/src/components/SharedFormFooter.tsx @@ -1,7 +1,7 @@ // File: src/components/SharedFormFooter.js import React, { useRef } from "react"; -import { Row } from "antd"; +import { Grid } from "@mui/material" import { useTranslation } from "next-i18next"; import { useRouter } from "next/router"; import AletheiaCaptcha from "./AletheiaCaptcha"; @@ -15,7 +15,7 @@ const SharedFormFooter = ({ isLoading, setRecaptchaString, hasCaptcha }) => { return ( <> - { > {t("claimForm:saveButton")} - + ); };