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

MCR-4653: CMS does not see withdrawn rate reviews on dashboard by default #3083

Merged
merged 2 commits into from
Jan 16, 2025
Merged

MCR-4653: CMS does not see withdrawn rate reviews on dashboard by default #3083

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
6cd7027
Simplify getting filters from url and add default status filters
JasonLin0991 Jan 15, 2025
1b68df2
Rate table tests
JasonLin0991 Jan 15, 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
54 changes: 33 additions & 21 deletions services/app-web/src/pages/CMSDashboard/RateReviewsDashboard/RateReviewsTable.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,24 +87,19 @@ describe('RateReviewsTable', () => {

await waitFor(() => {
expect(
screen.getByText('Displaying 3 of 3 rate reviews')
screen.getByText('Displaying 2 of 3 rate reviews')
).toBeInTheDocument()
})
// expect filter accordion to be present
expect(screen.getByTestId('accordion')).toBeInTheDocument()
expect(
screen.getByText('0 filters applied')
).toBeInTheDocument()

// expect table caption
expect(
screen.getByText('Test table caption')
screen.getByText('2 filters applied')
).toBeInTheDocument()

const tableRows = screen.getAllByRole('row')

// expect there to be 4 rows, one of which is the header row
expect(tableRows).toHaveLength(4)
expect(tableRows).toHaveLength(3)

// expect rows to be in order where latest updatedAt is first in the array
// expect statuses to be drawn from the consolidatedStatus field
Expand All @@ -115,17 +110,17 @@ describe('RateReviewsTable', () => {
within(tableRows[1]).getByText('Unlocked')
).toBeInTheDocument()
expect(
within(tableRows[2]).getByText('rate-2-certification-name')
).toBeInTheDocument()
expect(
within(tableRows[2]).getByText('Withdrawn')
within(tableRows[2]).getByText('rate-1-certification-name')
).toBeInTheDocument()
expect(
within(tableRows[3]).getByText('rate-1-certification-name')
within(tableRows[2]).getByText('Submitted')
).toBeInTheDocument()

// expect WITHDRAWN rates to be not visible
expect(
within(tableRows[3]).getByText('Submitted')
).toBeInTheDocument()
screen.queryByText('rate-2-certification-name')
).toBeNull()
expect(screen.queryByText('Withdrawn')).toBeNull()
})
it('renders rates table correctly without filters, captions and no rates', async () => {
renderWithProviders(<RateReviewsTable tableData={[]} />, {
Expand Down Expand Up @@ -183,6 +178,12 @@ describe('RateReviewsTable', () => {
await userEvent.click(accordionButton)
})

// clear out default status filter
const clearFilterButton = screen.getByRole('button', {
name: /Clear filters/,
})
await userEvent.click(clearFilterButton)

//Look for state filter
const stateCombobox = within(stateFilter).getByRole('combobox')
expect(stateCombobox).toBeInTheDocument()
Expand Down Expand Up @@ -233,7 +234,7 @@ describe('RateReviewsTable', () => {

await waitFor(() => {
expect(
screen.getByText('Displaying 3 of 3 rate reviews')
screen.getByText('Displaying 2 of 3 rate reviews')
).toBeInTheDocument()
})

Expand All @@ -250,6 +251,14 @@ describe('RateReviewsTable', () => {
await userEvent.click(accordionButton)
})

// clear out default status filter
const clearFilterButton = screen.getByRole('button', {
name: /Clear filters/,
})
expect(clearFilterButton).toBeInTheDocument()

await userEvent.click(clearFilterButton)

const ratingPeriodFilter = screen.getByTestId(
'filter-date-range-picker'
)
Expand Down Expand Up @@ -317,11 +326,6 @@ describe('RateReviewsTable', () => {
screen.getByText('Displaying 2 of 3 rate reviews')
).toBeInTheDocument()

const clearFilterButton = screen.getByRole('button', {
name: /Clear filters/,
})
expect(clearFilterButton).toBeInTheDocument()

// Clear all filters
await userEvent.click(clearFilterButton)

Expand Down Expand Up @@ -357,6 +361,14 @@ describe('RateReviewsTable', () => {
await userEvent.click(accordionButton)
})

// clear out default status filter
const clearFilterButton = screen.getByRole('button', {
name: /Clear filters/,
})
expect(clearFilterButton).toBeInTheDocument()

await userEvent.click(clearFilterButton)

//Look for status filter
const statusCombobox =
within(statusFilter).getByRole('combobox')
Expand Down
56 changes: 22 additions & 34 deletions services/app-web/src/pages/CMSDashboard/RateReviewsDashboard/RateReviewsTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useState, useRef, useLayoutEffect } from 'react'
import React, { useEffect, useState, useRef } from 'react'
import {
ColumnFiltersState,
createColumnHelper,
Expand All @@ -13,9 +13,7 @@ import {
FilterFn,
} from '@tanstack/react-table'
import { useAtom } from 'jotai/react'
import { atom } from 'jotai'
import { atomWithHash } from 'jotai-location'
import { loadable } from 'jotai/vanilla/utils'
import {
HealthPlanPackageStatus,
Program,
Expand All @@ -34,7 +32,7 @@ import {
import { pluralize, titleCaseString } from '@mc-review/common-code'
import { DoubleColumnGrid } from '../../../components'
import { FilterDateRangeRef } from '../../../components/FilterAccordion/FilterDateRange/FilterDateRange'
import { Loading, NavLinkWithLogging } from '../../../components'
import { NavLinkWithLogging } from '../../../components'
import { useTealium } from '../../../hooks'
import useDeepCompareEffect from 'use-deep-compare-effect'
import { getTealiumFiltersChanged } from '../../../tealium/tealiumHelpers'
Expand Down Expand Up @@ -151,10 +149,6 @@ const columnHash = atomWithHash('filters', [] as ColumnFiltersState, {
deserialize: fromReadableUrlToColumnFilters,
})

/* This returns the url filters along with a loading status. This is used to prevent flickering on first load with filters
in the url. */
const loadableColumnHash = loadable(atom(async (get) => get(columnHash)))

/* transform react-table's ColumnFilterState (stringified, formatted, and stored in the URL) to react-select's FilterOptionType
and return only the items matching the FilterSelect component that's calling the function*/
const getSelectedFiltersFromColumnState = (
Expand Down Expand Up @@ -235,10 +229,6 @@ export const RateReviewsTable = ({
const lastClickedElement = useRef<string | null>(null)
const filterDateRangeRef = useRef<FilterDateRangeRef>(null)
const [columnFilters, setColumnFilters] = useAtom(columnHash)
const [defaultFiltersFromUrl] = useAtom(loadableColumnHash)
const [defaultColumnFilters, setDefaultColumnState] = useState<
ColumnFiltersState | undefined
>(undefined)
const [prevFilters, setPrevFilters] = useState<{
filtersForAnalytics: string
results?: string
Expand Down Expand Up @@ -516,15 +506,25 @@ export const RateReviewsTable = ({
)
}, [filtersApplied, submissionCount, caption, tableConfig.tableName])

useLayoutEffect(() => {
// Do not set default column state again
if (
defaultFiltersFromUrl.state === 'hasData' &&
!defaultColumnFilters
) {
setDefaultColumnState(defaultFiltersFromUrl.data)
useEffect(() => {
// if on root route
if (location.hash === '') {
updateFilters(
statusColumn,
[
{
label: 'Submitted',
value: 'SUBMITTED',
},
{
label: 'Unlocked',
value: 'UNLOCKED',
},
],
'status'
)
}
}, [defaultFiltersFromUrl, defaultColumnFilters])
}, [statusColumn])

useDeepCompareEffect(() => {
const prevFiltersForAnalytics = prevFilters.filtersForAnalytics
Expand Down Expand Up @@ -562,10 +562,6 @@ export const RateReviewsTable = ({
}
}, [submissionCount, columnFilters, setPrevFilters, prevFilters])

if (defaultColumnFilters === undefined) {
return <Loading />
}

return (
<>
{tableData.length ? (
Expand All @@ -580,10 +576,6 @@ export const RateReviewsTable = ({
columnFilters,
'stateName'
)}
defaultValue={getSelectedFiltersFromColumnState(
defaultColumnFilters,
'stateName'
)}
name="state"
label="State"
filterOptions={stateFilterOptions}
Expand All @@ -600,10 +592,6 @@ export const RateReviewsTable = ({
columnFilters,
'rateType'
)}
defaultValue={getSelectedFiltersFromColumnState(
defaultColumnFilters,
'rateType'
)}
name="rateType"
label="Rate Type"
filterOptions={rateTypeOptions}
Expand All @@ -625,7 +613,7 @@ export const RateReviewsTable = ({
id: 'ratingPeriodStartFrom',
name: 'ratingPeriodStartFrom',
defaultValue: getDateRangeFilterFromUrl(
defaultColumnFilters,
columnFilters,
'rateDateStart'
)[0],
onChange: (date) =>
Expand All @@ -641,7 +629,7 @@ export const RateReviewsTable = ({
id: 'ratingPeriodStartTo',
name: 'ratingPeriodStartTo',
defaultValue: getDateRangeFilterFromUrl(
defaultColumnFilters,
columnFilters,
'rateDateStart'
)[1],
onChange: (date) =>
Expand Down
Loading