Skip to content

Commit d63db8c

Browse files
author
caneppelevitor
committed
removing debug mode, enhancement on translations and tool bar redesign
1 parent e36a437 commit d63db8c

File tree

8 files changed

+181
-240
lines changed

8 files changed

+181
-240
lines changed

‎public/locales/en/reviewTask.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,8 +78,14 @@
7878
"recaptchaModalCancel": "Cancel",
7979

8080
"unassigned": "Unassigned",
81+
"cross-checking": "Cross-checking",
82+
"selectReviewer": "Selecting reviewer",
83+
"selectCrossChecker": "Selecting cross-checker",
84+
"addCommentCrossChecking": "Adding comment",
85+
"rejected": "Rejected",
8186

8287
"stageAssign": "Assign",
88+
"stageAssigned": "Assigned",
8389
"stageDraft": "Draft",
8490
"stageReview": "Review",
8591
"stageApproval": "Approval",

‎public/locales/pt/reviewTask.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,8 +78,14 @@
7878
"recaptchaModalCancel": "Cancelar",
7979

8080
"unassigned": "Não atribuído",
81+
"cross-checking": "Cross-checking",
82+
"selectReviewer": "Selecionando revisor",
83+
"selectCrossChecker": "Selecionando cross-checker",
84+
"addCommentCrossChecking": "Adicionando comentário",
85+
"rejected": "Rejeitado",
8186

8287
"stageAssign": "Atribuição",
88+
"stageAssigned": "Atribuído",
8389
"stageDraft": "Rascunho",
8490
"stageReview": "Revisão",
8591
"stageApproval": "Aprovação",

‎src/components/ClaimReview/form/ActionToolbar.tsx‎

Lines changed: 110 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
import React from "react";
2-
import { Grid } from "@mui/material";
1+
import React, { useMemo } from "react";
2+
import { Box } from "@mui/material";
33
import { useTranslation } from "next-i18next";
4+
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
5+
import SaveOutlinedIcon from "@mui/icons-material/SaveOutlined";
46
import AletheiaButton, { ButtonType } from "../../Button";
57
import {
68
ReviewTaskEvents,
@@ -26,16 +28,6 @@ const PRIMARY_ACTIONS: Partial<Record<ReviewTaskStates, ReviewTaskEvents>> = {
2628
[ReviewTaskStates.rejected]: ReviewTaskEvents.addRejectionComment,
2729
};
2830

29-
function getButtonType(
30-
event: ReviewTaskEvents,
31-
currentState: string
32-
): ButtonType {
33-
if (event === ReviewTaskEvents.goback) return ButtonType.gray;
34-
const primaryEvent = PRIMARY_ACTIONS[currentState as ReviewTaskStates];
35-
if (primaryEvent && event === primaryEvent) return ButtonType.blue;
36-
return ButtonType.whiteBlue;
37-
}
38-
3931
interface ActionToolbarProps {
4032
events: ReviewTaskEvents[];
4133
permissions: PermissionContext;
@@ -55,51 +47,127 @@ const ActionToolbar = ({
5547
}: ActionToolbarProps) => {
5648
const { t } = useTranslation();
5749

58-
const filteredEvents = events.filter(
59-
(event) =>
60-
event !== ReviewTaskEvents.draft &&
61-
permissions.canSubmitActions.includes(event)
62-
);
50+
const primaryEvent = PRIMARY_ACTIONS[currentState as ReviewTaskStates];
51+
52+
// Separate events into groups for proper layout
53+
const { goBackEvent, secondaryEvents, primaryActionEvent } = useMemo(() => {
54+
const allowed = events.filter(
55+
(event) =>
56+
event !== ReviewTaskEvents.draft &&
57+
permissions.canSubmitActions.includes(event)
58+
);
59+
60+
const goBack = allowed.find((e) => e === ReviewTaskEvents.goback);
61+
const primary = allowed.find((e) => e === primaryEvent);
62+
const secondary = allowed.filter(
63+
(e) => e !== ReviewTaskEvents.goback && e !== primary
64+
);
65+
66+
return {
67+
goBackEvent: goBack,
68+
secondaryEvents: secondary,
69+
primaryActionEvent: primary,
70+
};
71+
}, [events, permissions.canSubmitActions, primaryEvent]);
72+
73+
const showSaveDraft =
74+
permissions.showSaveDraftButton &&
75+
permissions.canSubmitActions.includes(ReviewTaskEvents.draft);
6376

6477
return (
65-
<Grid
66-
container
67-
style={{
68-
padding: "32px 0 0",
69-
justifyContent: "space-evenly",
70-
gap: "10px",
78+
<Box
79+
sx={{
80+
display: "flex",
81+
alignItems: "center",
82+
justifyContent: "space-between",
83+
padding: "12px 20px",
84+
position: "sticky",
85+
bottom: 0,
86+
backgroundColor: "inherit",
87+
borderTop: "1px solid rgba(0, 0, 0, 0.12)",
88+
zIndex: 10,
89+
gap: "12px",
7190
}}
7291
>
73-
{permissions.showSaveDraftButton &&
74-
permissions.canSubmitActions.includes(
75-
ReviewTaskEvents.draft
76-
) && (
92+
{/* Left group: navigation actions */}
93+
<Box sx={{ display: "flex", alignItems: "center", gap: "8px" }}>
94+
{goBackEvent && (
95+
<AletheiaButton
96+
loading={isLoading[goBackEvent]}
97+
type={ButtonType.gray}
98+
htmlType="button"
99+
onClick={() => onButtonClick(goBackEvent)}
100+
event={goBackEvent}
101+
data-cy={`testClaimReview${goBackEvent}`}
102+
icon={<ArrowBackIcon style={{ fontSize: 16 }} />}
103+
style={{ textTransform: "none", fontWeight: 500 }}
104+
>
105+
{t(`reviewTask:${goBackEvent}`)}
106+
</AletheiaButton>
107+
)}
108+
</Box>
109+
110+
{/* Right group: save + secondary + primary action */}
111+
<Box
112+
sx={{
113+
display: "flex",
114+
alignItems: "center",
115+
gap: "10px",
116+
flexWrap: "wrap",
117+
justifyContent: "flex-end",
118+
}}
119+
>
120+
{showSaveDraft && (
77121
<AletheiaButton
78122
loading={isLoading[ReviewTaskEvents.draft]}
79-
type={ButtonType.whiteBlue}
123+
type={ButtonType.whiteBlack}
80124
htmlType="button"
81125
onClick={() => onButtonClick(ReviewTaskEvents.draft)}
82126
event={ReviewTaskEvents.draft}
83127
data-cy={`testClaimReview${ReviewTaskEvents.draft}`}
128+
icon={<SaveOutlinedIcon style={{ fontSize: 16 }} />}
129+
style={{ textTransform: "none", fontWeight: 500 }}
84130
>
85131
{t(`reviewTask:${ReviewTaskEvents.draft}`)}
86132
</AletheiaButton>
87133
)}
88134

89-
{filteredEvents.map((event) => (
90-
<AletheiaButton
91-
loading={isLoading[event]}
92-
key={event}
93-
type={getButtonType(event, currentState)}
94-
htmlType={defineButtonHtmlType(event)}
95-
onClick={() => onButtonClick(event)}
96-
event={event}
97-
data-cy={`testClaimReview${event}`}
98-
>
99-
{t(`reviewTask:${event}`)}
100-
</AletheiaButton>
101-
))}
102-
</Grid>
135+
{secondaryEvents.map((event) => (
136+
<AletheiaButton
137+
loading={isLoading[event]}
138+
key={event}
139+
type={ButtonType.whiteBlack}
140+
htmlType={defineButtonHtmlType(event)}
141+
onClick={() => onButtonClick(event)}
142+
event={event}
143+
data-cy={`testClaimReview${event}`}
144+
style={{ textTransform: "none", fontWeight: 500 }}
145+
>
146+
{t(`reviewTask:${event}`)}
147+
</AletheiaButton>
148+
))}
149+
150+
{primaryActionEvent && (
151+
<AletheiaButton
152+
loading={isLoading[primaryActionEvent]}
153+
type={ButtonType.blue}
154+
htmlType={defineButtonHtmlType(primaryActionEvent)}
155+
onClick={() => onButtonClick(primaryActionEvent)}
156+
event={primaryActionEvent}
157+
data-cy={`testClaimReview${primaryActionEvent}`}
158+
style={{
159+
textTransform: "none",
160+
fontWeight: 600,
161+
minWidth: 140,
162+
height: 44,
163+
fontSize: "13px",
164+
}}
165+
>
166+
{t(`reviewTask:${primaryActionEvent}`)}
167+
</AletheiaButton>
168+
)}
169+
</Box>
170+
</Box>
103171
);
104172
};
105173

‎src/components/ClaimReview/form/DynamicReviewTaskForm.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,14 @@ const DynamicReviewTaskForm = ({
4545
formState: { errors },
4646
watch,
4747
} = useForm();
48-
const { reportModel } = useContext(ReviewTaskMachineContext);
49-
const { machineService, events, form, setFormAndEvents, reviewTaskType } =
50-
useContext(ReviewTaskMachineContext);
48+
const {
49+
reportModel,
50+
machineService,
51+
events,
52+
form,
53+
setFormAndEvents,
54+
reviewTaskType,
55+
} = useContext(ReviewTaskMachineContext);
5156
const isReviewing = useSelector(machineService, reviewingSelector);
5257
const isCrossChecking = useSelector(machineService, crossCheckingSelector);
5358
const isAddCommentCrossChecking = useSelector(

‎src/components/SentenceReport/FactCheckingInfo.tsx‎

Lines changed: 20 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -18,44 +18,43 @@ const FactCheckingInfo = () => {
1818
borderRadius: "8px",
1919
}}
2020
>
21-
<Box
22-
style={{
23-
display: "flex",
24-
alignItems: "center",
25-
gap: "12px"
21+
<Box
22+
style={{
23+
display: "flex",
24+
alignItems: "center",
25+
gap: "12px",
2626
}}
2727
>
28-
<InfoIcon
29-
style={{
28+
<InfoIcon
29+
style={{
3030
color: colors.blue,
31-
fontSize: "24px"
32-
}}
31+
fontSize: "24px",
32+
}}
3333
/>
3434
<div>
35-
<Typography
36-
variant="h6"
37-
style={{
35+
<Typography
36+
variant="h6"
37+
style={{
3838
color: colors.blue,
3939
fontWeight: 600,
40-
marginBottom: "4px"
40+
marginBottom: "4px",
4141
}}
4242
>
43-
{t("claimReview:factCheckingInProgress") || "Fact-checking in progress"}
43+
{t("claimReview:factCheckingInProgress")}
4444
</Typography>
45-
<Typography
46-
variant="body2"
47-
style={{
45+
<Typography
46+
variant="body2"
47+
style={{
4848
color: colors.blackSecondary,
49-
lineHeight: 1.5
49+
lineHeight: 1.5,
5050
}}
5151
>
52-
{t("claimReview:factCheckingInfoMessage") ||
53-
"This content is currently being fact-checked by our team. The report will be available once the review process is complete."}
52+
{t("claimReview:factCheckingInfoMessage")}
5453
</Typography>
5554
</div>
5655
</Box>
5756
</Paper>
5857
);
5958
};
6059

61-
export default FactCheckingInfo;
60+
export default FactCheckingInfo;

‎src/components/SentenceReport/SentenceReportHeader.tsx‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -81,12 +81,18 @@ const SentenceReportHeader = ({
8181
return "default";
8282
case ReviewTaskStates.assigned:
8383
return "primary";
84-
case ReviewTaskStates.submitted:
85-
return "warning";
86-
case ReviewTaskStates.crossChecking:
87-
return "info";
8884
case ReviewTaskStates.reported:
8985
return "secondary";
86+
case ReviewTaskStates.selectReviewer:
87+
case ReviewTaskStates.selectCrossChecker:
88+
return "secondary";
89+
case ReviewTaskStates.crossChecking:
90+
case ReviewTaskStates.addCommentCrossChecking:
91+
return "info";
92+
case ReviewTaskStates.submitted:
93+
return "warning";
94+
case ReviewTaskStates.rejected:
95+
return "error";
9096
case ReviewTaskStates.published:
9197
return "success";
9298
default:
@@ -104,8 +110,6 @@ const SentenceReportHeader = ({
104110
alignItems: "center",
105111
gap: "12px",
106112
flexWrap: "wrap",
107-
backgroundColor: "rgba(245, 245, 245, 0.5)",
108-
borderRadius: "8px",
109113
}}
110114
>
111115
{/* State chip */}

0 commit comments

Comments
 (0)