diff --git a/src/components/MyKiva/GoalSetting/GoalSelector.vue b/src/components/MyKiva/GoalSetting/GoalSelector.vue
index 031aab6ce42..4c0433007a0 100644
--- a/src/components/MyKiva/GoalSetting/GoalSelector.vue
+++ b/src/components/MyKiva/GoalSetting/GoalSelector.vue
@@ -226,26 +226,27 @@ const titleText = computed(() => {
if (props.isGoalSet) {
return 'Success! Your goal is set!';
}
- if (loansLastYear.value === 1) {
- // eslint-disable-next-line max-len
- return `Last year, you helped ${loansLastYear.value} woman shape her future!`;
- }
- if (loansLastYear.value > SAME_AS_LAST_YEAR_LIMIT) {
+ if (loansLastYear.value === 0 || loansLastYear.value > SAME_AS_LAST_YEAR_LIMIT) {
+ if (props.selectedCategoryId === ID_SUPPORT_ALL) {
+ return 'How many loans will you make this year?';
+ }
// eslint-disable-next-line max-len
- return `Last year, you helped ${loansLastYear.value} women shape their futures!`;
+ return `How many loans to ${props.selectedCategoryName?.toLowerCase()} will you make this year?`;
}
return 'Lenders like you help
3 women a year';
});
const subtitleText = computed(() => {
- let extraText = '';
+ if (props.isGoalSet) {
+ return '';
+ }
+
if (loansThisYear.value > 0) {
- extraText = `You've already made ${loansThisYear.value}.`;
+ return `You've already made ${loansThisYear.value} that will count!.`;
}
- return props.isGoalSet
- ? ''
- : `How many loans will you make this year? ${extraText}`;
+
+ return '';
});
const buttonText = computed(() => {
@@ -347,7 +348,7 @@ const updateGoalOptions = () => {
goalOptions.value = [
{
loansNumber: suggestion1,
- optionText: useYtdAsBase ? 'One more' : 'Same as last year',
+ optionText: useYtdAsBase ? 'One more' : `Same as ${LAST_YEAR_KEY}`,
selected: false
},
{
diff --git a/test/unit/specs/components/MyKiva/GoalSelector.spec.js b/test/unit/specs/components/MyKiva/GoalSelector.spec.js
index fdde6b86f89..3f54e47691c 100644
--- a/test/unit/specs/components/MyKiva/GoalSelector.spec.js
+++ b/test/unit/specs/components/MyKiva/GoalSelector.spec.js
@@ -163,6 +163,63 @@ describe('GoalSelector', () => {
await expectCategoryOptions('category-support-all', getExpectedGoalOptions({ useDefault: true }));
});
+ it('renders the selected category name in the title when the user changes category', async () => {
+ const tieredAchievements = [
+ {
+ id: ID_WOMENS_EQUALITY,
+ progressForYear: 2,
+ },
+ {
+ id: ID_REFUGEE_EQUALITY,
+ progressForYear: 3,
+ },
+ ];
+
+ const user = userEvent.setup();
+ const { getByRole, getByTestId } = render(TestWrapper, {
+ global: {
+ ...globalOptions,
+ provide: {
+ ...globalOptions.provide,
+ $kvTrackEvent: vi.fn(),
+ },
+ },
+ props: { tieredAchievements },
+ });
+
+ await flushPromises();
+
+ const getTitleText = () => getByRole('heading', { level: 2 }).innerHTML;
+
+ // Initial category is Women
+ expect(getTitleText()).toContain('women');
+
+ // Refugees
+ await user.click(getByTestId('category-refugees'));
+ await flushPromises();
+ expect(getTitleText()).toContain('refugees');
+
+ // Climate Action
+ await user.click(getByTestId('category-climate'));
+ await flushPromises();
+ expect(getTitleText()).toContain('climate action');
+
+ // U.S. Entrepreneurs
+ await user.click(getByTestId('category-us'));
+ await flushPromises();
+ expect(getTitleText()).toContain('u.s. entrepreneurs');
+
+ // Basic Needs
+ await user.click(getByTestId('category-basic-needs'));
+ await flushPromises();
+ expect(getTitleText()).toContain('basic needs');
+
+ // Choose as I go (support all)
+ await user.click(getByTestId('category-support-all'));
+ await flushPromises();
+ expect(getTitleText()).toBe('How many loans will you make this year?');
+ });
+
it('uses YTD loans as base when they exceed last year', async () => {
const tieredAchievements = [
{