Skip to content

fix: error in modal background#815

Open
dennisvankekem wants to merge 4 commits into
mainfrom
APL-1978
Open

fix: error in modal background#815
dennisvankekem wants to merge 4 commits into
mainfrom
APL-1978

Conversation

@dennisvankekem

Copy link
Copy Markdown
Collaborator

Considerations

  • I have tested the changes in both light and dark mode.
  • I have considered the need for new unit tests.
  • I have tested the changes on a cluster.
  • I have included relevant documentation updates.
  • I have an approved Figma design or have reflected my changes in Figma
  • I have verified that the UI/UX is consistent in major browsers (e.g., Chrome, Firefox, Safari, Edge).
  • I have tested the changes for responsiveness in different screen resolutions.
  • I have tested expected error states and verified that the user is presented with informative error messages.
  • I have tested the feature with unusual or extreme inputs (e.g., very long strings, empty states, clicking a button multiple times quickly).

Copilot AI review requested due to automatic review settings July 6, 2026 08:59

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses a UI issue where the global <Error /> view can appear behind modals, by tracking open modals in global Redux state and conditionally rendering the error view only when no modal is open. It also extends InformationBanner to support an explicit error variant and adds unit tests around the new behavior.

Changes:

  • Add openModalCount to the global Redux slice with modalOpened / modalClosed actions and unit tests.
  • Hide the global <Error /> component in src/layouts/Paper.tsx while a modal is open.
  • Update ConfigureGitModal to dispatch modal open/close tracking and refine banner styling (including an error banner), with a comprehensive modal test suite.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/redux/reducers.ts Adds modal-open tracking to global Redux state and exports new actions.
src/redux/reducers.test.ts Adds reducer unit tests for modal-open tracking.
src/layouts/Paper.tsx Suppresses the global <Error /> rendering while a modal is open.
src/components/modals/ConfigureGitModal.tsx Dispatches modal open/close actions; improves banner spacing and error banner type.
src/components/modals/ConfigureGitModal.test.tsx Adds unit tests covering modal behavior including the new dispatch logic.
src/components/InformationBanner.tsx Introduces type prop to render “info” vs “error” banner styling.
src/components/InformationBanner.test.tsx Adds unit tests validating InformationBanner default and error variants.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/redux/reducers.ts
Comment thread src/components/InformationBanner.tsx
Copilot AI review requested due to automatic review settings July 8, 2026 08:45

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 4 comments.

Comment thread src/components/modals/ConfigureGitModal.tsx
Comment thread src/redux/reducers.ts
Comment thread src/components/InformationBanner.tsx
Comment thread docs/adr/0001-modal-open-state-suppresses-global-error.md Outdated
Copilot AI review requested due to automatic review settings July 9, 2026 11:31

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 5 comments.

Comment thread src/redux/reducers.ts
Comment thread src/components/modals/ConfigureGitModal.tsx
Comment thread src/components/modals/ConfigureGitModal.test.tsx
Comment thread src/components/InformationBanner.tsx
Comment thread src/components/InformationBanner.tsx
Copilot AI review requested due to automatic review settings July 9, 2026 12:41

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

Comment thread src/redux/reducers.ts
Comment on lines 4 to +15
export interface GlobalState {
error: any
isDirty: boolean | undefined | null
openModalCount: number
}

const initialState = { error: undefined, isDirty: undefined, isStale: false } as GlobalState
const initialState = {
error: undefined,
isDirty: undefined,
isStale: false,
openModalCount: 0,
} as GlobalState
Comment on lines +326 to +340
useEffect(() => {
if (actualOpen) {
const action = modalOpened()

dispatch(action)

return () => {
const action = modalClosed()

dispatch(action)
}
}

return undefined
}, [actualOpen, dispatch])
Comment on lines +7 to +13
const StyledInfoBanner = styled(Box)<{
small?: boolean
type: InformationBannerType
}>(({ small, type }) => ({
backgroundColor: type === 'error' ? '#722e38' : '#f2f2894d',
padding: small ? '5px' : '10px',
border: '1px solid #d4d402',
border: `1px solid ${type === 'error' ? '#d32f2f' : '#d4d402'}`,
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants