Skip to content

[ReviewEntries] Migrate from deprecations #3883

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

Merged
imnasnainaec merged 22 commits into from
Aug 19, 2025
Merged

[ReviewEntries] Migrate from deprecations #3883

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
b1b6e34
[WordCard, ReviewEntriesCompleted] Migrate from deprecated Grid
imnasnainaec Jun 17, 2025
66a88c3
Also ReviewEntries
imnasnainaec Jun 17, 2025
b6b8e8b
[EditDialog] Move testing to @testing-library
imnasnainaec Jun 17, 2025
a4d90d1
[EditSenseDialog] Move testing to @testing-library
imnasnainaec Jun 17, 2025
1866e8d
Merge branch 'master' into rev-entries-completed
imnasnainaec Jun 17, 2025
e387eb3
Tidy
imnasnainaec Jun 17, 2025
85b1214
Merge branch 'master' into rev-entries-completed
imnasnainaec Jun 18, 2025
4c89238
Restore necessary i18n mock
imnasnainaec Jun 18, 2025
d0ea8fb
Tidy
imnasnainaec Jun 18, 2025
8886e74
[ReviewEntriesTable] Migrate tests to @testing-library
imnasnainaec Jun 18, 2025
aad4ceb
Simplify row-order check
imnasnainaec Jun 18, 2025
2743567
Drop unneeded color adjustment
imnasnainaec Jun 19, 2025
972e1b6
Use color shorthand
imnasnainaec Jun 19, 2025
f32d889
Merge branch 'master' into rev-entries-completed
imnasnainaec Jun 23, 2025
4604e9a
Merge branch 'master' into rev-entries-completed
imnasnainaec Aug 13, 2025
5af9447
Tidy
imnasnainaec Aug 13, 2025
e7aa23d
Merge branch 'master' into rev-entries-completed
imnasnainaec Aug 13, 2025
dcac011
Merge branch 'master' into rev-entries-completed
imnasnainaec Aug 15, 2025
db93f18
Update DomainChip
imnasnainaec Aug 15, 2025
5ea9cab
Extract #3933
imnasnainaec Aug 15, 2025
43d78f5
Consolidate text ids
imnasnainaec Aug 18, 2025
7729988
Merge branch 'master' into rev-entries-completed
imnasnainaec Aug 19, 2025
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
14 changes: 8 additions & 6 deletions src/goals/ReviewEntries/ReviewEntriesTable/Cells/DomainsCell.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Chip, Grid } from "@mui/material";
import { Chip, Grid2 } from "@mui/material";
import { type ReactElement } from "react";

import { type SemanticDomain, type Sense } from "api/models";
Expand All @@ -19,12 +19,14 @@ export function gatherDomains(senses: Sense[]): SemanticDomain[] {

export default function DomainsCell(props: CellProps): ReactElement {
return (
<Grid container direction="row" spacing={1}>
<Grid2 container spacing={1}>
{gatherDomains(props.word.senses).map((dom) => (
<Grid item key={`${dom.id}-${dom.name}`}>
<Chip label={`${dom.id}: ${dom.name}`} style={{ color: "inherit" }} />
</Grid>
<Chip
key={`${dom.id}-${dom.name}`}
label={`${dom.id}: ${dom.name}`}
sx={{ color: "inherit" }}
/>
))}
</Grid>
</Grid2>
);
}
265 changes: 135 additions & 130 deletions src/goals/ReviewEntries/ReviewEntriesTable/Cells/EditCell/EditDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,11 @@ import {
Dialog,
DialogContent,
DialogTitle,
Grid,
Grid2,
IconButton,
MenuItem,
Select,
Stack,
type SelectChangeEvent,
} from "@mui/material";
import { grey, yellow } from "@mui/material/colors";
Expand All @@ -42,7 +43,6 @@ import {
} from "goals/ReviewEntries/ReviewEntriesTable/Cells/EditCell/utilities";
import { useAppSelector } from "rootRedux/hooks";
import { type StoreState } from "rootRedux/types";
import { themeColors } from "types/theme";
import {
type FileWithSpeakerId,
newPronunciation,
Expand Down Expand Up @@ -83,6 +83,16 @@ export enum EditDialogId {
TextFieldVernacular = "edit-dialog-vernacular-textfield",
}

export enum EditDialogTextId {
CardFlag = "reviewEntries.columns.flag",
CardNote = "reviewEntries.columns.note",
CardPronunciations = "reviewEntries.columns.pronunciations",
CardSenses = "reviewEntries.columns.senses",
CardVernacular = "reviewEntries.columns.vernacular",
DialogCancel = "reviewEntries.discardChanges",
TitlePrefix = "reviewEntries.columns.edit",
}

enum EditField {
Flag,
Note,
Expand Down Expand Up @@ -333,155 +343,150 @@ export default function EditDialog(props: EditDialogProps): ReactElement {
handleCancel={() => setCancelDialog(false)}
handleConfirm={cancelAndClose}
open={cancelDialog}
text="reviewEntries.discardChanges"
text={EditDialogTextId.DialogCancel}
/>
<Dialog fullWidth maxWidth="lg" open>
<DialogTitle>
<Grid container justifyContent="space-between">
<Grid item>
{t("reviewEntries.columns.edit")}
{" : "}
{props.word.vernacular}
</Grid>
<Grid item>
<IconButton id={EditDialogId.ButtonSave} onClick={saveAndClose}>
<Check style={{ color: themeColors.success }} />
<Grid2 container justifyContent="space-between">
{`${t(EditDialogTextId.TitlePrefix)} : ${props.word.vernacular}`}

<div>
<IconButton
data-testid={EditDialogId.ButtonSave}
id={EditDialogId.ButtonSave}
onClick={saveAndClose}
>
<Check sx={{ color: "success.main" }} />
</IconButton>

<IconButton
data-testid={EditDialogId.ButtonCancel}
id={EditDialogId.ButtonCancel}
onClick={conditionalCancel}
>
<Close style={{ color: themeColors.error }} />
<Close sx={{ color: "error.main" }} />
</IconButton>
</Grid>
</Grid>
</div>
</Grid2>
</DialogTitle>

<DialogContent>
<Grid
container
direction="column"
justifyContent="flex-start"
spacing={3}
>
<Stack spacing={3}>
{/* Vernacular */}
<Grid item>
<Card sx={bgStyle(EditField.Vernacular)}>
<CardHeader title={t("reviewEntries.columns.vernacular")} />
<CardContent>
<TextFieldWithFont
id={EditDialogId.TextFieldVernacular}
label={vernLang}
onChange={(e) =>
setNewWord((prev) => ({
...prev,
vernacular: e.target.value,
}))
}
value={newWord.vernacular}
vernacular
/>
</CardContent>
</Card>
</Grid>

{/* Senses */}
<Grid item>
<Card sx={bgStyle(EditField.Senses)}>
<CardHeader
action={
newWord.senses.length > 1 && (
<IconButton
id={EditDialogId.ButtonSensesViewToggle}
onClick={() => setShowSenses((prev) => !prev)}
>
{showSenses ? (
<CloseFullscreen sx={{ color: "gray" }} />
) : (
<OpenInFull sx={{ color: "gray" }} />
)}
</IconButton>
)
<Card sx={bgStyle(EditField.Vernacular)}>
<CardHeader title={t(EditDialogTextId.CardVernacular)} />
<CardContent>
<TextFieldWithFont
id={EditDialogId.TextFieldVernacular}
inputProps={{
"data-testid": EditDialogId.TextFieldVernacular,
}}
label={vernLang}
onChange={(e) =>
setNewWord((prev) => ({
...prev,
vernacular: e.target.value,
}))
}
title={t("reviewEntries.columns.senses")}
/>
<EditSensesCardContent
moveSense={moveSense}
newSenses={newWord.senses}
oldSenses={props.word.senses}
showSenses={showSenses}
toggleSenseDeleted={toggleSenseDeleted}
updateOrAddSense={updateOrAddSense}
value={newWord.vernacular}
vernacular
/>
</Card>
</Grid>
</CardContent>
</Card>

{/* Senses */}
<Card sx={bgStyle(EditField.Senses)}>
<CardHeader
action={
newWord.senses.length > 1 && (
<IconButton
data-testid={EditDialogId.ButtonSensesViewToggle}
id={EditDialogId.ButtonSensesViewToggle}
onClick={() => setShowSenses((prev) => !prev)}
>
{showSenses ? (
<CloseFullscreen sx={{ color: "gray" }} />
) : (
<OpenInFull sx={{ color: "gray" }} />
)}
</IconButton>
)
}
title={t(EditDialogTextId.CardSenses)}
/>
<EditSensesCardContent
moveSense={moveSense}
newSenses={newWord.senses}
oldSenses={props.word.senses}
showSenses={showSenses}
toggleSenseDeleted={toggleSenseDeleted}
updateOrAddSense={updateOrAddSense}
/>
</Card>

{/* Pronunciations */}
<Grid item>
<Card sx={bgStyle(EditField.Pronunciations)}>
<CardHeader title={t("reviewEntries.columns.pronunciations")} />
<CardContent>
<PronunciationsFrontend
elemBetweenRecordAndPlay={
<PronunciationsBackend
audio={newWord.audio}
deleteAudio={delOldAudio}
overrideMemo
playerOnly
replaceAudio={repOldAudio}
wordId={newWord.id}
/>
}
audio={newAudio}
deleteAudio={delNewAudio}
replaceAudio={repNewAudio}
uploadAudio={uplNewAudio}
/>
</CardContent>
</Card>
</Grid>
<Card sx={bgStyle(EditField.Pronunciations)}>
<CardHeader title={t(EditDialogTextId.CardPronunciations)} />
<CardContent>
<PronunciationsFrontend
elemBetweenRecordAndPlay={
<PronunciationsBackend
audio={newWord.audio}
deleteAudio={delOldAudio}
overrideMemo
playerOnly
replaceAudio={repOldAudio}
wordId={newWord.id}
/>
}
audio={newAudio}
deleteAudio={delNewAudio}
replaceAudio={repNewAudio}
uploadAudio={uplNewAudio}
/>
</CardContent>
</Card>

{/* Note */}
<Grid item>
<Card sx={bgStyle(EditField.Note)}>
<CardHeader
action={noteLangSelect}
title={t("reviewEntries.columns.note")}
<Card sx={bgStyle(EditField.Note)}>
<CardHeader
action={noteLangSelect}
title={t(EditDialogTextId.CardNote)}
/>
<CardContent>
<TextFieldWithFont
analysis
fullWidth
id={EditDialogId.TextFieldNote}
inputProps={{ "data-testid": EditDialogId.TextFieldNote }}
lang={newWord.note.language}
multiline
onChange={(e) => updateNoteText(e.target.value)}
value={newWord.note.text}
/>
<CardContent>
<TextFieldWithFont
analysis
fullWidth
id={EditDialogId.TextFieldNote}
lang={newWord.note.language}
multiline
onChange={(e) => updateNoteText(e.target.value)}
value={newWord.note.text}
/>
</CardContent>
</Card>
</Grid>
</CardContent>
</Card>

{/* Flag */}
<Grid item>
<Card sx={bgStyle(EditField.Flag)}>
<CardHeader title={t("reviewEntries.columns.flag")} />
<CardContent>
<IconButton onClick={toggleFlag}>
{newWord.flag.active ? (
<FlagFilled sx={{ color: themeColors.error }} />
) : (
<FlagOutlined />
)}
</IconButton>
<NormalizedTextField
id={EditDialogId.TextFieldFlag}
onChange={(e) => updateFlag(e.target.value)}
value={newWord.flag.active ? newWord.flag.text : ""}
/>
</CardContent>
</Card>
</Grid>
</Grid>
<Card sx={bgStyle(EditField.Flag)}>
<CardHeader title={t(EditDialogTextId.CardFlag)} />
<CardContent>
<IconButton onClick={toggleFlag}>
{newWord.flag.active ? (
<FlagFilled sx={{ color: "error.main" }} />
) : (
<FlagOutlined />
)}
</IconButton>
<NormalizedTextField
id={EditDialogId.TextFieldFlag}
inputProps={{ "data-testid": EditDialogId.TextFieldFlag }}
onChange={(e) => updateFlag(e.target.value)}
value={newWord.flag.active ? newWord.flag.text : ""}
/>
</CardContent>
</Card>
</Stack>
</DialogContent>
</Dialog>
</>
Expand Down
Loading
Loading