From 2f3802b3145710ac22fcfb168be6598c41cea236 Mon Sep 17 00:00:00 2001
From: chisom chima <chimachisom360@gmail.com>
Date: Wed, 21 Feb 2024 11:58:07 +0100
Subject: [PATCH] feat: update modal accessibility improvements

---
 collections/forms/i18n/en.pot       |  4 ++--
 components/modal/src/modal/modal.js | 10 ++++++++--
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/collections/forms/i18n/en.pot b/collections/forms/i18n/en.pot
index 394afcd8fc..ae22c1bcb9 100644
--- 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
index 2c6130d802..319e415b9b 100644
--- 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