diff --git a/src/components/ebook/EbookCommentModel.tsx b/src/components/ebook/EbookCommentModal.tsx
similarity index 100%
rename from src/components/ebook/EbookCommentModel.tsx
rename to src/components/ebook/EbookCommentModal.tsx
diff --git a/src/components/ebook/EbookDeleteCommentModel.tsx b/src/components/ebook/EbookDeleteCommentModal.tsx
similarity index 100%
rename from src/components/ebook/EbookDeleteCommentModel.tsx
rename to src/components/ebook/EbookDeleteCommentModal.tsx
diff --git a/src/components/program/ProgramContentEbookReader.tsx b/src/components/program/ProgramContentEbookReader.tsx
index 285f4904e..bac835823 100644
--- a/src/components/program/ProgramContentEbookReader.tsx
+++ b/src/components/program/ProgramContentEbookReader.tsx
@@ -16,8 +16,8 @@ import { useEbookHighlight, useGetEbookTrialPercentage } from '../../hooks/ebook
 import { Highlight } from '../../hooks/model/api/ebookHighlightQraphql'
 import CommonModal from '../common/CommonModal'
 import { deleteProgramContentEbookBookmark } from '../ebook/EbookBookmarkModal'
-import EbookCommentModal from '../ebook/EbookCommentModel'
-import EbookDeleteHighlightModal from '../ebook/EbookDeleteCommentModel'
+import EbookCommentModal from '../ebook/EbookCommentModal'
+import EbookDeleteHighlightModal from '../ebook/EbookDeleteCommentModal'
 import { EbookReaderControlBar } from '../ebook/EbookReaderControlBar'
 import EbookTextSelectionToolbar from '../ebook/EbookTextSelectionToolbar'
 import { decryptData } from './decryptUtils'
@@ -160,7 +160,7 @@ const ProgramContentEbookReader: React.VFC<{
     useMutationProgramContentEbookTocProgress()
 
   const [sliderValue, setSliderValue] = useState<number>(0)
-  const [modalState, setModalState] = useState<'trialComplete' | null | string>(null)
+  const [modalType, setModalType] = useState<'trialComplete' | 'comment' | 'deleteHighLight' | null | string>(null)
   const [isTrialCompleted, setIsTrialCompleted] = useState(false)
   const [isLocationGenerated, setIsLocationGenerated] = useState<boolean>(false)
   const [currentPageBookmarkIds, setCurrentPageBookmarkIds] = useState<string[]>([])
@@ -178,8 +178,6 @@ const ProgramContentEbookReader: React.VFC<{
     cfiRange: null,
     contents: null,
   })
-  const [openCommentModel, setOpenCommentModel] = useState(false)
-  const [openDeleteHighlightModel, setDeleteHighlightModel] = useState(false)
   const [isRenditionReady, setIsRenditionReady] = useState(false)
   const [reRenderHighlightQueue, setReRenderHighlightQueue] = useState<string[]>([])
   const [forceReapplyHighlight, setForceReapplyHighlight] = useState(false)
@@ -191,7 +189,7 @@ const ProgramContentEbookReader: React.VFC<{
   const originalPrevRef = useRef<(() => Promise<void>) | undefined>()
 
   if (rendition.current) {
-    if (!!openCommentModel || !isLocationGenerated) {
+    if (modalType === 'comment' || !isLocationGenerated) {
       rendition.current.next = () => {
         return Promise.resolve()
       }
@@ -234,7 +232,7 @@ const ProgramContentEbookReader: React.VFC<{
     }
 
     setAnnotation(highlightToComment)
-    setOpenCommentModel(true)
+    setModalType('comment')
     setToolbarVisible(false)
   }
 
@@ -264,13 +262,13 @@ const ProgramContentEbookReader: React.VFC<{
       }
 
       setAnnotation(null)
-      setOpenCommentModel(false)
+      setModalType(null)
       setToolbarVisible(false)
     }
   }
 
   const handleCommentCancel = () => {
-    setOpenCommentModel(false)
+    setModalType(null)
     setToolbarVisible(false)
   }
 
@@ -281,7 +279,7 @@ const ProgramContentEbookReader: React.VFC<{
 
     if (existingHighlight) {
       setHighlightToDelete(existingHighlight)
-      setDeleteHighlightModel(true)
+      setModalType('deleteHighLight')
       setToolbarVisible(false)
     }
   }
@@ -293,14 +291,14 @@ const ProgramContentEbookReader: React.VFC<{
       rendition.current?.annotations.remove(highlightToDelete.cfiRange, 'highlight')
       rendition.current?.annotations.remove(highlightToDelete.cfiRange, 'underline')
 
-      setDeleteHighlightModel(false)
+      setModalType(null)
       setToolbarVisible(false)
       setHighlightToDelete(null)
     }
   }
 
   const handleDeleteHighlightModalCancel = () => {
-    setDeleteHighlightModel(false)
+    setModalType(null)
     setToolbarVisible(false)
   }
 
@@ -580,24 +578,24 @@ const ProgramContentEbookReader: React.VFC<{
     <Box height={{ base: `${!!isSafari ? '90vh' : '100vh'}`, md: '85vh' }}>
       <CommonModal
         isCentered
-        isOpen={modalState === 'trialComplete'}
+        isOpen={modalType === 'trialComplete'}
         title={formatMessage(programMessages.ProgramContentEbookReader.trialCompleted)}
         onClose={() => {
-          setModalState(null)
+          setModalType(null)
         }}
         renderFooter={() => <Button colorScheme="primary">{formatMessage(commonMessages.ui.purchase)}</Button>}
       >
         <Text marginTop="16px">{formatMessage(programMessages.ProgramContentEbookReader.trialCompletedMessage)}</Text>
       </CommonModal>
       <EbookDeleteHighlightModal
-        visible={openDeleteHighlightModel}
+        visible={modalType === 'deleteHighLight'}
         onOk={() => {
           handleDeleteHighlightModalOk()
         }}
         onCancel={handleDeleteHighlightModalCancel}
       />
       <EbookCommentModal
-        visible={openCommentModel}
+        visible={modalType === 'comment'}
         onOk={handleCommentOk}
         onCancel={handleCommentCancel}
         annotation={annotation}
@@ -643,7 +641,7 @@ const ProgramContentEbookReader: React.VFC<{
                       setIsTrialCompleted(false)
                       setSliderValue(sliderPercentage)
                       if (isTrial && sliderPercentage >= ebookTrialPercentage) {
-                        setModalState('trialComplete')
+                        setModalType('trialComplete')
                         setIsTrialCompleted(true)
                       } else {
                         setIsTrialCompleted(false)
@@ -851,7 +849,7 @@ const ProgramContentEbookReader: React.VFC<{
                 style={{ ...readerStyles.arrow, ...readerStyles.next }}
                 onClick={async () => {
                   if (isTrialCompleted) {
-                    setModalState('trialComplete')
+                    setModalType('trialComplete')
                   } else {
                     await rendition.current?.next()
                     setForceReapplyHighlight(!forceReapplyHighlight)
@@ -872,7 +870,7 @@ const ProgramContentEbookReader: React.VFC<{
         <EbookReaderControlBar
           isLocationGenerated={isLocationGenerated}
           sliderValue={sliderValue}
-          onModalStateChange={setModalState}
+          onModalStateChange={setModalType}
           onSliderValueChange={setSliderValue}
           ebookTrialPercentage={ebookTrialPercentage}
           isTrial={isTrial}