-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #23 from JosephGasiorekUSDS/jgasiorek-ffs-918
FFS-918: Ledger Review Screen
- Loading branch information
Showing
16 changed files
with
439 additions
and
64 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
import { Card, CardBody, CardGroup, CardHeader, GridContainer } from "@trussworks/react-uswds"; | ||
import { useTranslation } from "@/app/i18n/client"; | ||
import { useAppSelector } from "@/lib/hooks"; | ||
import { ExpenseItem, selectExpenseItems, selectExpenseTotal } from "@/lib/features/ledger/expenses/expensesSlice"; | ||
import ExpenseListItem from "./ExpenseListItem"; | ||
|
||
interface ExpenseListProps { | ||
header: string | ||
} | ||
|
||
export default function ExpenseList({header}: ExpenseListProps) { | ||
const { t } = useTranslation('en') | ||
const items = useAppSelector(state => selectExpenseItems(state)) | ||
const expenseTotal = useAppSelector(state => selectExpenseTotal(state)) | ||
|
||
const expenseItemElements = items.map((item: ExpenseItem, idx: number) => { | ||
return <ExpenseListItem key={idx} item={item} index={idx} /> | ||
}) | ||
|
||
function getTotal() { | ||
if (expenseTotal > 0) { | ||
return (t('expenses_summary_total', {amount: expenseTotal})) | ||
} | ||
|
||
return <></> | ||
} | ||
|
||
return ( | ||
<CardGroup> | ||
<Card className="grid-col-12 margin-top-4"> | ||
<CardHeader><b>{header}</b></CardHeader> | ||
<CardBody> | ||
<GridContainer> | ||
{expenseItemElements} | ||
</GridContainer> | ||
{ getTotal() } | ||
</CardBody> | ||
</Card> | ||
</CardGroup> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
'use client' | ||
|
||
import { IncomeItem, selectIncomeItems, selectIncomeTotal } from "@/lib/features/ledger/income/incomeSlice" | ||
import { useAppSelector } from "@/lib/hooks" | ||
import IncomeListItem from "./IncomeListItem" | ||
import { Card, CardBody, CardGroup, CardHeader, GridContainer } from "@trussworks/react-uswds" | ||
import { useTranslation } from "@/app/i18n/client" | ||
|
||
interface Props { | ||
dayCount: number | ||
header: string | ||
} | ||
|
||
export default function IncomeList({dayCount, header}: Props) { | ||
const { t } = useTranslation('en') | ||
const items = useAppSelector(state => selectIncomeItems(state)) | ||
const incomeTotal = useAppSelector(state => selectIncomeTotal(state)) | ||
const incomeItemElements = items.map((item: IncomeItem, idx: number) => { | ||
return <IncomeListItem key={idx} item={item} index={idx} /> | ||
}) | ||
|
||
function getTotal() { | ||
if (incomeTotal > 0) { | ||
return (t('list_income_total', {day_count: dayCount, amount: incomeTotal})) | ||
} | ||
|
||
return <></> | ||
} | ||
|
||
return ( | ||
<CardGroup> | ||
<Card className="grid-col-12 margin-top-4"> | ||
<CardHeader><b>{header}</b></CardHeader> | ||
<CardBody> | ||
<GridContainer> | ||
{incomeItemElements} | ||
</GridContainer> | ||
{getTotal()} | ||
</CardBody> | ||
</Card> | ||
</CardGroup> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,121 @@ | ||
import { afterEach, beforeEach, describe, expect, it, test } from 'vitest' | ||
import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react' | ||
import { Provider } from 'react-redux' | ||
import LedgerReviewHeader from './LedgerReviewHeader' | ||
import { makeStore } from '@/lib/store' | ||
import { EnhancedStore } from '@reduxjs/toolkit' | ||
import { BenefitsState } from '@/lib/features/benefits/benefitsSlice' | ||
|
||
describe('Ledger Review Header', async () => { | ||
const SNAP_INCOME = 350.00 | ||
const MEDICAID_INCOME = 412.00 | ||
|
||
afterEach(cleanup) | ||
|
||
describe('Medicaid and Snap', () => { | ||
let benefits: BenefitsState | ||
beforeEach(() => { | ||
benefits = { | ||
standardDeduction: true, | ||
deductionAmount: 50, | ||
medicaid: true, | ||
snap: true, | ||
} | ||
|
||
const store: EnhancedStore = makeStore() | ||
render (<Provider store={store}><LedgerReviewHeader benefits={benefits} snapIncomeTotal={SNAP_INCOME} medicaidIncomeTotal={MEDICAID_INCOME} /></Provider>) | ||
}) | ||
|
||
it('Displays SNAP and Medicaid header', () => { | ||
expect(screen.getByTestId('review-header')).toBeDefined() | ||
}) | ||
|
||
it('Displays SNAP Income', () => { | ||
expect(screen.getByText(`SNAP Income: $${SNAP_INCOME}`)).toBeDefined() | ||
}) | ||
|
||
it('Displays Medicaid Income', () => { | ||
expect(screen.getByText(`Medicaid Income: $${MEDICAID_INCOME}`)).toBeDefined() | ||
}) | ||
|
||
it('Does not display Medicaid only header', () => { | ||
expect(screen.queryByTestId("medicaid-only-header")).toBeNull() | ||
}) | ||
|
||
it('Does not display SNAP only header', () => { | ||
expect(screen.queryByTestId("snap-only-header")).toBeNull() | ||
}) | ||
}) | ||
|
||
describe('Medicaid Only', () => { | ||
let benefits: BenefitsState | ||
beforeEach(() => { | ||
benefits = { | ||
medicaid: true, | ||
snap: false, | ||
} | ||
|
||
const store: EnhancedStore = makeStore() | ||
render (<Provider store={store}><LedgerReviewHeader benefits={benefits} snapIncomeTotal={SNAP_INCOME} medicaidIncomeTotal={MEDICAID_INCOME} /></Provider>) | ||
}) | ||
|
||
it('Displays Medicaid only header', () => { | ||
expect(screen.getByTestId('medicaid-only-header')).toBeDefined() | ||
}) | ||
|
||
it('Does not display SNAP and Medicaid header', () => { | ||
expect(screen.queryByTestId('review-header')).toBeNull() | ||
}) | ||
|
||
it('Does not display SNAP Income', () => { | ||
const header = screen.getByTestId('medicaid-only-header') | ||
expect(header.firstChild?.textContent?.indexOf(`${SNAP_INCOME}`)).toEqual(-1) | ||
}) | ||
|
||
it('Displays Medicaid Income', () => { | ||
const header = screen.getByTestId('medicaid-only-header') | ||
expect(header.firstChild?.textContent?.indexOf(`${MEDICAID_INCOME}`)).toBeGreaterThanOrEqual(0) | ||
}) | ||
|
||
it('Does not display SNAP only header', () => { | ||
expect(screen.queryByTestId("snap-only-header")).toBeNull() | ||
}) | ||
}) | ||
|
||
describe('SNAP Only', () => { | ||
let benefits: BenefitsState | ||
beforeEach(() => { | ||
benefits = { | ||
standardDeduction: true, | ||
deductionAmount: 50, | ||
medicaid: false, | ||
snap: true, | ||
} | ||
|
||
const store: EnhancedStore = makeStore() | ||
render (<Provider store={store}><LedgerReviewHeader benefits={benefits} snapIncomeTotal={SNAP_INCOME} medicaidIncomeTotal={MEDICAID_INCOME} /></Provider>) | ||
}) | ||
|
||
it('Does not display Medicaid only header', () => { | ||
expect(screen.queryByTestId('medicaid-only-header')).toBeNull() | ||
}) | ||
|
||
it('Does not display SNAP and Medicaid header', () => { | ||
expect(screen.queryByTestId('review-header')).toBeNull() | ||
}) | ||
|
||
it('Does display SNAP Income', () => { | ||
const header = screen.getByTestId('snap-only-header') | ||
expect(header.firstChild?.textContent?.indexOf(`${SNAP_INCOME}`)).toBeGreaterThanOrEqual(0) | ||
}) | ||
|
||
it('Does not display Medicaid Income', () => { | ||
const header = screen.getByTestId('snap-only-header') | ||
expect(header.firstChild?.textContent?.indexOf(`${MEDICAID_INCOME}`)).toEqual(-1) | ||
}) | ||
|
||
it('Does display SNAP only header', () => { | ||
expect(screen.queryByTestId("snap-only-header")).toBeDefined() | ||
}) | ||
}) | ||
}) |
Oops, something went wrong.