From 9b75f52073aeddcd6fc555b1540574b96317c623 Mon Sep 17 00:00:00 2001
From: Shubhangi Choudhary <78342516+shubhangi013@users.noreply.github.com>
Date: Tue, 21 Dec 2021 18:35:55 +0530
Subject: [PATCH] migrated the files to tsx (#4972)

* migrated the files to tsx

* reverted unecessary changes

* reverted unecessary changes to app.css

* fixed the fails

* fixed the fails
---
 web/src/js/components/Modal/Modal.jsx               | 13 -------------
 web/src/js/components/Modal/Modal.tsx               | 13 +++++++++++++
 .../Modal/{ModalLayout.jsx => ModalLayout.tsx}      |  8 ++++++--
 web/src/js/filt/filt.js                             |  4 +++-
 4 files changed, 22 insertions(+), 16 deletions(-)
 delete mode 100644 web/src/js/components/Modal/Modal.jsx
 create mode 100644 web/src/js/components/Modal/Modal.tsx
 rename web/src/js/components/Modal/{ModalLayout.jsx => ModalLayout.tsx} (67%)

diff --git a/web/src/js/components/Modal/Modal.jsx b/web/src/js/components/Modal/Modal.jsx
deleted file mode 100644
index 64b61fcce..000000000
--- a/web/src/js/components/Modal/Modal.jsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import * as React from "react"
-import ModalList from './ModalList'
-import { useAppSelector } from "../../ducks";
-
-
-export default function PureModal() {
-    const activeModal = useAppSelector(state => state.ui.modal.activeModal)
-    const ActiveModal = ModalList.find(m => m.name === activeModal )
-
-    return(
-        activeModal ? <ActiveModal/> : <div/>
-    )
-}
diff --git a/web/src/js/components/Modal/Modal.tsx b/web/src/js/components/Modal/Modal.tsx
new file mode 100644
index 000000000..d9a475eb9
--- /dev/null
+++ b/web/src/js/components/Modal/Modal.tsx
@@ -0,0 +1,13 @@
+import * as React from "react"
+import ModalList from './ModalList'
+import { useAppSelector } from "../../ducks";
+
+
+export default function PureModal() {
+    const activeModal : string = useAppSelector(state => state.ui.modal.activeModal)
+    const ActiveModal:(() => JSX.Element)  | undefined= ModalList.find(m => m.name === activeModal )
+
+    return(
+        activeModal&&ActiveModal!==undefined ? <ActiveModal/> : <div/>
+    )
+}
diff --git a/web/src/js/components/Modal/ModalLayout.jsx b/web/src/js/components/Modal/ModalLayout.tsx
similarity index 67%
rename from web/src/js/components/Modal/ModalLayout.jsx
rename to web/src/js/components/Modal/ModalLayout.tsx
index 387f7ded9..dd21aed08 100644
--- a/web/src/js/components/Modal/ModalLayout.jsx
+++ b/web/src/js/components/Modal/ModalLayout.tsx
@@ -1,10 +1,14 @@
 import * as React from "react"
 
-export default function ModalLayout ({ children }) {
+type ModalLayoutProps = {
+    children: React.ReactNode,
+}
+
+export default function ModalLayout ({ children}: ModalLayoutProps ) {
     return (
         <div>
         <div className="modal-backdrop fade in"></div>
-        <div className="modal modal-visible" id="optionsModal" tabIndex="-1" role="dialog" aria-labelledby="options">
+        <div className="modal modal-visible" id="optionsModal" tabIndex={-1} role="dialog" aria-labelledby="options">
         <div className="modal-dialog modal-lg" role="document">
             <div className="modal-content">
                 {children}
diff --git a/web/src/js/filt/filt.js b/web/src/js/filt/filt.js
index 3b7699362..7d496bd4b 100644
--- a/web/src/js/filt/filt.js
+++ b/web/src/js/filt/filt.js
@@ -2024,7 +2024,9 @@ export default (function() {
         new RegExp("application/x-javascript"),
         new RegExp("application/javascript"),
         new RegExp("text/css"),
-        new RegExp("image/.*")
+        new RegExp("image/.*"),
+        new RegExp("font/.*"),
+        new RegExp("application/font.*"),
     ];
     function assetFilter(flow) {
         if (flow.response) {