From 42ee6d4a024bd965c985252448b4411c4cc4a13e Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Tue, 28 Jul 2026 23:42:10 -0600 Subject: [PATCH 01/10] migrated ChevronLeft kyper --- src/components/GoBackButton.tsx | 10 +++++----- typings/kyper.d.ts | 1 - 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/src/components/GoBackButton.tsx b/src/components/GoBackButton.tsx index 7ed18fa92d..7b6b1e2620 100644 --- a/src/components/GoBackButton.tsx +++ b/src/components/GoBackButton.tsx @@ -3,7 +3,7 @@ import React, { forwardRef, useRef } from 'react' import PropTypes from 'prop-types' import { useTokens } from '@kyper/tokenprovider' import { IconButton } from '@mui/material' -import { ChevronLeft } from '@kyper/icon/ChevronLeft' +import { Icon } from '@mxenabled/mxui' import { __ } from 'src/utilities/Intl' @@ -25,10 +25,10 @@ export const GoBackButton = forwardRef((pr ref={ref ?? defaultRef} style={styles} > - ) diff --git a/typings/kyper.d.ts b/typings/kyper.d.ts index e9b6e8122a..70d635e1d7 100644 --- a/typings/kyper.d.ts +++ b/typings/kyper.d.ts @@ -17,7 +17,6 @@ declare module '@kyper/icon/Image' declare module '@kyper/icon/Health' declare module '@kyper/icon/Grid' declare module '@kyper/progressindicators' -declare module '@kyper/icon/ChevronLeft' declare module '@kyper/icon/Lock' declare module '@kyper/utilityrow' declare module '@kyper/hooks' From a767a3e2d6e64deb2ffd0690a9210a591c6ccc64 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Wed, 29 Jul 2026 15:32:38 -0600 Subject: [PATCH 02/10] feat: use one back button accross the widget for consistency --- src/components/ConnectNavigationHeader.js | 47 +++------------ src/components/GoBackButton.tsx | 57 +++++++++++-------- .../__tests__/GoBackButton-test.tsx | 13 +++-- 3 files changed, 47 insertions(+), 70 deletions(-) diff --git a/src/components/ConnectNavigationHeader.js b/src/components/ConnectNavigationHeader.js index 6afe618fd0..30e832dfcc 100644 --- a/src/components/ConnectNavigationHeader.js +++ b/src/components/ConnectNavigationHeader.js @@ -1,23 +1,14 @@ import React, { useContext, useState, useEffect, useRef } from 'react' import PropTypes from 'prop-types' import { useSelector } from 'react-redux' -import { useTokens } from '@kyper/tokenprovider' - -import AppBar from '@mui/material/AppBar' -import Box from '@mui/material/Box' -import Toolbar from '@mui/material/Toolbar' -import IconButton from '@mui/material/IconButton' -import { Icon } from '@mxenabled/mxui' - import { __ } from 'src/utilities/Intl' import { STEPS } from 'src/const/Connect' import { PostMessageContext } from 'src/ConnectWidget' +import { GoBackButton } from 'src/components/GoBackButton' export const ConnectNavigationHeader = (props) => { const goBackButtonContainerRef = useRef() const postMessageFunctions = useContext(PostMessageContext) - const tokens = useTokens() - const sx = getStyles(tokens) const step = useSelector( (state) => state.connect.location[state.connect.location.length - 1]?.step ?? STEPS.SEARCH, ) @@ -65,24 +56,12 @@ export const ConnectNavigationHeader = (props) => { } return ( - - - - {shouldShowGlobalBackButton || showMobileBackButton ? ( - - - - ) : null} - - - + ) } @@ -90,15 +69,3 @@ ConnectNavigationHeader.propTypes = { connectGoBack: PropTypes.func.isRequired, stepComponentRef: PropTypes.object, } - -const getStyles = (tokens) => ({ - container: { flexGrow: 1 }, - appBar: { backgroundColor: tokens.BackgroundColor.Container, display: 'flex' }, - toolbar: { - padding: `0 ${tokens.Spacing.Medium}px`, - maxWidth: '368px', - left: '50%', - transform: 'translateX(-50%)', - }, - button: { color: tokens.TextColor.Default }, -}) diff --git a/src/components/GoBackButton.tsx b/src/components/GoBackButton.tsx index 7b6b1e2620..e13938473d 100644 --- a/src/components/GoBackButton.tsx +++ b/src/components/GoBackButton.tsx @@ -1,48 +1,55 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ import React, { forwardRef, useRef } from 'react' -import PropTypes from 'prop-types' import { useTokens } from '@kyper/tokenprovider' -import { IconButton } from '@mui/material' +import { AppBar, Box, IconButton, Toolbar, SxProps, Theme } from '@mui/material' import { Icon } from '@mxenabled/mxui' import { __ } from 'src/utilities/Intl' interface GoBackButtonProps { handleGoBack: () => void + shouldShowBackButton: boolean + toolbarSx?: SxProps } export const GoBackButton = forwardRef((props, ref) => { const defaultRef = useRef(null) - const { handleGoBack } = props + const { handleGoBack, shouldShowBackButton = true, toolbarSx } = props const tokens = useTokens() - const styles = getStyles(tokens) + const defaultStyles = getStyles(tokens) return ( - - - + + + + {shouldShowBackButton ? ( + + + + ) : null} + + + ) }) const getStyles = (tokens: any) => ({ - height: '44px', - margin: `0px ${tokens.Spacing.XSmall}px ${tokens.Spacing.XSmall}px -${tokens.Spacing.Medium}px`, - padding: `0px 8px`, - width: '44px', + container: { flexGrow: 1 }, + appBar: { backgroundColor: tokens.BackgroundColor.Container, display: 'flex' }, + toolbar: { + padding: `0 ${tokens.Spacing.Medium}px`, + maxWidth: '368px', + left: 0, + transform: 'translateX(-5%)', + }, + button: { color: tokens.TextColor.Default }, }) -GoBackButton.propTypes = { - handleGoBack: PropTypes.func.isRequired, -} - GoBackButton.displayName = 'GoBackButton' diff --git a/src/components/__tests__/GoBackButton-test.tsx b/src/components/__tests__/GoBackButton-test.tsx index 7c30c69efd..fdbc9a2157 100644 --- a/src/components/__tests__/GoBackButton-test.tsx +++ b/src/components/__tests__/GoBackButton-test.tsx @@ -3,24 +3,27 @@ import { render, screen, fireEvent } from 'src/utilities/testingLibrary' import { GoBackButton } from '../GoBackButton' describe('GoBackButton', () => { - const handleGoBack = vi.fn() + const defaultProps = { + handleGoBack: vi.fn(), + shouldShowBackButton: true, + } it('renders the go back button', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) expect(button).toBeInTheDocument() }) it('navigates back when clicked', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) fireEvent.click(button) - expect(handleGoBack).toHaveBeenCalled() + expect(defaultProps.handleGoBack).toHaveBeenCalled() }) it('is accessible', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) expect(button).toHaveAttribute('aria-label', 'Go Back') }) From 0dde168c15acd335e25b6f1ef3339a3eef4a3949 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Wed, 29 Jul 2026 16:11:41 -0600 Subject: [PATCH 03/10] fixed failing test --- src/components/GoBackButton.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/GoBackButton.tsx b/src/components/GoBackButton.tsx index e13938473d..7a0076150d 100644 --- a/src/components/GoBackButton.tsx +++ b/src/components/GoBackButton.tsx @@ -8,13 +8,13 @@ import { __ } from 'src/utilities/Intl' interface GoBackButtonProps { handleGoBack: () => void - shouldShowBackButton: boolean + shouldShowBackButton?: boolean toolbarSx?: SxProps } export const GoBackButton = forwardRef((props, ref) => { const defaultRef = useRef(null) - const { handleGoBack, shouldShowBackButton = true, toolbarSx } = props + const { handleGoBack, shouldShowBackButton, toolbarSx } = props const tokens = useTokens() const defaultStyles = getStyles(tokens) From 6c5b0e2d438aa687c37c0adef4058fc6ac99e926 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Wed, 29 Jul 2026 16:37:40 -0600 Subject: [PATCH 04/10] fixing a bug with showMobileBackButton --- src/components/ConnectNavigationHeader.js | 6 +++--- src/components/GoBackButton.tsx | 2 +- src/views/manualAccount/ManualAccountConnect-test.tsx | 2 ++ 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/ConnectNavigationHeader.js b/src/components/ConnectNavigationHeader.js index 30e832dfcc..bf058bd3bc 100644 --- a/src/components/ConnectNavigationHeader.js +++ b/src/components/ConnectNavigationHeader.js @@ -12,9 +12,9 @@ export const ConnectNavigationHeader = (props) => { const step = useSelector( (state) => state.connect.location[state.connect.location.length - 1]?.step ?? STEPS.SEARCH, ) - const showMobileBackButton = useSelector( - (state) => state.config.show_back_button && state.connect.location.length === 1, - ) + const showMobileBackButton = + useSelector((state) => state.config.show_back_button && state.connect.location.length === 1) || + false const [shouldShowGlobalBackButton, setShouldShowGlobalBackButton] = useState(false) useEffect(() => { diff --git a/src/components/GoBackButton.tsx b/src/components/GoBackButton.tsx index 7a0076150d..c7c8444440 100644 --- a/src/components/GoBackButton.tsx +++ b/src/components/GoBackButton.tsx @@ -14,7 +14,7 @@ interface GoBackButtonProps { export const GoBackButton = forwardRef((props, ref) => { const defaultRef = useRef(null) - const { handleGoBack, shouldShowBackButton, toolbarSx } = props + const { handleGoBack, shouldShowBackButton = true, toolbarSx = {} } = props const tokens = useTokens() const defaultStyles = getStyles(tokens) diff --git a/src/views/manualAccount/ManualAccountConnect-test.tsx b/src/views/manualAccount/ManualAccountConnect-test.tsx index 9d43d25dc4..5bdb03a537 100644 --- a/src/views/manualAccount/ManualAccountConnect-test.tsx +++ b/src/views/manualAccount/ManualAccountConnect-test.tsx @@ -236,6 +236,8 @@ describe('', () => { await addManualCheckingAccount(user) await screen.findByTestId('manual-account-success-header') + screen.debug() + expect(screen.queryByTestId('back-button')).not.toBeInTheDocument() }) }) From 1c3346f8e34d3760ee2a581dbbbebe527dbe26e9 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Wed, 29 Jul 2026 16:39:20 -0600 Subject: [PATCH 05/10] remove unused code --- src/views/manualAccount/ManualAccountConnect-test.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/views/manualAccount/ManualAccountConnect-test.tsx b/src/views/manualAccount/ManualAccountConnect-test.tsx index 5bdb03a537..9d43d25dc4 100644 --- a/src/views/manualAccount/ManualAccountConnect-test.tsx +++ b/src/views/manualAccount/ManualAccountConnect-test.tsx @@ -236,8 +236,6 @@ describe('', () => { await addManualCheckingAccount(user) await screen.findByTestId('manual-account-success-header') - screen.debug() - expect(screen.queryByTestId('back-button')).not.toBeInTheDocument() }) }) From 308850a0969c583f8d2a2537c068c427af1eac98 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Thu, 13 Aug 2026 13:04:49 -0600 Subject: [PATCH 06/10] using Stack for spacing --- src/components/DayOfMonthPicker.module.css | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 src/components/DayOfMonthPicker.module.css diff --git a/src/components/DayOfMonthPicker.module.css b/src/components/DayOfMonthPicker.module.css new file mode 100644 index 0000000000..2e40aeb8c4 --- /dev/null +++ b/src/components/DayOfMonthPicker.module.css @@ -0,0 +1,7 @@ +.textGroup:global(.MuiStack-root) { + margin-bottom: var(--spacing-3); +} + +.button:global(.MuiButton-root) { + width: 14.25%; +} From 0fa05362f90922c37fcb2a4a45a821eafac929e5 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Mon, 17 Aug 2026 13:43:37 -0600 Subject: [PATCH 07/10] add back button component styles --- .../ConnectNavigationHeader.module.css | 4 ++++ src/components/GoBackButton.module.css | 19 +++++++++++++++++++ 2 files changed, 23 insertions(+) create mode 100644 src/components/ConnectNavigationHeader.module.css create mode 100644 src/components/GoBackButton.module.css diff --git a/src/components/ConnectNavigationHeader.module.css b/src/components/ConnectNavigationHeader.module.css new file mode 100644 index 0000000000..4f2682bbd4 --- /dev/null +++ b/src/components/ConnectNavigationHeader.module.css @@ -0,0 +1,4 @@ +.toolbar.toolbar:global(.MuiToolbar-root) { + left: 50%; + transform: translateX(-50%); +} diff --git a/src/components/GoBackButton.module.css b/src/components/GoBackButton.module.css new file mode 100644 index 0000000000..778a6e2969 --- /dev/null +++ b/src/components/GoBackButton.module.css @@ -0,0 +1,19 @@ +.container:global(.MuiBox-root) { + flex-grow: 1; +} + +.appBar:global(.MuiAppBar-root) { + background-color: var(--mui-palette-background-paper); + display: flex; +} + +.toolbar:global(.MuiToolbar-root) { + left: 0; + max-width: 368px; + padding: 0 var(--spacing-2); + transform: translateX(-5%); +} + +.button:global(.MuiIconButton-root) { + color: var(--mui-palette-text-primary); +} From 2412ebc5cd032e5e3e914db72774587a8192f0f3 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Mon, 17 Aug 2026 15:16:42 -0600 Subject: [PATCH 08/10] renamed GobackButton to GoBackButtonHeader --- src/components/ConnectNavigationHeader.js | 7 ++- src/components/DayOfMonthPicker.tsx | 60 +++++++------------ src/components/GoBackButton.tsx | 55 ----------------- ...dule.css => GoBackButtonHeader.module.css} | 3 +- src/components/GoBackButtonHeader.tsx | 42 +++++++++++++ src/components/LeavingNoticeFlat.js | 4 +- .../__tests__/GoBackButton-test.tsx | 2 +- .../microdeposits/SharedRoutingNumber.js | 4 +- 8 files changed, 73 insertions(+), 104 deletions(-) delete mode 100644 src/components/GoBackButton.tsx rename src/components/{GoBackButton.module.css => GoBackButtonHeader.module.css} (83%) create mode 100644 src/components/GoBackButtonHeader.tsx diff --git a/src/components/ConnectNavigationHeader.js b/src/components/ConnectNavigationHeader.js index bf058bd3bc..193b6e786e 100644 --- a/src/components/ConnectNavigationHeader.js +++ b/src/components/ConnectNavigationHeader.js @@ -4,7 +4,8 @@ import { useSelector } from 'react-redux' import { __ } from 'src/utilities/Intl' import { STEPS } from 'src/const/Connect' import { PostMessageContext } from 'src/ConnectWidget' -import { GoBackButton } from 'src/components/GoBackButton' +import { GoBackButtonHeader } from 'src/components/GoBackButtonHeader' +import styles from 'src/components/ConnectNavigationHeader.module.css' export const ConnectNavigationHeader = (props) => { const goBackButtonContainerRef = useRef() @@ -56,11 +57,11 @@ export const ConnectNavigationHeader = (props) => { } return ( - ) } diff --git a/src/components/DayOfMonthPicker.tsx b/src/components/DayOfMonthPicker.tsx index 253a181e21..923f13eda6 100644 --- a/src/components/DayOfMonthPicker.tsx +++ b/src/components/DayOfMonthPicker.tsx @@ -2,17 +2,18 @@ import React, { MutableRefObject } from 'react' import _range from 'lodash/range' -import { useTokens } from '@kyper/tokenprovider' -import { Button } from '@mui/material' +import { Button, Stack } from '@mui/material' import { Text } from '@mxenabled/mxui' import { fadeOut } from 'src/utilities/Animation' import { __ } from 'src/utilities/Intl' -import { GoBackButton } from 'src/components/GoBackButton' +import { GoBackButtonHeader } from 'src/components/GoBackButtonHeader' import { SlideDown } from 'src/components/SlideDown' import { getDelay } from 'src/utilities/getDelay' +import styles from './DayOfMonthPicker.module.css' + interface DayOfMonthPicker { handleClose: () => void handleSelect: (e: React.MouseEvent) => void @@ -21,8 +22,6 @@ interface DayOfMonthPicker { export const DayOfMonthPicker = React.forwardRef( (props, ref) => { - const tokens = useTokens() - const styles = getStyles(tokens) const getNextDelay = getDelay() const days = _range(1, 32) const containerRef = ref as MutableRefObject @@ -30,64 +29,47 @@ export const DayOfMonthPicker = React.forwardRef - fadeOut(containerRef?.current, 'up', 300).then(props.handleClose)} /> - - {__('Payment due day')} - - - {__('Choose what day of the month your payment is due.')} - + + + {__('Payment due day')} + + + {__('Choose what day of the month your payment is due.')} + + -
+ {days.map((day: number) => ( ))} -
+ ) }, ) -// eslint-disable-next-line @typescript-eslint/no-explicit-any -const getStyles = (tokens: any) => ({ - buttons: { - display: 'flex', - flexWrap: 'wrap' as const, - marginTop: tokens.Spacing.XSmall, - }, - button: { - width: '14.25%', - }, -}) - DayOfMonthPicker.displayName = 'DayOfMonthPicker' diff --git a/src/components/GoBackButton.tsx b/src/components/GoBackButton.tsx deleted file mode 100644 index c7c8444440..0000000000 --- a/src/components/GoBackButton.tsx +++ /dev/null @@ -1,55 +0,0 @@ -/* eslint-disable @typescript-eslint/no-explicit-any */ -import React, { forwardRef, useRef } from 'react' -import { useTokens } from '@kyper/tokenprovider' -import { AppBar, Box, IconButton, Toolbar, SxProps, Theme } from '@mui/material' -import { Icon } from '@mxenabled/mxui' - -import { __ } from 'src/utilities/Intl' - -interface GoBackButtonProps { - handleGoBack: () => void - shouldShowBackButton?: boolean - toolbarSx?: SxProps -} - -export const GoBackButton = forwardRef((props, ref) => { - const defaultRef = useRef(null) - const { handleGoBack, shouldShowBackButton = true, toolbarSx = {} } = props - const tokens = useTokens() - const defaultStyles = getStyles(tokens) - - return ( - - - - {shouldShowBackButton ? ( - - - - ) : null} - - - - ) -}) - -const getStyles = (tokens: any) => ({ - container: { flexGrow: 1 }, - appBar: { backgroundColor: tokens.BackgroundColor.Container, display: 'flex' }, - toolbar: { - padding: `0 ${tokens.Spacing.Medium}px`, - maxWidth: '368px', - left: 0, - transform: 'translateX(-5%)', - }, - button: { color: tokens.TextColor.Default }, -}) - -GoBackButton.displayName = 'GoBackButton' diff --git a/src/components/GoBackButton.module.css b/src/components/GoBackButtonHeader.module.css similarity index 83% rename from src/components/GoBackButton.module.css rename to src/components/GoBackButtonHeader.module.css index 778a6e2969..6b9489ce3c 100644 --- a/src/components/GoBackButton.module.css +++ b/src/components/GoBackButtonHeader.module.css @@ -10,8 +10,7 @@ .toolbar:global(.MuiToolbar-root) { left: 0; max-width: 368px; - padding: 0 var(--spacing-2); - transform: translateX(-5%); + transform: translateX(-10%); } .button:global(.MuiIconButton-root) { diff --git a/src/components/GoBackButtonHeader.tsx b/src/components/GoBackButtonHeader.tsx new file mode 100644 index 0000000000..39707f34a0 --- /dev/null +++ b/src/components/GoBackButtonHeader.tsx @@ -0,0 +1,42 @@ +import React, { forwardRef, useRef } from 'react' +import { AppBar, Box, IconButton, Toolbar } from '@mui/material' +import { Icon } from '@mxenabled/mxui' +import clsx from 'clsx' + +import { __ } from 'src/utilities/Intl' + +import styles from 'src/components/GoBackButtonHeader.module.css' + +interface GoBackButtonProps { + handleGoBack: () => void + shouldShowBackButton?: boolean + toolbarClassName?: string +} + +export const GoBackButtonHeader = forwardRef((props, ref) => { + const defaultRef = useRef(null) + const { handleGoBack, shouldShowBackButton = true, toolbarClassName } = props + + return ( + + + + {shouldShowBackButton ? ( + + + + ) : null} + + + + ) +}) + +GoBackButtonHeader.displayName = 'GoBackButtonHeader' diff --git a/src/components/LeavingNoticeFlat.js b/src/components/LeavingNoticeFlat.js index 35b118d90b..2e8d251fda 100644 --- a/src/components/LeavingNoticeFlat.js +++ b/src/components/LeavingNoticeFlat.js @@ -8,7 +8,7 @@ import { Text, Icon } from '@mxenabled/mxui' import { Button, Stack } from '@mui/material' import { SlideDown } from 'src/components/SlideDown' -import { GoBackButton } from 'src/components/GoBackButton' +import { GoBackButtonHeader } from 'src/components/GoBackButtonHeader' import { getDelay } from 'src/utilities/getDelay' import styles from 'src/components/LeavingNoticeFlat.module.css' @@ -20,7 +20,7 @@ export const LeavingNoticeFlat = ({ onContinue, onCancel, portalTo = 'connect-wr
- + diff --git a/src/components/__tests__/GoBackButton-test.tsx b/src/components/__tests__/GoBackButton-test.tsx index fdbc9a2157..2b8963a66a 100644 --- a/src/components/__tests__/GoBackButton-test.tsx +++ b/src/components/__tests__/GoBackButton-test.tsx @@ -1,6 +1,6 @@ import React from 'react' import { render, screen, fireEvent } from 'src/utilities/testingLibrary' -import { GoBackButton } from '../GoBackButton' +import { GoBackButton } from '../GoBackButtonHeader' describe('GoBackButton', () => { const defaultProps = { diff --git a/src/views/microdeposits/SharedRoutingNumber.js b/src/views/microdeposits/SharedRoutingNumber.js index a5efb3b592..ee2eec1ffc 100644 --- a/src/views/microdeposits/SharedRoutingNumber.js +++ b/src/views/microdeposits/SharedRoutingNumber.js @@ -14,7 +14,7 @@ import { PageviewInfo } from 'src/const/Analytics' import { SlideDown } from 'src/components/SlideDown' import { InstitutionTile } from 'src/components/InstitutionTile' import { getDelay } from 'src/utilities/getDelay' -import { GoBackButton } from 'src/components/GoBackButton' +import { GoBackButtonHeader } from 'src/components/GoBackButtonHeader' import { ActionTile } from 'src/components/ActionTile' import { fadeOut } from 'src/utilities/Animation' @@ -29,7 +29,7 @@ export const SharedRoutingNumber = (props) => { return (
- + {__('Select how to connect your account')} From 562ff92976a989963cda62892c9e2f58697550ba Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Mon, 17 Aug 2026 15:23:11 -0600 Subject: [PATCH 09/10] fixed the import --- README.md | 2 +- src/components/__tests__/GoBackButton-test.tsx | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 132aa1ff78..4d1fe2a525 100644 --- a/README.md +++ b/README.md @@ -46,7 +46,7 @@ const App = () => { | `onShowConnectSuccessSurvey` | [`AnalyticContextType`](./typings/connectProps.d.ts#L100) | The connect widget provides a way to let your analytics provider know that the connect success survey was shown. [More details](./docs/ANALYTICS.md#onShowConnectSuccessSurvey) | | `onSubmitConnectSuccessSurvey` | [`AnalyticContextType`](./typings/connectProps.d.ts#L101) | The connect widget provides a way to submit connect success survey responses using your own analytics provider. [More details](./docs/ANALYTICS.md#onSubmitConnectSuccessSurvey) | | | `profiles` | [`ProfilesTypes`](./typings/connectProps.d.ts) | The connect widget uses the profiles to set the initial state of the widget. [More details](./docs/PROFILES.md) | See more details | -| `userFeatures` | [`UserFeaturesType`](./typings/connectProps.d.ts) | The connect widget uses user features to determine the behavior of the widget. [More details](./docs/USER_FEATURES.md) | See more details +| `userFeatures` | [`UserFeaturesType`](./typings/connectProps.d.ts) | The connect widget uses user features to determine the behavior of the widget. [More details](./docs/USER_FEATURES.md) | See more details | | `webSocketConnection` | `object` | An object containing `isConnected()` function and `webSocketMessages$` observable for real-time updates. | `null` | | `experimentalFeatures` | `object` | An object to enable or disable experimental features like `useWebSockets: true`. | `null` | diff --git a/src/components/__tests__/GoBackButton-test.tsx b/src/components/__tests__/GoBackButton-test.tsx index 2b8963a66a..5c366ede7d 100644 --- a/src/components/__tests__/GoBackButton-test.tsx +++ b/src/components/__tests__/GoBackButton-test.tsx @@ -1,6 +1,6 @@ import React from 'react' import { render, screen, fireEvent } from 'src/utilities/testingLibrary' -import { GoBackButton } from '../GoBackButtonHeader' +import { GoBackButtonHeader } from 'src/components/GoBackButtonHeader' describe('GoBackButton', () => { const defaultProps = { @@ -9,13 +9,13 @@ describe('GoBackButton', () => { } it('renders the go back button', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) expect(button).toBeInTheDocument() }) it('navigates back when clicked', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) fireEvent.click(button) @@ -23,7 +23,7 @@ describe('GoBackButton', () => { }) it('is accessible', () => { - render() + render() const button = screen.getByRole('button', { name: /back/i }) expect(button).toHaveAttribute('aria-label', 'Go Back') }) From 74c920176edc5a4265afc4451c6f74da0e1481c1 Mon Sep 17 00:00:00 2001 From: Clement Mwimo Date: Tue, 18 Aug 2026 13:13:43 -0600 Subject: [PATCH 10/10] moved and renamed the test file --- .../GoBackButton-test.tsx => GoBackButtonHeader-test.tsx} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/components/{__tests__/GoBackButton-test.tsx => GoBackButtonHeader-test.tsx} (100%) diff --git a/src/components/__tests__/GoBackButton-test.tsx b/src/components/GoBackButtonHeader-test.tsx similarity index 100% rename from src/components/__tests__/GoBackButton-test.tsx rename to src/components/GoBackButtonHeader-test.tsx