feat: update modal accessibility improvements

dhis2 · Feb 21, 2024 · 2f3802b · 2f3802b
1 parent c5a160a
commit 2f3802b
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/collections/forms/i18n/en.pot b/collections/forms/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2024-02-19T11:41:26.003Z\n"
-"PO-Revision-Date: 2024-02-19T11:41:26.003Z\n"
+"POT-Creation-Date: 2024-02-21T10:19:12.883Z\n"
+"PO-Revision-Date: 2024-02-21T10:19:12.883Z\n"
 
 msgid "Upload file"
 msgstr "Upload file"

diff --git a/components/modal/src/modal/modal.js b/components/modal/src/modal/modal.js
@@ -4,7 +4,7 @@ import { Layer } from '@dhis2-ui/layer'
 import { spacers, spacersNum, sharedPropTypes } from '@dhis2/ui-constants'
 import cx from 'classnames'
 import PropTypes from 'prop-types'
-import React from 'react'
+import React, { useEffect } from 'react'
 import { resolve } from 'styled-jsx/css'
 import { CloseButton } from './close-button.js'
 
@@ -35,7 +35,13 @@ export const Modal = ({
         }
     }
 
-    document.addEventListener('keydown', handleKeyDown)
+    useEffect(() => {
+        document.addEventListener('keydown', handleKeyDown)
+
+        return () => {
+            document.removeEventListener('keydown', handleKeyDown)
+        }
+    }, [onClose])
 
     return (
         <Layer