Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adapting imports of {Row} alone and { Row, Col } together to Grid/mui #1656

Merged
merged 2 commits into from
Dec 18, 2024
Merged

Adapting imports of {Row} alone and { Row, Col } together to Grid/mui #1656

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8d4438b
Change just Rows alone antd for muy
LuizFNJ Dec 16, 2024
6a52842
Change {Row, Col} together to grid/muy
LuizFNJ Dec 17, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/CardBase.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { Row } from "antd";
import { Grid } from "@mui/material"
import colors from "../styles/colors";

const CardBase = ({ children, style = {} }) => {
return (
<Row style={{
<Grid container style={{
background: colors.white,
border: `1px solid ${colors.lightNeutralSecondary}`,
boxSizing: "border-box",
Expand All @@ -13,7 +13,7 @@ const CardBase = ({ children, style = {} }) => {
...style
}}>
{children}
</Row>
</Grid>
)
}

Expand Down
18 changes: 9 additions & 9 deletions src/components/Claim/ClaimListView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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";
Expand All @@ -8,19 +8,19 @@ const ClaimListView = () => {
const { t } = useTranslation();
return (
<>
<Row justify="center" style={{ marginTop: "64px" }}>
<Col sm={22} md={14} lg={21}>
<Grid container style={{ marginTop: "64px", justifyContent:"center" }}>
<Grid item sm={11} md={7} lg={10.5}>
<h1 style={{ fontSize: 32 }}>
{t("claim:claimListTitle")}
</h1>
</Col>
<Col sm={22} md={14} lg={12}>
</Grid>
<Grid item sm={11} md={7} lg={6}>
<SourceList />
</Col>
<Col offset={1} sm={22} md={14} lg={8}>
</Grid>
<Grid item style={{margin:"0 20px"}} sm={11} md={7} lg={4}>
<ClaimList columns={1} personality={{ _id: null }} />
</Col>
</Row>
</Grid>
</Grid>
</>
);
};
Expand Down
4 changes: 2 additions & 2 deletions src/components/Claim/ClaimSummary.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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;
Expand Down
3 changes: 2 additions & 1 deletion src/components/Claim/CreateClaim/ClaimSelectType.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,8 +53,9 @@ const ClaimSelectType = () => {
</p>
</div>

<Grid
<Grid container
style={{
gap: "10px",
margin: "24px 0",
display: "flex",
justifyContent: "space-evenly",
Expand Down
6 changes: 3 additions & 3 deletions src/components/Claim/CreateClaim/ClaimUploadImage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { useState } from "react";
import { Row } from "antd";
import { Grid } from "@mui/material"
import { UploadFile } from "antd/lib/upload/interface";
import { useAtom } from "jotai";
import { useTranslation } from "next-i18next";
Expand Down Expand Up @@ -94,13 +94,13 @@ const ClaimUploadImage = () => {
isLoading={isLoading}
dateExtraText={t("claimForm:dateFieldHelpImage")}
content={
<Row style={{ marginBottom: 24 }}>
<Grid container style={{ marginBottom: 24 }}>
<Label required>{t("claimForm:fileInputButton")}</Label>
<ImageUpload
onChange={handleAntdChange}
error={imageError}
/>
</Row>
</Grid>
}
/>
</>
Expand Down
10 changes: 5 additions & 5 deletions src/components/Claim/CreateClaim/CreateClaimView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Col, Row } from "antd";
import { Grid } from "@mui/material"
import { useAtom } from "jotai";
import React, { useState } from "react";

Expand Down Expand Up @@ -77,8 +77,8 @@ const CreateClaimView = () => {
};

return (
<Row justify="center">
<Col span={18} style={{ marginTop: 32 }}>
<Grid container style={{justifyContent:"center"}}>
<Grid item xs={9} style={{ marginTop: 32 }}>
{!isLoading &&
claimData?.group &&
claimData?.group?.content?.length > 0 && (
Expand All @@ -101,7 +101,7 @@ const CreateClaimView = () => {
{addDebate && <ClaimCreateDebate />}
{isLoading && <Loading />}
{addUnattributed && <ClaimCreate />}
</Col>
</Grid>

<VerificationRequestDrawer
groupContent={claimData.group.content}
Expand All @@ -110,7 +110,7 @@ const CreateClaimView = () => {
onCloseDrawer={onCloseDrawer}
onRemove={onRemove}
/>
</Row>
</Grid>
);
};

Expand Down
20 changes: 10 additions & 10 deletions src/components/ClaimReview/ClaimReviewDrawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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";
Expand Down Expand Up @@ -62,16 +62,16 @@ const ClaimReviewDrawer = () => {
}
>
<VisualEditorProvider data_hash={data_hash}>
<Row
justify="space-between"
<Grid container
style={{
width: "100%",
padding: "1rem",
display: "flex",
flexDirection: "column",
justifyContent:"space-between"
}}
>
<Col style={{ display: "flex", gap: 32 }}>
<Grid item style={{ display: "flex", gap: 32 }}>
<AletheiaButton
icon={<ArrowLeftOutlined />}
onClick={() =>
Expand All @@ -82,7 +82,7 @@ const ClaimReviewDrawer = () => {
>
{t("common:back_button")}
</AletheiaButton>
<Col span={vw?.xs ? 8 : 14}>
<Grid item xs={vw?.xs ? 4 : 7}>
<AletheiaButton
href={generateReviewContentPath(
nameSpace,
Expand All @@ -102,10 +102,10 @@ const ClaimReviewDrawer = () => {
>
{t("reviewTask:seeFullPage")}
</AletheiaButton>
</Col>
</Col>
</Grid>
</Grid>
{enableCopilotChatBot && (
<Col
<Grid item
style={{
display: "flex",
justifyContent: "center",
Expand All @@ -128,9 +128,9 @@ const ClaimReviewDrawer = () => {
>
{t("copilotChatBot:copilotWarning")}
</span>
</Col>
</Grid>
)}
</Row>
</Grid>
<ClaimReviewView
personality={personality}
target={target}
Expand Down
11 changes: 6 additions & 5 deletions src/components/ClaimReview/ClaimReviewForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Col, Row } from "antd";
import { Grid } from "@mui/material"
import React, { useContext, useEffect, useState } from "react";
import {
reviewingSelector,
Expand Down Expand Up @@ -72,13 +72,14 @@ const ClaimReviewForm = ({
}, [isUnassigned]);

return (
<Row
<Grid container
style={{
background: colors.lightNeutral,
padding: "20px 15px",
justifyContent:"center"
}}
>
<Col span={componentStyle.span} offset={componentStyle.offset}>
<Grid item xs={componentStyle.span}>
{formCollapsed && (
<ReportModelButtons setFormCollapsed={setFormCollapsed} />
)}
Expand All @@ -90,8 +91,8 @@ const ClaimReviewForm = ({
target={target?._id}
/>
)}
</Col>
</Row>
</Grid>
</Grid>
);
};

Expand Down
28 changes: 12 additions & 16 deletions src/components/ClaimReview/ClaimReviewHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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";
Expand Down Expand Up @@ -45,25 +45,21 @@ const ClaimReviewHeader = ({
reviewTaskType === ReviewTaskTypeEnum.VerificationRequest;

return (
<Row
<Grid container
style={{
justifyContent:"center",
background:
isPublished &&
reviewTaskType !== ReviewTaskTypeEnum.VerificationRequest
? "none"
: colors.lightNeutral,
}}
>
<Col offset={componentStyle.offset} span={componentStyle.span}>
<Row>
<Col
lg={{
order: 1,
span: 24,
}}
md={{ order: 2, span: 24 }}
sm={{ order: 2, span: 24 }}
xs={{ order: 2, span: 24 }}
<Grid item xs={componentStyle.span}>
<Grid container>
<Grid item
xs={12}
order={{ xs: 2, lg: 1 }}
>
<SentenceReportCard
personality={personality}
Expand All @@ -84,16 +80,16 @@ const ClaimReviewHeader = ({
topics={content?.topics || []}
/>
)}
</Col>
</Grid>

<ReviewAlert
isHidden={isHidden}
isPublished={isPublished}
hideDescription={hideDescription}
/>
</Row>
</Col>
</Row>
</Grid>
</Grid>
</Grid>
);
};

Expand Down
6 changes: 2 additions & 4 deletions src/components/ClaimReview/ClaimReviewView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand Down
12 changes: 6 additions & 6 deletions src/components/ClaimReview/ReportModelButtons.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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 {
Expand Down Expand Up @@ -28,15 +28,15 @@ const ReportModelButtons = ({ setFormCollapsed }) => {
};

return (
<Row
<Grid container
style={{
width: "100%",
padding: "0px 0px 15px 0px",
justifyContent: "center",
}}
>
<Col
span={24}
<Grid item
xs={12}
style={{
display: "flex",
justifyContent: "center",
Expand Down Expand Up @@ -102,8 +102,8 @@ const ReportModelButtons = ({ setFormCollapsed }) => {
)}
</>
)}
</Col>
</Row>
</Grid>
</Grid>
);
};

Expand Down
11 changes: 6 additions & 5 deletions src/components/ClaimReview/form/DynamicReviewTaskForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -244,10 +244,11 @@ const DynamicReviewTaskForm = ({ data_hash, personality, target }) => {
</>
)}
{showButtons && (
<Row
<Grid container
style={{
padding: "32px 0 0",
justifyContent: "space-evenly",
gap: "10px"
}}
>
{events?.map((event) => {
Expand All @@ -266,7 +267,7 @@ const DynamicReviewTaskForm = ({ data_hash, personality, target }) => {
</AletheiaButton>
);
})}
</Row>
</Grid>
)}

<WarningModal
Expand Down
Loading
Loading