Skip to content

Commit

Permalink
Merge branch 'develop' into MAT-7652
Browse files Browse the repository at this point in the history
  • Loading branch information
adongare committed Dec 3, 2024
2 parents f76460e + de07798 commit 759d561
Show file tree
Hide file tree
Showing 4 changed files with 46 additions and 68 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ describe("Results Section component", () => {
expect(resultsContent).toBeInTheDocument();
let applyBtn;
await act(async () => {
applyBtn = await findByTestId(resultsContent, "select-action-0_apply");
applyBtn = await findByTestId(resultsContent, "apply-code-0");
expect(applyBtn).toBeDefined();
userEvent.click(applyBtn);
});
Expand All @@ -95,7 +95,7 @@ describe("Results Section component", () => {
expect(resultsContent).toBeInTheDocument();
let applyBtn;
await act(async () => {
applyBtn = await findByTestId(resultsContent, "select-action-0_apply");
applyBtn = await findByTestId(resultsContent, "apply-code-0");
expect(applyBtn).toBeDefined();
userEvent.click(applyBtn);
});
Expand Down Expand Up @@ -125,12 +125,6 @@ describe("Results Section component", () => {
"DoNotDisturbOnIcon"
);

await waitFor(() => {
const selectButton = screen.getByTestId(`select-action-0_apply`);
expect(selectButton).toBeInTheDocument();
userEvent.click(selectButton);
});

const editButton = screen.getByTestId(`edit-code-0`);
expect(editButton).toBeInTheDocument();

Expand Down Expand Up @@ -158,11 +152,7 @@ describe("Results Section component", () => {
{ ...mockCode, status: CodeStatus.NA },
"DoNotDisturbOnIcon"
);
await waitFor(() => {
const selectButton = screen.getByTestId(`select-action-0_apply`);
expect(selectButton).toBeInTheDocument();
userEvent.click(selectButton);
});

const editButton = screen.getByTestId(`edit-code-0`);
userEvent.click(editButton);
await waitFor(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ import CheckCircleIcon from "@mui/icons-material/CheckCircle";
import DoDisturbOutlinedIcon from "@mui/icons-material/DoDisturbOutlined";
import DoNotDisturbOnIcon from "@mui/icons-material/DoNotDisturbOn";
import ExpandingSection from "../../../../common/ExpandingSection";
import ControlPointIcon from "@mui/icons-material/ControlPoint";
import BorderColorOutlinedIcon from "@mui/icons-material/BorderColorOutlined";

import {
useReactTable,
Expand All @@ -15,7 +17,6 @@ import {
import { Code, CodeStatus } from "../../../../api/useTerminologyServiceApi";
import ToolTippedIcon from "../../../../toolTippedIcon/ToolTippedIcon";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import { Popover } from "@madie/madie-design-system/dist/react";
import "./ResultsSection.scss";
import EditCodeDetailsDialog from "../common/EditCodeDetailsDialog";

Expand All @@ -41,9 +42,6 @@ export default function ResultsSection({
code,
handleApplyCode,
}: ResultSectionProps) {
const [optionsOpen, setOptionsOpen] = useState<boolean>(false);
const [anchorEl, setAnchorEl] = useState(null);
const [selectedReferenceId, setSelectedReferenceId] = useState<string>(null);
const [selectedCodeDetails, setSelectedCodeDetails] =
useState<ResultsColumnRow>(null);
const [openEditCodeDialog, setOpenEditCodeDialog] = useState<boolean>(false);
Expand All @@ -52,18 +50,9 @@ export default function ResultsSection({
selectedId,
event: React.MouseEvent<HTMLButtonElement>
) => {
setOptionsOpen(true);
setSelectedReferenceId(selectedId);
setAnchorEl(event.currentTarget);
setSelectedCodeDetails(table.getRow(selectedId).original);
};

const handleClose = () => {
setOptionsOpen(false);
setSelectedReferenceId(null);
setAnchorEl(null);
};

const data = [code];
const columns = useMemo<ColumnDef<ResultsColumnRow>[]>(
() => [
Expand Down Expand Up @@ -91,19 +80,38 @@ export default function ResultsSection({
header: "",
accessorKey: "apply",
cell: (row: any) => (
<div className="inline-flex gap-x-2">
<button
className="action-button"
onClick={(e) => handleOpen(row.cell.row.id, e)}
tw="text-blue-600 hover:text-blue-900"
data-testid={`select-action-${row.cell.id}`}
aria-label={`select-action-${row.cell.id}`}
<div className="inline-flex gap-x-2" style={{ width: "max-content" }}>
<ToolTippedIcon
tooltipMessage="Edit"
buttonProps={{
"data-testid": `edit-code-${row.cell.row.id}`,
"aria-label": `edit-code-${row.cell.row.id}`,
size: "small",
onClick: (e) => {
setSelectedCodeDetails(
table.getRow(row.cell.row.id).original
);
handleEditCode();
},
}}
>
<BorderColorOutlinedIcon color="primary" />
</ToolTippedIcon>
<ToolTippedIcon
tooltipMessage="Apply"
buttonProps={{
"data-testid": `apply-code-${row.cell.row.id}`,
"aria-label": `apply-code-${row.cell.row.id}`,
size: "small",
onClick: (e) => {
const selectedCode = table.getRow(row.cell.row.id).original;
setSelectedCodeDetails(selectedCode);
handleApplyCodeInner(selectedCode);
},
}}
>
<div className="action">Select</div>
<div className="chevron-container">
<ExpandMoreIcon />
</div>
</button>
<ControlPointIcon color="primary" />
</ToolTippedIcon>
</div>
),
},
Expand All @@ -116,17 +124,15 @@ export default function ResultsSection({
columns,
getCoreRowModel: getCoreRowModel(),
});
const handleApplyCodeInner = () => {
handleApplyCode(selectedCodeDetails);
setOptionsOpen(false);
const handleApplyCodeInner = (selectedCode) => {
handleApplyCode(selectedCode);
};

const toggleEditCodeDialogState = () => {
setOpenEditCodeDialog(!open);
};

const handleEditCode = () => {
setOptionsOpen(false);
setOpenEditCodeDialog(true);
};

Expand Down Expand Up @@ -207,24 +213,6 @@ export default function ResultsSection({
))
)}
</tbody>
<Popover
optionsOpen={optionsOpen}
anchorEl={anchorEl}
handleClose={handleClose}
canEdit={true}
editViewSelectOptionProps={{
label: "Apply",
toImplementFunction: () => handleApplyCodeInner(),
dataTestId: `apply-code-${selectedReferenceId}`,
}}
otherSelectOptionProps={[
{
label: "Edit",
toImplementFunction: () => handleEditCode(),
dataTestId: `edit-code-${selectedReferenceId}`,
},
]}
/>
</table>
<EditCodeDetailsDialog
selectedCodeDetails={selectedCodeDetails}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ describe("Saved Codes section component", () => {
const editButton = getByTestId(`edit-code-0`);
expect(editButton).toBeInTheDocument();

const removeButton = getByTestId(`remove-code-0`);
const removeButton = getByTestId(`delete-code-0`);
expect(removeButton).toBeInTheDocument();

userEvent.click(editButton);
Expand Down Expand Up @@ -218,7 +218,7 @@ describe("Saved Codes section component", () => {
const editButton = getByTestId(`edit-code-0`);
expect(editButton).toBeInTheDocument();

const removeButton = getByTestId(`remove-code-0`);
const removeButton = getByTestId(`delete-code-0`);
expect(removeButton).toBeInTheDocument();

userEvent.click(removeButton);
Expand Down Expand Up @@ -251,7 +251,7 @@ describe("Saved Codes section component", () => {
);
await checkRows(2);

const removeButton = getByTestId(`remove-code-0`);
const removeButton = getByTestId(`delete-code-0`);
expect(removeButton).toBeInTheDocument();

userEvent.click(removeButton);
Expand Down Expand Up @@ -279,7 +279,7 @@ describe("Saved Codes section component", () => {
);
await checkRows(2);

const removeButton = getByTestId(`remove-code-0`);
const removeButton = getByTestId(`delete-code-0`);
expect(removeButton).toBeInTheDocument();

userEvent.click(removeButton);
Expand Down Expand Up @@ -313,7 +313,7 @@ describe("Saved Codes section component", () => {
);
await checkRows(2);

const removeButton = getByTestId(`remove-code-0`);
const removeButton = getByTestId(`delete-code-0`);
expect(removeButton).toBeInTheDocument();

userEvent.click(removeButton);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -223,10 +223,10 @@ export default function SavedCodesSubSection({
{canEdit ? (
<>
<ToolTippedIcon
tooltipMessage="Remove"
tooltipMessage="Delete"
buttonProps={{
"data-testid": `remove-code-${row.cell.row.id}`,
"aria-label": `remove-code-${row.cell.row.id}`,
"data-testid": `delete-code-${row.cell.row.id}`,
"aria-label": `delete-code-${row.cell.row.id}`,
size: "small",
onClick: (e) => {
setSelectedCodeDetails(
Expand Down

0 comments on commit 759d561

Please sign in to comment.