diff --git a/Accounts/src/App.tsx b/Accounts/src/App.tsx
index d74c89e179..fbce41db2a 100644
--- a/Accounts/src/App.tsx
+++ b/Accounts/src/App.tsx
@@ -20,9 +20,18 @@ function App(): ReactElement {
                         path="/accounts/forgot-password"
                         element={<ForgotPasswordPage />}
                     />
-                    <Route path="/accounts/register" element={<RegisterPage />} />
-                    <Route path="/accounts/login/sso" element={<SsoLoginPage />} />
-                    <Route path="/accounts/verify-email" element={<LoginPage />} />
+                    <Route
+                        path="/accounts/register"
+                        element={<RegisterPage />}
+                    />
+                    <Route
+                        path="/accounts/login/sso"
+                        element={<SsoLoginPage />}
+                    />
+                    <Route
+                        path="/accounts/verify-email"
+                        element={<LoginPage />}
+                    />
                 </Routes>
             </Router>
         </div>
diff --git a/Accounts/src/Pages/Register.tsx b/Accounts/src/Pages/Register.tsx
index ca201c6e2c..93fd6ce0c6 100644
--- a/Accounts/src/Pages/Register.tsx
+++ b/Accounts/src/Pages/Register.tsx
@@ -12,7 +12,6 @@ import HTTPResponse from 'Common/Types/API/HTTPResponse';
 import FormFieldSchemaType from 'CommonUI/src/Components/Forms/Types/FormFieldSchemaType';
 
 const RegisterPage: FunctionComponent = () => {
-
     const [isLaoding, setIsLoading] = useState<boolean>(false);
 
     const user: User = new User();
@@ -20,15 +19,15 @@ const RegisterPage: FunctionComponent = () => {
     const submitForm = async (values: FormValues<User>) => {
         setIsLoading(true);
 
-        const response: HTTPResponse<JSONObject> = await IdentityAPI.post<JSONObject>(new Route("/signup"), {
-            user: values as JSONObject
-        });
+        const response: HTTPResponse<JSONObject> =
+            await IdentityAPI.post<JSONObject>(new Route('/signup'), {
+                user: values as JSONObject,
+            });
 
-        // navigate to dashboard. 
+        // navigate to dashboard.
         console.log(response);
         setIsLoading(false);
-    }
-
+    };
 
     return (
         <Container title="Register">
@@ -108,7 +107,6 @@ const RegisterPage: FunctionComponent = () => {
                         <p>
                             <span>Have an account? </span>
                             <Link to="/accounts/login">Login</Link>
-
                         </p>
                     </div>
                 }
diff --git a/Accounts/src/Pages/SsoLogin.tsx b/Accounts/src/Pages/SsoLogin.tsx
index 622e7be87c..4a1c58df2c 100644
--- a/Accounts/src/Pages/SsoLogin.tsx
+++ b/Accounts/src/Pages/SsoLogin.tsx
@@ -33,7 +33,9 @@ const SsoLoginPage: FunctionComponent = () => {
                 footer={
                     <div className="actions">
                         <p>
-                            <Link to="/accounts/login">Use your password instead</Link>
+                            <Link to="/accounts/login">
+                                Use your password instead
+                            </Link>
                         </p>
                         <p>
                             <span>Don&apos;t have an account? </span>
diff --git a/AdminDashboard/src/App.tsx b/AdminDashboard/src/App.tsx
index 30a8569705..d63df12bb2 100644
--- a/AdminDashboard/src/App.tsx
+++ b/AdminDashboard/src/App.tsx
@@ -20,7 +20,6 @@ if (userData !== undefined) {
     User.setEmail(userData.email);
     User.setName(userData.name);
 } else {
-
     window.location.href = ACCOUNTS_URL;
 }
 
@@ -32,7 +31,9 @@ const App: Function = () => {
                     <Suspense fallback={<LoadingState />}>
                         <Switch>
                             {allRoutes
-                                .filter(route => route.visible)
+                                .filter(route => {
+                                    return route.visible;
+                                })
                                 .map((route, index) => {
                                     return (
                                         <Route
diff --git a/AdminDashboard/src/Components/404.tsx b/AdminDashboard/src/Components/404.tsx
index cf6438341a..498b06fbe0 100644
--- a/AdminDashboard/src/Components/404.tsx
+++ b/AdminDashboard/src/Components/404.tsx
@@ -1,7 +1,6 @@
 import React, { Component, Fragment } from 'react';
 
 class NotFound extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -34,12 +33,11 @@ class NotFound extends Component<ComponentProps> {
                         </div>
                     </div>
                 </div>
-            </Fragment >
+            </Fragment>
         );
     }
 }
 
-
 NotFound.displayName = 'NotFound';
 
 export default NotFound;
diff --git a/AdminDashboard/src/Components/AdminNote/AdminNote.tsx b/AdminDashboard/src/Components/AdminNote/AdminNote.tsx
index 2f28b98d96..980ca50415 100644
--- a/AdminDashboard/src/Components/AdminNote/AdminNote.tsx
+++ b/AdminDashboard/src/Components/AdminNote/AdminNote.tsx
@@ -6,7 +6,7 @@ import { Field } from 'redux-form';
 
 const AdminNote: Function = ({
     fields,
-    meta: { error, submitFailed }
+    meta: { error, submitFailed },
 }: $TSFixMe) => {
     return (
         <ul>
@@ -37,7 +37,9 @@ const AdminNote: Function = ({
                                         id={`btnRemoveAdminNote${i}`}
                                         className="bs-Button bs-DeprecatedButton"
                                         type="button"
-                                        onClick={() => fields.remove(i)}
+                                        onClick={() => {
+                                            return fields.remove(i);
+                                        }}
                                     >
                                         Remove
                                     </button>
@@ -58,7 +60,9 @@ const AdminNote: Function = ({
                                     id="btnAddAdminNotes"
                                     type="button"
                                     className="bs-Button bs-FileUploadButton bs-Button--icon bs-Button--new"
-                                    onClick={() => fields.push({ note: '' })}
+                                    onClick={() => {
+                                        return fields.push({ note: '' });
+                                    }}
                                 >
                                     Add Notes
                                 </button>
diff --git a/AdminDashboard/src/Components/AdminNote/AdminNotes.tsx b/AdminDashboard/src/Components/AdminNote/AdminNotes.tsx
index c7b123d061..36a343ac91 100644
--- a/AdminDashboard/src/Components/AdminNote/AdminNotes.tsx
+++ b/AdminDashboard/src/Components/AdminNote/AdminNotes.tsx
@@ -19,7 +19,6 @@ function validate(values: $TSFixMe) {
             const adminNotesErrors: $TSFixMe = {};
             if (values.adminNotes[i] && values.adminNotes[i].note) {
                 if (!Validate.text(values.adminNotes[i].note)) {
-
                     adminNotesErrors.note = 'Note is not in text format.';
                     adminNotesArrayErrors[i] = adminNotesErrors;
                 }
@@ -27,7 +26,6 @@ function validate(values: $TSFixMe) {
         }
 
         if (adminNotesArrayErrors.length) {
-
             errors.adminNotes = adminNotesArrayErrors;
         }
     }
@@ -35,17 +33,15 @@ function validate(values: $TSFixMe) {
     return errors;
 }
 
-export class AdminNotes extends Component<ComponentProps>{
+export class AdminNotes extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     submitForm = async (values: $TSFixMe) => {
-
         await this.props.addNote(this.props.id, values.adminNotes);
     };
 
     override render() {
-
         const { handleSubmit, requesting }: $TSFixMe = this.props;
         return (
             <div className="Box-root Margin-bottom--12">
@@ -101,16 +97,16 @@ export class AdminNotes extends Component<ComponentProps>{
     }
 }
 
-
 AdminNotes.displayName = 'AdminNotes';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({}, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({}, dispatch);
+};
 
 const mapStateToProps: Function = () => {
     return {};
 };
 
-
 AdminNotes.propTypes = {
     requesting: PropTypes.bool,
     addNote: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/AuditLogs/AuditLogsJsonViewModal.tsx b/AdminDashboard/src/Components/AuditLogs/AuditLogsJsonViewModal.tsx
index b2942e2b1f..7bb8448867 100644
--- a/AdminDashboard/src/Components/AuditLogs/AuditLogsJsonViewModal.tsx
+++ b/AdminDashboard/src/Components/AuditLogs/AuditLogsJsonViewModal.tsx
@@ -7,7 +7,6 @@ import ReactJson from 'react-json-view';
 import ClickOutside from 'react-click-outside';
 
 class AuditLogsJsonViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,7 +21,6 @@ class AuditLogsJsonViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -31,7 +29,6 @@ class AuditLogsJsonViewModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             error,
@@ -142,8 +139,9 @@ class AuditLogsJsonViewModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -165,7 +163,6 @@ class AuditLogsJsonViewModal extends Component<ComponentProps> {
     }
 }
 
-
 AuditLogsJsonViewModal.displayName = 'AuditLogsJsonViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -181,7 +178,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 AuditLogsJsonViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/AuditLogs/AuditLogsList.tsx b/AdminDashboard/src/Components/AuditLogs/AuditLogsList.tsx
index b17e4b70cb..d293f668c9 100644
--- a/AdminDashboard/src/Components/AuditLogs/AuditLogsList.tsx
+++ b/AdminDashboard/src/Components/AuditLogs/AuditLogsList.tsx
@@ -10,7 +10,7 @@ import AuditLogsJsonViewModal from './AuditLogsJsonViewModal';
 import DeleteConfirmationModal from './DeleteConfirmationModal';
 import ShouldRender from '../basic/ShouldRender';
 
-export class AuditLogsList extends Component<ComponentProps>{
+export class AuditLogsList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,7 +20,6 @@ export class AuditLogsList extends Component<ComponentProps>{
     }
 
     handleDelete = () => {
-
         const { openModal }: $TSFixMe = this.props;
 
         const { deleteModalId }: $TSFixMe = this.state;
@@ -33,7 +32,6 @@ export class AuditLogsList extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -42,64 +40,51 @@ export class AuditLogsList extends Component<ComponentProps>{
 
     override render() {
         if (
-
             this.props.auditLogs &&
-
             this.props.auditLogs.skip &&
-
             typeof this.props.auditLogs.skip === 'string'
         ) {
-
             this.props.auditLogs.skip = parseInt(this.props.auditLogs.skip, 10);
         }
         if (
-
             this.props.auditLogs &&
-
             this.props.auditLogs.limit &&
-
             typeof this.props.auditLogs.limit === 'string'
         ) {
-
             this.props.auditLogs.limit = parseInt(
-
                 this.props.auditLogs.limit,
                 10
             );
         }
 
-        if (!this.props.auditLogs.skip) this.props.auditLogs.skip = 0;
+        if (!this.props.auditLogs.skip) {
+            this.props.auditLogs.skip = 0;
+        }
 
-        if (!this.props.auditLogs.limit) this.props.auditLogs.limit = 0;
+        if (!this.props.auditLogs.limit) {
+            this.props.auditLogs.limit = 0;
+        }
 
         let canNext =
-
             this.props.auditLogs &&
-
-                this.props.auditLogs.count &&
-
-                this.props.auditLogs.count >
-
+            this.props.auditLogs.count &&
+            this.props.auditLogs.count >
                 this.props.auditLogs.skip + this.props.auditLogs.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.auditLogs && this.props.auditLogs.skip <= 0
                 ? false
                 : true;
 
         if (
-
             this.props.auditLogs &&
-
             (this.props.requesting || !this.props.auditLogs.auditLogs)
         ) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.auditLogs && this.props.auditLogs.count) / 10
         );
         return (
@@ -151,7 +136,6 @@ export class AuditLogsList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -172,127 +156,132 @@ export class AuditLogsList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.auditLogs &&
-
-                                this.props.auditLogs.auditLogs &&
-
-                                this.props.auditLogs.auditLogs.length > 0 ? (
-
-                                this.props.auditLogs.auditLogs.map((auditLog: $TSFixMe) => {
-                                    return (
-                                        <tr
-                                            key={auditLog._id}
-                                            className="Table-row db-ListViewItem bs-ActionsParent"
-                                        >
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{ height: '1px' }}
+                              this.props.auditLogs.auditLogs &&
+                              this.props.auditLogs.auditLogs.length > 0 ? (
+                                this.props.auditLogs.auditLogs.map(
+                                    (auditLog: $TSFixMe) => {
+                                        return (
+                                            <tr
+                                                key={auditLog._id}
+                                                className="Table-row db-ListViewItem bs-ActionsParent"
                                             >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <span>
-                                                                {auditLog.projectId
-                                                                    ? auditLog
-                                                                        .projectId
-                                                                        .name
-                                                                    : 'N/A'}
-                                                            </span>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{ height: '1px' }}
+                                                >
                                                     <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
                                                                 <span>
-                                                                    {auditLog.userId
+                                                                    {auditLog.projectId
                                                                         ? auditLog
-                                                                            .userId
-                                                                            .name
+                                                                              .projectId
+                                                                              .name
                                                                         : 'N/A'}
                                                                 </span>
                                                             </div>
                                                         </span>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {auditLog.request &&
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {auditLog.userId
+                                                                            ? auditLog
+                                                                                  .userId
+                                                                                  .name
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {auditLog.request &&
                                                                         auditLog
                                                                             .request
                                                                             .apiSection
-                                                                        ? auditLog
-                                                                            .request
-                                                                            .apiSection
-                                                                        : ''}
-                                                                </span>
-                                                            </div>
-                                                        </span>
+                                                                            ? auditLog
+                                                                                  .request
+                                                                                  .apiSection
+                                                                            : ''}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
+                                                </td>
 
-                                            <td
-                                                className="Table-cell Table-cell--align--center Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    <button
-                                                                        onClick={() => {
-
-                                                                            this.props.openModal(
-                                                                                {
-                                                                                    id: uuidv4(),
-                                                                                    onConfirm: () => {
-                                                                                        return Promise.resolve();
-                                                                                    },
-                                                                                    content: (props: $TSFixMe) => <AuditLogsJsonViewModal
-                                                                                        {...props}
-                                                                                        reqLog={
-                                                                                            auditLog.request
-                                                                                        }
-                                                                                        resLog={
-                                                                                            auditLog.response
-                                                                                        }
-                                                                                    />,
-                                                                                }
-                                                                            );
-                                                                        }}
-                                                                        id="view"
-                                                                        className="bs-Button"
-                                                                    >
-                                                                        <span>
-                                                                            View
-                                                                        </span>
-                                                                    </button>
-                                                                </span>
-                                                            </div>
-                                                        </span>
+                                                <td
+                                                    className="Table-cell Table-cell--align--center Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        <button
+                                                                            onClick={() => {
+                                                                                this.props.openModal(
+                                                                                    {
+                                                                                        id: uuidv4(),
+                                                                                        onConfirm:
+                                                                                            () => {
+                                                                                                return Promise.resolve();
+                                                                                            },
+                                                                                        content:
+                                                                                            (
+                                                                                                props: $TSFixMe
+                                                                                            ) => {
+                                                                                                return (
+                                                                                                    <AuditLogsJsonViewModal
+                                                                                                        {...props}
+                                                                                                        reqLog={
+                                                                                                            auditLog.request
+                                                                                                        }
+                                                                                                        resLog={
+                                                                                                            auditLog.response
+                                                                                                        }
+                                                                                                    />
+                                                                                                );
+                                                                                            },
+                                                                                    }
+                                                                                );
+                                                                            }}
+                                                                            id="view"
+                                                                            className="bs-Button"
+                                                                        >
+                                                                            <span>
+                                                                                View
+                                                                            </span>
+                                                                        </button>
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                    );
-                                })
+                                                </td>
+                                            </tr>
+                                        );
+                                    }
+                                )
                             ) : (
                                 <tr></tr>
                             )}
@@ -303,21 +292,15 @@ export class AuditLogsList extends Component<ComponentProps>{
                     id="logsStatus"
                     style={{ textAlign: 'center', marginTop: '10px' }}
                 >
-
                     {this.props.auditLogs &&
-
-                        (!this.props.auditLogs.auditLogs ||
-
-                            !this.props.auditLogs.auditLogs.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.auditLogs.error
+                    (!this.props.auditLogs.auditLogs ||
+                        !this.props.auditLogs.auditLogs.length) &&
+                    !this.props.requesting &&
+                    !this.props.auditLogs.error
                         ? "We don't have any logs yet"
                         : null}
 
                     {this.props.auditLogs && this.props.auditLogs.error
-
                         ? this.props.auditLogs.error
                         : null}
                 </div>
@@ -331,22 +314,17 @@ export class AuditLogsList extends Component<ComponentProps>{
                                 >
                                     <ShouldRender
                                         if={
-
                                             this.props.auditLogs &&
-
                                             this.props.auditLogs.count
                                         }
                                     >
-
                                         Page {this.props.page} of{' '}
                                         {numberOfPages} (
                                         <span id="audit-log-count">
-
                                             {this.props.auditLogs.count}
                                         </span>{' '}
                                         Log
                                         <ShouldRender
-
                                             if={this.props.auditLogs.count > 0}
                                         >
                                             s
@@ -363,9 +341,7 @@ export class AuditLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.auditLogs.skip,
 
                                             this.props.auditLogs.limit
@@ -390,9 +366,7 @@ export class AuditLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.auditLogs.skip,
 
                                             this.props.auditLogs.limit
@@ -420,7 +394,6 @@ export class AuditLogsList extends Component<ComponentProps>{
                                     className={'Button bs-ButtonLegacy'}
                                     // data-db-analytics-name="list_view.pagination.next"
                                     type="button"
-
                                     disabled={this.props.requesting}
                                 >
                                     <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
@@ -449,10 +422,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 AuditLogsList.displayName = 'ProjectList';
 
-
 AuditLogsList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/AuditLogs/DeleteConfirmationModal.tsx b/AdminDashboard/src/Components/AuditLogs/DeleteConfirmationModal.tsx
index 454f71d9f1..b3a148fb2e 100644
--- a/AdminDashboard/src/Components/AuditLogs/DeleteConfirmationModal.tsx
+++ b/AdminDashboard/src/Components/AuditLogs/DeleteConfirmationModal.tsx
@@ -10,7 +10,6 @@ import { deleteAuditLogs } from '../../actions/auditLogs';
 import { FormLoader } from '../basic/Loader';
 
 class DeleteConfirmationModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +24,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
                 return this.handleDelete();
@@ -35,8 +33,8 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     };
 
     handleDelete = () => {
-
-        const { error, deleteAuditLogs, closeModal, modalId }: $TSFixMe = this.props;
+        const { error, deleteAuditLogs, closeModal, modalId }: $TSFixMe =
+            this.props;
         deleteAuditLogs().then(() => {
             if (!error) {
                 return closeModal({ id: modalId });
@@ -44,7 +42,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
         });
     };
     override render() {
-
         const { closeThisDialog, deleteRequest, error }: $TSFixMe = this.props;
 
         return (
@@ -102,8 +99,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <button
                                             id="cancelAuditDelete"
-                                            className={`bs-Button btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={deleteRequest}
@@ -115,8 +114,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             onClick={this.handleDelete}
                                             disabled={deleteRequest}
                                             autoFocus={true}
@@ -144,18 +145,20 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     }
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    deleteRequest: state.auditLogs.auditLogs.deleteRequest,
-    error: state.auditLogs.auditLogs.error,
-    modalId: state.modal.modals[0].id
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal, deleteAuditLogs }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        deleteRequest: state.auditLogs.auditLogs.deleteRequest,
+        error: state.auditLogs.auditLogs.error,
+        modalId: state.modal.modals[0].id,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal, deleteAuditLogs }, dispatch);
+};
 
 DeleteConfirmationModal.displayName = 'Delete Confirmation Modal';
 
-
 DeleteConfirmationModal.propTypes = {
     closeThisDialog: PropTypes.func,
     deleteRequest: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Basic/AlertPanel.tsx b/AdminDashboard/src/Components/Basic/AlertPanel.tsx
index 8107cf8a6f..c7f51b8912 100644
--- a/AdminDashboard/src/Components/Basic/AlertPanel.tsx
+++ b/AdminDashboard/src/Components/Basic/AlertPanel.tsx
@@ -2,21 +2,18 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
 class AlertPanel extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override render() {
         return (
-            <div className="Box-root Margin-vertical--12" >
+            <div className="Box-root Margin-vertical--12">
                 <div
-
                     className={`db-Trends Card-shadow--small ${this.props.className}`}
                 >
                     <div className="Box-root Box-background--red4">
                         <div className="bs-ContentSection-content Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--spaceBetween Padding-horizontal--20 Padding-vertical--12">
                             <span className="ContentHeader-title Text-color--white Text-fontSize--15 Text-fontWeight--regular Text-lineHeight--16">
-
                                 <span>{this.props.message}</span>
                             </span>
                         </div>
@@ -27,10 +24,8 @@ class AlertPanel extends Component<ComponentProps> {
     }
 }
 
-
 AlertPanel.displayName = 'AlertPanel';
 
-
 AlertPanel.propTypes = {
     message: PropTypes.object.isRequired,
     className: PropTypes.string,
diff --git a/AdminDashboard/src/Components/Basic/BeforeLoad.tsx b/AdminDashboard/src/Components/Basic/BeforeLoad.tsx
index e9bc1e017b..bd1d9454e9 100644
--- a/AdminDashboard/src/Components/Basic/BeforeLoad.tsx
+++ b/AdminDashboard/src/Components/Basic/BeforeLoad.tsx
@@ -12,17 +12,17 @@ class BeforeLoad extends Component<ComponentProps> {
         this.isAuthenticated = isAuthenticated;
         const redirectTo: $TSFixMe = getQueryVar('redirectTo', initialUrl);
         const counter: $TSFixMe = getQueryVar('counter', initialUrl) || 0;
-        if (redirectTo) this.redirect = redirectTo;
+        if (redirectTo) {
+            this.redirect = redirectTo;
+        }
         if (isAuthenticated) {
             if (redirectTo) {
                 sessionStorage.removeItem('initialUrl');
                 const accessToken: $TSFixMe = User.getAccessToken();
 
-                window.location.href = `${redirectTo}?accessToken=${accessToken}&counter=${parseInt(
-
-                    counter,
-                    10
-                ) + 1}`;
+                window.location.href = `${redirectTo}?accessToken=${accessToken}&counter=${
+                    parseInt(counter, 10) + 1
+                }`;
             }
         }
     }
@@ -52,13 +52,10 @@ class BeforeLoad extends Component<ComponentProps> {
     }
 }
 
-
 BeforeLoad.displayName = 'BeforeLoad';
 
-
 BeforeLoad.contextTypes = {};
 
-
 BeforeLoad.propTypes = {
     children: PropTypes.any,
 };
diff --git a/AdminDashboard/src/Components/Basic/DropDownMenu.tsx b/AdminDashboard/src/Components/Basic/DropDownMenu.tsx
index 740d3363cc..6344a1c554 100644
--- a/AdminDashboard/src/Components/Basic/DropDownMenu.tsx
+++ b/AdminDashboard/src/Components/Basic/DropDownMenu.tsx
@@ -8,13 +8,12 @@ const DropDownMenu: Function = ({
     value,
     updateState,
     id,
-    title
+    title,
 }: $TSFixMe) => {
     const [open, setOpen]: $TSFixMe = useState(false);
     const container: $TSFixMe = useRef(null);
 
     const handleClickOutside: Function = (event: $TSFixMe) => {
-
         if (container.current && !container.current.contains(event.target)) {
             setOpen(false);
         }
@@ -41,7 +40,9 @@ const DropDownMenu: Function = ({
                 className="bs-Button bs-DeprecatedButton ddm-button"
                 id={id}
                 title={title}
-                onClick={() => setOpen(!open)}
+                onClick={() => {
+                    return setOpen(!open);
+                }}
             >
                 <div>{value}</div>
                 <div className="caret-icon--down"></div>
@@ -49,16 +50,20 @@ const DropDownMenu: Function = ({
             {open && (
                 <div className="ddm-dropdown-wrapper">
                     <ul className="ddm-dropdown-menu">
-                        {options.map((data: $TSFixMe, index: $TSFixMe) => (
-                            <ShouldRender key={index} if={data.show}>
-                                <li
-                                    className="ddm-dropdown-menu__item"
-                                    onClick={() => onClick(data.value)}
-                                >
-                                    {data.value}
-                                </li>
-                            </ShouldRender>
-                        ))}
+                        {options.map((data: $TSFixMe, index: $TSFixMe) => {
+                            return (
+                                <ShouldRender key={index} if={data.show}>
+                                    <li
+                                        className="ddm-dropdown-menu__item"
+                                        onClick={() => {
+                                            return onClick(data.value);
+                                        }}
+                                    >
+                                        {data.value}
+                                    </li>
+                                </ShouldRender>
+                            );
+                        })}
                     </ul>
                 </div>
             )}
diff --git a/AdminDashboard/src/Components/Basic/ErrorBoundary.tsx b/AdminDashboard/src/Components/Basic/ErrorBoundary.tsx
index b8bfa3b258..354256e78f 100644
--- a/AdminDashboard/src/Components/Basic/ErrorBoundary.tsx
+++ b/AdminDashboard/src/Components/Basic/ErrorBoundary.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
 class ErrorBoundary extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -17,7 +16,6 @@ class ErrorBoundary extends Component<ComponentProps> {
     }
 
     override render() {
-
         if (this.state.hasError || this.state.error) {
             return (
                 <div
@@ -47,13 +45,10 @@ class ErrorBoundary extends Component<ComponentProps> {
     }
 }
 
-
 ErrorBoundary.displayName = 'ErrorBoundary';
 
-
 ErrorBoundary.contextTypes = {};
 
-
 ErrorBoundary.propTypes = {
     children: PropTypes.any,
 };
diff --git a/AdminDashboard/src/Components/Basic/Loader.tsx b/AdminDashboard/src/Components/Basic/Loader.tsx
index 723e41dedf..6d946da521 100644
--- a/AdminDashboard/src/Components/Basic/Loader.tsx
+++ b/AdminDashboard/src/Components/Basic/Loader.tsx
@@ -4,112 +4,151 @@ const loaderStyle: $TSFixMe = {
     backgroundColor: '#96d8ff',
 };
 
-export const FlatLoader: Function = () => (
-    <div className="ball-pulse">
-        <div style={loaderStyle}></div>
-        <div style={loaderStyle}></div>
-        <div style={loaderStyle}></div>
-    </div>
-);
+export const FlatLoader: Function = () => {
+    return (
+        <div className="ball-pulse">
+            <div style={loaderStyle}></div>
+            <div style={loaderStyle}></div>
+            <div style={loaderStyle}></div>
+        </div>
+    );
+};
 
 FlatLoader.displayName = 'FlatLoader';
 
-export const FormLoader: Function = () => (
-    <div className="ball-beat">
-        <div style={{ height: '8px', width: '8px' }}></div>
-        <div style={{ height: '8px', width: '8px' }}></div>
-        <div style={{ height: '8px', width: '8px' }}></div>
-    </div>
-);
+export const FormLoader: Function = () => {
+    return (
+        <div className="ball-beat">
+            <div style={{ height: '8px', width: '8px' }}></div>
+            <div style={{ height: '8px', width: '8px' }}></div>
+            <div style={{ height: '8px', width: '8px' }}></div>
+        </div>
+    );
+};
 
 FormLoader.displayName = 'FormLoader';
 
-export const ListLoader: Function = () => (
-    <div
-        className="ball-beat"
-        style={{ textAlign: 'center', marginTop: '20px' }}
-    >
+export const ListLoader: Function = () => {
+    return (
         <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-    </div>
-);
+            className="ball-beat"
+            style={{ textAlign: 'center', marginTop: '20px' }}
+        >
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+        </div>
+    );
+};
 
 ListLoader.displayName = 'ListLoader';
 
-export const TeamListLoader: Function = () => (
-    <div className="ball-beat" style={{ textAlign: 'center', width: '95px' }}>
+export const TeamListLoader: Function = () => {
+    return (
         <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-    </div>
-);
+            className="ball-beat"
+            style={{ textAlign: 'center', width: '95px' }}
+        >
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+        </div>
+    );
+};
 
 TeamListLoader.displayName = 'TeamListLoader';
 
-export const Spinner: Function = () => (
-    <div className="Spinner bs-SpinnerLegacy Spinner--color--white Box-root Flex-inlineFlex Flex-alignItems--center Flex-justifyContent--center">
-        <svg
-            viewBox="0 0 24 24"
-            xmlns="http://www.w3.org/2000/svg"
-            className="Spinner-svg"
-        >
-            <ellipse
-                cx={12}
-                cy={12}
-                rx={10}
-                ry={10}
-                className="Spinner-ellipse"
-            />
-        </svg>
-    </div>
-);
+export const Spinner: Function = () => {
+    return (
+        <div className="Spinner bs-SpinnerLegacy Spinner--color--white Box-root Flex-inlineFlex Flex-alignItems--center Flex-justifyContent--center">
+            <svg
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                className="Spinner-svg"
+            >
+                <ellipse
+                    cx={12}
+                    cy={12}
+                    rx={10}
+                    ry={10}
+                    className="Spinner-ellipse"
+                />
+            </svg>
+        </div>
+    );
+};
 
 Spinner.displayName = 'Spinner';
 
-export const LoadingState: Function = () => (
-    <div className="Box-root Margin-bottom--12">
-        <div className="bs-ContentSection Card-root Card-shadow--medium">
-            <div className="Box-root">
-                <div className="ContentState Box-root">
-                    <div className="Box-root Padding-horizontal--20 Padding-vertical--48">
-                        <div className="Box-root Flex-flex Flex-alignItems--center Flex-direction--column Flex-justifyContent--flexStart">
-                            <div className="Box-root Margin-bottom--12">
-                                <div className="Box-root">
-                                    <div className="Spinner bs-SpinnerLegacy Spinner--size--large Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center">
-                                        <svg
-                                            viewBox="0 0 24 24"
-                                            xmlns="http://www.w3.org/2000/svg"
-                                            className="Spinner-svg"
-                                        >
-                                            <ellipse
-                                                cx={12}
-                                                cy={12}
-                                                rx={10}
-                                                ry={10}
-                                                className="Spinner-ellipse"
-                                            />
-                                        </svg>
+export const LoadingState: Function = () => {
+    return (
+        <div className="Box-root Margin-bottom--12">
+            <div className="bs-ContentSection Card-root Card-shadow--medium">
+                <div className="Box-root">
+                    <div className="ContentState Box-root">
+                        <div className="Box-root Padding-horizontal--20 Padding-vertical--48">
+                            <div className="Box-root Flex-flex Flex-alignItems--center Flex-direction--column Flex-justifyContent--flexStart">
+                                <div className="Box-root Margin-bottom--12">
+                                    <div className="Box-root">
+                                        <div className="Spinner bs-SpinnerLegacy Spinner--size--large Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center">
+                                            <svg
+                                                viewBox="0 0 24 24"
+                                                xmlns="http://www.w3.org/2000/svg"
+                                                className="Spinner-svg"
+                                            >
+                                                <ellipse
+                                                    cx={12}
+                                                    cy={12}
+                                                    rx={10}
+                                                    ry={10}
+                                                    className="Spinner-ellipse"
+                                                />
+                                            </svg>
+                                        </div>
                                     </div>
                                 </div>
-                            </div>
-                            <div className="Box-root">
                                 <div className="Box-root">
-                                    <span className="ContentState-title Text-align--center Text-color--secondary Text-display--block Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                        <span>Loading</span>
-                                    </span>
+                                    <div className="Box-root">
+                                        <span className="ContentState-title Text-align--center Text-color--secondary Text-display--block Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                            <span>Loading</span>
+                                        </span>
+                                    </div>
                                 </div>
                             </div>
                         </div>
@@ -117,7 +156,7 @@ export const LoadingState: Function = () => (
                 </div>
             </div>
         </div>
-    </div>
-);
+    );
+};
 
 LoadingState.displayName = 'LoadingState';
diff --git a/AdminDashboard/src/Components/Basic/RenderField.tsx b/AdminDashboard/src/Components/Basic/RenderField.tsx
index 4c52bfa3df..6e66fb615f 100644
--- a/AdminDashboard/src/Components/Basic/RenderField.tsx
+++ b/AdminDashboard/src/Components/Basic/RenderField.tsx
@@ -11,43 +11,45 @@ const RenderField: Function = ({
     disabled,
     initialValue,
     style,
-    autoFocus
-}: $TSFixMe) => (
-    <span>
+    autoFocus,
+}: $TSFixMe) => {
+    return (
         <span>
-            <input
-                {...input}
-                type={type}
-                placeholder={placeholder}
-                className={className}
-                id={id}
-                disabled={disabled || false}
-                defaultValue={initialValue}
-                style={style || {}}
-                autoFocus={autoFocus}
-            />
-        </span>
-        <br />
-        {meta.error && meta.touched && (
-            <div
-                className="Box-root Flex-flex Flex-alignItems--stretch Flex-direction--row Flex-justifyContent--flexStart"
-                style={{ marginTop: '5px' }}
-            >
+            <span>
+                <input
+                    {...input}
+                    type={type}
+                    placeholder={placeholder}
+                    className={className}
+                    id={id}
+                    disabled={disabled || false}
+                    defaultValue={initialValue}
+                    style={style || {}}
+                    autoFocus={autoFocus}
+                />
+            </span>
+            <br />
+            {meta.error && meta.touched && (
                 <div
-                    className="Box-root Margin-right--8"
-                    style={{ marginTop: '2px' }}
+                    className="Box-root Flex-flex Flex-alignItems--stretch Flex-direction--row Flex-justifyContent--flexStart"
+                    style={{ marginTop: '5px' }}
                 >
-                    <div className="Icon Icon--info Icon--color--red Icon--size--14 Box-root Flex-flex"></div>
+                    <div
+                        className="Box-root Margin-right--8"
+                        style={{ marginTop: '2px' }}
+                    >
+                        <div className="Icon Icon--info Icon--color--red Icon--size--14 Box-root Flex-flex"></div>
+                    </div>
+                    <div className="Box-root">
+                        <span className="field-error" style={{ color: 'red' }}>
+                            {meta.error}
+                        </span>
+                    </div>
                 </div>
-                <div className="Box-root">
-                    <span className="field-error" style={{ color: 'red' }}>
-                        {meta.error}
-                    </span>
-                </div>
-            </div>
-        )}
-    </span>
-);
+            )}
+        </span>
+    );
+};
 
 RenderField.displayName = 'RenderField';
 
diff --git a/AdminDashboard/src/Components/Basic/RenderSelect.tsx b/AdminDashboard/src/Components/Basic/RenderSelect.tsx
index c5a80c475d..1dfe4f7895 100644
--- a/AdminDashboard/src/Components/Basic/RenderSelect.tsx
+++ b/AdminDashboard/src/Components/Basic/RenderSelect.tsx
@@ -12,18 +12,18 @@ const RenderSelect: Function = ({
     options = [{ value: '', label: 'Select' }],
     message,
     id,
-    autoFocus
+    autoFocus,
 }: $TSFixMe) => {
     const filteredOpt: $TSFixMe = useRef();
 
-    filteredOpt.current = options.filter(opt => opt.value === input.value);
+    filteredOpt.current = options.filter(opt => {
+        return opt.value === input.value;
+    });
 
     const [value, setValue]: $TSFixMe = useState({
         value: input.value,
         label:
-
             filteredOpt.current.length > 0
-
                 ? filteredOpt.current[0].label
                 : placeholder,
     });
@@ -32,9 +32,7 @@ const RenderSelect: Function = ({
         setValue({
             value: input.value,
             label:
-
                 filteredOpt.current.length > 0
-
                     ? filteredOpt.current[0].label
                     : placeholder,
         });
@@ -51,7 +49,6 @@ const RenderSelect: Function = ({
         <span style={{ height: '28px', width: '250px', ...style }}>
             <div style={{ display: 'flex' }}>
                 <Select
-
                     name={input.name}
                     value={value}
                     onChange={handleChange}
@@ -59,10 +56,9 @@ const RenderSelect: Function = ({
                     className={className}
                     id={id}
                     isDisabled={disabled || false}
-
-                    options={options.filter(opt =>
-                        opt.show !== undefined ? opt.show : true
-                    )}
+                    options={options.filter(opt => {
+                        return opt.show !== undefined ? opt.show : true;
+                    })}
                     autoFocus={autoFocus}
                 />
                 {message && message.length && (
diff --git a/AdminDashboard/src/Components/Basic/RenderTextArea.tsx b/AdminDashboard/src/Components/Basic/RenderTextArea.tsx
index 435813929f..38e79b314f 100644
--- a/AdminDashboard/src/Components/Basic/RenderTextArea.tsx
+++ b/AdminDashboard/src/Components/Basic/RenderTextArea.tsx
@@ -10,40 +10,42 @@ const RenderTextArea: Function = ({
     maxlength,
     rows,
     disabled,
-    style
-}: $TSFixMe) => (
-    <span>
+    style,
+}: $TSFixMe) => {
+    return (
         <span>
-            <textarea
-                {...input}
-                type={type}
-                rows={rows}
-                placeholder={placeholder}
-                maxLength={maxlength}
-                className={className}
-                disabled={disabled || false}
-                style={style || {}}
-            />
-        </span>
-        <br />
-        {meta.error && meta.touched && (
-            <div
-                className="Box-root Flex-flex Flex-alignItems--stretch Flex-direction--row Flex-justifyContent--flexStart"
-                style={{ marginTop: '5px' }}
-            >
+            <span>
+                <textarea
+                    {...input}
+                    type={type}
+                    rows={rows}
+                    placeholder={placeholder}
+                    maxLength={maxlength}
+                    className={className}
+                    disabled={disabled || false}
+                    style={style || {}}
+                />
+            </span>
+            <br />
+            {meta.error && meta.touched && (
                 <div
-                    className="Box-root Margin-right--8"
-                    style={{ marginTop: '2px' }}
+                    className="Box-root Flex-flex Flex-alignItems--stretch Flex-direction--row Flex-justifyContent--flexStart"
+                    style={{ marginTop: '5px' }}
                 >
-                    <div className="Icon Icon--info Icon--color--red Icon--size--14 Box-root Flex-flex"></div>
+                    <div
+                        className="Box-root Margin-right--8"
+                        style={{ marginTop: '2px' }}
+                    >
+                        <div className="Icon Icon--info Icon--color--red Icon--size--14 Box-root Flex-flex"></div>
+                    </div>
+                    <div className="Box-root">
+                        <span style={{ color: 'red' }}>{meta.error}</span>
+                    </div>
                 </div>
-                <div className="Box-root">
-                    <span style={{ color: 'red' }}>{meta.error}</span>
-                </div>
-            </div>
-        )}
-    </span>
-);
+            )}
+        </span>
+    );
+};
 
 RenderTextArea.displayName = 'RenderTextArea';
 
diff --git a/AdminDashboard/src/Components/Basic/UploadFile.tsx b/AdminDashboard/src/Components/Basic/UploadFile.tsx
index d3a5e3f56d..58e9936afa 100644
--- a/AdminDashboard/src/Components/Basic/UploadFile.tsx
+++ b/AdminDashboard/src/Components/Basic/UploadFile.tsx
@@ -8,7 +8,9 @@ const UploadFile: Function = ({
     meta: omitMeta,
 
     ...props
-}: $TSFixMe) => <input key={fileInputKey} type="file" {...inputProps} {...props} />;
+}: $TSFixMe) => {
+    return <input key={fileInputKey} type="file" {...inputProps} {...props} />;
+};
 
 UploadFile.propTypes = {
     input: PropTypes.object.isRequired,
diff --git a/AdminDashboard/src/Components/Basic/react-select-oneuptime/index.tsx b/AdminDashboard/src/Components/Basic/react-select-oneuptime/index.tsx
index b4d5f52849..d6a0498fc0 100644
--- a/AdminDashboard/src/Components/Basic/react-select-oneuptime/index.tsx
+++ b/AdminDashboard/src/Components/Basic/react-select-oneuptime/index.tsx
@@ -3,36 +3,48 @@ import React from 'react';
 import Select from 'react-select';
 import PropTypes from 'prop-types';
 
-const ReactSelectOneUptime: Function = (props: $TSFixMe) => <Select
-    {...props}
-    styles={{
-        control: (provided: $TSFixMe) => ({
-            ...provided,
-            border: '1px solid hsl(0,0%,80%) !important',
-            boxShadow: 'unset !important',
-            minHeight: 'unset',
+const ReactSelectOneUptime: Function = (props: $TSFixMe) => {
+    return (
+        <Select
+            {...props}
+            styles={{
+                control: (provided: $TSFixMe) => {
+                    return {
+                        ...provided,
+                        border: '1px solid hsl(0,0%,80%) !important',
+                        boxShadow: 'unset !important',
+                        minHeight: 'unset',
 
-            height:
-                props.style && props.style.height
-                    ? props.style.height
-                    : '30px'
-        }),
+                        height:
+                            props.style && props.style.height
+                                ? props.style.height
+                                : '30px',
+                    };
+                },
 
-        option: (provided, state) => ({
-            ...provided,
-            backgroundColor: state.isSelected ? 'black' : 'unset',
+                option: (provided, state) => {
+                    return {
+                        ...provided,
+                        backgroundColor: state.isSelected ? 'black' : 'unset',
 
-            ':hover': {
-                ...provided[':hover'],
-                backgroundColor: state.isSelected ? 'black' : '#ededed',
-            }
-        }),
-        menu: (provided: $TSFixMe) => ({
-            ...provided,
-            zIndex: 5
-        }),
-    }}
-/>;
+                        ':hover': {
+                            ...provided[':hover'],
+                            backgroundColor: state.isSelected
+                                ? 'black'
+                                : '#ededed',
+                        },
+                    };
+                },
+                menu: (provided: $TSFixMe) => {
+                    return {
+                        ...provided,
+                        zIndex: 5,
+                    };
+                },
+            }}
+        />
+    );
+};
 
 ReactSelectOneUptime.displayName = 'ReactSelectOneUptime';
 ReactSelectOneUptime.propTypes = {
diff --git a/AdminDashboard/src/Components/CallLogs/CallLogsContentViewModal.tsx b/AdminDashboard/src/Components/CallLogs/CallLogsContentViewModal.tsx
index ae0268a83a..efb1090769 100644
--- a/AdminDashboard/src/Components/CallLogs/CallLogsContentViewModal.tsx
+++ b/AdminDashboard/src/Components/CallLogs/CallLogsContentViewModal.tsx
@@ -5,7 +5,6 @@ import { connect } from 'react-redux';
 import ClickOutside from 'react-click-outside';
 import ShouldRender from '../basic/ShouldRender';
 class CallLogsContentViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,7 +19,6 @@ class CallLogsContentViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -28,8 +26,8 @@ class CallLogsContentViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
 
         return (
             <div className="db-CallLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -99,8 +97,9 @@ class CallLogsContentViewModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -122,7 +121,6 @@ class CallLogsContentViewModal extends Component<ComponentProps> {
     }
 }
 
-
 CallLogsContentViewModal.displayName = 'CallLogsContentViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -138,7 +136,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 CallLogsContentViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/CallLogs/CallLogsErrorViewModal.tsx b/AdminDashboard/src/Components/CallLogs/CallLogsErrorViewModal.tsx
index 29d358d04b..1b02f6a8c0 100644
--- a/AdminDashboard/src/Components/CallLogs/CallLogsErrorViewModal.tsx
+++ b/AdminDashboard/src/Components/CallLogs/CallLogsErrorViewModal.tsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import ShouldRender from '../basic/ShouldRender';
 class CallLogsErrorViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -18,7 +17,6 @@ class CallLogsErrorViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -26,8 +24,8 @@ class CallLogsErrorViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
         return (
             <div className="db-CallLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
                 <div
@@ -78,8 +76,9 @@ class CallLogsErrorViewModal extends Component<ComponentProps> {
                                         </div>
                                     </ShouldRender>
                                     <button
-                                        className={`bs-Button btn__modal ${isRequesting &&
-                                            'bs-is-disabled'}`}
+                                        className={`bs-Button btn__modal ${
+                                            isRequesting && 'bs-is-disabled'
+                                        }`}
                                         type="button"
                                         onClick={closeThisDialog}
                                         disabled={isRequesting}
@@ -100,7 +99,6 @@ class CallLogsErrorViewModal extends Component<ComponentProps> {
     }
 }
 
-
 CallLogsErrorViewModal.displayName = 'CallLogsErrorViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -116,7 +114,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 CallLogsErrorViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/CallLogs/CallLogsList.tsx b/AdminDashboard/src/Components/CallLogs/CallLogsList.tsx
index 2ef2055266..2ed131b75d 100644
--- a/AdminDashboard/src/Components/CallLogs/CallLogsList.tsx
+++ b/AdminDashboard/src/Components/CallLogs/CallLogsList.tsx
@@ -13,7 +13,7 @@ import CallLogsErrorViewModal from './CallLogsErrorViewModal';
 import DeleteConfirmationModal from './DeleteConfirmationModal';
 import { history, RootState } from '../../store';
 
-export class CallLogsList extends Component<ComponentProps>{
+export class CallLogsList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -23,7 +23,6 @@ export class CallLogsList extends Component<ComponentProps>{
     }
 
     handleDelete = () => {
-
         const { openModal }: $TSFixMe = this.props;
 
         const { deleteModalId }: $TSFixMe = this.state;
@@ -36,7 +35,6 @@ export class CallLogsList extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -45,58 +43,46 @@ export class CallLogsList extends Component<ComponentProps>{
 
     override render() {
         if (
-
             this.props.callLogs &&
-
             this.props.callLogs.skip &&
-
             typeof this.props.callLogs.skip === 'string'
         ) {
-
             this.props.callLogs.skip = parseInt(this.props.callLogs.skip, 10);
         }
         if (
-
             this.props.callLogs &&
-
             this.props.callLogs.limit &&
-
             typeof this.props.callLogs.limit === 'string'
         ) {
-
             this.props.callLogs.limit = parseInt(this.props.callLogs.limit, 10);
         }
 
-        if (!this.props.callLogs.skip) this.props.callLogs.skip = 0;
+        if (!this.props.callLogs.skip) {
+            this.props.callLogs.skip = 0;
+        }
 
-        if (!this.props.callLogs.limit) this.props.callLogs.limit = 0;
+        if (!this.props.callLogs.limit) {
+            this.props.callLogs.limit = 0;
+        }
 
         let canNext =
-
             this.props.callLogs &&
-
-                this.props.callLogs.count &&
-
-                this.props.callLogs.count >
-
+            this.props.callLogs.count &&
+            this.props.callLogs.count >
                 this.props.callLogs.skip + this.props.callLogs.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.callLogs && this.props.callLogs.skip <= 0 ? false : true;
 
         if (
-
             this.props.callLogs &&
-
             (this.props.requesting || !this.props.callLogs.callLogs)
         ) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.callLogs && this.props.callLogs.count) / 10
         );
         return (
@@ -171,7 +157,6 @@ export class CallLogsList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -192,202 +177,183 @@ export class CallLogsList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.callLogs &&
-
-                                this.props.callLogs.callLogs &&
-
-                                this.props.callLogs.callLogs.length > 0 ? (
-
-                                this.props.callLogs.callLogs.map((callLog: $TSFixMe) => {
-                                    return (
-                                        <tr
-                                            key={callLog._id}
-                                            className="Table-row db-ListViewItem bs-ActionsParent"
-                                        >
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{ height: '1px' }}
+                              this.props.callLogs.callLogs &&
+                              this.props.callLogs.callLogs.length > 0 ? (
+                                this.props.callLogs.callLogs.map(
+                                    (callLog: $TSFixMe) => {
+                                        return (
+                                            <tr
+                                                key={callLog._id}
+                                                className="Table-row db-ListViewItem bs-ActionsParent"
                                             >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <div
-                                                                className={`Badge Badge--color--${callLog.status ===
-                                                                    'Success'
-                                                                    ? 'green'
-                                                                    : 'red'
-                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
-                                                            >
-                                                                <span
-                                                                    className={`Badge-text Text-color--${callLog.status ===
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <div
+                                                                    className={`Badge Badge--color--${
+                                                                        callLog.status ===
                                                                         'Success'
-                                                                        ? 'green'
-                                                                        : 'red'
-                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
+                                                                            ? 'green'
+                                                                            : 'red'
+                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
                                                                 >
-                                                                    <span>
-                                                                        {callLog.status
-                                                                            ? callLog.status
-                                                                            : 'N/A'}
-                                                                    </span>
-                                                                </span>
-                                                            </div>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                    cursor: 'pointer',
-
-                                                    textDecoration: callLog.projectId
-                                                        ? 'underline'
-                                                        : null,
-                                                }}
-                                                onClick={() => {
-                                                    history.push(
-                                                        '/admin/projects/' +
-                                                        callLog.projectId
-                                                            ._id
-                                                    );
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {callLog.projectId
-                                                                        ? callLog
-                                                                            .projectId
-                                                                            .name
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {callLog.from
-                                                                        ? callLog.from
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {callLog.to
-                                                                        ? callLog.to
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {callLog.createdAt
-                                                                        ? moment
-                                                                            .utc(
-                                                                                callLog.createdAt
-                                                                            )
-                                                                            .local()
-                                                                            .format(
-                                                                                'ddd, YYYY/MM/DD, h:mm:ss'
-                                                                            )
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div
-                                                        className="db-ListViewItem-cellContent Box-root Padding-all--8"
-                                                        style={{
-                                                            float: 'right',
-                                                        }}
-                                                    >
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    <button
-                                                                        onClick={() => {
-
-                                                                            this.props.openModal(
-                                                                                {
-                                                                                    id: uuidv4(),
-                                                                                    onConfirm: () => {
-                                                                                        return Promise.resolve();
-                                                                                    },
-                                                                                    content: (props: $TSFixMe) => <CallLogsContentViewModal
-                                                                                        {...props}
-                                                                                        content={
-                                                                                            callLog.content
-                                                                                        }
-                                                                                    />,
-                                                                                }
-                                                                            );
-                                                                        }}
-                                                                        id="view"
-                                                                        className="bs-Button"
+                                                                    <span
+                                                                        className={`Badge-text Text-color--${
+                                                                            callLog.status ===
+                                                                            'Success'
+                                                                                ? 'green'
+                                                                                : 'red'
+                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
                                                                     >
                                                                         <span>
-                                                                            View
-                                                                            Content
+                                                                            {callLog.status
+                                                                                ? callLog.status
+                                                                                : 'N/A'}
                                                                         </span>
-                                                                    </button>
-                                                                    {callLog.error ? (
+                                                                    </span>
+                                                                </div>
+                                                            </div>
+                                                        </span>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                        cursor: 'pointer',
+
+                                                        textDecoration:
+                                                            callLog.projectId
+                                                                ? 'underline'
+                                                                : null,
+                                                    }}
+                                                    onClick={() => {
+                                                        history.push(
+                                                            '/admin/projects/' +
+                                                                callLog
+                                                                    .projectId
+                                                                    ._id
+                                                        );
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {callLog.projectId
+                                                                            ? callLog
+                                                                                  .projectId
+                                                                                  .name
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {callLog.from
+                                                                            ? callLog.from
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {callLog.to
+                                                                            ? callLog.to
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {callLog.createdAt
+                                                                            ? moment
+                                                                                  .utc(
+                                                                                      callLog.createdAt
+                                                                                  )
+                                                                                  .local()
+                                                                                  .format(
+                                                                                      'ddd, YYYY/MM/DD, h:mm:ss'
+                                                                                  )
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div
+                                                            className="db-ListViewItem-cellContent Box-root Padding-all--8"
+                                                            style={{
+                                                                float: 'right',
+                                                            }}
+                                                        >
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
                                                                         <button
                                                                             onClick={() => {
-
                                                                                 this.props.openModal(
                                                                                     {
                                                                                         id: uuidv4(),
-                                                                                        onConfirm: () => {
-                                                                                            return Promise.resolve();
-                                                                                        },
-                                                                                        content: (props: $TSFixMe) => <CallLogsErrorViewModal
-                                                                                            {...props}
-                                                                                            content={
-                                                                                                callLog.error
-                                                                                            }
-                                                                                        />,
+                                                                                        onConfirm:
+                                                                                            () => {
+                                                                                                return Promise.resolve();
+                                                                                            },
+                                                                                        content:
+                                                                                            (
+                                                                                                props: $TSFixMe
+                                                                                            ) => {
+                                                                                                return (
+                                                                                                    <CallLogsContentViewModal
+                                                                                                        {...props}
+                                                                                                        content={
+                                                                                                            callLog.content
+                                                                                                        }
+                                                                                                    />
+                                                                                                );
+                                                                                            },
                                                                                     }
                                                                                 );
                                                                             }}
@@ -396,19 +362,54 @@ export class CallLogsList extends Component<ComponentProps>{
                                                                         >
                                                                             <span>
                                                                                 View
-                                                                                Error
+                                                                                Content
                                                                             </span>
                                                                         </button>
-                                                                    ) : null}
-                                                                </span>
-                                                            </div>
-                                                        </span>
+                                                                        {callLog.error ? (
+                                                                            <button
+                                                                                onClick={() => {
+                                                                                    this.props.openModal(
+                                                                                        {
+                                                                                            id: uuidv4(),
+                                                                                            onConfirm:
+                                                                                                () => {
+                                                                                                    return Promise.resolve();
+                                                                                                },
+                                                                                            content:
+                                                                                                (
+                                                                                                    props: $TSFixMe
+                                                                                                ) => {
+                                                                                                    return (
+                                                                                                        <CallLogsErrorViewModal
+                                                                                                            {...props}
+                                                                                                            content={
+                                                                                                                callLog.error
+                                                                                                            }
+                                                                                                        />
+                                                                                                    );
+                                                                                                },
+                                                                                        }
+                                                                                    );
+                                                                                }}
+                                                                                id="view"
+                                                                                className="bs-Button"
+                                                                            >
+                                                                                <span>
+                                                                                    View
+                                                                                    Error
+                                                                                </span>
+                                                                            </button>
+                                                                        ) : null}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                    );
-                                })
+                                                </td>
+                                            </tr>
+                                        );
+                                    }
+                                )
                             ) : (
                                 <tr></tr>
                             )}
@@ -419,21 +420,15 @@ export class CallLogsList extends Component<ComponentProps>{
                     id="logsStatus"
                     style={{ textAlign: 'center', marginTop: '10px' }}
                 >
-
                     {this.props.callLogs &&
-
-                        (!this.props.callLogs.callLogs ||
-
-                            !this.props.callLogs.callLogs.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.callLogs.error
+                    (!this.props.callLogs.callLogs ||
+                        !this.props.callLogs.callLogs.length) &&
+                    !this.props.requesting &&
+                    !this.props.callLogs.error
                         ? "We don't have any logs yet"
                         : null}
 
                     {this.props.callLogs && this.props.callLogs.error
-
                         ? this.props.callLogs.error
                         : null}
                 </div>
@@ -445,21 +440,19 @@ export class CallLogsList extends Component<ComponentProps>{
                                     id="log-count"
                                     className="Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap"
                                 >
-
                                     {this.props.callLogs &&
-
-                                        this.props.callLogs.count
-                                        ? `Page ${this.props.page
-                                        } of ${numberOfPages} (${this.props
-
-                                            .callLogs &&
-
-                                        this.props.callLogs.count} Log${this.props.callLogs &&
-
-                                            this.props.callLogs.count === 1
-                                            ? ''
-                                            : 's'
-                                        })`
+                                    this.props.callLogs.count
+                                        ? `Page ${
+                                              this.props.page
+                                          } of ${numberOfPages} (${
+                                              this.props.callLogs &&
+                                              this.props.callLogs.count
+                                          } Log${
+                                              this.props.callLogs &&
+                                              this.props.callLogs.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          })`
                                         : null}
                                 </span>
                             </span>
@@ -471,9 +464,7 @@ export class CallLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.callLogs.skip,
 
                                             this.props.callLogs.limit
@@ -498,9 +489,7 @@ export class CallLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.callLogs.skip,
 
                                             this.props.callLogs.limit
@@ -528,7 +517,6 @@ export class CallLogsList extends Component<ComponentProps>{
                                     className={'Button bs-ButtonLegacy'}
                                     // data-db-analytics-name="list_view.pagination.next"
                                     type="button"
-
                                     disabled={this.props.requesting}
                                 >
                                     <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
@@ -557,10 +545,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 CallLogsList.displayName = 'ProjectList';
 
-
 CallLogsList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/CallLogs/DeleteConfirmationModal.tsx b/AdminDashboard/src/Components/CallLogs/DeleteConfirmationModal.tsx
index fa81797cb9..2c9728623b 100644
--- a/AdminDashboard/src/Components/CallLogs/DeleteConfirmationModal.tsx
+++ b/AdminDashboard/src/Components/CallLogs/DeleteConfirmationModal.tsx
@@ -10,7 +10,6 @@ import { deleteCallLogs } from '../../actions/callLogs';
 import { FormLoader } from '../basic/Loader';
 
 class DeleteConfirmationModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +24,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
                 return this.handleDelete();
@@ -35,8 +33,8 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     };
 
     handleDelete = () => {
-
-        const { error, deleteCallLogs, closeModal, modalId }: $TSFixMe = this.props;
+        const { error, deleteCallLogs, closeModal, modalId }: $TSFixMe =
+            this.props;
         deleteCallLogs().then(() => {
             if (!error) {
                 return closeModal({ id: modalId });
@@ -44,7 +42,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
         });
     };
     override render() {
-
         const { closeThisDialog, deleteRequest, error }: $TSFixMe = this.props;
 
         return (
@@ -102,8 +99,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <button
                                             id="cancelCallDelete"
-                                            className={`bs-Button btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={deleteRequest}
@@ -115,8 +114,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             onClick={this.handleDelete}
                                             disabled={deleteRequest}
                                             autoFocus={true}
@@ -144,18 +145,20 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     }
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    deleteRequest: state.callLogs.callLogs.deleteRequest,
-    error: state.callLogs.callLogs.error,
-    modalId: state.modal.modals[0].id
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal, deleteCallLogs }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        deleteRequest: state.callLogs.callLogs.deleteRequest,
+        error: state.callLogs.callLogs.error,
+        modalId: state.modal.modals[0].id,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal, deleteCallLogs }, dispatch);
+};
 
 DeleteConfirmationModal.displayName = 'Delete Confirmation Modal';
 
-
 DeleteConfirmationModal.propTypes = {
     closeThisDialog: PropTypes.func,
     deleteRequest: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Clipboard.tsx b/AdminDashboard/src/Components/Clipboard.tsx
index 5b635df4a9..2ef5190178 100644
--- a/AdminDashboard/src/Components/Clipboard.tsx
+++ b/AdminDashboard/src/Components/Clipboard.tsx
@@ -11,7 +11,9 @@ class ClipboardWrap extends Component<ComponentProps> {
         const input: $TSFixMe = this.input;
 
         this.clipboard = new Clipboard(button, {
-            target: () => input,
+            target: () => {
+                return input;
+            },
         });
     }
 
@@ -20,7 +22,6 @@ class ClipboardWrap extends Component<ComponentProps> {
     }
 
     override render() {
-
         const { value }: $TSFixMe = this.props;
 
         return (
@@ -56,10 +57,8 @@ class ClipboardWrap extends Component<ComponentProps> {
     }
 }
 
-
 ClipboardWrap.displayName = 'ClipboardWrap';
 
-
 ClipboardWrap.propTypes = {
     value: PropTypes.string,
 };
diff --git a/AdminDashboard/src/Components/Common/Badge.tsx b/AdminDashboard/src/Components/Common/Badge.tsx
index eaf423a972..b19d7768e9 100644
--- a/AdminDashboard/src/Components/Common/Badge.tsx
+++ b/AdminDashboard/src/Components/Common/Badge.tsx
@@ -1,10 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-function Badge({
-    children,
-    color = 'green'
-}: $TSFixMe) {
+function Badge({ children, color = 'green' }: $TSFixMe) {
     return (
         <div
             className={`Badge Badge--color--blue Box-background--${color} bg-${color}-700 Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
diff --git a/AdminDashboard/src/Components/ContextModal.tsx b/AdminDashboard/src/Components/ContextModal.tsx
index fa4713dfc6..0dce5b41f7 100644
--- a/AdminDashboard/src/Components/ContextModal.tsx
+++ b/AdminDashboard/src/Components/ContextModal.tsx
@@ -1,12 +1,13 @@
 import React from 'react';
 
 export default function (Cm: $TSFixMe) {
-    return (props: $TSFixMe) => (
-        <div className="bs-BIM">
-            <div className="ContextualLayer-layer--topleft ContextualLayer-layer--anytop ContextualLayer-layer--anyleft ContextualLayer-context--topleft ContextualLayer-context--anytop ContextualLayer-context--anyleft ContextualLayer-container ContextualLayer--pointerEvents">
-                <Cm {...props} />
+    return (props: $TSFixMe) => {
+        return ((
+            <div className="bs-BIM">
+                <div className="ContextualLayer-layer--topleft ContextualLayer-layer--anytop ContextualLayer-layer--anyleft ContextualLayer-context--topleft ContextualLayer-context--anytop ContextualLayer-context--anyleft ContextualLayer-container ContextualLayer--pointerEvents">
+                    <Cm {...props} />
+                </div>
             </div>
-        </div>
-
-    ).displayName = 'ContextModal';
+        ).displayName = 'ContextModal');
+    };
 }
diff --git a/AdminDashboard/src/Components/Dashboard.tsx b/AdminDashboard/src/Components/Dashboard.tsx
index a73c59309b..b9e597c1db 100644
--- a/AdminDashboard/src/Components/Dashboard.tsx
+++ b/AdminDashboard/src/Components/Dashboard.tsx
@@ -22,13 +22,12 @@ import AlertPanel from './basic/AlertPanel';
 import { closeModal } from '../actions/Modal';
 import { loadDashboard } from '../actions/dashboard';
 
-export class DashboardApp extends Component<ComponentProps>{
+export class DashboardApp extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     componentDidMount = async () => {
         const {
-
             fetchLicense,
 
             user,
@@ -61,23 +60,19 @@ export class DashboardApp extends Component<ComponentProps>{
     };
 
     showProjectForm = () => {
-
         this.props.showForm();
     };
 
     hideProfileMenu = () => {
-
         this.props.hideProfileMenu();
     };
     closeNotificationMenu = () => {
-
         this.props.closeNotificationMenu();
     };
 
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 this.props.closeNotificationMenu();
 
                 this.props.hideProfileMenu();
@@ -87,12 +82,11 @@ export class DashboardApp extends Component<ComponentProps>{
         }
     };
 
-    closeModal = () =>
-
-        this.props.closeModal({
-
+    closeModal = () => {
+        return this.props.closeModal({
             id: this.props.currentModal ? this.props.currentModal.id : '',
         });
+    };
 
     override render() {
         const {
@@ -112,12 +106,10 @@ export class DashboardApp extends Component<ComponentProps>{
         return (
             <Fragment>
                 <ClickOutside onClickOutside={this.hideProfileMenu}>
-
                     <ProfileMenu visible={this.props.profile.menuVisible} />
                 </ClickOutside>
                 <ClickOutside onClickOutside={this.closeNotificationMenu}>
                     <NotificationMenu
-
                         visible={this.props.notification.notificationsVisible}
                     />
                 </ClickOutside>
@@ -152,7 +144,6 @@ export class DashboardApp extends Component<ComponentProps>{
                                             }
                                         >
                                             <AlertPanel
-
                                                 className="bs-ContentSection Card-root"
                                                 message={
                                                     <span>
@@ -179,7 +170,6 @@ export class DashboardApp extends Component<ComponentProps>{
                                             }
                                         >
                                             <AlertPanel
-
                                                 className="bs-ContentSection Card-root"
                                                 message={
                                                     <span>
@@ -266,10 +256,8 @@ export class DashboardApp extends Component<ComponentProps>{
     }
 }
 
-
 DashboardApp.displayName = 'DashboardApp';
 
-
 DashboardApp.propTypes = {
     profile: PropTypes.object.isRequired,
     notification: PropTypes.object.isRequired,
@@ -290,36 +278,39 @@ DashboardApp.propTypes = {
     loadDashboard: PropTypes.func,
 };
 
-const mapStateToProps: Function = (state: RootState) => ({
-    profile: state.profileSettings,
-    notification: state.notifications,
-    user: state.user,
-    license: state.license.license,
-    settings: state.settings,
-    twilio: state.settings.twilio,
-    smtp: state.settings.smtp,
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        profile: state.profileSettings,
+        notification: state.notifications,
+        user: state.user,
+        license: state.license.license,
+        settings: state.settings,
+        twilio: state.settings.twilio,
+        smtp: state.settings.smtp,
 
-    currentModal:
-        state.modal.modals && state.modal.modals.length > 0
-            ? state.modal.modals[state.modal.modals.length - 1]
-            : '',
+        currentModal:
+            state.modal.modals && state.modal.modals.length > 0
+                ? state.modal.modals[state.modal.modals.length - 1]
+                : '',
 
-    dashboardLoadState: state.dashboard
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        hideProfileMenu,
-        closeNotificationMenu,
-        fetchUsers,
-        fetchLicense,
-        fetchSettings,
-        closeModal,
-        loadDashboard,
-    },
-    dispatch
-);
+        dashboardLoadState: state.dashboard,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            hideProfileMenu,
+            closeNotificationMenu,
+            fetchUsers,
+            fetchLicense,
+            fetchSettings,
+            closeModal,
+            loadDashboard,
+        },
+        dispatch
+    );
+};
 
 DashboardApp.contextTypes = {};
 
diff --git a/AdminDashboard/src/Components/EmailLogs/DeleteConfirmationModal.tsx b/AdminDashboard/src/Components/EmailLogs/DeleteConfirmationModal.tsx
index fb39105c89..15a4656447 100644
--- a/AdminDashboard/src/Components/EmailLogs/DeleteConfirmationModal.tsx
+++ b/AdminDashboard/src/Components/EmailLogs/DeleteConfirmationModal.tsx
@@ -10,7 +10,6 @@ import { deleteEmailLogs } from '../../actions/emailLogs';
 import { FormLoader } from '../basic/Loader';
 
 class DeleteConfirmationModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +24,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
                 return this.handleDelete();
@@ -35,8 +33,8 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     };
 
     handleDelete = () => {
-
-        const { error, deleteEmailLogs, closeModal, modalId }: $TSFixMe = this.props;
+        const { error, deleteEmailLogs, closeModal, modalId }: $TSFixMe =
+            this.props;
         deleteEmailLogs().then(() => {
             if (!error) {
                 return closeModal({ id: modalId });
@@ -44,7 +42,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
         });
     };
     override render() {
-
         const { closeThisDialog, deleteRequest, error }: $TSFixMe = this.props;
 
         return (
@@ -102,8 +99,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <button
                                             id="cancelEmailDelete"
-                                            className={`bs-Button btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={deleteRequest}
@@ -115,8 +114,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             onClick={this.handleDelete}
                                             disabled={deleteRequest}
                                             autoFocus={true}
@@ -144,18 +145,20 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     }
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    deleteRequest: state.emailLogs.emailLogs.deleteRequest,
-    error: state.emailLogs.emailLogs.error,
-    modalId: state.modal.modals[0].id
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal, deleteEmailLogs }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        deleteRequest: state.emailLogs.emailLogs.deleteRequest,
+        error: state.emailLogs.emailLogs.error,
+        modalId: state.modal.modals[0].id,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal, deleteEmailLogs }, dispatch);
+};
 
 DeleteConfirmationModal.displayName = 'Delete Confirmation Modal';
 
-
 DeleteConfirmationModal.propTypes = {
     closeThisDialog: PropTypes.func,
     deleteRequest: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/EmailLogs/EmailLogsContentViewModal.tsx b/AdminDashboard/src/Components/EmailLogs/EmailLogsContentViewModal.tsx
index 5f8c87680a..f2d8d176fc 100644
--- a/AdminDashboard/src/Components/EmailLogs/EmailLogsContentViewModal.tsx
+++ b/AdminDashboard/src/Components/EmailLogs/EmailLogsContentViewModal.tsx
@@ -5,7 +5,6 @@ import { connect } from 'react-redux';
 import ClickOutside from 'react-click-outside';
 import ShouldRender from '../basic/ShouldRender';
 class EmailLogsContentViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,7 +19,6 @@ class EmailLogsContentViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -28,8 +26,8 @@ class EmailLogsContentViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
 
         return (
             <div className="db-EmailLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -99,8 +97,9 @@ class EmailLogsContentViewModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -122,7 +121,6 @@ class EmailLogsContentViewModal extends Component<ComponentProps> {
     }
 }
 
-
 EmailLogsContentViewModal.displayName = 'EmailLogsContentViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -138,7 +136,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 EmailLogsContentViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/EmailLogs/EmailLogsErrorViewModal.tsx b/AdminDashboard/src/Components/EmailLogs/EmailLogsErrorViewModal.tsx
index d419399704..c122a5a5e3 100644
--- a/AdminDashboard/src/Components/EmailLogs/EmailLogsErrorViewModal.tsx
+++ b/AdminDashboard/src/Components/EmailLogs/EmailLogsErrorViewModal.tsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import ShouldRender from '../basic/ShouldRender';
 class EmailLogsErrorViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -18,7 +17,6 @@ class EmailLogsErrorViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -26,8 +24,8 @@ class EmailLogsErrorViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
         return (
             <div className="db-EmailLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
                 <div
@@ -78,8 +76,9 @@ class EmailLogsErrorViewModal extends Component<ComponentProps> {
                                         </div>
                                     </ShouldRender>
                                     <button
-                                        className={`bs-Button btn__modal ${isRequesting &&
-                                            'bs-is-disabled'}`}
+                                        className={`bs-Button btn__modal ${
+                                            isRequesting && 'bs-is-disabled'
+                                        }`}
                                         type="button"
                                         onClick={closeThisDialog}
                                         disabled={isRequesting}
@@ -100,7 +99,6 @@ class EmailLogsErrorViewModal extends Component<ComponentProps> {
     }
 }
 
-
 EmailLogsErrorViewModal.displayName = 'EmailLogsErrorViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -116,7 +114,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 EmailLogsErrorViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/EmailLogs/EmailLogsList.tsx b/AdminDashboard/src/Components/EmailLogs/EmailLogsList.tsx
index ab6548fc7d..cdeb41195e 100644
--- a/AdminDashboard/src/Components/EmailLogs/EmailLogsList.tsx
+++ b/AdminDashboard/src/Components/EmailLogs/EmailLogsList.tsx
@@ -12,7 +12,7 @@ import EmailLogsContentViewModal from './EmailLogsContentViewModal';
 import EmailLogsErrorViewModal from './EmailLogsErrorViewModal';
 import DeleteConfirmationModal from './DeleteConfirmationModal';
 
-export class EmailLogsList extends Component<ComponentProps>{
+export class EmailLogsList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,7 +22,6 @@ export class EmailLogsList extends Component<ComponentProps>{
     }
 
     handleDelete = () => {
-
         const { openModal }: $TSFixMe = this.props;
 
         const { deleteModalId }: $TSFixMe = this.state;
@@ -35,7 +34,6 @@ export class EmailLogsList extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -44,64 +42,51 @@ export class EmailLogsList extends Component<ComponentProps>{
 
     override render() {
         if (
-
             this.props.emailLogs &&
-
             this.props.emailLogs.skip &&
-
             typeof this.props.emailLogs.skip === 'string'
         ) {
-
             this.props.emailLogs.skip = parseInt(this.props.emailLogs.skip, 10);
         }
         if (
-
             this.props.emailLogs &&
-
             this.props.emailLogs.limit &&
-
             typeof this.props.emailLogs.limit === 'string'
         ) {
-
             this.props.emailLogs.limit = parseInt(
-
                 this.props.emailLogs.limit,
                 10
             );
         }
 
-        if (!this.props.emailLogs.skip) this.props.emailLogs.skip = 0;
+        if (!this.props.emailLogs.skip) {
+            this.props.emailLogs.skip = 0;
+        }
 
-        if (!this.props.emailLogs.limit) this.props.emailLogs.limit = 0;
+        if (!this.props.emailLogs.limit) {
+            this.props.emailLogs.limit = 0;
+        }
 
         let canNext =
-
             this.props.emailLogs &&
-
-                this.props.emailLogs.count &&
-
-                this.props.emailLogs.count >
-
+            this.props.emailLogs.count &&
+            this.props.emailLogs.count >
                 this.props.emailLogs.skip + this.props.emailLogs.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.emailLogs && this.props.emailLogs.skip <= 0
                 ? false
                 : true;
 
         if (
-
             this.props.emailLogs &&
-
             (this.props.requesting || !this.props.emailLogs.emailLogs)
         ) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.emailLogs && this.props.emailLogs.count) / 10
         );
         return (
@@ -181,7 +166,6 @@ export class EmailLogsList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -202,169 +186,126 @@ export class EmailLogsList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.emailLogs &&
-
-                                this.props.emailLogs.emailLogs &&
-
-                                this.props.emailLogs.emailLogs.length > 0 ? (
-
-                                this.props.emailLogs.emailLogs.map((emailLog: $TSFixMe) => {
-                                    return (
-                                        <tr
-                                            key={emailLog._id}
-                                            className="Table-row db-ListViewItem bs-ActionsParent"
-                                        >
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{ height: '1px' }}
+                              this.props.emailLogs.emailLogs &&
+                              this.props.emailLogs.emailLogs.length > 0 ? (
+                                this.props.emailLogs.emailLogs.map(
+                                    (emailLog: $TSFixMe) => {
+                                        return (
+                                            <tr
+                                                key={emailLog._id}
+                                                className="Table-row db-ListViewItem bs-ActionsParent"
                                             >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <div
-                                                                className={`Badge Badge--color--${emailLog.status ===
-                                                                    'Success'
-                                                                    ? 'green'
-                                                                    : 'red'
-                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
-                                                            >
-                                                                <span
-                                                                    className={`Badge-text Text-color--${emailLog.status ===
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <div
+                                                                    className={`Badge Badge--color--${
+                                                                        emailLog.status ===
                                                                         'Success'
-                                                                        ? 'green'
-                                                                        : 'red'
-                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
+                                                                            ? 'green'
+                                                                            : 'red'
+                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
                                                                 >
-                                                                    <span>
-                                                                        {emailLog.status
-                                                                            ? emailLog.status
-                                                                            : 'N/A'}
-                                                                    </span>
-                                                                </span>
-                                                            </div>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {emailLog.from
-                                                                        ? emailLog.from
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {emailLog.to
-                                                                        ? emailLog.to
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {emailLog.subject
-                                                                        ? emailLog.subject
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {emailLog.smtpServer
-                                                                        ? emailLog.smtpServer ===
-                                                                            'internal'
-                                                                            ? 'Internal'
-                                                                            : emailLog.smtpServer
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    <button
-                                                                        onClick={() => {
-
-                                                                            this.props.openModal(
-                                                                                {
-                                                                                    id: uuidv4(),
-                                                                                    onConfirm: () => {
-                                                                                        return Promise.resolve();
-                                                                                    },
-                                                                                    content: (props: $TSFixMe) => <EmailLogsContentViewModal
-                                                                                        {...props}
-                                                                                        content={
-                                                                                            emailLog.content
-                                                                                        }
-                                                                                    />,
-                                                                                }
-                                                                            );
-                                                                        }}
-                                                                        id="view"
-                                                                        className="bs-Button"
+                                                                    <span
+                                                                        className={`Badge-text Text-color--${
+                                                                            emailLog.status ===
+                                                                            'Success'
+                                                                                ? 'green'
+                                                                                : 'red'
+                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
                                                                     >
                                                                         <span>
-                                                                            View
-                                                                            Content
+                                                                            {emailLog.status
+                                                                                ? emailLog.status
+                                                                                : 'N/A'}
                                                                         </span>
-                                                                    </button>
-                                                                </span>
+                                                                    </span>
+                                                                </div>
                                                             </div>
                                                         </span>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            {emailLog.error ? (
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {emailLog.from
+                                                                            ? emailLog.from
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {emailLog.to
+                                                                            ? emailLog.to
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {emailLog.subject
+                                                                            ? emailLog.subject
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {emailLog.smtpServer
+                                                                            ? emailLog.smtpServer ===
+                                                                              'internal'
+                                                                                ? 'Internal'
+                                                                                : emailLog.smtpServer
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
                                                 <td
                                                     className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
                                                     style={{ height: '1px' }}
@@ -376,19 +317,26 @@ export class EmailLogsList extends Component<ComponentProps>{
                                                                     <span>
                                                                         <button
                                                                             onClick={() => {
-
                                                                                 this.props.openModal(
                                                                                     {
                                                                                         id: uuidv4(),
-                                                                                        onConfirm: () => {
-                                                                                            return Promise.resolve();
-                                                                                        },
-                                                                                        content: (props: $TSFixMe) => <EmailLogsErrorViewModal
-                                                                                            {...props}
-                                                                                            content={
-                                                                                                emailLog.error
-                                                                                            }
-                                                                                        />,
+                                                                                        onConfirm:
+                                                                                            () => {
+                                                                                                return Promise.resolve();
+                                                                                            },
+                                                                                        content:
+                                                                                            (
+                                                                                                props: $TSFixMe
+                                                                                            ) => {
+                                                                                                return (
+                                                                                                    <EmailLogsContentViewModal
+                                                                                                        {...props}
+                                                                                                        content={
+                                                                                                            emailLog.content
+                                                                                                        }
+                                                                                                    />
+                                                                                                );
+                                                                                            },
                                                                                     }
                                                                                 );
                                                                             }}
@@ -397,7 +345,7 @@ export class EmailLogsList extends Component<ComponentProps>{
                                                                         >
                                                                             <span>
                                                                                 View
-                                                                                Error
+                                                                                Content
                                                                             </span>
                                                                         </button>
                                                                     </span>
@@ -406,10 +354,62 @@ export class EmailLogsList extends Component<ComponentProps>{
                                                         </div>
                                                     </div>
                                                 </td>
-                                            ) : null}
-                                        </tr>
-                                    );
-                                })
+                                                {emailLog.error ? (
+                                                    <td
+                                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                        style={{
+                                                            height: '1px',
+                                                        }}
+                                                    >
+                                                        <div className="db-ListViewItem-link">
+                                                            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                                <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                    <div className="Box-root">
+                                                                        <span>
+                                                                            <button
+                                                                                onClick={() => {
+                                                                                    this.props.openModal(
+                                                                                        {
+                                                                                            id: uuidv4(),
+                                                                                            onConfirm:
+                                                                                                () => {
+                                                                                                    return Promise.resolve();
+                                                                                                },
+                                                                                            content:
+                                                                                                (
+                                                                                                    props: $TSFixMe
+                                                                                                ) => {
+                                                                                                    return (
+                                                                                                        <EmailLogsErrorViewModal
+                                                                                                            {...props}
+                                                                                                            content={
+                                                                                                                emailLog.error
+                                                                                                            }
+                                                                                                        />
+                                                                                                    );
+                                                                                                },
+                                                                                        }
+                                                                                    );
+                                                                                }}
+                                                                                id="view"
+                                                                                className="bs-Button"
+                                                                            >
+                                                                                <span>
+                                                                                    View
+                                                                                    Error
+                                                                                </span>
+                                                                            </button>
+                                                                        </span>
+                                                                    </div>
+                                                                </span>
+                                                            </div>
+                                                        </div>
+                                                    </td>
+                                                ) : null}
+                                            </tr>
+                                        );
+                                    }
+                                )
                             ) : (
                                 <tr></tr>
                             )}
@@ -420,21 +420,15 @@ export class EmailLogsList extends Component<ComponentProps>{
                     id="logsStatus"
                     style={{ textAlign: 'center', marginTop: '10px' }}
                 >
-
                     {this.props.emailLogs &&
-
-                        (!this.props.emailLogs.emailLogs ||
-
-                            !this.props.emailLogs.emailLogs.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.emailLogs.error
+                    (!this.props.emailLogs.emailLogs ||
+                        !this.props.emailLogs.emailLogs.length) &&
+                    !this.props.requesting &&
+                    !this.props.emailLogs.error
                         ? "We don't have any logs yet"
                         : null}
 
                     {this.props.emailLogs && this.props.emailLogs.error
-
                         ? this.props.emailLogs.error
                         : null}
                 </div>
@@ -448,22 +442,17 @@ export class EmailLogsList extends Component<ComponentProps>{
                                 >
                                     <ShouldRender
                                         if={
-
                                             this.props.emailLogs &&
-
                                             this.props.emailLogs.count
                                         }
                                     >
-
                                         Page {this.props.page} of{' '}
                                         {numberOfPages} (
                                         <span id="email-log-count">
-
                                             {this.props.emailLogs.count}
                                         </span>{' '}
                                         Log
                                         <ShouldRender
-
                                             if={this.props.emailLogs.count > 0}
                                         >
                                             s
@@ -480,9 +469,7 @@ export class EmailLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.emailLogs.skip,
 
                                             this.props.emailLogs.limit
@@ -507,9 +494,7 @@ export class EmailLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.emailLogs.skip,
 
                                             this.props.emailLogs.limit
@@ -537,7 +522,6 @@ export class EmailLogsList extends Component<ComponentProps>{
                                     className={'Button bs-ButtonLegacy'}
                                     // data-db-analytics-name="list_view.pagination.next"
                                     type="button"
-
                                     disabled={this.props.requesting}
                                 >
                                     <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
@@ -566,10 +550,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 EmailLogsList.displayName = 'ProjectList';
 
-
 EmailLogsList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/Modalize.tsx b/AdminDashboard/src/Components/Modalize.tsx
index 160f940353..69b04d98f9 100644
--- a/AdminDashboard/src/Components/Modalize.tsx
+++ b/AdminDashboard/src/Components/Modalize.tsx
@@ -7,16 +7,11 @@ import { connect } from 'react-redux';
  * @param {React.Props} props Props comprise an object with 3 JSX values for `HEADER`, `CONTENT` & `FOOTER`
  * @returns {JSX.Element} A modal and a child component.
  */
-export function Modalize({
-    HEADER,
-    CONTENT,
-    FOOTER
-}: $TSFixMe) {
+export function Modalize({ HEADER, CONTENT, FOOTER }: $TSFixMe) {
     return HEADER && CONTENT && FOOTER ? (
         <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
             <div
                 className="ModalLayer-contents"
-
                 tabIndex="-1"
                 style={{ marginTop: 105 }}
             >
@@ -41,11 +36,13 @@ export function Modalize({
     ) : null;
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    HEADER: state.modal.header,
-    CONTENT: state.modal.content,
-    FOOTER: state.modal.footer
-});
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        HEADER: state.modal.header,
+        CONTENT: state.modal.content,
+        FOOTER: state.modal.footer,
+    };
+};
 
 Modalize.propTypes = {
     HEADER: PropTypes.string.isRequired,
diff --git a/AdminDashboard/src/Components/Modals/About.tsx b/AdminDashboard/src/Components/Modals/About.tsx
index 4cb9ffcced..6a5822bd07 100644
--- a/AdminDashboard/src/Components/Modals/About.tsx
+++ b/AdminDashboard/src/Components/Modals/About.tsx
@@ -4,7 +4,6 @@ import { connect } from 'react-redux';
 
 import ClickOutside from 'react-click-outside';
 class About extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,7 +19,6 @@ class About extends Component<ComponentProps> {
         switch (e.key) {
             case 'Escape':
             case 'Enter':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -28,7 +26,6 @@ class About extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { versions, closeThisDialog, probes }: $TSFixMe = this.props;
         const currentYear: $TSFixMe = new Date().getFullYear();
         let probeVersion = null;
@@ -329,7 +326,6 @@ class About extends Component<ComponentProps> {
                                         <button
                                             className="bs-Button bs-DeprecatedButton bs-Button--grey btn__modal"
                                             type="button"
-
                                             onClick={this.props.closeThisDialog}
                                             autoFocus={true}
                                         >
@@ -349,7 +345,6 @@ class About extends Component<ComponentProps> {
     }
 }
 
-
 About.displayName = 'AboutModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -359,7 +354,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 About.propTypes = {
     closeThisDialog: PropTypes.func.isRequired,
     versions: PropTypes.object,
diff --git a/AdminDashboard/src/Components/Modals/ConfirmBalanceTopUp.tsx b/AdminDashboard/src/Components/Modals/ConfirmBalanceTopUp.tsx
index da38517f1d..3bbca1f99f 100644
--- a/AdminDashboard/src/Components/Modals/ConfirmBalanceTopUp.tsx
+++ b/AdminDashboard/src/Components/Modals/ConfirmBalanceTopUp.tsx
@@ -6,7 +6,6 @@ import { connect } from 'react-redux';
 import ClickOutside from 'react-click-outside';
 
 class ConfirmBalanceTopUp extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -21,10 +20,8 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -44,7 +41,6 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
                     tabIndex={-1}
                     style={{ marginTop: 40 }}
                 >
-
                     <ClickOutside onClickOutside={this.props.closeThisDialog}>
                         <div className="bs-BIM">
                             <div className="bs-Modal bs-Modal--medium">
@@ -65,7 +61,6 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
                                             style={{
                                                 fontWeight: 'bold',
                                             }}
-
                                         >{`${this.props.data.amount}$`}</span>
                                         ?
                                     </span>
@@ -76,7 +71,6 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
                                             id="cancelBalanceTopUp"
                                             className="bs-Button bs-DeprecatedButton bs-Button--grey btn__modal"
                                             type="button"
-
                                             onClick={this.props.closeThisDialog}
                                         >
                                             <span>Cancel</span>
@@ -89,7 +83,6 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
                                             className="bs-Button bs-DeprecatedButton bs-Button--blue btn__modal"
                                             type="button"
                                             onClick={
-
                                                 this.props.confirmThisDialog
                                             }
                                             disabled={recharging}
@@ -118,11 +111,12 @@ class ConfirmBalanceTopUp extends Component<ComponentProps> {
     }
 }
 
-
 ConfirmBalanceTopUp.displayName = 'ConfirmBalanceTopUpFormModal';
-const mapStateToProps: Function = (state: RootState) => ({
-    isRequesting: state.project.updateBalance.requesting
-});
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        isRequesting: state.project.updateBalance.requesting,
+    };
+};
 
 ConfirmBalanceTopUp.propTypes = {
     confirmThisDialog: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/Modals/MessageBox.tsx b/AdminDashboard/src/Components/Modals/MessageBox.tsx
index f6c91fdef0..6d36c2746a 100644
--- a/AdminDashboard/src/Components/Modals/MessageBox.tsx
+++ b/AdminDashboard/src/Components/Modals/MessageBox.tsx
@@ -7,7 +7,6 @@ import ClickOutside from 'react-click-outside';
 import { closeModal } from 'CommonUI/actions/Modal';
 
 class MessageBox extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -30,15 +29,12 @@ class MessageBox extends Component<ComponentProps> {
     };
 
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.messageBoxId,
         });
     };
 
     override render() {
-
         const { data }: $TSFixMe = this.props;
 
         let { title, message, messageBoxId } = this.props;
@@ -81,12 +77,11 @@ class MessageBox extends Component<ComponentProps> {
                                             className="bs-Button bs-DeprecatedButton bs-Button--white btn__modal"
                                             type="button"
                                             id="modal-ok"
-                                            onClick={() =>
-
-                                                this.props.closeModal({
+                                            onClick={() => {
+                                                return this.props.closeModal({
                                                     id: messageBoxId,
-                                                })
-                                            }
+                                                });
+                                            }}
                                             autoFocus={true}
                                         >
                                             <span>OK</span>
@@ -105,10 +100,8 @@ class MessageBox extends Component<ComponentProps> {
     }
 }
 
-
 MessageBox.displayName = 'MessageBoxModal';
 
-
 MessageBox.propTypes = {
     closeModal: PropTypes.func.isRequired,
     title: PropTypes.string,
@@ -129,5 +122,7 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal }, dispatch);
+};
 export default connect(mapStateToProps, mapDispatchToProps)(MessageBox);
diff --git a/AdminDashboard/src/Components/MultiSelect/LoadingIndicator.tsx b/AdminDashboard/src/Components/MultiSelect/LoadingIndicator.tsx
index 151b2fe699..7187a21a33 100644
--- a/AdminDashboard/src/Components/MultiSelect/LoadingIndicator.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/LoadingIndicator.tsx
@@ -1,6 +1,8 @@
 import React from 'react';
 
-const LoadingIndicator: Function = () => <div className="loading-status" />;
+const LoadingIndicator: Function = () => {
+    return <div className="loading-status" />;
+};
 
 LoadingIndicator.displayName = 'LoadingIndicator';
 
diff --git a/AdminDashboard/src/Components/MultiSelect/MultiSelectMonitor.tsx b/AdminDashboard/src/Components/MultiSelect/MultiSelectMonitor.tsx
index 76492268ad..8a4925e588 100644
--- a/AdminDashboard/src/Components/MultiSelect/MultiSelectMonitor.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/MultiSelectMonitor.tsx
@@ -14,14 +14,16 @@ const MultiSelectMonitor: Function = ({
     meta,
     valueField,
     textField,
-    placeholder
+    placeholder,
 }: $TSFixMe) => {
     return (
         <span style={{ width: '100%' }}>
             <span>
                 <Multiselect
                     {...input}
-                    onBlur={() => input.onBlur()}
+                    onBlur={() => {
+                        return input.onBlur();
+                    }}
                     value={input.value || []} // requires value to be an array
                     data={data}
                     valueField={valueField}
diff --git a/AdminDashboard/src/Components/MultiSelect/RFReactSelect.tsx b/AdminDashboard/src/Components/MultiSelect/RFReactSelect.tsx
index acce730899..b98d115341 100644
--- a/AdminDashboard/src/Components/MultiSelect/RFReactSelect.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/RFReactSelect.tsx
@@ -21,7 +21,11 @@ function singleChangeHandler(func: $TSFixMe) {
  */
 function multiChangeHandler(func: $TSFixMe) {
     return function handleMultiHandler(values: $TSFixMe) {
-        func(values.map((value: $TSFixMe) => value.value));
+        func(
+            values.map((value: $TSFixMe) => {
+                return value.value;
+            })
+        );
     };
 }
 
@@ -33,7 +37,9 @@ function multiChangeHandler(func: $TSFixMe) {
  * wants the array of values in the form [{ value: "grape", label: "Grape" }]
  */
 function transformValue(value: $TSFixMe, options: $TSFixMe, isMulti: $TSFixMe) {
-    if (isMulti && typeof value === 'string') return [];
+    if (isMulti && typeof value === 'string') {
+        return [];
+    }
 
     const filteredOptions = options.filter((option: $TSFixMe) => {
         return isMulti
@@ -52,7 +58,7 @@ const RFReactSelect: Function = ({
     isMulti,
     className,
     placeholder,
-    disabled
+    disabled,
 }: $TSFixMe) => {
     const { name, value, onBlur, onChange, onFocus }: $TSFixMe = input;
     const transformedValue: $TSFixMe = transformValue(value, options, isMulti);
@@ -71,7 +77,9 @@ const RFReactSelect: Function = ({
                     ? multiChangeHandler(onChange)
                     : singleChangeHandler(onChange)
             }
-            onBlur={() => onBlur(value)}
+            onBlur={() => {
+                return onBlur(value);
+            }}
             onFocus={onFocus}
             className={className}
         />
diff --git a/AdminDashboard/src/Components/MultiSelect/SelectItem.tsx b/AdminDashboard/src/Components/MultiSelect/SelectItem.tsx
index 27d205b864..38db75f1df 100644
--- a/AdminDashboard/src/Components/MultiSelect/SelectItem.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/SelectItem.tsx
@@ -7,27 +7,29 @@ const DefaultRenderer: Function = ({
     checked,
     option,
     disabled,
-    onClick
-}: $TSFixMe) => (
-    <span className="db-MultiSelect-item-renderer">
-        <input
-            type="checkbox"
-            onChange={onClick}
-            checked={checked}
-            disabled={disabled}
-
-            tabIndex="-1"
-        />
-        <span className="db-MultiSelect-renderer-label">{option.label}</span>
-    </span>
-);
+    onClick,
+}: $TSFixMe) => {
+    return (
+        <span className="db-MultiSelect-item-renderer">
+            <input
+                type="checkbox"
+                onChange={onClick}
+                checked={checked}
+                disabled={disabled}
+                tabIndex="-1"
+            />
+            <span className="db-MultiSelect-renderer-label">
+                {option.label}
+            </span>
+        </span>
+    );
+};
 
 DefaultRenderer.displayName = 'DefaultRenderer';
 
 DefaultRenderer.propTypes = {
     checked: PropTypes.bool.isRequired,
     option: PropTypes.objectOf({
-
         label: PropTypes.string.isRequired,
         value: PropTypes.string.isRequired,
     }),
@@ -52,7 +54,6 @@ class SelectItem extends Component<ComponentProps> {
     }
 
     onChecked = (e: $TSFixMe) => {
-
         const { onSelectionChanged }: $TSFixMe = this.props;
         const { checked }: $TSFixMe = e.target;
 
@@ -60,13 +61,11 @@ class SelectItem extends Component<ComponentProps> {
     };
 
     toggleChecked = () => {
-
         const { checked, onSelectionChanged }: $TSFixMe = this.props;
         onSelectionChanged(!checked);
     };
 
     updateFocus() {
-
         const { focused }: $TSFixMe = this.state;
 
         if (focused && this.labelRef) {
@@ -88,8 +87,8 @@ class SelectItem extends Component<ComponentProps> {
         e.preventDefault();
     };
     override render() {
-
-        const { option, checked, disabled, ItemRenderer, focused }: $TSFixMe = this.props;
+        const { option, checked, disabled, ItemRenderer, focused }: $TSFixMe =
+            this.props;
         const { hovered }: $TSFixMe = this.state;
 
         return (
@@ -98,15 +97,21 @@ class SelectItem extends Component<ComponentProps> {
                 aria-selected={checked}
                 aria-required="true"
                 selected={checked}
-                ref={ref => (this.labelRef = ref)}
-
+                ref={ref => {
+                    return (this.labelRef = ref);
+                }}
                 tabIndex="-1"
-                className={`db-MultiSelect-select-container ${(hovered ||
-                    focused) &&
-                    'db-MultiSelect-item-container--hover'}`}
+                className={`db-MultiSelect-select-container ${
+                    (hovered || focused) &&
+                    'db-MultiSelect-item-container--hover'
+                }`}
                 onKeyDown={this.handleKeyDown}
-                onMouseOver={() => this.setState({ hovered: true })}
-                onMouseOut={() => this.setState({ hovered: false })}
+                onMouseOver={() => {
+                    return this.setState({ hovered: true });
+                }}
+                onMouseOut={() => {
+                    return this.setState({ hovered: false });
+                }}
             >
                 {ItemRenderer ? (
                     <ItemRenderer
@@ -128,14 +133,11 @@ class SelectItem extends Component<ComponentProps> {
     }
 }
 
-
 SelectItem.displayName = 'SelectItem';
 
-
 SelectItem.propTypes = {
     checked: PropTypes.bool.isRequired,
     option: PropTypes.objectOf({
-
         label: PropTypes.string.isRequired,
         value: PropTypes.string.isRequired,
         key: PropTypes.string,
diff --git a/AdminDashboard/src/Components/MultiSelect/SelectList.tsx b/AdminDashboard/src/Components/MultiSelect/SelectList.tsx
index ca1179b96b..63ab7013db 100644
--- a/AdminDashboard/src/Components/MultiSelect/SelectList.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/SelectList.tsx
@@ -4,10 +4,11 @@ import SelectItem from './SelectItem';
 
 class SelectList extends Component<ComponentProps> {
     handleSelectionChanged = (option: $TSFixMe, checked: $TSFixMe) => {
-
         const { selected, onSelectedChanged, disabled }: $TSFixMe = this.props;
 
-        if (disabled) return true;
+        if (disabled) {
+            return true;
+        }
 
         if (checked) {
             onSelectedChanged({ selected, onSelectedChanged, disabled });
@@ -24,7 +25,6 @@ class SelectList extends Component<ComponentProps> {
 
     renderItems() {
         const {
-
             options,
 
             selected,
@@ -37,23 +37,32 @@ class SelectList extends Component<ComponentProps> {
 
             disabled,
         } = this.props;
-        return options.map((o: $TSFixMe, i: $TSFixMe) => (
-            <li
-                key={Object.prototype.hasOwnProperty.call(o, 'key') ? o.key : i}
-                style={{ listStyle: 'none' }}
-            >
-                <SelectItem
-
-                    focused={focusIndex === 1}
-                    option={o}
-                    onSelectChanged={(c: $TSFixMe) => this.handleSelectionChanged(o, c)}
-                    checked={selected.includes(o.value)}
-                    onClick={(e: $TSFixMe) => onClick(e, i)}
-                    ItemRenderer={ItemRenderer}
-                    disabled={disabled}
-                />
-            </li>
-        ));
+        return options.map((o: $TSFixMe, i: $TSFixMe) => {
+            return (
+                <li
+                    key={
+                        Object.prototype.hasOwnProperty.call(o, 'key')
+                            ? o.key
+                            : i
+                    }
+                    style={{ listStyle: 'none' }}
+                >
+                    <SelectItem
+                        focused={focusIndex === 1}
+                        option={o}
+                        onSelectChanged={(c: $TSFixMe) => {
+                            return this.handleSelectionChanged(o, c);
+                        }}
+                        checked={selected.includes(o.value)}
+                        onClick={(e: $TSFixMe) => {
+                            return onClick(e, i);
+                        }}
+                        ItemRenderer={ItemRenderer}
+                        disabled={disabled}
+                    />
+                </li>
+            );
+        });
     }
     override render() {
         return (
@@ -62,19 +71,16 @@ class SelectList extends Component<ComponentProps> {
                 style={{ margin: 0, paddingLeft: 0 }}
             >
                 {this.renderItems()}
-            </ul >
+            </ul>
         );
     }
 }
 
-
 SelectList.displayName = 'SelectList';
 
-
 SelectList.propTypes = {
     selected: PropTypes.arrayOf(Object).isRequired,
     options: PropTypes.arrayOf({
-
         label: PropTypes.string.isRequired,
         value: PropTypes.string.isRequired,
         key: PropTypes.string,
diff --git a/AdminDashboard/src/Components/MultiSelect/SelectPanel.tsx b/AdminDashboard/src/Components/MultiSelect/SelectPanel.tsx
index 1b140053fb..d097a1f315 100644
--- a/AdminDashboard/src/Components/MultiSelect/SelectPanel.tsx
+++ b/AdminDashboard/src/Components/MultiSelect/SelectPanel.tsx
@@ -14,13 +14,16 @@ class SelectPanel extends Component<ComponentProps> {
         focusIndex: 0,
     };
 
-    selectAll = () => { };
+    selectAll = () => {};
 
-    selectNone = () => { };
+    selectNone = () => {};
 
     selectAllChanged = (checked: $TSFixMe) => {
-        if (checked) this.selectAll();
-        else this.selectNone();
+        if (checked) {
+            this.selectAll();
+        } else {
+            this.selectNone();
+        }
     };
 
     handleSearchChange = (e: $TSFixMe) => {
@@ -36,17 +39,23 @@ class SelectPanel extends Component<ComponentProps> {
         });
     };
 
-    clearSearch = () => this.setState({ searchText: '' });
+    clearSearch = () => {
+        return this.setState({ searchText: '' });
+    };
 
     handleKeyDown = (e: $TSFixMe) => {
         switch (e) {
             case 38:
-                if (e.altKey) return;
+                if (e.altKey) {
+                    return;
+                }
 
                 this.updateFocus(-1);
                 break;
             case 40:
-                if (e.altKey) return;
+                if (e.altKey) {
+                    return;
+                }
 
                 this.updateFocus(1);
                 break;
@@ -66,7 +75,6 @@ class SelectPanel extends Component<ComponentProps> {
     };
 
     allAreSelected() {
-
         const { options, selected }: $TSFixMe = this.props;
         return options.length === selected.length;
     }
@@ -95,7 +103,6 @@ class SelectPanel extends Component<ComponentProps> {
 
     override render() {
         const {
-
             ItemRenderer,
 
             selectAllLabel,
@@ -124,8 +131,10 @@ class SelectPanel extends Component<ComponentProps> {
                         <input
                             placeholder="Search"
                             type="text"
-                            className={`db-MultiSelect-search ${searchHasFocus &&
-                                'db-MultiSelect-search--focused'}`}
+                            className={`db-MultiSelect-search ${
+                                searchHasFocus &&
+                                'db-MultiSelect-search--focused'
+                            }`}
                             onChange={this.handleSearchChange}
                             onBlur={this.onBlur}
                             onFocus={this.onFocus}
@@ -134,12 +143,13 @@ class SelectPanel extends Component<ComponentProps> {
                 )}
                 {hasSelectAll && (
                     <SelectItem
-
                         focused={focusIndex === 0}
                         checked={this.allAreSelected}
                         option={selectAllOption}
                         onSelectChanged={this.selectAllChanged}
-                        onClick={() => this.handleItemClicked(0)}
+                        onClick={() => {
+                            return this.handleItemClicked(0);
+                        }}
                         ItemRenderer={ItemRenderer}
                         disabled={disabled}
                     />
@@ -147,10 +157,11 @@ class SelectPanel extends Component<ComponentProps> {
 
                 <SelectList
                     {...this.props}
-
                     options={this.filteredOptions()}
                     focusIndex={focusIndex - 1}
-                    onClick={(e: $TSFixMe, index: $TSFixMe) => this.handleItemClicked(index + 1)}
+                    onClick={(e: $TSFixMe, index: $TSFixMe) => {
+                        return this.handleItemClicked(index + 1);
+                    }}
                     ItemRenderer={ItemRenderer}
                     disabled={disabled}
                 />
@@ -159,14 +170,11 @@ class SelectPanel extends Component<ComponentProps> {
     }
 }
 
-
 SelectPanel.displayName = 'SelectPanel';
 
-
 SelectPanel.propTypes = {
     ItemRenderer: PropTypes.element,
     options: PropTypes.arrayOf({
-
         label: PropTypes.string.isRequired,
         value: PropTypes.string.isRequired,
         key: PropTypes.string,
diff --git a/AdminDashboard/src/Components/Nav/SideNav.tsx b/AdminDashboard/src/Components/Nav/SideNav.tsx
index 7185139759..64682549aa 100644
--- a/AdminDashboard/src/Components/Nav/SideNav.tsx
+++ b/AdminDashboard/src/Components/Nav/SideNav.tsx
@@ -12,7 +12,6 @@ import ClickOutside from 'react-click-outside';
 import { withRouter, Switch, Route } from 'react-router-dom';
 
 class SideNav extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -27,18 +26,17 @@ class SideNav extends Component<ComponentProps> {
 
     override render() {
         return (
-
-            <ClickOutside onClickOutside={this.props.closeSideNav} >
+            <ClickOutside onClickOutside={this.props.closeSideNav}>
                 <div
                     onKeyDown={this.handleKeyBoard}
-                    className={`db-World-sideNavContainer${this.props.sidenavopen ? ' open' : ''
-                        }`}
+                    className={`db-World-sideNavContainer${
+                        this.props.sidenavopen ? ' open' : ''
+                    }`}
                 >
                     <div className="db-SideNav-container Box-root Box-background--surface Flex-flex Flex-direction--column Padding-top--20 Padding-right--2">
                         <div className="Box-root Margin-bottom--20">
                             <div>
                                 <div>
-
                                     <div tabIndex="-1" id="AccountSwitcherId">
                                         <div className="db-AccountSwitcherX-button Box-root Flex-flex Flex-alignItems--center">
                                             <div className="Box-root Margin-right--8">
@@ -81,8 +79,12 @@ class SideNav extends Component<ComponentProps> {
                         <div className="db-SideNav-navSections Box-root Flex-flex Flex-alignItems--stretch Flex-direction--column Flex-justifyContent--flexStaIt">
                             {groups
 
-                                .filter(group => !group.isPublic)
-                                .filter(group => group.visible)
+                                .filter(group => {
+                                    return !group.isPublic;
+                                })
+                                .filter(group => {
+                                    return group.visible;
+                                })
                                 .map((group, index, array) => {
                                     const marginClass: $TSFixMe =
                                         index === array.length - 1
@@ -94,15 +96,23 @@ class SideNav extends Component<ComponentProps> {
                                             className={marginClass}
                                         >
                                             <ul>
-                                                {group.routes.map((route: $TSFixMe) => {
-                                                    return (
-                                                        <li key={route.index}>
-                                                            <NavItem
-                                                                route={route}
-                                                            />
-                                                        </li>
-                                                    );
-                                                })}
+                                                {group.routes.map(
+                                                    (route: $TSFixMe) => {
+                                                        return (
+                                                            <li
+                                                                key={
+                                                                    route.index
+                                                                }
+                                                            >
+                                                                <NavItem
+                                                                    route={
+                                                                        route
+                                                                    }
+                                                                />
+                                                            </li>
+                                                        );
+                                                    }
+                                                )}
                                             </ul>
                                         </div>
                                     );
@@ -115,7 +125,6 @@ class SideNav extends Component<ComponentProps> {
     }
 }
 
-
 SideNav.displayName = 'SideNav';
 
 const mapStateToProps: $TSFixMe = function (state: RootState) {
@@ -135,7 +144,6 @@ const mapDispatchToProps: $TSFixMe = function (dispatch: Dispatch) {
     );
 };
 
-
 SideNav.propTypes = {
     closeSideNav: PropTypes.func,
     sidenavopen: PropTypes.bool,
@@ -143,22 +151,27 @@ SideNav.propTypes = {
 
 SideNav.contextTypes = {};
 
-// since sideNav is above page routes we have no access to the pages' props.match,
-// we rebuild the routes here to enable access to these properties
+/*
+ * since sideNav is above page routes we have no access to the pages' props.match,
+ * we rebuild the routes here to enable access to these properties
+ */
 
 const WrappedSideNav: Function = (props: $TSFixMe) => {
     return (
         <Switch>
             {allRoutes
-                .filter(route => route.visible)
+                .filter(route => {
+                    return route.visible;
+                })
                 .map((route, index) => {
                     return (
                         <Route
-
                             exact={route.exact}
                             path={route.path}
                             key={index}
-                            render={(routeProps: $TSFixMe) => <SideNav {...props} {...routeProps} />}
+                            render={(routeProps: $TSFixMe) => {
+                                return <SideNav {...props} {...routeProps} />;
+                            }}
                         />
                     );
                 })}
diff --git a/AdminDashboard/src/Components/Nav/SideNavItem.tsx b/AdminDashboard/src/Components/Nav/SideNavItem.tsx
index 7a2db9309c..b1fa12a7a0 100644
--- a/AdminDashboard/src/Components/Nav/SideNavItem.tsx
+++ b/AdminDashboard/src/Components/Nav/SideNavItem.tsx
@@ -8,7 +8,7 @@ import ShouldRender from '../basic/ShouldRender';
 import { loadPage } from '../../actions/page';
 import { navKeyBind, cleanBind } from '../../utils/keybinding';
 
-export class SidebarNavItem extends Component<ComponentProps>{
+export class SidebarNavItem extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -19,7 +19,6 @@ export class SidebarNavItem extends Component<ComponentProps>{
     }
 
     override componentDidMount() {
-
         const { route }: $TSFixMe = this.props;
         navKeyBind(route);
 
@@ -30,7 +29,6 @@ export class SidebarNavItem extends Component<ComponentProps>{
     }
 
     override componentWillUnmount() {
-
         const { route }: $TSFixMe = this.props;
         cleanBind(route);
 
@@ -43,7 +41,9 @@ export class SidebarNavItem extends Component<ComponentProps>{
     camalize = function camalize(str: $TSFixMe) {
         return str
             .toLowerCase()
-            .replace(/[^a-zA-Z0-9]+(.)/g, (m: $TSFixMe, chr: $TSFixMe) => chr.toUpperCase());
+            .replace(/[^a-zA-Z0-9]+(.)/g, (m: $TSFixMe, chr: $TSFixMe) => {
+                return chr.toUpperCase();
+            });
     };
 
     routeInnerDiv = (route: $TSFixMe, isLinkActive: $TSFixMe) => {
@@ -55,11 +55,13 @@ export class SidebarNavItem extends Component<ComponentProps>{
                     <div className="Box-root Flex-flex Flex-alignItems--center tooltip">
                         <div className="Box-root Flex-flex Flex-alignItems--center Margin-right--12">
                             <span
-                                className={`db-SideNav-icon db-SideNav-icon--${route.icon
-                                    } ${isLinkActive
+                                className={`db-SideNav-icon db-SideNav-icon--${
+                                    route.icon
+                                } ${
+                                    isLinkActive
                                         ? 'db-SideNav-icon--selected'
                                         : null
-                                    }`}
+                                }`}
                             />
                         </div>
                         <span
@@ -106,7 +108,6 @@ export class SidebarNavItem extends Component<ComponentProps>{
         };
 
         return (
-
             <div id={this.camalize(route.title)} style={routeStyle}>
                 <ShouldRender if={!route.invisible}>
                     <ShouldRender if={route.external}>
@@ -115,7 +116,12 @@ export class SidebarNavItem extends Component<ComponentProps>{
                         </a>
                     </ShouldRender>
                     <ShouldRender if={!route.external}>
-                        <Link to={path} onClick={() => loadPage(route.title)}>
+                        <Link
+                            to={path}
+                            onClick={() => {
+                                return loadPage(route.title);
+                            }}
+                        >
                             {this.routeInnerDiv(route, isLinkActive)}
                         </Link>
                     </ShouldRender>
@@ -131,7 +137,9 @@ export class SidebarNavItem extends Component<ComponentProps>{
                             <ul style={{ marginBottom: '8px' }}>
                                 <RenderListItems
                                     active={match.url}
-                                    onLoad={(title: $TSFixMe) => loadPage(title)}
+                                    onLoad={(title: $TSFixMe) => {
+                                        return loadPage(title);
+                                    }}
                                 />
                             </ul>
                         </ShouldRender>
@@ -141,72 +149,90 @@ export class SidebarNavItem extends Component<ComponentProps>{
         );
     }
 
-    RenderListItems({
-        active,
-        onLoad
-    }: $TSFixMe) {
+    RenderListItems({ active, onLoad }: $TSFixMe) {
+        return this.props.route.subRoutes.map(
+            (child: $TSFixMe, index: $TSFixMe) => {
+                const routes: $TSFixMe =
+                    child.shortcut && child.shortcut.split('+');
 
-        return this.props.route.subRoutes.map((child: $TSFixMe, index: $TSFixMe) => {
-            const routes: $TSFixMe = child.shortcut && child.shortcut.split('+');
+                const removedLinks: $TSFixMe = ['User', 'Project'];
+                if (
+                    removedLinks.some(link => {
+                        return link === child.title;
+                    })
+                ) {
+                    return null;
+                }
 
-            const removedLinks: $TSFixMe = ['User', 'Project'];
-            if (removedLinks.some(link => link === child.title)) return null;
+                if (child.visible) {
+                    const link: $TSFixMe = child.path.replace(
+                        ':userId',
 
-            if (child.visible) {
-                const link: $TSFixMe = child.path.replace(
-                    ':userId',
-
-                    this.props.match.params.userId
-                );
-                return (
-                    <li id={this.camalize(child.title)} key={`nav ${index}`}>
-                        <div style={{ position: 'relative' }}>
-                            <Link to={link} onClick={() => onLoad(child.title)}>
-                                <div style={{ outline: 'none' }}>
-                                    <div className="NavItem Box-root Box-background--surface Box-divider--surface-bottom-1 Padding-horizontal--4 Padding-vertical--2">
-                                        <div className="Box-root Flex-flex Flex-alignItems--center Padding-left--32 tooltip">
-                                            <span className="Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                <span
-                                                    className={
-                                                        link === active
-                                                            ? 'Text-color--oneuptimeblue Text-fontWeight--bold'
-                                                            : ''
-                                                    }
-                                                >
-                                                    {child.title}
+                        this.props.match.params.userId
+                    );
+                    return (
+                        <li
+                            id={this.camalize(child.title)}
+                            key={`nav ${index}`}
+                        >
+                            <div style={{ position: 'relative' }}>
+                                <Link
+                                    to={link}
+                                    onClick={() => {
+                                        return onLoad(child.title);
+                                    }}
+                                >
+                                    <div style={{ outline: 'none' }}>
+                                        <div className="NavItem Box-root Box-background--surface Box-divider--surface-bottom-1 Padding-horizontal--4 Padding-vertical--2">
+                                            <div className="Box-root Flex-flex Flex-alignItems--center Padding-left--32 tooltip">
+                                                <span className="Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                    <span
+                                                        className={
+                                                            link === active
+                                                                ? 'Text-color--oneuptimeblue Text-fontWeight--bold'
+                                                                : ''
+                                                        }
+                                                    >
+                                                        {child.title}
+                                                    </span>
                                                 </span>
-                                            </span>
-                                            {child.shortcut && (
-                                                <span className="tooltiptext">
-                                                    <strong>{routes[0]}</strong>
-                                                    <span> then </span>
-                                                    <strong>{routes[1]}</strong>
-                                                </span>
-                                            )}
+                                                {child.shortcut && (
+                                                    <span className="tooltiptext">
+                                                        <strong>
+                                                            {routes[0]}
+                                                        </strong>
+                                                        <span> then </span>
+                                                        <strong>
+                                                            {routes[1]}
+                                                        </strong>
+                                                    </span>
+                                                )}
+                                            </div>
                                         </div>
                                     </div>
+                                </Link>
+                                <div className="db-SideNav-item--root">
+                                    <span></span>
                                 </div>
-                            </Link>
-                            <div className="db-SideNav-item--root">
-                                <span></span>
                             </div>
-                        </div>
-                    </li>
-                );
-            } else {
+                        </li>
+                    );
+                }
                 return null;
             }
-        });
+        );
     }
 }
 
-
 SidebarNavItem.displayName = 'SidebarNavItem';
 
-const mapStateToProps: Function = () => ({});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ loadPage }, dispatch);
+const mapStateToProps: Function = () => {
+    return {};
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ loadPage }, dispatch);
+};
 
 SidebarNavItem.propTypes = {
     match: PropTypes.object.isRequired,
diff --git a/AdminDashboard/src/Components/Nav/TopNav.tsx b/AdminDashboard/src/Components/Nav/TopNav.tsx
index d06fd63d64..6ae53e11bc 100644
--- a/AdminDashboard/src/Components/Nav/TopNav.tsx
+++ b/AdminDashboard/src/Components/Nav/TopNav.tsx
@@ -10,24 +10,20 @@ import { getVersion } from '../../actions/version';
 import { getProbes } from '../../actions/probe';
 
 class TopContent extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override componentDidMount() {
-
         const { getVersion }: $TSFixMe = this.props;
         getVersion();
 
         this.props.getProbes(0, 10);
     }
     showProfileMenu = (e: $TSFixMe) => {
-
         this.props.showProfileMenu(e.clientX);
     };
 
     showNotificationsMenu = (e: $TSFixMe) => {
-
         this.props.openNotificationMenu(e.clientX);
     };
 
@@ -42,42 +38,35 @@ class TopContent extends Component<ComponentProps> {
 
     override render() {
         const IMG_URL: $TSFixMe =
-
             this.props.profilePic && this.props.profilePic !== ''
-
                 ? `url(${API_URL}/file/${this.props.profilePic})`
                 : 'url(https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mp&f=y)';
         const userId: $TSFixMe = User.getUserId();
         let count = 0;
         if (
-
             this.props.notifications &&
-
             this.props.notifications.notifications &&
-
             this.props.notifications.notifications.length
         ) {
-
-            this.props.notifications.notifications.map((notification: $TSFixMe) => {
-                if (notification.read.indexOf(userId) > -1) {
-                    return notification;
-                } else {
+            this.props.notifications.notifications.map(
+                (notification: $TSFixMe) => {
+                    if (notification.read.indexOf(userId) > -1) {
+                        return notification;
+                    }
                     count++;
                     return notification;
                 }
-            });
+            );
         }
 
         return (
             <div
-
                 tabIndex="0"
                 onKeyDown={this.handleKeyBoard}
                 style={{ zIndex: '2' }}
                 className="db-World-topContent Box-root Box-background--surface Padding-vertical--20"
             >
                 <div className="Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--spaceBetween">
-
                     <div className="Box-root" onClick={this.props.openSideNav}>
                         <div className="db-MenuContainer">
                             <div
@@ -93,7 +82,6 @@ class TopContent extends Component<ComponentProps> {
                     <div className="Box-root Flex-flex">
                         <div>
                             <div
-
                                 tabIndex="-1"
                                 style={{ outline: 'none', marginRight: '15px' }}
                             >
@@ -117,7 +105,6 @@ class TopContent extends Component<ComponentProps> {
                                             className="bs-Button bs-DeprecatedButton db-UserMenuX"
                                             id="profile-menu"
                                             type="button"
-
                                             tabIndex="-1"
                                             onClick={this.showProfileMenu}
                                         >
@@ -139,7 +126,6 @@ class TopContent extends Component<ComponentProps> {
     }
 }
 
-
 TopContent.displayName = 'TopContent';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -148,17 +134,18 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        showProfileMenu,
-        openNotificationMenu,
-        openSideNav,
-        getVersion,
-        getProbes,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            showProfileMenu,
+            openNotificationMenu,
+            openSideNav,
+            getVersion,
+            getProbes,
+        },
+        dispatch
+    );
+};
 
 TopContent.propTypes = {
     getVersion: PropTypes.func,
@@ -178,7 +165,6 @@ TopContent.propTypes = {
     getProbes: PropTypes.func.isRequired,
 };
 
-
 TopContent.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(TopContent);
diff --git a/AdminDashboard/src/Components/NotRequiredAuth.tsx b/AdminDashboard/src/Components/NotRequiredAuth.tsx
index b80600f49d..18178f067a 100644
--- a/AdminDashboard/src/Components/NotRequiredAuth.tsx
+++ b/AdminDashboard/src/Components/NotRequiredAuth.tsx
@@ -5,7 +5,6 @@ import { history } from '../store';
 
 export default function (ComposedComponent: $TSFixMe) {
     class NotAuthentication extends Component<ComponentProps> {
-
         public static displayName = '';
         public static propTypes = {};
 
@@ -39,7 +38,6 @@ export default function (ComposedComponent: $TSFixMe) {
         return {};
     }
 
-
     NotAuthentication.displayName = 'NotAuthentication';
 
     return connect(mapStateToProps)(NotAuthentication);
diff --git a/AdminDashboard/src/Components/Notification/NotificationMenu.tsx b/AdminDashboard/src/Components/Notification/NotificationMenu.tsx
index 309ac68d3f..28a0cd6237 100644
--- a/AdminDashboard/src/Components/Notification/NotificationMenu.tsx
+++ b/AdminDashboard/src/Components/Notification/NotificationMenu.tsx
@@ -6,7 +6,6 @@ import { User } from '../../config';
 import moment from 'moment';
 
 class NotificationMenu extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -21,7 +20,6 @@ class NotificationMenu extends Component<ComponentProps> {
                     width: '450px',
 
                     left: this.props.position
-
                         ? `${this.props.position - 391.5}px`
                         : 'unset',
                     right: '40px',
@@ -69,16 +67,15 @@ class NotificationMenu extends Component<ComponentProps> {
                                     </div>
                                 </div>
                                 <div className="Box-root Padding-vertical--8">
-
                                     {this.props.notifications &&
-
-                                        this.props.notifications.notifications &&
-
-                                        this.props.notifications.notifications
-                                            .length ? (
-
+                                    this.props.notifications.notifications &&
+                                    this.props.notifications.notifications
+                                        .length ? (
                                         this.props.notifications.notifications.map(
-                                            (notification: $TSFixMe, key: $TSFixMe) => {
+                                            (
+                                                notification: $TSFixMe,
+                                                key: $TSFixMe
+                                            ) => {
                                                 return (
                                                     <div
                                                         className={
@@ -101,24 +98,22 @@ class NotificationMenu extends Component<ComponentProps> {
                                                     >
                                                         <div className="Notify-oneuptime">
                                                             <img
-                                                                src={`/dashboard/assets/img/${notification.icon
-                                                                    ? notification.icon
-                                                                    : 'information'
-                                                                    }.svg`}
+                                                                src={`/dashboard/assets/img/${
+                                                                    notification.icon
+                                                                        ? notification.icon
+                                                                        : 'information'
+                                                                }.svg`}
                                                                 className="Notify-oneuptime-row-primary"
                                                                 style={{
-                                                                    height:
-                                                                        '20px',
-                                                                    width:
-                                                                        '20px',
+                                                                    height: '20px',
+                                                                    width: '20px',
                                                                 }}
                                                                 alt="notify"
                                                             />
                                                             <span
                                                                 className="Notify-oneuptime-row-secondary"
                                                                 style={{
-                                                                    cursor:
-                                                                        'default',
+                                                                    cursor: 'default',
                                                                 }}
                                                             >
                                                                 {
@@ -160,7 +155,6 @@ class NotificationMenu extends Component<ComponentProps> {
     }
 }
 
-
 NotificationMenu.displayName = 'NotificationMenu';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -174,7 +168,6 @@ const mapDispatchToProps: Function = (dispatch: Dispatch) => {
     return bindActionCreators({}, dispatch);
 };
 
-
 NotificationMenu.propTypes = {
     visible: PropTypes.bool,
     notifications: PropTypes.oneOfType([
@@ -186,7 +179,6 @@ NotificationMenu.propTypes = {
     position: PropTypes.number,
 };
 
-
 NotificationMenu.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(NotificationMenu);
diff --git a/AdminDashboard/src/Components/OutsideCLick.tsx b/AdminDashboard/src/Components/OutsideCLick.tsx
index 54e25d9aa2..d778f7e359 100644
--- a/AdminDashboard/src/Components/OutsideCLick.tsx
+++ b/AdminDashboard/src/Components/OutsideCLick.tsx
@@ -6,7 +6,6 @@ import React, { Component } from 'react';
 
 export default (ComposedComponent: $TSFixMe, extras: $TSFixMe) => {
     class OutsideCkick extends Component<ComponentProps> {
-
         public static displayName = '';
         public static propTypes = {};
 
@@ -44,15 +43,14 @@ export default (ComposedComponent: $TSFixMe, extras: $TSFixMe) => {
 
         override render() {
             return (
-                <div ref={this.setWrapperRef} >
+                <div ref={this.setWrapperRef}>
                     {' '}
-                    < ComposedComponent {...this.props} />{' '}
-                </div >
+                    <ComposedComponent {...this.props} />{' '}
+                </div>
             );
         }
     }
 
-
     OutsideCkick.displayName = 'OutsideCkick';
 
     return OutsideCkick;
diff --git a/AdminDashboard/src/Components/Probe/ProbeAddModal.tsx b/AdminDashboard/src/Components/Probe/ProbeAddModal.tsx
index 999b9a16d9..ea45ecfb5e 100644
--- a/AdminDashboard/src/Components/Probe/ProbeAddModal.tsx
+++ b/AdminDashboard/src/Components/Probe/ProbeAddModal.tsx
@@ -13,7 +13,6 @@ import { ValidateField } from '../../config';
 import { addProbe, resetAddProbe } from '../../actions/probe';
 
 class ProbeAddModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -26,16 +25,16 @@ class ProbeAddModal extends Component<ComponentProps> {
     }
 
     submitForm = (values: $TSFixMe) => {
-
-        const { addProbe, closeThisDialog, resetAddProbe }: $TSFixMe = this.props;
+        const { addProbe, closeThisDialog, resetAddProbe }: $TSFixMe =
+            this.props;
         addProbe(values.probe_key, values.probe_name).then(
-            function (val: $TSFixMe) {
+            (val: $TSFixMe) => {
                 if (val === 'ok') {
                     resetAddProbe();
                     closeThisDialog();
                 }
             },
-            function () {
+            () => {
                 //do nothing.
             }
         );
@@ -44,7 +43,6 @@ class ProbeAddModal extends Component<ComponentProps> {
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 this.props.resetAddProbe();
 
                 return this.props.closeThisDialog();
@@ -55,7 +53,6 @@ class ProbeAddModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             handleSubmit,
 
             closeThisDialog,
@@ -66,11 +63,11 @@ class ProbeAddModal extends Component<ComponentProps> {
 
             resetAddProbe,
         } = this.props;
-        const disabled: $TSFixMe = addProbeState.requesting || probes.requesting;
+        const disabled: $TSFixMe =
+            addProbeState.requesting || probes.requesting;
         return (
             <div
                 className="ModalLayer-contents"
-
                 tabIndex="-1"
                 style={{ marginTop: '40px' }}
             >
@@ -232,7 +229,6 @@ class ProbeAddModal extends Component<ComponentProps> {
     }
 }
 
-
 ProbeAddModal.displayName = 'ProbeAddFormModal';
 
 const ProbeAddModalForm: $TSFixMe = reduxForm({
@@ -250,7 +246,6 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 ProbeAddModal.propTypes = {
     addProbe: PropTypes.func,
     addProbeState: PropTypes.object,
diff --git a/AdminDashboard/src/Components/Probe/ProbeDeleteModal.tsx b/AdminDashboard/src/Components/Probe/ProbeDeleteModal.tsx
index a44fc7e2fd..38855aa6c5 100644
--- a/AdminDashboard/src/Components/Probe/ProbeDeleteModal.tsx
+++ b/AdminDashboard/src/Components/Probe/ProbeDeleteModal.tsx
@@ -10,7 +10,6 @@ import { closeModal } from 'CommonUI/actions/Modal';
 import { deleteProbe } from '../../actions/probe';
 
 class ProbeDeleteModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +24,6 @@ class ProbeDeleteModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
                 return this.handleDelete();
@@ -35,8 +33,8 @@ class ProbeDeleteModal extends Component<ComponentProps> {
     };
 
     handleDelete = () => {
-
-        const { error, modalId, closeModal, deleteProbe, probeId }: $TSFixMe = this.props;
+        const { error, modalId, closeModal, deleteProbe, probeId }: $TSFixMe =
+            this.props;
         deleteProbe(probeId).then(() => {
             if (!error) {
                 return closeModal({ id: modalId });
@@ -45,7 +43,6 @@ class ProbeDeleteModal extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { isRequesting, error, closeThisDialog }: $TSFixMe = this.props;
 
         return (
@@ -103,8 +100,9 @@ class ProbeDeleteModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -116,8 +114,9 @@ class ProbeDeleteModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             onClick={this.handleDelete}
                                             disabled={isRequesting}
                                             autoFocus={true}
@@ -141,7 +140,6 @@ class ProbeDeleteModal extends Component<ComponentProps> {
     }
 }
 
-
 ProbeDeleteModal.displayName = 'ProbeDeleteModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -159,8 +157,9 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal, deleteProbe }, dispatch);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal, deleteProbe }, dispatch);
+};
 
 ProbeDeleteModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
diff --git a/AdminDashboard/src/Components/Probe/ProbeList.tsx b/AdminDashboard/src/Components/Probe/ProbeList.tsx
index 2d8db51473..ac7d5298b9 100644
--- a/AdminDashboard/src/Components/Probe/ProbeList.tsx
+++ b/AdminDashboard/src/Components/Probe/ProbeList.tsx
@@ -16,7 +16,7 @@ import { reduxForm, Field } from 'redux-form';
 import { UploadFile } from '../basic/UploadFile';
 import { API_URL } from '../../config';
 
-export class ProbeList extends Component<ComponentProps>{
+export class ProbeList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -26,7 +26,6 @@ export class ProbeList extends Component<ComponentProps>{
     }
 
     handleClick = (probeId: $TSFixMe) => {
-
         const { deleteModalId }: $TSFixMe = this.state;
 
         this.props.openModal({
@@ -43,9 +42,11 @@ export class ProbeList extends Component<ComponentProps>{
         const reader: $TSFixMe = new FileReader();
         const file: $TSFixMe = e.target.files[0];
 
-        // reader.onloadend = () => {
-        //     this.props.logFile(reader.result);
-        // };
+        /*
+         * reader.onloadend = () => {
+         *     this.props.logFile(reader.result);
+         * };
+         */
         try {
             reader.readAsDataURL(file);
             const data: $TSFixMe = { id: probe._id, probeImage: file };
@@ -57,10 +58,8 @@ export class ProbeList extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { selectedProbe }: $TSFixMe = this.state;
         const {
-
             probes,
 
             deleteRequesting,
@@ -77,8 +76,12 @@ export class ProbeList extends Component<ComponentProps>{
         if (probes && probes.limit && typeof probes.limit === 'string') {
             probes.limit = parseInt(probes.limit, 10);
         }
-        if (!probes.skip) probes.skip = 0;
-        if (!probes.limit) probes.limit = 0;
+        if (!probes.skip) {
+            probes.skip = 0;
+        }
+        if (!probes.limit) {
+            probes.limit = 0;
+        }
 
         let canNext =
             probes && probes.count && probes.count > probes.skip + probes.limit
@@ -175,8 +178,8 @@ export class ProbeList extends Component<ComponentProps>{
                                     </tr>
                                 </Fragment>
                             ) : probes &&
-                                probes.data &&
-                                probes.data.length > 0 ? (
+                              probes.data &&
+                              probes.data.length > 0 ? (
                                 probes.data.map((probe: $TSFixMe) => {
                                     const fileData: $TSFixMe =
                                         probe && probe.probeImage
@@ -246,10 +249,10 @@ export class ProbeList extends Component<ComponentProps>{
                                                                 <span>
                                                                     {probe.lastAlive
                                                                         ? moment(
-                                                                            probe.lastAlive
-                                                                        ).format(
-                                                                            'dddd, MMMM Do YYYY, h:mm a'
-                                                                        )
+                                                                              probe.lastAlive
+                                                                          ).format(
+                                                                              'dddd, MMMM Do YYYY, h:mm a'
+                                                                          )
                                                                         : ''}
                                                                 </span>
                                                             </div>
@@ -302,7 +305,6 @@ export class ProbeList extends Component<ComponentProps>{
                                                                 'flex-end',
                                                         }}
                                                     >
-
                                                         <form onSubmit>
                                                             <div className="bs-Button bs-DeprecatedButton Margin-left--8">
                                                                 <ShouldRender
@@ -335,17 +337,19 @@ export class ProbeList extends Component<ComponentProps>{
                                                                     name="profilePic"
                                                                     id="profilePic"
                                                                     accept="image/jpeg, image/jpg, image/png"
-                                                                    onChange={(e: $TSFixMe) => this.handleChange(
-                                                                        probe,
-                                                                        e
-                                                                    )
-                                                                    }
+                                                                    onChange={(
+                                                                        e: $TSFixMe
+                                                                    ) => {
+                                                                        return this.handleChange(
+                                                                            probe,
+                                                                            e
+                                                                        );
+                                                                    }}
                                                                     disabled={
                                                                         updateRequesting &&
                                                                         selectedProbe ===
-                                                                        probe.id
+                                                                            probe.id
                                                                     }
-
                                                                     fileInputKey={Math.round()}
                                                                 />
                                                             </div>
@@ -358,11 +362,11 @@ export class ProbeList extends Component<ComponentProps>{
                                                                 addRequesting ||
                                                                 deleteRequesting
                                                             }
-                                                            onClick={() =>
-                                                                this.handleClick(
+                                                            onClick={() => {
+                                                                return this.handleClick(
                                                                     probe._id
-                                                                )
-                                                            }
+                                                                );
+                                                            }}
                                                         >
                                                             <ShouldRender
                                                                 if={
@@ -396,9 +400,9 @@ export class ProbeList extends Component<ComponentProps>{
                 </div>
                 <div style={{ textAlign: 'center', marginTop: '10px' }}>
                     {probes &&
-                        (!probes.data || !probes.data.length) &&
-                        !probes.requesting &&
-                        !probes.error
+                    (!probes.data || !probes.data.length) &&
+                    !probes.requesting &&
+                    !probes.error
                         ? "We don't have any probes yet"
                         : null}
                     {probes && probes.error ? probes.error : null}
@@ -409,12 +413,15 @@ export class ProbeList extends Component<ComponentProps>{
                             <span>
                                 <span className="Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
                                     {probes && probes.count
-                                        ? `Page ${this.props.page
-                                        } of ${numberOfPages} (${probes &&
-                                        probes.count} Probe${probes && probes.count === 1
-                                            ? ''
-                                            : 's'
-                                        })`
+                                        ? `Page ${
+                                              this.props.page
+                                          } of ${numberOfPages} (${
+                                              probes && probes.count
+                                          } Probe${
+                                              probes && probes.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          })`
                                         : null}
                                 </span>
                             </span>
@@ -426,7 +433,6 @@ export class ProbeList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
                                             probes.skip,
                                             probes.limit
@@ -451,7 +457,6 @@ export class ProbeList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
                                             probes.skip,
                                             probes.limit
@@ -496,10 +501,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 ProbeList.displayName = 'ProbeList';
 
-
 ProbeList.propTypes = {
     addRequesting: PropTypes.bool,
     deleteRequesting: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Probe/ProbeStatus.tsx b/AdminDashboard/src/Components/Probe/ProbeStatus.tsx
index 29ab788896..aad45dcde8 100644
--- a/AdminDashboard/src/Components/Probe/ProbeStatus.tsx
+++ b/AdminDashboard/src/Components/Probe/ProbeStatus.tsx
@@ -2,9 +2,7 @@ import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import moment from 'moment';
 
-function ProbeStatus({
-    lastAlive
-}: $TSFixMe) {
+function ProbeStatus({ lastAlive }: $TSFixMe) {
     const [now, setNow]: $TSFixMe = useState(Date.now());
 
     useEffect(() => {
diff --git a/AdminDashboard/src/Components/Profile/ProfileMenu.tsx b/AdminDashboard/src/Components/Profile/ProfileMenu.tsx
index 8472461078..906d972aac 100644
--- a/AdminDashboard/src/Components/Profile/ProfileMenu.tsx
+++ b/AdminDashboard/src/Components/Profile/ProfileMenu.tsx
@@ -10,7 +10,7 @@ import { v4 as uuidv4 } from 'uuid';
 import About from '../Modals/About';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class ProfileMenu extends Component<ComponentProps>{
+export class ProfileMenu extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,19 +20,18 @@ export class ProfileMenu extends Component<ComponentProps>{
     }
 
     logout() {
-
         const { logoutUser }: $TSFixMe = this.props;
         logoutUser();
     }
 
     showAboutModal = () => {
-
         this.props.hideProfileMenu();
 
         this.props.openModal({
-
             id: this.state.aboutId,
-            onClose: () => '',
+            onClose: () => {
+                return '';
+            },
             content: About,
         });
     };
@@ -59,7 +58,6 @@ export class ProfileMenu extends Component<ComponentProps>{
         const name: $TSFixMe = User.getName();
         const email: $TSFixMe = User.getEmail();
 
-
         return this.props.visible ? (
             <div
                 className="ContextualLayer-layer--topright ContextualLayer-layer--anytop ContextualLayer-layer--anyright ContextualLayer-context--bottom ContextualLayer-context--anybottom ContextualLayer-container ContextualLayer--pointerEvents"
@@ -68,7 +66,6 @@ export class ProfileMenu extends Component<ComponentProps>{
                     width: '232px',
 
                     left: this.props.position
-
                         ? `${this.props.position - 214.25}px`
                         : 'unset',
                     right: '40px',
@@ -112,9 +109,9 @@ export class ProfileMenu extends Component<ComponentProps>{
                                             className="ButtonLink db-Menu-item db-Menu-item--link"
                                             id="about-button"
                                             type="button"
-                                            onClick={() =>
-                                                this.showAboutModal()
-                                            }
+                                            onClick={() => {
+                                                return this.showAboutModal();
+                                            }}
                                             style={{ width: '100%' }}
                                         >
                                             <div
@@ -150,7 +147,9 @@ export class ProfileMenu extends Component<ComponentProps>{
                                             className="ButtonLink db-Menu-item db-Menu-item--link"
                                             id="logout-button"
                                             type="button"
-                                            onClick={() => this.logout()}
+                                            onClick={() => {
+                                                return this.logout();
+                                            }}
                                         >
                                             <div className="Box-root Flex-inlineFlex Flex-alignItems--center Flex-direction--rowReversed">
                                                 <span className="ButtonLink-label Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
@@ -171,7 +170,6 @@ export class ProfileMenu extends Component<ComponentProps>{
     }
 }
 
-
 ProfileMenu.displayName = 'ProfileMenu';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -187,7 +185,6 @@ const mapDispatchToProps: Function = (dispatch: Dispatch) => {
     );
 };
 
-
 ProfileMenu.propTypes = {
     visible: PropTypes.bool,
     logoutUser: PropTypes.func.isRequired,
@@ -196,7 +193,6 @@ ProfileMenu.propTypes = {
     hideProfileMenu: PropTypes.func,
 };
 
-
 ProfileMenu.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProfileMenu);
diff --git a/AdminDashboard/src/Components/Project/DeleteDomain.tsx b/AdminDashboard/src/Components/Project/DeleteDomain.tsx
index 75edf14d37..0c2a09607f 100644
--- a/AdminDashboard/src/Components/Project/DeleteDomain.tsx
+++ b/AdminDashboard/src/Components/Project/DeleteDomain.tsx
@@ -14,12 +14,10 @@ import {
 import ShouldRender from '../basic/ShouldRender';
 
 class DeleteDomain extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override componentDidMount() {
-
         this.props.resetDeleteProjectDomain();
         window.addEventListener('keydown', this.handleKeyBoard);
     }
@@ -39,16 +37,13 @@ class DeleteDomain extends Component<ComponentProps> {
         }
     };
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.domainId,
         });
     };
 
     handleDelete = () => {
         const {
-
             deleteProjectDomain,
 
             data: { projectId, domainId },
@@ -65,7 +60,6 @@ class DeleteDomain extends Component<ComponentProps> {
         });
     };
     override render() {
-
         const { isRequesting, deleteError }: $TSFixMe = this.props;
         return (
             <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -170,10 +164,8 @@ class DeleteDomain extends Component<ComponentProps> {
     }
 }
 
-
 DeleteDomain.displayName = 'DeleteDomain';
 
-
 DeleteDomain.propTypes = {
     closeModal: PropTypes.func,
     deleteProjectDomain: PropTypes.func,
@@ -196,14 +188,16 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        closeModal,
-        deleteProjectDomain,
-        fetchProjectDomains,
-        resetDeleteProjectDomain,
-    },
-    dispatch
-);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            closeModal,
+            deleteProjectDomain,
+            fetchProjectDomains,
+            resetDeleteProjectDomain,
+        },
+        dispatch
+    );
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(DeleteDomain);
diff --git a/AdminDashboard/src/Components/Project/ProjectAlertLimitBox.tsx b/AdminDashboard/src/Components/Project/ProjectAlertLimitBox.tsx
index e6b3067489..f700eb4754 100644
--- a/AdminDashboard/src/Components/Project/ProjectAlertLimitBox.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectAlertLimitBox.tsx
@@ -6,7 +6,7 @@ import { FormLoader } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 import { renewAlertLimit } from '../../actions/project';
 
-export class ProjectAlertLimitBox extends Component<ComponentProps>{
+export class ProjectAlertLimitBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -26,7 +26,6 @@ export class ProjectAlertLimitBox extends Component<ComponentProps>{
     };
 
     handleClick = () => {
-
         const { renewAlertLimit, project }: $TSFixMe = this.props;
 
         const { alertLimit }: $TSFixMe = this.state;
@@ -34,7 +33,6 @@ export class ProjectAlertLimitBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { requesting }: $TSFixMe = this.props;
         return (
             <div className="Box-root Margin-bottom--12">
@@ -67,7 +65,6 @@ export class ProjectAlertLimitBox extends Component<ComponentProps>{
                                                         placeholder="100"
                                                         value={
                                                             this.state
-
                                                                 .alertLimit
                                                         }
                                                         onChange={this.onChange}
@@ -104,10 +101,11 @@ export class ProjectAlertLimitBox extends Component<ComponentProps>{
     }
 }
 
-
 ProjectAlertLimitBox.displayName = 'ProjectAlertLimitBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ renewAlertLimit }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ renewAlertLimit }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const project: $TSFixMe = state.project.project.project;
@@ -120,14 +118,12 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectAlertLimitBox.propTypes = {
     project: PropTypes.object,
     renewAlertLimit: PropTypes.func,
     requesting: PropTypes.bool,
 };
 
-
 ProjectAlertLimitBox.contextTypes = {};
 
 export default connect(
diff --git a/AdminDashboard/src/Components/Project/ProjectBalance.tsx b/AdminDashboard/src/Components/Project/ProjectBalance.tsx
index c4c88f8c77..b375e4c938 100644
--- a/AdminDashboard/src/Components/Project/ProjectBalance.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectBalance.tsx
@@ -20,13 +20,10 @@ function validate(value: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.text(value.rechargeBalanceAmount)) {
-
         errors.rechargeBalanceAmount = 'Amount is required';
     } else if (!Validate.number(value.rechargeBalanceAmount)) {
-
         errors.rechargeBalanceAmount = 'Enter a valid number';
     } else if (!Validate.numberGreaterThanZero(value.rechargeBalanceAmount)) {
-
         errors.rechargeBalanceAmount = 'Enter a valid number greater than 0';
     }
 
@@ -34,7 +31,6 @@ function validate(value: $TSFixMe) {
 }
 
 class ProjectBalance extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -43,7 +39,6 @@ class ProjectBalance extends Component<ComponentProps> {
         createTopUpModalId: uuidv4(),
     };
     submitForm = (values: $TSFixMe) => {
-
         const { openModal }: $TSFixMe = this.props;
 
         const { createTopUpModalId }: $TSFixMe = this.state;
@@ -51,8 +46,12 @@ class ProjectBalance extends Component<ComponentProps> {
         if (rechargeBalanceAmount) {
             openModal({
                 id: createTopUpModalId,
-                onClose: () => '',
-                onConfirm: () => this.updateProjectBalance(values),
+                onClose: () => {
+                    return '';
+                },
+                onConfirm: () => {
+                    return this.updateProjectBalance(values);
+                },
                 content: DataPathHoC(ConfirmBalanceTopUp, {
                     amount: values.rechargeBalanceAmount,
 
@@ -62,7 +61,6 @@ class ProjectBalance extends Component<ComponentProps> {
         }
     };
     updateProjectBalance = (values: $TSFixMe) => {
-
         const { updateBalance, projectId, openModal }: $TSFixMe = this.props;
         const { MessageBoxId }: $TSFixMe = this.state;
         return updateBalance(projectId, values.rechargeBalanceAmount)
@@ -88,7 +86,6 @@ class ProjectBalance extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { balance }: $TSFixMe = this.props;
         return (
             <div className="Box-root Margin-vertical--12">
@@ -110,7 +107,6 @@ class ProjectBalance extends Component<ComponentProps> {
                                     </div>
                                 </div>
                                 <form
-
                                     onSubmit={this.props.handleSubmit(
                                         this.submitForm
                                     )}
@@ -230,7 +226,6 @@ class ProjectBalance extends Component<ComponentProps> {
                                                         required="required"
                                                         disabled={
                                                             this.props
-
                                                                 .isRequesting
                                                         }
                                                     />
@@ -245,21 +240,18 @@ class ProjectBalance extends Component<ComponentProps> {
                                                 id="rechargeAccount"
                                                 className="bs-Button bs-Button--blue"
                                                 disabled={
-
                                                     this.props.isRequesting
                                                 }
                                                 type="submit"
                                             >
                                                 <ShouldRender
                                                     if={
-
                                                         !this.props.isRequesting
                                                     }
                                                 >
                                                     <span>Update Balance</span>
                                                 </ShouldRender>
                                                 <ShouldRender
-
                                                     if={this.props.isRequesting}
                                                 >
                                                     <FormLoader />
@@ -277,10 +269,8 @@ class ProjectBalance extends Component<ComponentProps> {
     }
 }
 
-
 ProjectBalance.displayName = 'ProjectBalance';
 
-
 ProjectBalance.propTypes = {
     updateBalance: PropTypes.func.isRequired,
     handleSubmit: PropTypes.func.isRequired,
@@ -290,9 +280,11 @@ ProjectBalance.propTypes = {
     openModal: PropTypes.func,
 };
 
-const  formName: string = 'CustomerBalance' + Math.floor(Math.random() * 10 + 1);
+const formName: string = 'CustomerBalance' + Math.floor(Math.random() * 10 + 1);
 
-const onSubmitSuccess: Function = (result: $TSFixMe, dispatch: Dispatch) => dispatch(reset(formName));
+const onSubmitSuccess: Function = (result: $TSFixMe, dispatch: Dispatch) => {
+    return dispatch(reset(formName));
+};
 
 const ProjectBalanceForm: $TSFixMe = new reduxForm({
     form: formName,
@@ -301,6 +293,8 @@ const ProjectBalanceForm: $TSFixMe = new reduxForm({
     onSubmitSuccess,
 })(ProjectBalance);
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ openModal, updateBalance }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ openModal, updateBalance }, dispatch);
+};
 
 export default connect(null, mapDispatchToProps)(ProjectBalanceForm);
diff --git a/AdminDashboard/src/Components/Project/ProjectBlockBox.tsx b/AdminDashboard/src/Components/Project/ProjectBlockBox.tsx
index 8b7212b0a8..ae6f0ffbe1 100644
--- a/AdminDashboard/src/Components/Project/ProjectBlockBox.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectBlockBox.tsx
@@ -10,7 +10,7 @@ import { blockProject } from '../../actions/project';
 import ProjectBlockModal from './ProjectBlockModal';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class ProjectBlockBox extends Component<ComponentProps>{
+export class ProjectBlockBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,12 +20,10 @@ export class ProjectBlockBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { blockProject, project }: $TSFixMe = this.props;
 
         const { blockModalId }: $TSFixMe = this.state;
 
-
         this.props.openModal({
             id: blockModalId,
             onConfirm: () => {
@@ -38,7 +36,6 @@ export class ProjectBlockBox extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.blockModalId });
             default:
                 return false;
@@ -46,7 +43,6 @@ export class ProjectBlockBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -93,10 +89,14 @@ export class ProjectBlockBox extends Component<ComponentProps>{
     }
 }
 
-
 ProjectBlockBox.displayName = 'ProjectBlockBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ blockProject, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { blockProject, openModal, closeModal },
+        dispatch
+    );
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const project: $TSFixMe = state.project.project.project;
@@ -109,7 +109,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectBlockBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     project: PropTypes.object.isRequired,
@@ -118,7 +117,6 @@ ProjectBlockBox.propTypes = {
     openModal: PropTypes.func.isRequired,
 };
 
-
 ProjectBlockBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectBlockBox);
diff --git a/AdminDashboard/src/Components/Project/ProjectBlockModal.tsx b/AdminDashboard/src/Components/Project/ProjectBlockModal.tsx
index 85d891648e..9fe5620ee9 100644
--- a/AdminDashboard/src/Components/Project/ProjectBlockModal.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectBlockModal.tsx
@@ -7,7 +7,6 @@ import { Spinner } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 
 class ProjectBlockModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,10 +21,8 @@ class ProjectBlockModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -34,7 +31,6 @@ class ProjectBlockModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             error,
@@ -99,8 +95,9 @@ class ProjectBlockModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -112,8 +109,9 @@ class ProjectBlockModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             onClick={confirmThisDialog}
                                             disabled={isRequesting}
                                             autoFocus={true}
@@ -137,7 +135,6 @@ class ProjectBlockModal extends Component<ComponentProps> {
     }
 }
 
-
 ProjectBlockModal.displayName = 'ProjectBlockModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -153,7 +150,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectBlockModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Project/ProjectDeleteBox.tsx b/AdminDashboard/src/Components/Project/ProjectDeleteBox.tsx
index b4bdc41116..a1436c8e98 100644
--- a/AdminDashboard/src/Components/Project/ProjectDeleteBox.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectDeleteBox.tsx
@@ -10,7 +10,7 @@ import { deleteProject } from '../../actions/project';
 import ProjectDeleteModal from './ProjectDeleteModal';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class ProjectDeleteBox extends Component<ComponentProps>{
+export class ProjectDeleteBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,10 +20,8 @@ export class ProjectDeleteBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { deleteProject, project }: $TSFixMe = this.props;
 
-
         const { deleteModalId }: $TSFixMe = this.state;
 
         this.props.openModal({
@@ -38,7 +36,6 @@ export class ProjectDeleteBox extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -46,7 +43,6 @@ export class ProjectDeleteBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -93,10 +89,14 @@ export class ProjectDeleteBox extends Component<ComponentProps>{
     }
 }
 
-
 ProjectDeleteBox.displayName = 'ProjectDeleteBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ deleteProject, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { deleteProject, openModal, closeModal },
+        dispatch
+    );
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const project: $TSFixMe = state.project.project.project;
@@ -109,7 +109,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectDeleteBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     project: PropTypes.object.isRequired,
@@ -118,7 +117,6 @@ ProjectDeleteBox.propTypes = {
     openModal: PropTypes.func.isRequired,
 };
 
-
 ProjectDeleteBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectDeleteBox);
diff --git a/AdminDashboard/src/Components/Project/ProjectDeleteModal.tsx b/AdminDashboard/src/Components/Project/ProjectDeleteModal.tsx
index c674969418..618f8eabaf 100644
--- a/AdminDashboard/src/Components/Project/ProjectDeleteModal.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectDeleteModal.tsx
@@ -7,7 +7,6 @@ import { Spinner } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 
 class ProjectDeleteModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,10 +21,8 @@ class ProjectDeleteModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -34,7 +31,6 @@ class ProjectDeleteModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             error,
@@ -99,8 +95,9 @@ class ProjectDeleteModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -112,8 +109,9 @@ class ProjectDeleteModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             onClick={confirmThisDialog}
                                             disabled={isRequesting}
                                             autoFocus={true}
@@ -137,7 +135,6 @@ class ProjectDeleteModal extends Component<ComponentProps> {
     }
 }
 
-
 ProjectDeleteModal.displayName = 'ProjectDeleteModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -153,7 +150,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectDeleteModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Project/ProjectDetails.tsx b/AdminDashboard/src/Components/Project/ProjectDetails.tsx
index 08e8f8f079..298ab17b86 100644
--- a/AdminDashboard/src/Components/Project/ProjectDetails.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectDetails.tsx
@@ -4,13 +4,13 @@ import { bindActionCreators, Dispatch } from 'redux';
 import { connect } from 'react-redux';
 import { DASHBOARD_URL } from '../../config';
 
-export class ProjectDetails extends Component<ComponentProps>{
+export class ProjectDetails extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     override render() {
         return (
-            <div className="Box-root Margin-bottom--12" >
+            <div className="Box-root Margin-bottom--12">
                 <div className="bs-ContentSection Card-root Card-shadow--medium">
                     <div className="Box-root">
                         <div className="bs-ContentSection-content Box-root Box-divider--surface-bottom-1 Flex-flex Flex-alignItems--center Flex-justifyContent--spaceBetween Padding-horizontal--20 Padding-vertical--16">
@@ -21,10 +21,9 @@ export class ProjectDetails extends Component<ComponentProps>{
                                             className="bs-Button bs-DeprecatedButton bs-Button--White"
                                             type="submit"
                                             style={{ float: 'right' }}
-                                            onClick={() =>
-
-                                                (window.location.href = `${DASHBOARD_URL}/project/${this.props.project.slug}`)
-                                            }
+                                            onClick={() => {
+                                                return (window.location.href = `${DASHBOARD_URL}/project/${this.props.project.slug}`);
+                                            }}
                                         >
                                             <span>Goto Project</span>
                                         </button>
@@ -71,14 +70,11 @@ export class ProjectDetails extends Component<ComponentProps>{
                                                             marginTop: '6px',
                                                         }}
                                                     >
-
                                                         {this.props.project !==
                                                             null &&
-
-                                                            this.props.project.name
-
+                                                        this.props.project.name
                                                             ? this.props.project
-                                                                .name
+                                                                  .name
                                                             : 'LOADING...'}
                                                     </span>
                                                 </div>
@@ -111,14 +107,11 @@ export class ProjectDetails extends Component<ComponentProps>{
                                                             marginTop: '6px',
                                                         }}
                                                     >
-
                                                         {this.props.project !==
                                                             null &&
-
-                                                            this.props.project._id
-
+                                                        this.props.project._id
                                                             ? this.props.project
-                                                                ._id
+                                                                  ._id
                                                             : 'LOADING...'}
                                                     </span>
                                                 </div>
@@ -151,15 +144,12 @@ export class ProjectDetails extends Component<ComponentProps>{
                                                             marginTop: '6px',
                                                         }}
                                                     >
-
                                                         {this.props.project !==
                                                             null &&
-
-                                                            this.props.project
-                                                                .apiKey
-
+                                                        this.props.project
+                                                            .apiKey
                                                             ? this.props.project
-                                                                .apiKey
+                                                                  .apiKey
                                                             : 'LOADING...'}
                                                     </span>
                                                 </div>
@@ -197,55 +187,50 @@ export class ProjectDetails extends Component<ComponentProps>{
                                                     >
                                                         {
                                                             <div
-                                                                className={`Badge Badge--color--${this.props
-
-                                                                    .project
-                                                                    .deleted
-                                                                    ? 'red'
-                                                                    : this
-                                                                        .props
-
-                                                                        .project
-                                                                        .isBlocked
-                                                                        ? 'yellow'
-                                                                        : 'green'
-                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
-                                                            >
-                                                                <span
-                                                                    className={`Badge-text Text-color--${this
-                                                                        .props
-
+                                                                className={`Badge Badge--color--${
+                                                                    this.props
                                                                         .project
                                                                         .deleted
                                                                         ? 'red'
                                                                         : this
+                                                                              .props
+                                                                              .project
+                                                                              .isBlocked
+                                                                        ? 'yellow'
+                                                                        : 'green'
+                                                                } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
+                                                            >
+                                                                <span
+                                                                    className={`Badge-text Text-color--${
+                                                                        this
                                                                             .props
-
                                                                             .project
-                                                                            .isBlocked
+                                                                            .deleted
+                                                                            ? 'red'
+                                                                            : this
+                                                                                  .props
+                                                                                  .project
+                                                                                  .isBlocked
                                                                             ? 'yellow'
                                                                             : 'green'
-                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
+                                                                    } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
                                                                 >
                                                                     <span>
                                                                         {this
                                                                             .props
-
                                                                             .project !==
-                                                                            null
+                                                                        null
                                                                             ? this
-                                                                                .props
-
-                                                                                .project
-                                                                                .deleted
+                                                                                  .props
+                                                                                  .project
+                                                                                  .deleted
                                                                                 ? 'Deleted'
                                                                                 : this
-                                                                                    .props
-
-                                                                                    .project
-                                                                                    .isBlocked
-                                                                                    ? 'Blocked'
-                                                                                    : 'Active'
+                                                                                      .props
+                                                                                      .project
+                                                                                      .isBlocked
+                                                                                ? 'Blocked'
+                                                                                : 'Active'
                                                                             : 'LOADING...'}
                                                                     </span>
                                                                 </span>
@@ -271,7 +256,6 @@ export class ProjectDetails extends Component<ComponentProps>{
     }
 }
 
-
 ProjectDetails.displayName = 'ProjectDetails';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -282,14 +266,14 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({}, dispatch);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({}, dispatch);
+};
 
 ProjectDetails.propTypes = {
     project: PropTypes.object.isRequired,
 };
 
-
 ProjectDetails.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectDetails);
diff --git a/AdminDashboard/src/Components/Project/ProjectDomain.tsx b/AdminDashboard/src/Components/Project/ProjectDomain.tsx
index a011087ab7..89827dec23 100644
--- a/AdminDashboard/src/Components/Project/ProjectDomain.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectDomain.tsx
@@ -15,13 +15,11 @@ import ProjectUnverifyDomain from './ProjectUnverifyDomain';
 import ProjectResetDomain from './ProjectResetDomain';
 
 class ProjectDomain extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     limit: PositiveNumber;
     constructor() {
-
         super();
         this.limit = 10;
         this.state = {
@@ -30,28 +28,22 @@ class ProjectDomain extends Component<ComponentProps> {
     }
 
     override componentDidMount() {
-
         const projectId: $TSFixMe = this.props.projectId;
         if (projectId) {
-
             this.props.fetchProjectDomains(this.props.projectId, 0, this.limit);
         }
     }
 
     componentDidUpdate(prevProps: $TSFixMe) {
-
         if (prevProps.projectId !== this.props.projectId) {
-
             const projectId: $TSFixMe = this.props.projectId;
             if (projectId) {
-
                 this.props.fetchProjectDomains(projectId, 0, this.limit);
             }
         }
     }
 
     prevClicked = (projectId: string, skip: PositiveNumber) => {
-
         const { fetchProjectDomains }: $TSFixMe = this.props;
         fetchProjectDomains(
             projectId,
@@ -61,7 +53,6 @@ class ProjectDomain extends Component<ComponentProps> {
     };
 
     nextClicked = (projectId: string, skip: PositiveNumber) => {
-
         const { fetchProjectDomains }: $TSFixMe = this.props;
         fetchProjectDomains(
             projectId,
@@ -72,7 +63,6 @@ class ProjectDomain extends Component<ComponentProps> {
 
     override render() {
         const {
-
             projectDomain: { domains },
 
             projectId,
@@ -91,7 +81,8 @@ class ProjectDomain extends Component<ComponentProps> {
         } = this.props;
         const footerBorderTopStyle: $TSFixMe = { margin: 0, padding: 0 };
 
-        const canNext: $TSFixMe = count > Number(skip) + Number(limit) ? true : false;
+        const canNext: $TSFixMe =
+            count > Number(skip) + Number(limit) ? true : false;
         const canPrev: $TSFixMe = Number(skip) <= 0 ? false : true;
 
         return (
@@ -135,175 +126,197 @@ class ProjectDomain extends Component<ComponentProps> {
                                     </div>
                                 </header>
                                 {domains.length > 0 &&
-                                    domains.map((eachDomain: $TSFixMe, index: $TSFixMe) => (
-                                        <div
-                                            key={eachDomain._id}
-                                            className="scheduled-event-list-item bs-ObjectList-row db-UserListRow db-UserListRow--withName"
-                                            style={{
-                                                backgroundColor: 'white',
-                                                cursor: 'pointer',
-                                            }}
-                                            id={`projectdomain_${index}`}
-                                        >
-                                            {eachDomain.verified ? (
+                                    domains.map(
+                                        (
+                                            eachDomain: $TSFixMe,
+                                            index: $TSFixMe
+                                        ) => {
+                                            return (
                                                 <div
-                                                    className="bs-ObjectList-cell bs-u-v-middle"
+                                                    key={eachDomain._id}
+                                                    className="scheduled-event-list-item bs-ObjectList-row db-UserListRow db-UserListRow--withName"
                                                     style={{
-                                                        display: 'flex',
-                                                        width: '10vw',
-                                                        whiteSpace: 'normal',
+                                                        backgroundColor:
+                                                            'white',
+                                                        cursor: 'pointer',
                                                     }}
+                                                    id={`projectdomain_${index}`}
                                                 >
-                                                    <div className="bs-ObjectList-cell-row">
-                                                        {eachDomain.domain}
-                                                    </div>
-                                                    <div
-                                                        style={{
-                                                            marginLeft: 5,
-                                                        }}
-                                                        className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
-                                                    >
-                                                        <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
-                                                            <span>
-                                                                Verified
-                                                            </span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            ) : (
-                                                <div
-                                                    className="bs-ObjectList-cell bs-u-v-middle"
-                                                    style={{
-                                                        display: 'flex',
-                                                        width: '10vw',
-                                                        whiteSpace: 'normal',
-                                                    }}
-                                                >
-                                                    <div className="bs-ObjectList-cell-row">
-                                                        {eachDomain.domain}
-                                                    </div>
-                                                    <div
-                                                        style={{
-                                                            marginLeft: 5,
-                                                        }}
-                                                        className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
-                                                    >
-                                                        <span className="Badge-text Text-color--red Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
-                                                            <span>
-                                                                Unverified
-                                                            </span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            )}
-                                            <div className="bs-ObjectList-cell bs-u-v-middle">
-                                                <div className="Box-root Flex-flex Flex-justifyContent--flexEnd">
-                                                    {!eachDomain.verified && (
-                                                        <button
-                                                            id={`verifyProjectDomain_${index}`}
-                                                            title="verify"
-                                                            className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
+                                                    {eachDomain.verified ? (
+                                                        <div
+                                                            className="bs-ObjectList-cell bs-u-v-middle"
                                                             style={{
-                                                                marginLeft: 20,
-                                                            }}
-                                                            type="button"
-                                                            onClick={() => {
-                                                                openModal({
-                                                                    id:
-                                                                        eachDomain._id,
-                                                                    content: ProjectVerifyDomain,
-                                                                    projectId,
-                                                                    verificationToken:
-                                                                        eachDomain.verificationToken,
-                                                                    domain:
-                                                                        eachDomain.domain,
-                                                                });
+                                                                display: 'flex',
+                                                                width: '10vw',
+                                                                whiteSpace:
+                                                                    'normal',
                                                             }}
                                                         >
-                                                            <span>Verify</span>
-                                                        </button>
-                                                    )}
-                                                    {eachDomain.verified && (
-                                                        <button
-                                                            id={`unVerifyProjectDomain_${index}`}
-                                                            title="unverify"
-                                                            className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
+                                                            <div className="bs-ObjectList-cell-row">
+                                                                {
+                                                                    eachDomain.domain
+                                                                }
+                                                            </div>
+                                                            <div
+                                                                style={{
+                                                                    marginLeft: 5,
+                                                                }}
+                                                                className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
+                                                            >
+                                                                <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
+                                                                    <span>
+                                                                        Verified
+                                                                    </span>
+                                                                </span>
+                                                            </div>
+                                                        </div>
+                                                    ) : (
+                                                        <div
+                                                            className="bs-ObjectList-cell bs-u-v-middle"
                                                             style={{
-                                                                marginLeft: 20,
-                                                            }}
-                                                            type="button"
-                                                            onClick={() => {
-                                                                openModal({
-                                                                    id:
-                                                                        eachDomain._id,
-                                                                    content: ProjectUnverifyDomain,
-                                                                    projectId,
-                                                                    verificationToken:
-                                                                        eachDomain.verificationToken,
-                                                                    domain:
-                                                                        eachDomain.domain,
-                                                                });
+                                                                display: 'flex',
+                                                                width: '10vw',
+                                                                whiteSpace:
+                                                                    'normal',
                                                             }}
                                                         >
-                                                            <span>
-                                                                Unverify
-                                                            </span>
-                                                        </button>
+                                                            <div className="bs-ObjectList-cell-row">
+                                                                {
+                                                                    eachDomain.domain
+                                                                }
+                                                            </div>
+                                                            <div
+                                                                style={{
+                                                                    marginLeft: 5,
+                                                                }}
+                                                                className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
+                                                            >
+                                                                <span className="Badge-text Text-color--red Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
+                                                                    <span>
+                                                                        Unverified
+                                                                    </span>
+                                                                </span>
+                                                            </div>
+                                                        </div>
                                                     )}
-                                                    <button
-                                                        id={`unVerifyProjectDomain_${index}`}
-                                                        title="reset"
-                                                        className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--settings"
-                                                        style={{
-                                                            marginLeft: 20,
-                                                        }}
-                                                        type="button"
-                                                        onClick={() => {
-                                                            openModal({
-                                                                id:
-                                                                    eachDomain._id,
-                                                                content: ProjectResetDomain,
-                                                                projectId,
-                                                                verificationToken:
-                                                                    eachDomain.verificationToken,
-                                                                domain:
-                                                                    eachDomain.domain,
-                                                            });
-                                                        }}
-                                                    >
-                                                        <span>Reset</span>
-                                                    </button>
-                                                    <button
-                                                        id={`deleteProjectDomain_${index}`}
-                                                        title="remove"
-                                                        className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--delete"
-                                                        style={{
-                                                            marginLeft: 20,
-                                                        }}
-                                                        type="button"
-                                                        onClick={() => {
-                                                            openModal({
-                                                                content: DataPathHoC(
-                                                                    DeleteDomain,
-                                                                    {
-                                                                        removeUserModalId: this
-                                                                            .state
-
-                                                                            .removeUserModalId,
-                                                                        domainId:
-                                                                            eachDomain._id,
+                                                    <div className="bs-ObjectList-cell bs-u-v-middle">
+                                                        <div className="Box-root Flex-flex Flex-justifyContent--flexEnd">
+                                                            {!eachDomain.verified && (
+                                                                <button
+                                                                    id={`verifyProjectDomain_${index}`}
+                                                                    title="verify"
+                                                                    className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
+                                                                    style={{
+                                                                        marginLeft: 20,
+                                                                    }}
+                                                                    type="button"
+                                                                    onClick={() => {
+                                                                        openModal(
+                                                                            {
+                                                                                id: eachDomain._id,
+                                                                                content:
+                                                                                    ProjectVerifyDomain,
+                                                                                projectId,
+                                                                                verificationToken:
+                                                                                    eachDomain.verificationToken,
+                                                                                domain: eachDomain.domain,
+                                                                            }
+                                                                        );
+                                                                    }}
+                                                                >
+                                                                    <span>
+                                                                        Verify
+                                                                    </span>
+                                                                </button>
+                                                            )}
+                                                            {eachDomain.verified && (
+                                                                <button
+                                                                    id={`unVerifyProjectDomain_${index}`}
+                                                                    title="unverify"
+                                                                    className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
+                                                                    style={{
+                                                                        marginLeft: 20,
+                                                                    }}
+                                                                    type="button"
+                                                                    onClick={() => {
+                                                                        openModal(
+                                                                            {
+                                                                                id: eachDomain._id,
+                                                                                content:
+                                                                                    ProjectUnverifyDomain,
+                                                                                projectId,
+                                                                                verificationToken:
+                                                                                    eachDomain.verificationToken,
+                                                                                domain: eachDomain.domain,
+                                                                            }
+                                                                        );
+                                                                    }}
+                                                                >
+                                                                    <span>
+                                                                        Unverify
+                                                                    </span>
+                                                                </button>
+                                                            )}
+                                                            <button
+                                                                id={`unVerifyProjectDomain_${index}`}
+                                                                title="reset"
+                                                                className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--settings"
+                                                                style={{
+                                                                    marginLeft: 20,
+                                                                }}
+                                                                type="button"
+                                                                onClick={() => {
+                                                                    openModal({
+                                                                        id: eachDomain._id,
+                                                                        content:
+                                                                            ProjectResetDomain,
                                                                         projectId,
-                                                                    }
-                                                                ),
-                                                            });
-                                                        }}
-                                                    >
-                                                        <span>Remove</span>
-                                                    </button>
+                                                                        verificationToken:
+                                                                            eachDomain.verificationToken,
+                                                                        domain: eachDomain.domain,
+                                                                    });
+                                                                }}
+                                                            >
+                                                                <span>
+                                                                    Reset
+                                                                </span>
+                                                            </button>
+                                                            <button
+                                                                id={`deleteProjectDomain_${index}`}
+                                                                title="remove"
+                                                                className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--delete"
+                                                                style={{
+                                                                    marginLeft: 20,
+                                                                }}
+                                                                type="button"
+                                                                onClick={() => {
+                                                                    openModal({
+                                                                        content:
+                                                                            DataPathHoC(
+                                                                                DeleteDomain,
+                                                                                {
+                                                                                    removeUserModalId:
+                                                                                        this
+                                                                                            .state
+                                                                                            .removeUserModalId,
+                                                                                    domainId:
+                                                                                        eachDomain._id,
+                                                                                    projectId,
+                                                                                }
+                                                                            ),
+                                                                    });
+                                                                }}
+                                                            >
+                                                                <span>
+                                                                    Remove
+                                                                </span>
+                                                            </button>
+                                                        </div>
+                                                    </div>
                                                 </div>
-                                            </div>
-                                        </div>
-                                    ))}
+                                            );
+                                        }
+                                    )}
                                 <ShouldRender
                                     if={
                                         !(
@@ -339,8 +352,8 @@ class ProjectDomain extends Component<ComponentProps> {
                             >
                                 <span>
                                     {(!domains || domains.length === 0) &&
-                                        !requesting &&
-                                        !error
+                                    !requesting &&
+                                    !error
                                         ? 'You have no domain at this time'
                                         : null}
                                 </span>
@@ -358,14 +371,11 @@ class ProjectDomain extends Component<ComponentProps> {
                                             id="customFieldCount"
                                             className="Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap"
                                         >
-
                                             {this.props.count
-
                                                 ? this.props.count +
-
-                                                (this.props.count > 1
-                                                    ? '  Domains'
-                                                    : ' Domain')
+                                                  (this.props.count > 1
+                                                      ? '  Domains'
+                                                      : ' Domain')
                                                 : '0 Domain'}
                                         </span>
                                     </span>
@@ -376,12 +386,12 @@ class ProjectDomain extends Component<ComponentProps> {
                                     <div className="Box-root Margin-right--8">
                                         <button
                                             id="btnPrevProjectDomains"
-                                            onClick={() =>
-                                                this.prevClicked(
+                                            onClick={() => {
+                                                return this.prevClicked(
                                                     projectId,
                                                     skip
-                                                )
-                                            }
+                                                );
+                                            }}
                                             className={
                                                 'Button bs-ButtonLegacy' +
                                                 (canPrev ? '' : 'Is--disabled')
@@ -400,12 +410,12 @@ class ProjectDomain extends Component<ComponentProps> {
                                     <div className="Box-root">
                                         <button
                                             id="btnNextProjectDomains"
-                                            onClick={() =>
-                                                this.nextClicked(
+                                            onClick={() => {
+                                                return this.nextClicked(
                                                     projectId,
                                                     skip
-                                                )
-                                            }
+                                                );
+                                            }}
                                             className={
                                                 'Button bs-ButtonLegacy' +
                                                 (canNext ? '' : 'Is--disabled')
@@ -431,18 +441,18 @@ class ProjectDomain extends Component<ComponentProps> {
     }
 }
 
-
 ProjectDomain.displayName = 'ProjectDomain';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    projectDomain: state.project.projectDomain,
-    requesting: state.project.projectDomain.requesting,
-    error: state.project.projectDomain.error,
-    count: state.project.projectDomain.count,
-    limit: state.project.projectDomain.limit,
-    skip: state.project.projectDomain.skip
-});
-
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        projectDomain: state.project.projectDomain,
+        requesting: state.project.projectDomain.requesting,
+        error: state.project.projectDomain.error,
+        count: state.project.projectDomain.count,
+        limit: state.project.projectDomain.limit,
+        skip: state.project.projectDomain.skip,
+    };
+};
 
 ProjectDomain.propTypes = {
     projectId: PropTypes.string,
@@ -459,6 +469,8 @@ ProjectDomain.propTypes = {
     requesting: PropTypes.bool,
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ fetchProjectDomains, openModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ fetchProjectDomains, openModal }, dispatch);
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectDomain);
diff --git a/AdminDashboard/src/Components/Project/ProjectList.tsx b/AdminDashboard/src/Components/Project/ProjectList.tsx
index cb9ca2fe69..7b8a57bb30 100644
--- a/AdminDashboard/src/Components/Project/ProjectList.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectList.tsx
@@ -6,64 +6,52 @@ import moment from 'moment';
 import { ListLoader } from '../basic/Loader';
 import { history, RootState } from '../../store';
 
-export class ProjectList extends Component<ComponentProps>{
+export class ProjectList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     override render() {
         if (
-
             this.props.projects &&
-
             this.props.projects.skip &&
-
             typeof this.props.projects.skip === 'string'
         ) {
-
             this.props.projects.skip = parseInt(this.props.projects.skip, 10);
         }
         if (
-
             this.props.projects &&
-
             this.props.projects.limit &&
-
             typeof this.props.projects.limit === 'string'
         ) {
-
             this.props.projects.limit = parseInt(this.props.projects.limit, 10);
         }
 
-        if (!this.props.projects.skip) this.props.projects.skip = 0;
+        if (!this.props.projects.skip) {
+            this.props.projects.skip = 0;
+        }
 
-        if (!this.props.projects.limit) this.props.projects.limit = 0;
+        if (!this.props.projects.limit) {
+            this.props.projects.limit = 0;
+        }
 
         let canNext =
-
             this.props.projects &&
-
-                this.props.projects.count &&
-
-                this.props.projects.count >
-
+            this.props.projects.count &&
+            this.props.projects.count >
                 this.props.projects.skip + this.props.projects.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.projects && this.props.projects.skip <= 0 ? false : true;
 
         if (
-
             this.props.projects &&
-
             (this.props.requesting || !this.props.projects.projects)
         ) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.projects && this.props.projects.count) / 10
         );
         return (
@@ -152,7 +140,6 @@ export class ProjectList extends Component<ComponentProps>{
                                 </td>
                                 <td
                                     id="overflow"
-
                                     type="action"
                                     className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
                                     style={{ height: '1px' }}
@@ -164,7 +151,6 @@ export class ProjectList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -185,18 +171,18 @@ export class ProjectList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.projects &&
-
-                                this.props.projects.projects &&
-
-                                this.props.projects.projects.length > 0 ? (
-
+                              this.props.projects.projects &&
+                              this.props.projects.projects.length > 0 ? (
                                 this.props.projects.projects.map(
                                     (project: $TSFixMe, index: $TSFixMe) => {
                                         const projectOwner: $TSFixMe =
                                             project.users.find(
-                                                (user: $TSFixMe) => user.role === 'Owner'
+                                                (user: $TSFixMe) => {
+                                                    return (
+                                                        user.role === 'Owner'
+                                                    );
+                                                }
                                             ) || project.users.length > 0
                                                 ? project.users[0]
                                                 : {};
@@ -209,9 +195,11 @@ export class ProjectList extends Component<ComponentProps>{
                                             ) {
                                                 usersDetail = `${projectOwner.name} and 1 other`;
                                             } else {
-                                                usersDetail = `${projectOwner.name
-                                                    } and ${project.users.length -
-                                                    1} others`;
+                                                usersDetail = `${
+                                                    projectOwner.name
+                                                } and ${
+                                                    project.users.length - 1
+                                                } others`;
                                             }
                                         } else {
                                             usersDetail = 'Not Added Yet';
@@ -225,7 +213,7 @@ export class ProjectList extends Component<ComponentProps>{
                                                 onClick={() => {
                                                     history.push(
                                                         '/admin/projects/' +
-                                                        project.slug
+                                                            project.slug
                                                     );
                                                 }}
                                             >
@@ -391,21 +379,15 @@ export class ProjectList extends Component<ComponentProps>{
                     </table>
                 </div>
                 <div style={{ textAlign: 'center', marginTop: '10px' }}>
-
                     {this.props.projects &&
-
-                        (!this.props.projects.projects ||
-
-                            !this.props.projects.projects.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.projects.error
+                    (!this.props.projects.projects ||
+                        !this.props.projects.projects.length) &&
+                    !this.props.requesting &&
+                    !this.props.projects.error
                         ? "We don't have any projects yet"
                         : null}
 
                     {this.props.projects && this.props.projects.error
-
                         ? this.props.projects.error
                         : null}
                 </div>
@@ -415,33 +397,29 @@ export class ProjectList extends Component<ComponentProps>{
                             <span>
                                 <span className="Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
                                     {numberOfPages > 0
-                                        ? `Page ${this.props.page
-                                        } of ${numberOfPages} (${this.props
-
-                                            .projects &&
-
-                                        this.props.projects
-                                            .count} Project${this.props.projects &&
-
-                                                this.props.projects.count === 1
-                                                ? ''
-                                                : 's'
-                                        })`
-
+                                        ? `Page ${
+                                              this.props.page
+                                          } of ${numberOfPages} (${
+                                              this.props.projects &&
+                                              this.props.projects.count
+                                          } Project${
+                                              this.props.projects &&
+                                              this.props.projects.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          })`
                                         : this.props.projects &&
-
-                                            this.props.projects.count
-
-                                            ? `${this.props.projects &&
-
-                                            this.props.projects
-                                                .count} Project${this.props.projects &&
-
-                                                    this.props.projects.count === 1
-                                                    ? ''
-                                                    : 's'
-                                            }`
-                                            : null}
+                                          this.props.projects.count
+                                        ? `${
+                                              this.props.projects &&
+                                              this.props.projects.count
+                                          } Project${
+                                              this.props.projects &&
+                                              this.props.projects.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          }`
+                                        : null}
                                 </span>
                             </span>
                         </span>
@@ -452,9 +430,7 @@ export class ProjectList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.projects.skip,
 
                                             this.props.projects.limit
@@ -479,9 +455,7 @@ export class ProjectList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.projects.skip,
 
                                             this.props.projects.limit
@@ -520,10 +494,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 ProjectList.displayName = 'ProjectList';
 
-
 ProjectList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/Project/ProjectRemoveUserModal.tsx b/AdminDashboard/src/Components/Project/ProjectRemoveUserModal.tsx
index c300a3674c..472f4740d3 100644
--- a/AdminDashboard/src/Components/Project/ProjectRemoveUserModal.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectRemoveUserModal.tsx
@@ -10,7 +10,6 @@ import ShouldRender from '../basic/ShouldRender';
 import { FormLoader } from '../basic/Loader';
 
 class ProjectRemoveUserModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -23,7 +22,6 @@ class ProjectRemoveUserModal extends Component<ComponentProps> {
     }
 
     handleKeyBoard = (e: $TSFixMe) => {
-
         const { data, resetTeamDelete }: $TSFixMe = this.props;
         switch (e.key) {
             case 'Escape':
@@ -37,16 +35,13 @@ class ProjectRemoveUserModal extends Component<ComponentProps> {
     };
 
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.data.removeUserModalId,
         });
     };
 
     override render() {
         const {
-
             teamUserDelete,
 
             closeModal,
@@ -115,11 +110,11 @@ class ProjectRemoveUserModal extends Component<ComponentProps> {
                                             className="bs-Button bs-DeprecatedButton bs-Button--red btn__modal"
                                             disabled={deleting}
                                             type="button"
-                                            onClick={() =>
-                                                data.removeTeamMember(
+                                            onClick={() => {
+                                                return data.removeTeamMember(
                                                     data.values
-                                                )
-                                            }
+                                                );
+                                            }}
                                             autoFocus={true}
                                         >
                                             {!deleting && (
@@ -143,7 +138,6 @@ class ProjectRemoveUserModal extends Component<ComponentProps> {
     }
 }
 
-
 ProjectRemoveUserModal.displayName = 'ProjectRemoveUserModal';
 
 const mapStateToProps: Function = (state: RootState, props: $TSFixMe) => {
@@ -153,7 +147,9 @@ const mapStateToProps: Function = (state: RootState, props: $TSFixMe) => {
             : null;
     return {
         teamUserDelete: state.project.teamDelete,
-        deleting: state.project.teamDelete.deleting.some((id: $TSFixMe) => id === userId),
+        deleting: state.project.teamDelete.deleting.some((id: $TSFixMe) => {
+            return id === userId;
+        }),
     };
 };
 
@@ -161,7 +157,6 @@ const mapDispatchToProps: Function = (dispatch: Dispatch) => {
     return bindActionCreators({ closeModal, resetTeamDelete }, dispatch);
 };
 
-
 ProjectRemoveUserModal.propTypes = {
     closeModal: PropTypes.func,
     data: PropTypes.object,
diff --git a/AdminDashboard/src/Components/Project/ProjectResetDomain.tsx b/AdminDashboard/src/Components/Project/ProjectResetDomain.tsx
index f84c1cb5a4..dfd829b80a 100644
--- a/AdminDashboard/src/Components/Project/ProjectResetDomain.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectResetDomain.tsx
@@ -14,12 +14,10 @@ import {
 } from '../../actions/project';
 
 class ProjectResetDomain extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override componentDidMount() {
-
         this.props.resetProjectDomainOnMount();
         window.addEventListener('keydown', this.handleKeyBoard);
     }
@@ -36,16 +34,13 @@ class ProjectResetDomain extends Component<ComponentProps> {
     };
 
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.domainId,
         });
     };
 
     handleResetDomain = () => {
         const {
-
             resetProjectDomain,
 
             fetchProjectDomains,
@@ -55,7 +50,6 @@ class ProjectResetDomain extends Component<ComponentProps> {
             domainId,
         } = this.props;
         resetProjectDomain(projectId, domainId).then(() => {
-
             if (!this.props.resetError) {
                 fetchProjectDomains(projectId, 0, 10);
                 this.handleCloseModal();
@@ -64,7 +58,6 @@ class ProjectResetDomain extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { requesting, resetError }: $TSFixMe = this.props;
         return (
             <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -125,8 +118,7 @@ class ProjectResetDomain extends Component<ComponentProps> {
                                                         <div className="Box-root">
                                                             <span
                                                                 style={{
-                                                                    color:
-                                                                        'red',
+                                                                    color: 'red',
                                                                 }}
                                                             >
                                                                 {resetError}
@@ -145,8 +137,10 @@ class ProjectResetDomain extends Component<ComponentProps> {
                                         >
                                             <button
                                                 id="cancelVerifyDomain"
-                                                className={`bs-Button btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 type="button"
                                                 disabled={requesting}
                                                 onClick={this.handleCloseModal}
@@ -158,8 +152,10 @@ class ProjectResetDomain extends Component<ComponentProps> {
                                             </button>
                                             <button
                                                 id="confirmVerifyDomain"
-                                                className={`bs-Button bs-Button--blue btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button bs-Button--blue btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 onClick={this.handleResetDomain}
                                                 disabled={requesting}
                                                 autoFocus={true}
@@ -187,10 +183,8 @@ class ProjectResetDomain extends Component<ComponentProps> {
     }
 }
 
-
 ProjectResetDomain.displayName = 'ProjectResetDomain';
 
-
 ProjectResetDomain.propTypes = {
     closeModal: PropTypes.func,
     resetProjectDomain: PropTypes.func,
@@ -205,22 +199,26 @@ ProjectResetDomain.propTypes = {
     resetProjectDomainOnMount: PropTypes.func,
 };
 
-const mapStateToProps: Function = (state: RootState) => ({
-    domainId: state.modal.modals[0].id,
-    domain: state.modal.modals[0].domain,
-    projectId: state.modal.modals[0].projectId,
-    requesting: state.project.resetDomain.requesting,
-    resetError: state.project.resetDomain.error
-});
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        domainId: state.modal.modals[0].id,
+        domain: state.modal.modals[0].domain,
+        projectId: state.modal.modals[0].projectId,
+        requesting: state.project.resetDomain.requesting,
+        resetError: state.project.resetDomain.error,
+    };
+};
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        closeModal,
-        resetProjectDomain,
-        fetchProjectDomains,
-        resetProjectDomainOnMount,
-    },
-    dispatch
-);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            closeModal,
+            resetProjectDomain,
+            fetchProjectDomains,
+            resetProjectDomainOnMount,
+        },
+        dispatch
+    );
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectResetDomain);
diff --git a/AdminDashboard/src/Components/Project/ProjectRestoreBox.tsx b/AdminDashboard/src/Components/Project/ProjectRestoreBox.tsx
index 8ebcc3445c..11f4a3b186 100644
--- a/AdminDashboard/src/Components/Project/ProjectRestoreBox.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectRestoreBox.tsx
@@ -7,7 +7,7 @@ import ShouldRender from '../basic/ShouldRender';
 import { restoreProject } from '../../actions/project';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class ProjectRestoreBox extends Component<ComponentProps>{
+export class ProjectRestoreBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -16,13 +16,11 @@ export class ProjectRestoreBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { restoreProject, project }: $TSFixMe = this.props;
         return restoreProject(project._id);
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -67,10 +65,14 @@ export class ProjectRestoreBox extends Component<ComponentProps>{
     }
 }
 
-
 ProjectRestoreBox.displayName = 'ProjectRestoreBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ restoreProject, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { restoreProject, openModal, closeModal },
+        dispatch
+    );
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const project: $TSFixMe = state.project.project.project;
@@ -83,14 +85,12 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectRestoreBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     project: PropTypes.object.isRequired,
     restoreProject: PropTypes.func.isRequired,
 };
 
-
 ProjectRestoreBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectRestoreBox);
diff --git a/AdminDashboard/src/Components/Project/ProjectUnblockBox.tsx b/AdminDashboard/src/Components/Project/ProjectUnblockBox.tsx
index 4fa286ac3c..bc2a69f012 100644
--- a/AdminDashboard/src/Components/Project/ProjectUnblockBox.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectUnblockBox.tsx
@@ -7,7 +7,7 @@ import ShouldRender from '../basic/ShouldRender';
 import { unblockProject } from '../../actions/project';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class ProjectUnblockBox extends Component<ComponentProps>{
+export class ProjectUnblockBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -16,13 +16,11 @@ export class ProjectUnblockBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { unblockProject, project }: $TSFixMe = this.props;
         return unblockProject(project._id);
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -67,10 +65,14 @@ export class ProjectUnblockBox extends Component<ComponentProps>{
     }
 }
 
-
 ProjectUnblockBox.displayName = 'ProjectUnblockBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ unblockProject, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { unblockProject, openModal, closeModal },
+        dispatch
+    );
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const project: $TSFixMe = state.project.project.project;
@@ -83,14 +85,12 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 ProjectUnblockBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     project: PropTypes.object.isRequired,
     unblockProject: PropTypes.func.isRequired,
 };
 
-
 ProjectUnblockBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(ProjectUnblockBox);
diff --git a/AdminDashboard/src/Components/Project/ProjectUnverifyDomain.tsx b/AdminDashboard/src/Components/Project/ProjectUnverifyDomain.tsx
index c85cde1f26..a9bb582aea 100644
--- a/AdminDashboard/src/Components/Project/ProjectUnverifyDomain.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectUnverifyDomain.tsx
@@ -14,19 +14,15 @@ import {
 } from '../../actions/project';
 
 class ProjectUnverifyDomain extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override componentDidMount() {
-
         this.props.resetUnverifyProjectDomain();
         window.addEventListener('keydown', this.handleKeyBoard);
     }
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.domainId,
         });
     };
@@ -44,7 +40,6 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
 
     handleUnverifyDomain = async () => {
         const {
-
             projectId,
 
             domainId,
@@ -64,7 +59,6 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { requesting, unverifyError }: $TSFixMe = this.props;
         return (
             <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -130,8 +124,7 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
                                                         <div className="Box-root">
                                                             <span
                                                                 style={{
-                                                                    color:
-                                                                        'red',
+                                                                    color: 'red',
                                                                 }}
                                                             >
                                                                 {unverifyError}
@@ -150,8 +143,10 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
                                         >
                                             <button
                                                 id="cancelVerifyDomain"
-                                                className={`bs-Button btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 type="button"
                                                 disabled={requesting}
                                                 onClick={this.handleCloseModal}
@@ -163,8 +158,10 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
                                             </button>
                                             <button
                                                 id="confirmVerifyDomain"
-                                                className={`bs-Button bs-Button--blue btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button bs-Button--blue btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 onClick={
                                                     this.handleUnverifyDomain
                                                 }
@@ -194,26 +191,28 @@ class ProjectUnverifyDomain extends Component<ComponentProps> {
     }
 }
 
-
 ProjectUnverifyDomain.displayName = 'ProjectUnverifyDomain';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    requesting: state.project.unverifyDomain.requesting,
-    unverifyError: state.project.unverifyDomain.error,
-    domainId: state.modal.modals[0].id,
-    projectId: state.modal.modals[0].projectId
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        closeModal,
-        unVerifyProjectDomain,
-        fetchProjectDomains,
-        resetUnverifyProjectDomain,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        requesting: state.project.unverifyDomain.requesting,
+        unverifyError: state.project.unverifyDomain.error,
+        domainId: state.modal.modals[0].id,
+        projectId: state.modal.modals[0].projectId,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            closeModal,
+            unVerifyProjectDomain,
+            fetchProjectDomains,
+            resetUnverifyProjectDomain,
+        },
+        dispatch
+    );
+};
 
 ProjectUnverifyDomain.propTypes = {
     closeModal: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Project/ProjectUpgrade.tsx b/AdminDashboard/src/Components/Project/ProjectUpgrade.tsx
index f3c9266781..8dc0e9160e 100644
--- a/AdminDashboard/src/Components/Project/ProjectUpgrade.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectUpgrade.tsx
@@ -14,7 +14,6 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.text(values.planId)) {
-
         errors.name = 'Stripe PlanID is required!';
     }
 
@@ -22,7 +21,6 @@ function validate(values: $TSFixMe) {
 }
 
 class ProjectUpgrade extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -37,8 +35,14 @@ class ProjectUpgrade extends Component<ComponentProps> {
         };
         this.plansArr = PricingPlan.getPlans();
 
-        this.getPlansFromToggle = (planDuration: $TSFixMe, plansArr: $TSFixMe) =>
-            plansArr.filter((plan: $TSFixMe) => plan.type === planDuration);
+        this.getPlansFromToggle = (
+            planDuration: $TSFixMe,
+            plansArr: $TSFixMe
+        ) => {
+            return plansArr.filter((plan: $TSFixMe) => {
+                return plan.type === planDuration;
+            });
+        };
 
         this.state = {
             isAnnual: true,
@@ -51,9 +55,7 @@ class ProjectUpgrade extends Component<ComponentProps> {
     }
 
     shouldTogglePlans = (prevstate: RootState) => {
-
         if (this.state.isAnnual !== prevState.isAnnual) {
-
             if (this.state.isAnnual) {
                 this.setState({
                     plans: this.getPlansFromToggle('annual', this.plansArr),
@@ -67,12 +69,12 @@ class ProjectUpgrade extends Component<ComponentProps> {
     };
 
     handlePlanToggle = () => {
-
-        this.setState(prevState => ({ isAnnual: !prevState.isAnnual }));
+        this.setState(prevState => {
+            return { isAnnual: !prevState.isAnnual };
+        });
     };
 
     submit = (values: $TSFixMe) => {
-
         const { project, changePlan }: $TSFixMe = this.props;
         let oldPlan, newPlan;
         const { _id, name, stripePlanId }: $TSFixMe = project;
@@ -86,7 +88,6 @@ class ProjectUpgrade extends Component<ComponentProps> {
             oldPlan = this.enterprisePlan.category;
 
             const {
-
                 category: newCategory,
 
                 type: newType,
@@ -96,7 +97,6 @@ class ProjectUpgrade extends Component<ComponentProps> {
             newPlan = `${newCategory} ${newType}ly (${newDetails})`;
         } else {
             const {
-
                 category: oldCategory,
 
                 type: oldType,
@@ -106,7 +106,6 @@ class ProjectUpgrade extends Component<ComponentProps> {
             oldPlan = `${oldCategory} ${oldType}ly (${oldDetails})`;
 
             const {
-
                 category: newCategory,
 
                 type: newType,
@@ -121,8 +120,8 @@ class ProjectUpgrade extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { handleSubmit, isRequesting, error, activeForm }: $TSFixMe = this.props;
+        const { handleSubmit, isRequesting, error, activeForm }: $TSFixMe =
+            this.props;
 
         const { isAnnual, plans }: $TSFixMe = this.state;
 
@@ -160,9 +159,9 @@ class ProjectUpgrade extends Component<ComponentProps> {
                                         <input
                                             className="btn-toggler"
                                             type="checkbox"
-                                            onChange={() =>
-                                                this.handlePlanToggle()
-                                            }
+                                            onChange={() => {
+                                                return this.handlePlanToggle();
+                                            }}
                                             name="planDuration"
                                             id="planDuration"
                                             checked={isAnnual}
@@ -179,63 +178,70 @@ class ProjectUpgrade extends Component<ComponentProps> {
                                         <fieldset className="bs-Fieldset">
                                             <div className="bs-Fieldset-rows">
                                                 <div className="price-list-4c Margin-all--16">
-                                                    {plans.map((plan: $TSFixMe) => <label
-                                                        key={plan.planId}
-                                                        htmlFor={`${plan.category}_${plan.type}`}
-                                                        style={{
-                                                            cursor:
-                                                                'pointer',
-                                                        }}
-                                                    >
-                                                        <div
-                                                            className={`bs-Fieldset-fields Flex-justifyContent--center price-list-item Box-background--white ${activeForm ===
-                                                                plan.planId
-                                                                ? 'price-list-item--active'
-                                                                : ''
-                                                                }`}
-                                                            style={{
-                                                                flex: 1,
-                                                                padding: 0,
-                                                            }}
-                                                        >
-                                                            <span className="Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--24 Text-typeface--base Text-wrap--wrap">
-                                                                <span
+                                                    {plans.map(
+                                                        (plan: $TSFixMe) => {
+                                                            return (
+                                                                <label
+                                                                    key={
+                                                                        plan.planId
+                                                                    }
+                                                                    htmlFor={`${plan.category}_${plan.type}`}
                                                                     style={{
-                                                                        marginBottom:
-                                                                            '4px',
+                                                                        cursor: 'pointer',
                                                                     }}
                                                                 >
-                                                                    {
-                                                                        plan.category
-                                                                    }{' '}
-                                                                    {plan.type ===
-                                                                        'month'
-                                                                        ? 'Monthly'
-                                                                        : 'Yearly'}{' '}
-                                                                    Plan
-                                                                </span>
-                                                            </span>
-                                                            <RadioInput
-                                                                id={`${plan.category}_${plan.type}`}
-                                                                details={
-                                                                    plan.details
-                                                                }
-                                                                value={
-                                                                    plan.planId
-                                                                }
-                                                                style={{
-                                                                    display:
-                                                                        'flex',
-                                                                    alignItems:
-                                                                        'center',
-                                                                    justifyContent:
-                                                                        'center',
-                                                                    color:
-                                                                        '#4c4c4c',
-                                                                }}
-                                                            />
-                                                        </div>
-                                                    </label>)}
+                                                                    <div
+                                                                        className={`bs-Fieldset-fields Flex-justifyContent--center price-list-item Box-background--white ${
+                                                                            activeForm ===
+                                                                            plan.planId
+                                                                                ? 'price-list-item--active'
+                                                                                : ''
+                                                                        }`}
+                                                                        style={{
+                                                                            flex: 1,
+                                                                            padding: 0,
+                                                                        }}
+                                                                    >
+                                                                        <span className="Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--24 Text-typeface--base Text-wrap--wrap">
+                                                                            <span
+                                                                                style={{
+                                                                                    marginBottom:
+                                                                                        '4px',
+                                                                                }}
+                                                                            >
+                                                                                {
+                                                                                    plan.category
+                                                                                }{' '}
+                                                                                {plan.type ===
+                                                                                'month'
+                                                                                    ? 'Monthly'
+                                                                                    : 'Yearly'}{' '}
+                                                                                Plan
+                                                                            </span>
+                                                                        </span>
+                                                                        <RadioInput
+                                                                            id={`${plan.category}_${plan.type}`}
+                                                                            details={
+                                                                                plan.details
+                                                                            }
+                                                                            value={
+                                                                                plan.planId
+                                                                            }
+                                                                            style={{
+                                                                                display:
+                                                                                    'flex',
+                                                                                alignItems:
+                                                                                    'center',
+                                                                                justifyContent:
+                                                                                    'center',
+                                                                                color: '#4c4c4c',
+                                                                            }}
+                                                                        />
+                                                                    </div>
+                                                                </label>
+                                                            );
+                                                        }
+                                                    )}
                                                     <label
                                                         htmlFor={
                                                             this.enterprisePlan
@@ -246,11 +252,12 @@ class ProjectUpgrade extends Component<ComponentProps> {
                                                         }}
                                                     >
                                                         <div
-                                                            className={`bs-Fieldset-fields Flex-justifyContent--center price-list-item Box-background--white ${activeForm ===
+                                                            className={`bs-Fieldset-fields Flex-justifyContent--center price-list-item Box-background--white ${
+                                                                activeForm ===
                                                                 'enterprise'
-                                                                ? 'price-list-item--active'
-                                                                : ''
-                                                                }`}
+                                                                    ? 'price-list-item--active'
+                                                                    : ''
+                                                            }`}
                                                             style={{
                                                                 flex: 1,
                                                                 padding: 0,
@@ -274,16 +281,14 @@ class ProjectUpgrade extends Component<ComponentProps> {
                                                             <div
                                                                 className="bs-Fieldset-field"
                                                                 style={{
-                                                                    width:
-                                                                        '100%',
+                                                                    width: '100%',
                                                                     display:
                                                                         'flex',
                                                                     alignItems:
                                                                         'center',
                                                                     justifyContent:
                                                                         'center',
-                                                                    color:
-                                                                        '#4c4c4c',
+                                                                    color: '#4c4c4c',
                                                                 }}
                                                             >
                                                                 <Field
@@ -364,10 +369,8 @@ class ProjectUpgrade extends Component<ComponentProps> {
     }
 }
 
-
 ProjectUpgrade.displayName = 'Project Upgrade';
 
-
 ProjectUpgrade.propTypes = {
     handleSubmit: PropTypes.func.isRequired,
     isRequesting: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/Project/ProjectUserAddModal.tsx b/AdminDashboard/src/Components/Project/ProjectUserAddModal.tsx
index 898f5ec9bf..b61939bba5 100644
--- a/AdminDashboard/src/Components/Project/ProjectUserAddModal.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectUserAddModal.tsx
@@ -28,14 +28,13 @@ function validate(values: $TSFixMe) {
     values.emails = values.emails ? values.emails.replace(/\s/g, '') : '';
     const emails: $TSFixMe = values.emails ? values.emails.split(',') : [];
     if (!Validate.isValidBusinessEmails(emails)) {
-
         errors.emails = 'Please enter business emails of the members.';
     }
 
     return errors;
 }
 
-export class FormModal extends Component<ComponentProps>{
+export class FormModal extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -66,10 +65,10 @@ export class FormModal extends Component<ComponentProps>{
             this.showMessageBox();
         }
         userCreate(data.projectId, values).then(
-            function () {
+            () => {
                 closeThisDialog();
             },
-            function () {
+            () => {
                 //do nothing.
             }
         );
@@ -78,11 +77,9 @@ export class FormModal extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 this.props.closeThisDialog();
                 return true;
             case 'Enter':
-
                 return document
 
                     .getElementById(`btn_modal_${this.props.data.projectName}`)
@@ -92,10 +89,8 @@ export class FormModal extends Component<ComponentProps>{
         }
     };
 
-    showMessageBox = () =>
-
-        this.props.openModal({
-
+    showMessageBox = () => {
+        return this.props.openModal({
             id: this.state.messageModalId,
             content: DataPathHoC(MessageBox, {
                 message: (
@@ -117,14 +112,13 @@ export class FormModal extends Component<ComponentProps>{
                 messageBoxId: this.state.messageModalId,
             }),
         });
+    };
 
     override render() {
-
         const { handleSubmit, closeThisDialog, data }: $TSFixMe = this.props;
         return (
             <div
                 className="ModalLayer-contents"
-
                 tabIndex="-1"
                 style={{ marginTop: '40px' }}
             >
@@ -133,7 +127,6 @@ export class FormModal extends Component<ComponentProps>{
                         <ClickOutside onClickOutside={closeThisDialog}>
                             <form
                                 id={`frm_${data.projectName}`}
-
                                 lpformnum="2"
                                 onSubmit={handleSubmit(this.submitForm)}
                             >
@@ -194,10 +187,8 @@ export class FormModal extends Component<ComponentProps>{
                                                                                     RenderField
                                                                                 }
                                                                                 style={{
-                                                                                    border:
-                                                                                        '0px',
-                                                                                    width:
-                                                                                        '100%',
+                                                                                    border: '0px',
+                                                                                    width: '100%',
                                                                                 }}
                                                                                 autoFocus={
                                                                                     true
@@ -423,7 +414,6 @@ export class FormModal extends Component<ComponentProps>{
                                         style={{ width: '100%' }}
                                     >
                                         <ShouldRender
-
                                             if={this.props.createUser.error}
                                         >
                                             <div className="bs-Tail-copy">
@@ -444,7 +434,6 @@ export class FormModal extends Component<ComponentProps>{
                                                         >
                                                             {
                                                                 this.props
-
                                                                     .createUser
                                                                     .error
                                                             }
@@ -473,13 +462,11 @@ export class FormModal extends Component<ComponentProps>{
                                                 id={`btn_modal_${data.projectName}`}
                                                 className="bs-Button bs-DeprecatedButton bs-Button--blue btn__modal"
                                                 disabled={
-
                                                     this.props.createUser
                                                         .requesting
                                                 }
                                                 type="submit"
                                             >
-
                                                 {this.props.createUser
                                                     .requesting ? (
                                                     <FormLoader />
@@ -504,7 +491,6 @@ export class FormModal extends Component<ComponentProps>{
     }
 }
 
-
 FormModal.displayName = 'InviteMemberFormModal';
 
 const ProjectUserAddModal: $TSFixMe = reduxForm({
@@ -525,7 +511,6 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 FormModal.propTypes = {
     handleSubmit: PropTypes.func.isRequired,
     createUser: PropTypes.object.isRequired,
diff --git a/AdminDashboard/src/Components/Project/ProjectUsers.tsx b/AdminDashboard/src/Components/Project/ProjectUsers.tsx
index 08f1b5f897..3f4ca596d6 100644
--- a/AdminDashboard/src/Components/Project/ProjectUsers.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectUsers.tsx
@@ -24,7 +24,6 @@ import { TeamListLoader } from '../basic/Loader';
 import DropDownMenu from '../basic/DropDownMenu';
 
 class ProjectUser extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -36,14 +35,14 @@ class ProjectUser extends Component<ComponentProps> {
         };
     }
     handleClick = () => {
-
         const { addUserId }: $TSFixMe = this.state;
 
         this.props.openModal({
             id: addUserId,
-            onConfirm: () => true,
+            onConfirm: () => {
+                return true;
+            },
             content: DataPathHoC(ProjectUserAddModal, {
-
                 projectId: this.props.projectId,
 
                 projectName: this.props.projectName,
@@ -56,18 +55,18 @@ class ProjectUser extends Component<ComponentProps> {
         data.teamMemberId = values.userId;
         if (values.role === to) {
             return;
-        } else {
-
-            data.role = to;
         }
 
-        const { projectId, changeUserProjectRole, userUpdateRole }: $TSFixMe = this.props;
-        userUpdateRole(projectId, data).then((team: $TSFixMe) => changeUserProjectRole(team.data)
-        );
+        data.role = to;
+
+        const { projectId, changeUserProjectRole, userUpdateRole }: $TSFixMe =
+            this.props;
+        userUpdateRole(projectId, data).then((team: $TSFixMe) => {
+            return changeUserProjectRole(team.data);
+        });
     };
     removeTeamMember = (values: $TSFixMe) => {
         const {
-
             resetTeamDelete,
 
             teamDelete,
@@ -80,20 +79,19 @@ class ProjectUser extends Component<ComponentProps> {
             if (!value.error) {
                 resetTeamDelete();
                 return closeModal({
-
                     id: this.state.removeUserModalId,
                 });
-            } else return null;
+            }
+            return null;
         });
     };
     renderTable = () => {
+        const { handleSubmit, updateUsers, pages, membersPerPage }: $TSFixMe =
+            this.props;
 
-        const { handleSubmit, updateUsers, pages, membersPerPage }: $TSFixMe = this.props;
-
-        return this.props.users &&
-
+        return (
+            this.props.users &&
             this.props.users.teamMembers &&
-
             this.props.users.teamMembers.map((user: $TSFixMe, i: $TSFixMe) => {
                 if (
                     i >= pages * membersPerPage - membersPerPage &&
@@ -131,8 +129,9 @@ class ProjectUser extends Component<ComponentProps> {
                             </div>
                             <div className="bs-ObjectList-cell bs-u-v-middle">
                                 <div
-                                    id={`${user.role}_${user.email.split('@')[0]
-                                        }`}
+                                    id={`${user.role}_${
+                                        user.email.split('@')[0]
+                                    }`}
                                     className="bs-ObjectList-cell-row"
                                 >
                                     {user.role}
@@ -144,9 +143,9 @@ class ProjectUser extends Component<ComponentProps> {
                                         <span>
                                             {user && user.name
                                                 ? 'Online ' +
-                                                moment(
-                                                    user && user.lastActive
-                                                ).fromNow()
+                                                  moment(
+                                                      user && user.lastActive
+                                                  ).fromNow()
                                                 : 'Invitation Sent'}
                                         </span>
                                     </span>
@@ -159,7 +158,7 @@ class ProjectUser extends Component<ComponentProps> {
                                         if={
                                             !(
                                                 User.getUserId() ===
-                                                user.userId &&
+                                                    user.userId &&
                                                 user.role === 'Owner'
                                             )
                                         }
@@ -182,8 +181,7 @@ class ProjectUser extends Component<ComponentProps> {
                                                             show: true,
                                                         },
                                                         {
-                                                            value:
-                                                                'Administrator',
+                                                            value: 'Administrator',
                                                             show: true,
                                                         },
                                                         {
@@ -196,18 +194,19 @@ class ProjectUser extends Component<ComponentProps> {
                                                         },
                                                     ]}
                                                     value={'Change Role'}
-                                                    id={`changeRole_${user.email.split('@')[0]
-                                                        }`}
+                                                    id={`changeRole_${
+                                                        user.email.split('@')[0]
+                                                    }`}
                                                     title="Change Role"
-                                                    updateState={(val: $TSFixMe) => {
+                                                    updateState={(
+                                                        val: $TSFixMe
+                                                    ) => {
                                                         switch (val) {
                                                             case 'Owner':
                                                                 this.updateTeamMemberRole(
                                                                     {
-                                                                        role:
-                                                                            user.role,
-                                                                        userId:
-                                                                            user.userId,
+                                                                        role: user.role,
+                                                                        userId: user.userId,
                                                                     },
                                                                     'Owner'
                                                                 );
@@ -215,10 +214,8 @@ class ProjectUser extends Component<ComponentProps> {
                                                             case 'Administrator':
                                                                 this.updateTeamMemberRole(
                                                                     {
-                                                                        role:
-                                                                            user.role,
-                                                                        userId:
-                                                                            user.userId,
+                                                                        role: user.role,
+                                                                        userId: user.userId,
                                                                     },
                                                                     'Administrator'
                                                                 );
@@ -226,10 +223,8 @@ class ProjectUser extends Component<ComponentProps> {
                                                             case 'Member':
                                                                 this.updateTeamMemberRole(
                                                                     {
-                                                                        role:
-                                                                            user.role,
-                                                                        userId:
-                                                                            user.userId,
+                                                                        role: user.role,
+                                                                        userId: user.userId,
                                                                     },
                                                                     'Member'
                                                                 );
@@ -237,10 +232,8 @@ class ProjectUser extends Component<ComponentProps> {
                                                             case 'Viewer':
                                                                 this.updateTeamMemberRole(
                                                                     {
-                                                                        role:
-                                                                            user.role,
-                                                                        userId:
-                                                                            user.userId,
+                                                                        role: user.role,
+                                                                        userId: user.userId,
                                                                     },
                                                                     'Viewer'
                                                                 );
@@ -274,37 +267,42 @@ class ProjectUser extends Component<ComponentProps> {
                                                 </button>
                                             </ShouldRender>
                                             <button
-                                                id={`removeMember__${user.email.split('@')[0]
-                                                    }`}
+                                                id={`removeMember__${
+                                                    user.email.split('@')[0]
+                                                }`}
                                                 title="delete"
                                                 disabled={false}
                                                 className="bs-Button bs-DeprecatedButton Margin-left--8"
                                                 type="button"
-
-                                                onClick={handleSubmit((values: $TSFixMe) => this.props.openModal({
-                                                    id: this.state
-
-                                                        .removeUserModalId,
-                                                    content: DataPathHoC(
-                                                        ProjectRemoveUserModal,
-                                                        {
-                                                            removeUserModalId: this
-                                                                .state
-
-                                                                .removeUserModalId,
-                                                            values: {
-                                                                ...values,
-                                                                userId:
-                                                                    user.userId,
-                                                            },
-                                                            displayName:
-                                                                user.name ||
-                                                                user.email,
-                                                            removeTeamMember: this
-                                                                .removeTeamMember,
-                                                        }
-                                                    ),
-                                                })
+                                                onClick={handleSubmit(
+                                                    (values: $TSFixMe) => {
+                                                        return this.props.openModal(
+                                                            {
+                                                                id: this.state
+                                                                    .removeUserModalId,
+                                                                content:
+                                                                    DataPathHoC(
+                                                                        ProjectRemoveUserModal,
+                                                                        {
+                                                                            removeUserModalId:
+                                                                                this
+                                                                                    .state
+                                                                                    .removeUserModalId,
+                                                                            values: {
+                                                                                ...values,
+                                                                                userId: user.userId,
+                                                                            },
+                                                                            displayName:
+                                                                                user.name ||
+                                                                                user.email,
+                                                                            removeTeamMember:
+                                                                                this
+                                                                                    .removeTeamMember,
+                                                                        }
+                                                                    ),
+                                                            }
+                                                        );
+                                                    }
                                                 )}
                                             >
                                                 {!false && <span>Remove</span>}
@@ -315,14 +313,13 @@ class ProjectUser extends Component<ComponentProps> {
                             </div>
                         </div>
                     );
-                } else {
-                    return null;
                 }
-            });
+                return null;
+            })
+        );
     };
     override render() {
         const {
-
             count,
 
             updateUsers,
@@ -346,7 +343,6 @@ class ProjectUser extends Component<ComponentProps> {
                         >
                             <span className="ContentHeader-title Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--28 Text-typeface--base Text-wrap--wrap">
                                 <span
-
                                     id={`project_${this.props.projectName}`}
                                     style={{ textTransform: 'capitalize' }}
                                 >
@@ -359,7 +355,6 @@ class ProjectUser extends Component<ComponentProps> {
                                     <span
                                         style={{ textTransform: 'lowercase' }}
                                     >
-
                                         {this.props.projectName}
                                     </span>
                                 </span>
@@ -371,7 +366,6 @@ class ProjectUser extends Component<ComponentProps> {
                         >
                             <div className="Box-root">
                                 <button
-
                                     id={`btn_${this.props.projectName}`}
                                     onClick={this.handleClick}
                                     className="Button bs-ButtonLegacy ActionIconParent"
@@ -476,9 +470,11 @@ class ProjectUser extends Component<ComponentProps> {
                                     <div className="bs-Tail-copy">
                                         <span id={`count_kolawole`}>
                                             {count
-                                                ? `Page ${this.props.page
-                                                } of ${numberOfPages} (${count} User${count === 1 ? '' : 's'
-                                                })`
+                                                ? `Page ${
+                                                      this.props.page
+                                                  } of ${numberOfPages} (${count} User${
+                                                      count === 1 ? '' : 's'
+                                                  })`
                                                 : null}
                                         </span>
                                     </div>
@@ -488,13 +484,16 @@ class ProjectUser extends Component<ComponentProps> {
                                 <div className="Box-root Margin-right--8">
                                     <button
                                         data-test="TeamSettings-paginationButton"
-                                        className={`Button bs-ButtonLegacy ${!canPaginateBackward
-                                            ? 'Is--disabled'
-                                            : ''
-                                            }`}
+                                        className={`Button bs-ButtonLegacy ${
+                                            !canPaginateBackward
+                                                ? 'Is--disabled'
+                                                : ''
+                                        }`}
                                         disabled={!canPaginateBackward}
                                         type="button"
-                                        onClick={() => paginate('prev')}
+                                        onClick={() => {
+                                            return paginate('prev');
+                                        }}
                                     >
                                         <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
                                             <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
@@ -506,13 +505,16 @@ class ProjectUser extends Component<ComponentProps> {
                                 <div className="Box-root">
                                     <button
                                         data-test="TeamSettings-paginationButton"
-                                        className={`Button bs-ButtonLegacy ${!canPaginateForward
-                                            ? 'Is--disabled'
-                                            : ''
-                                            }`}
+                                        className={`Button bs-ButtonLegacy ${
+                                            !canPaginateForward
+                                                ? 'Is--disabled'
+                                                : ''
+                                        }`}
                                         disabled={!canPaginateForward}
                                         type="button"
-                                        onClick={() => paginate('next')}
+                                        onClick={() => {
+                                            return paginate('next');
+                                        }}
                                     >
                                         <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
                                             <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
@@ -530,7 +532,6 @@ class ProjectUser extends Component<ComponentProps> {
     }
 }
 
-
 ProjectUser.displayName = 'ProjectUser';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -547,7 +548,6 @@ const mapDispatchToProps: Function = (dispatch: Dispatch) => {
     );
 };
 
-
 ProjectUser.propTypes = {
     users: PropTypes.oneOfType([
         PropTypes.array,
diff --git a/AdminDashboard/src/Components/Project/ProjectVerifyDomain.tsx b/AdminDashboard/src/Components/Project/ProjectVerifyDomain.tsx
index 97cf9ea7b9..291948b47f 100644
--- a/AdminDashboard/src/Components/Project/ProjectVerifyDomain.tsx
+++ b/AdminDashboard/src/Components/Project/ProjectVerifyDomain.tsx
@@ -14,12 +14,10 @@ import {
 } from '../../actions/project';
 
 class ProjectVerifyDomain extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     override componentDidMount() {
-
         this.props.resetVerifyProjectDomain();
         window.addEventListener('keydown', this.handleKeyBoard);
     }
@@ -40,16 +38,13 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
     };
 
     handleCloseModal = () => {
-
         this.props.closeModal({
-
             id: this.props.domainId,
         });
     };
 
     handleVerifyDomain = () => {
         const {
-
             domainId,
 
             projectId,
@@ -59,7 +54,6 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
             fetchProjectDomains,
         } = this.props;
         verifyProjectDomain({ projectId, domainId }).then(() => {
-
             if (!this.props.verifyError) {
                 fetchProjectDomains(projectId, 0, 10);
                 this.handleCloseModal();
@@ -68,8 +62,8 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { requesting, verificationToken, verifyError }: $TSFixMe = this.props;
+        const { requesting, verificationToken, verifyError }: $TSFixMe =
+            this.props;
         return (
             <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
                 <div
@@ -224,8 +218,7 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
                                                         <div className="Box-root">
                                                             <span
                                                                 style={{
-                                                                    color:
-                                                                        'red',
+                                                                    color: 'red',
                                                                 }}
                                                             >
                                                                 {verifyError}
@@ -244,8 +237,10 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
                                         >
                                             <button
                                                 id="cancelVerifyDomain"
-                                                className={`bs-Button btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 type="button"
                                                 disabled={requesting}
                                                 onClick={this.handleCloseModal}
@@ -257,8 +252,10 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
                                             </button>
                                             <button
                                                 id="confirmVerifyDomain"
-                                                className={`bs-Button bs-Button--blue btn__modal ${requesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button bs-Button--blue btn__modal ${
+                                                    requesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 onClick={
                                                     this.handleVerifyDomain
                                                 }
@@ -288,28 +285,30 @@ class ProjectVerifyDomain extends Component<ComponentProps> {
     }
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    requesting: state.project.verifyDomain.requesting,
-    verifyError: state.project.verifyDomain.error,
-    domainId: state.modal.modals[0].id,
-    verificationToken: state.modal.modals[0].verificationToken,
-    domain: state.modal.modals[0].domain,
-    projectId: state.modal.modals[0].projectId
-});
-
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        requesting: state.project.verifyDomain.requesting,
+        verifyError: state.project.verifyDomain.error,
+        domainId: state.modal.modals[0].id,
+        verificationToken: state.modal.modals[0].verificationToken,
+        domain: state.modal.modals[0].domain,
+        projectId: state.modal.modals[0].projectId,
+    };
+};
 
 ProjectVerifyDomain.displayName = 'ProjectVerifyDomain';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        closeModal,
-        fetchProjectDomains,
-        verifyProjectDomain,
-        resetVerifyProjectDomain,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            closeModal,
+            fetchProjectDomains,
+            verifyProjectDomain,
+            resetVerifyProjectDomain,
+        },
+        dispatch
+    );
+};
 
 ProjectVerifyDomain.propTypes = {
     closeModal: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Project/RadioInput.tsx b/AdminDashboard/src/Components/Project/RadioInput.tsx
index 80ab2702c5..0d835e0768 100644
--- a/AdminDashboard/src/Components/Project/RadioInput.tsx
+++ b/AdminDashboard/src/Components/Project/RadioInput.tsx
@@ -3,12 +3,7 @@ import PropTypes from 'prop-types';
 
 import { Field } from 'redux-form';
 
-export function RadioInput({
-    id,
-    details,
-    value,
-    style
-}: $TSFixMe) {
+export function RadioInput({ id, details, value, style }: $TSFixMe) {
     return (
         <div
             className="bs-Fieldset-field"
diff --git a/AdminDashboard/src/Components/PublicPage.tsx b/AdminDashboard/src/Components/PublicPage.tsx
index b1a2cc8948..aa9a816563 100644
--- a/AdminDashboard/src/Components/PublicPage.tsx
+++ b/AdminDashboard/src/Components/PublicPage.tsx
@@ -5,23 +5,28 @@ import routes from '../routes';
 
 const { allRoutes }: $TSFixMe = routes;
 
-const PublicPage: Function = () => (
-    <Switch>
-        {allRoutes
+const PublicPage: Function = () => {
+    return (
+        <Switch>
+            {allRoutes
 
-            .filter(route => route.isPublic)
-            .map((route, index) => (
-                <Route
-                    component={route.component}
-
-                    exact={route.exact}
-                    path={route.path}
-                    key={index}
-                />
-            ))}
-        <Redirect to="/login" />
-    </Switch>
-);
+                .filter((route) => {
+                    return route.isPublic;
+                })
+                .map((route, index) => {
+                    return (
+                        <Route
+                            component={route.component}
+                            exact={route.exact}
+                            path={route.path}
+                            key={index}
+                        />
+                    );
+                })}
+            <Redirect to="/login" />
+        </Switch>
+    );
+};
 
 PublicPage.displayName = 'PublicPage';
 
diff --git a/AdminDashboard/src/Components/RequiredAuth.tsx b/AdminDashboard/src/Components/RequiredAuth.tsx
index 8d13c52c45..53b89dfa63 100644
--- a/AdminDashboard/src/Components/RequiredAuth.tsx
+++ b/AdminDashboard/src/Components/RequiredAuth.tsx
@@ -6,7 +6,6 @@ import { history } from '../store';
 
 export default function (ComposedComponent: $TSFixMe) {
     class Authentication extends Component<ComponentProps> {
-
         public static displayName = '';
         public static propTypes = {};
 
@@ -22,7 +21,6 @@ export default function (ComposedComponent: $TSFixMe) {
         override componentDidMount() {
             if (!this.isAuthenticated) {
                 history.push('/login', {
-
                     continue: this.props.location.pathname,
                 });
             }
@@ -31,7 +29,6 @@ export default function (ComposedComponent: $TSFixMe) {
         componentDidUpdate() {
             if (!this.isAuthenticated) {
                 history.push('/login', {
-
                     continue: this.props.location.pathname,
                 });
             }
@@ -46,12 +43,10 @@ export default function (ComposedComponent: $TSFixMe) {
         }
     }
 
-
     Authentication.propTypes = {
         location: PropTypes.object,
     };
 
-
     Authentication.displayName = 'RequireAuth';
 
     function mapStateToProps() {
diff --git a/AdminDashboard/src/Components/Search/SearchForm.tsx b/AdminDashboard/src/Components/Search/SearchForm.tsx
index 6e317f8f5c..ec58378eb4 100644
--- a/AdminDashboard/src/Components/Search/SearchForm.tsx
+++ b/AdminDashboard/src/Components/Search/SearchForm.tsx
@@ -4,7 +4,6 @@ import { connect } from 'react-redux';
 import { reduxForm, Field } from 'redux-form';
 
 class Search extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -32,12 +31,11 @@ class Search extends Component<ComponentProps> {
                         Search
                     </button>
                 </div>
-            </div >
+            </div>
         );
     }
 }
 
-
 Search.displayName = 'Search';
 
 const mapStateToProps: Function = () => {
diff --git a/AdminDashboard/src/Components/Settings/MessageModal.tsx b/AdminDashboard/src/Components/Settings/MessageModal.tsx
index 783eb24b2b..3f06418440 100644
--- a/AdminDashboard/src/Components/Settings/MessageModal.tsx
+++ b/AdminDashboard/src/Components/Settings/MessageModal.tsx
@@ -11,7 +11,9 @@ const MessageModal: Function = (props: $TSFixMe) => {
 
     return (
         <div
-            onKeyDown={e => e.key === 'Escape' && closeThisDialog()}
+            onKeyDown={e => {
+                return e.key === 'Escape' && closeThisDialog();
+            }}
             className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center"
         >
             <div
diff --git a/AdminDashboard/src/Components/Settings/auditLog.tsx b/AdminDashboard/src/Components/Settings/auditLog.tsx
index 25ed561752..b6091e0d1f 100644
--- a/AdminDashboard/src/Components/Settings/auditLog.tsx
+++ b/AdminDashboard/src/Components/Settings/auditLog.tsx
@@ -11,36 +11,32 @@ import {
 } from '../../actions/auditLogs';
 
 class AuditLog extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     handleKeyBoard: $TSFixMe;
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchAuditLogStatus();
     }
-    toggleComponent = ({
-        input: { value, onChange }
-    }: $TSFixMe) => (
-        <label className="Toggler-wrap">
-            <input
-                className="btn-toggler"
-                checked={value}
-                onChange={onChange}
-                type="checkbox"
-                name="auditStatusToggler"
-                id="auditStatusToggler"
-            />
-            <span className="TogglerBtn-slider round"></span>
-        </label>
-    );
+    toggleComponent = ({ input: { value, onChange } }: $TSFixMe) => {
+        return (
+            <label className="Toggler-wrap">
+                <input
+                    className="btn-toggler"
+                    checked={value}
+                    onChange={onChange}
+                    type="checkbox"
+                    name="auditStatusToggler"
+                    id="auditStatusToggler"
+                />
+                <span className="TogglerBtn-slider round"></span>
+            </label>
+        );
+    };
     submitForm = (values: $TSFixMe) => {
-
         this.props.auditLogStatusChange({ status: values.auditStatusToggler });
     };
     override render() {
-
         const { changeAuditLogStatus, handleSubmit }: $TSFixMe = this.props;
         return (
             <div
@@ -156,7 +152,6 @@ class AuditLog extends Component<ComponentProps> {
     }
 }
 
-
 AuditLog.displayName = 'AuditLog';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -185,7 +180,6 @@ const ReduxFormComponent: $TSFixMe = reduxForm({
     enableReinitialize: true,
 })(AuditLog);
 
-
 AuditLog.propTypes = {
     changeAuditLogStatus: PropTypes.object,
     handleSubmit: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/callLog.tsx b/AdminDashboard/src/Components/Settings/callLog.tsx
index 2a4ccc8b02..7f095dbdec 100644
--- a/AdminDashboard/src/Components/Settings/callLog.tsx
+++ b/AdminDashboard/src/Components/Settings/callLog.tsx
@@ -11,36 +11,32 @@ import {
 } from '../../actions/callLogs';
 
 class CallLog extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     handleKeyBoard: $TSFixMe;
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchCallLogStatus();
     }
-    toggleComponent = ({
-        input: { value, onChange }
-    }: $TSFixMe) => (
-        <label className="Toggler-wrap">
-            <input
-                className="btn-toggler"
-                checked={value}
-                onChange={onChange}
-                type="checkbox"
-                name="callStatusToggler"
-                id="callStatusToggler"
-            />
-            <span className="TogglerBtn-slider round"></span>
-        </label>
-    );
+    toggleComponent = ({ input: { value, onChange } }: $TSFixMe) => {
+        return (
+            <label className="Toggler-wrap">
+                <input
+                    className="btn-toggler"
+                    checked={value}
+                    onChange={onChange}
+                    type="checkbox"
+                    name="callStatusToggler"
+                    id="callStatusToggler"
+                />
+                <span className="TogglerBtn-slider round"></span>
+            </label>
+        );
+    };
     submitForm = (values: $TSFixMe) => {
-
         this.props.callLogStatusChange({ status: values.callStatusToggler });
     };
     override render() {
-
         const { changeCallLogStatus, handleSubmit }: $TSFixMe = this.props;
         return (
             <div
@@ -156,7 +152,6 @@ class CallLog extends Component<ComponentProps> {
     }
 }
 
-
 CallLog.displayName = 'CallLog';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -185,7 +180,6 @@ const ReduxFormComponent: $TSFixMe = reduxForm({
     enableReinitialize: true,
 })(CallLog);
 
-
 CallLog.propTypes = {
     changeCallLogStatus: PropTypes.object,
     handleSubmit: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/emailLog.tsx b/AdminDashboard/src/Components/Settings/emailLog.tsx
index 79b10e5c59..f24e59667c 100644
--- a/AdminDashboard/src/Components/Settings/emailLog.tsx
+++ b/AdminDashboard/src/Components/Settings/emailLog.tsx
@@ -11,36 +11,32 @@ import {
 } from '../../actions/emailLogs';
 
 class EmailLog extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     handleKeyBoard: $TSFixMe;
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchEmailLogStatus();
     }
-    toggleComponent = ({
-        input: { value, onChange }
-    }: $TSFixMe) => (
-        <label className="Toggler-wrap">
-            <input
-                className="btn-toggler"
-                checked={value}
-                onChange={onChange}
-                type="checkbox"
-                name="emailStatusToggler"
-                id="emailStatusToggler"
-            />
-            <span className="TogglerBtn-slider round"></span>
-        </label>
-    );
+    toggleComponent = ({ input: { value, onChange } }: $TSFixMe) => {
+        return (
+            <label className="Toggler-wrap">
+                <input
+                    className="btn-toggler"
+                    checked={value}
+                    onChange={onChange}
+                    type="checkbox"
+                    name="emailStatusToggler"
+                    id="emailStatusToggler"
+                />
+                <span className="TogglerBtn-slider round"></span>
+            </label>
+        );
+    };
     submitForm = (values: $TSFixMe) => {
-
         this.props.emailLogStatusChange({ status: values.emailStatusToggler });
     };
     override render() {
-
         const { changeEmailLogStatus, handleSubmit }: $TSFixMe = this.props;
         return (
             <div
@@ -156,7 +152,6 @@ class EmailLog extends Component<ComponentProps> {
     }
 }
 
-
 EmailLog.displayName = 'EmailLog';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -185,7 +180,6 @@ const ReduxFormComponent: $TSFixMe = reduxForm({
     enableReinitialize: true,
 })(EmailLog);
 
-
 EmailLog.propTypes = {
     changeEmailLogStatus: PropTypes.object,
     handleSubmit: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/smsLog.tsx b/AdminDashboard/src/Components/Settings/smsLog.tsx
index 8bbb0a91c5..9b4163eb70 100644
--- a/AdminDashboard/src/Components/Settings/smsLog.tsx
+++ b/AdminDashboard/src/Components/Settings/smsLog.tsx
@@ -8,36 +8,32 @@ import PropTypes from 'prop-types';
 import { fetchSmsLogStatus, smsLogStatusChange } from '../../actions/smsLogs';
 
 class SmsLog extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     handleKeyBoard: $TSFixMe;
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchSmsLogStatus();
     }
-    toggleComponent = ({
-        input: { value, onChange }
-    }: $TSFixMe) => (
-        <label className="Toggler-wrap">
-            <input
-                className="btn-toggler"
-                checked={value}
-                onChange={onChange}
-                type="checkbox"
-                name="smsStatusToggler"
-                id="smsStatusToggler"
-            />
-            <span className="TogglerBtn-slider round"></span>
-        </label>
-    );
+    toggleComponent = ({ input: { value, onChange } }: $TSFixMe) => {
+        return (
+            <label className="Toggler-wrap">
+                <input
+                    className="btn-toggler"
+                    checked={value}
+                    onChange={onChange}
+                    type="checkbox"
+                    name="smsStatusToggler"
+                    id="smsStatusToggler"
+                />
+                <span className="TogglerBtn-slider round"></span>
+            </label>
+        );
+    };
     submitForm = (values: $TSFixMe) => {
-
         this.props.smsLogStatusChange({ status: values.smsStatusToggler });
     };
     override render() {
-
         const { changeSmsLogStatus, handleSubmit }: $TSFixMe = this.props;
         return (
             <div
@@ -153,7 +149,6 @@ class SmsLog extends Component<ComponentProps> {
     }
 }
 
-
 SmsLog.displayName = 'SmsLog';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -182,7 +177,6 @@ const ReduxFormComponent: $TSFixMe = reduxForm({
     enableReinitialize: true,
 })(SmsLog);
 
-
 SmsLog.propTypes = {
     changeSmsLogStatus: PropTypes.object,
     handleSubmit: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/smtp.tsx b/AdminDashboard/src/Components/Settings/smtp.tsx
index c0bdc9a8b5..17740e3cca 100644
--- a/AdminDashboard/src/Components/Settings/smtp.tsx
+++ b/AdminDashboard/src/Components/Settings/smtp.tsx
@@ -19,39 +19,33 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.email(values.email)) {
-
         errors.email = 'Email is not valid.';
     }
 
     if (!Validate.text(values.password)) {
-
         errors.password = 'Password is not valid.';
     }
 
     if (!Validate.text(values['from-name'])) {
-
         errors['from-name'] = 'Name is not valid.';
     }
 
     if (!Validate.email(values['from'])) {
-
         errors['from'] = 'Email is not valid.';
     }
 
     if (!Validate.text(values['smtp-server'])) {
-
         errors['smtp-server'] = 'SMTP Server is not valid.';
     }
 
     if (!Validate.text(values['smtp-port'])) {
-
         errors['smtp-port'] = 'SMTP Port is not valid.';
     }
 
     return errors;
 }
 
-const  settingsType: string = 'smtp';
+const settingsType: string = 'smtp';
 
 const fields: $TSFixMe = [
     {
@@ -100,21 +94,21 @@ const fields: $TSFixMe = [
         key: 'smtp-secure',
         label: 'SMTP Secure',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap" id="label_smpt_secure">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="smtp-secure"
-                    id="smtp-secure"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap" id="label_smpt_secure">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="smtp-secure"
+                        id="smtp-secure"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
         explanation: 'Enabled for port 465, disabled for port 587',
     },
 ];
@@ -124,20 +118,20 @@ const emailEnableField: $TSFixMe = [
         key: 'email-enabled',
         label: 'Enable Emails',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap" id="email-enabled">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="email-enabled"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap" id="email-enabled">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="email-enabled"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
     },
 ];
 
@@ -146,47 +140,47 @@ const smtpOptions: $TSFixMe = [
         key: 'internalSmtp',
         label: 'Enable internal SMTP server',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap" id="internalSmtp">
-                {' '}
-                {/**setting id at label removes intermittent result*/}
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="internalSmtp"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap" id="internalSmtp">
+                    {' '}
+                    {/**setting id at label removes intermittent result*/}
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="internalSmtp"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
         explanation: 'Use pre-configured internal SMTP server',
     },
     {
         key: 'customSmtp',
         label: 'Enable custom SMTP server',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap" id="customSmtp">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="customSmtp"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap" id="customSmtp">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="customSmtp"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
         explanation: 'Custom SMTP will also serve as backup SMTP server',
     },
 ];
 
-export class Component extends Component<ComponentProps>{
+export class Component extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
     constructor(props: $TSFixMe) {
@@ -197,8 +191,7 @@ export class Component extends Component<ComponentProps>{
         };
     }
 
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchSettings(settingsType);
     }
 
@@ -209,11 +202,9 @@ export class Component extends Component<ComponentProps>{
 
         const { testModalId }: $TSFixMe = this.state;
 
-
         this.props.openModal({
             id: testModalId,
             onConfirm: (testForm: $TSFixMe) => {
-
                 const { smtpToUse }: $TSFixMe = this.props.smtpTestForm.values;
                 const { 'test-email': email } = testForm;
                 const {
@@ -244,11 +235,12 @@ export class Component extends Component<ComponentProps>{
 
                 return testSmtp(payload).then((res: ExpressResponse) => {
                     if (res && typeof res === 'string') {
-                        // prevent dismissal of modal if errored
-                        // res will only be a string if errored
+                        /*
+                         * prevent dismissal of modal if errored
+                         * res will only be a string if errored
+                         */
 
                         return this.props.openModal({
-
                             id: this.state.messageModalId,
                             content: (props: $TSFixMe) => {
                                 return (
@@ -259,7 +251,6 @@ export class Component extends Component<ComponentProps>{
                     }
 
                     return this.props.openModal({
-
                         id: this.state.messageModalId,
                         content: (props: $TSFixMe) => {
                             return <MessageModal {...props} email={email} />;
@@ -274,7 +265,6 @@ export class Component extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.testModalId });
             default:
                 return false;
@@ -282,12 +272,10 @@ export class Component extends Component<ComponentProps>{
     };
 
     submitForm = (values: $TSFixMe) => {
-
         this.props.saveSettings(settingsType, values);
     };
 
     override render() {
-
         const { settings, handleSubmit, smtpForm }: $TSFixMe = this.props;
         return (
             <div
@@ -321,59 +309,60 @@ export class Component extends Component<ComponentProps>{
                                 <div className="bs-Fieldset-wrapper Box-root Margin-bottom--2">
                                     <fieldset className="bs-Fieldset">
                                         <div className="bs-Fieldset-rows">
-                                            {emailEnableField.map(field => (
-                                                <div
-                                                    key={field.key}
-                                                    className="bs-Fieldset-row"
-                                                >
-                                                    <label className="bs-Fieldset-label">
-                                                        {field.label}
-                                                    </label>
+                                            {emailEnableField.map(field => {
+                                                return (
                                                     <div
-                                                        className="bs-Fieldset-fields"
-                                                        style={{
-                                                            paddingTop: 3,
-                                                        }}
+                                                        key={field.key}
+                                                        className="bs-Fieldset-row"
                                                     >
-                                                        <Field
-                                                            className="db-BusinessSettings-input TextInput bs-TextInput"
-
-                                                            type={field.type}
-                                                            name={field.key}
-                                                            id={field.key}
-                                                            placeholder={
-
-                                                                field.placeholder ||
-                                                                field.label
-                                                            }
-                                                            component={
-                                                                field.component
-                                                            }
-                                                            disabled={
-                                                                settings &&
-                                                                settings.requesting
-                                                            }
-                                                        />
-
-                                                        {field.explanation && (
-                                                            <p className="bs-Fieldset-explanation">
-                                                                {
-
-                                                                    field.explanation
+                                                        <label className="bs-Fieldset-label">
+                                                            {field.label}
+                                                        </label>
+                                                        <div
+                                                            className="bs-Fieldset-fields"
+                                                            style={{
+                                                                paddingTop: 3,
+                                                            }}
+                                                        >
+                                                            <Field
+                                                                className="db-BusinessSettings-input TextInput bs-TextInput"
+                                                                type={
+                                                                    field.type
                                                                 }
-                                                            </p>
-                                                        )}
+                                                                name={field.key}
+                                                                id={field.key}
+                                                                placeholder={
+                                                                    field.placeholder ||
+                                                                    field.label
+                                                                }
+                                                                component={
+                                                                    field.component
+                                                                }
+                                                                disabled={
+                                                                    settings &&
+                                                                    settings.requesting
+                                                                }
+                                                            />
+
+                                                            {field.explanation && (
+                                                                <p className="bs-Fieldset-explanation">
+                                                                    {
+                                                                        field.explanation
+                                                                    }
+                                                                </p>
+                                                            )}
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            ))}
+                                                );
+                                            })}
                                             {smtpForm.values &&
                                                 smtpForm.values[
-                                                'email-enabled'
+                                                    'email-enabled'
                                                 ] &&
                                                 smtpOptions.map(field => {
                                                     if (
                                                         field.key ===
-                                                        'internalSmtp' &&
+                                                            'internalSmtp' &&
                                                         !IS_INTERNAL_SMTP_DEPLOYED
                                                     ) {
                                                         return null;
@@ -395,7 +384,6 @@ export class Component extends Component<ComponentProps>{
                                                                 <Field
                                                                     className="db-BusinessSettings-input TextInput bs-TextInput"
                                                                     type={
-
                                                                         field.type
                                                                     }
                                                                     name={
@@ -405,7 +393,6 @@ export class Component extends Component<ComponentProps>{
                                                                         field.key
                                                                     }
                                                                     placeholder={
-
                                                                         field.placeholder ||
                                                                         field.label
                                                                     }
@@ -430,53 +417,58 @@ export class Component extends Component<ComponentProps>{
                                                 })}
                                             {smtpForm.values &&
                                                 smtpForm.values[
-                                                'email-enabled'
+                                                    'email-enabled'
                                                 ] &&
                                                 smtpForm.values.customSmtp &&
-                                                fields.map(field => (
-                                                    <div
-                                                        key={field.key}
-                                                        className="bs-Fieldset-row"
-                                                    >
-                                                        <label className="bs-Fieldset-label">
-                                                            {field.label}
-                                                        </label>
+                                                fields.map(field => {
+                                                    return (
                                                         <div
-                                                            className="bs-Fieldset-fields"
-                                                            style={{
-                                                                paddingTop: 3,
-                                                            }}
+                                                            key={field.key}
+                                                            className="bs-Fieldset-row"
                                                         >
-                                                            <Field
-                                                                className="db-BusinessSettings-input TextInput bs-TextInput"
-                                                                type={
-                                                                    field.type
-                                                                }
-                                                                name={field.key}
-                                                                id={field.key}
-                                                                placeholder={
-
-                                                                    field.placeholder ||
-                                                                    field.label
-                                                                }
-                                                                component={
-                                                                    field.component
-                                                                }
-                                                                disabled={
-                                                                    settings &&
-                                                                    settings.requesting
-                                                                }
-                                                            />
-                                                            {field.explanation && (
-                                                                <p className="bs-Fieldset-explanation">
-                                                                    {
-                                                                        field.explanation
+                                                            <label className="bs-Fieldset-label">
+                                                                {field.label}
+                                                            </label>
+                                                            <div
+                                                                className="bs-Fieldset-fields"
+                                                                style={{
+                                                                    paddingTop: 3,
+                                                                }}
+                                                            >
+                                                                <Field
+                                                                    className="db-BusinessSettings-input TextInput bs-TextInput"
+                                                                    type={
+                                                                        field.type
                                                                     }
-                                                                </p>
-                                                            )}
+                                                                    name={
+                                                                        field.key
+                                                                    }
+                                                                    id={
+                                                                        field.key
+                                                                    }
+                                                                    placeholder={
+                                                                        field.placeholder ||
+                                                                        field.label
+                                                                    }
+                                                                    component={
+                                                                        field.component
+                                                                    }
+                                                                    disabled={
+                                                                        settings &&
+                                                                        settings.requesting
+                                                                    }
+                                                                />
+                                                                {field.explanation && (
+                                                                    <p className="bs-Fieldset-explanation">
+                                                                        {
+                                                                            field.explanation
+                                                                        }
+                                                                    </p>
+                                                                )}
+                                                            </div>
                                                         </div>
-                                                    </div>
-                                                ))}
+                                                    );
+                                                })}
                                         </div>
                                     </fieldset>
                                 </div>
@@ -519,10 +511,8 @@ export class Component extends Component<ComponentProps>{
     }
 }
 
-
 Component.displayName = 'SettingsForm';
 
-
 Component.propTypes = {
     settings: PropTypes.object.isRequired,
     handleSubmit: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/Settings/smtpTestModal.tsx b/AdminDashboard/src/Components/Settings/smtpTestModal.tsx
index 2186080805..6c1ecf7424 100644
--- a/AdminDashboard/src/Components/Settings/smtpTestModal.tsx
+++ b/AdminDashboard/src/Components/Settings/smtpTestModal.tsx
@@ -15,11 +15,13 @@ const SmtpTestModal: Function = ({
     closeThisDialog,
     testing,
     testError,
-    smtp
+    smtp,
 }: $TSFixMe) => {
     return (
         <div
-            onKeyDown={e => e.key === 'Escape' && closeThisDialog()}
+            onKeyDown={e => {
+                return e.key === 'Escape' && closeThisDialog();
+            }}
             className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center"
         >
             <div
@@ -91,8 +93,7 @@ const SmtpTestModal: Function = ({
                                                                     value="internalSmtp"
                                                                     style={{
                                                                         width: 0,
-                                                                        border:
-                                                                            'none',
+                                                                        border: 'none',
                                                                     }}
                                                                 />
                                                                 <span className="bs-Radio-button"></span>
@@ -142,8 +143,7 @@ const SmtpTestModal: Function = ({
                                                                     value="customSmtp"
                                                                     style={{
                                                                         width: 0,
-                                                                        border:
-                                                                            'none',
+                                                                        border: 'none',
                                                                     }}
                                                                 />
                                                                 <span className="bs-Radio-button"></span>
@@ -204,8 +204,9 @@ const SmtpTestModal: Function = ({
                                     </ShouldRender>
                                     <button
                                         id="cancelSmtpTest"
-                                        className={`bs-Button ${testing &&
-                                            'bs-is-disabled'}`}
+                                        className={`bs-Button ${
+                                            testing && 'bs-is-disabled'
+                                        }`}
                                         type="button"
                                         onClick={closeThisDialog}
                                         disabled={testing}
@@ -215,16 +216,20 @@ const SmtpTestModal: Function = ({
                                     </button>
                                     <button
                                         id="confirmSmtpTest"
-                                        className={`bs-Button bs-Button--blue ${testing &&
-                                            'bs-is-disabled'}`}
+                                        className={`bs-Button bs-Button--blue ${
+                                            testing && 'bs-is-disabled'
+                                        }`}
                                         onClick={() => {
                                             // prevent form submission if form field is empty or invalid
-                                            if (!smtp.values) return;
+                                            if (!smtp.values) {
+                                                return;
+                                            }
                                             if (
                                                 smtp.syncErrors &&
                                                 smtp.syncErrors['test-email']
-                                            )
+                                            ) {
                                                 return;
+                                            }
 
                                             confirmThisDialog(smtp.values);
                                         }}
@@ -247,11 +252,13 @@ const SmtpTestModal: Function = ({
     );
 };
 
-const mapStateToProps: Function = (state: RootState) => ({
-    testing: state.settings.testing,
-    testError: state.settings.error,
-    smtp: state.form['smtp-test-form']
-});
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        testing: state.settings.testing,
+        testError: state.settings.error,
+        smtp: state.form['smtp-test-form'],
+    };
+};
 
 SmtpTestModal.displayName = 'Test Confirmation Modal';
 
@@ -271,7 +278,6 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.email(values['test-email'])) {
-
         errors['test-email'] = 'Email is not valid.';
     }
     return errors;
diff --git a/AdminDashboard/src/Components/Settings/sso.tsx b/AdminDashboard/src/Components/Settings/sso.tsx
index 8f4246453a..7518c7e268 100644
--- a/AdminDashboard/src/Components/Settings/sso.tsx
+++ b/AdminDashboard/src/Components/Settings/sso.tsx
@@ -12,7 +12,7 @@ import SsoDeleteModal from './sso/SsoDeleteModal';
 import { SsoAddModal, SsoUpdateModal } from './sso/SsoModal';
 import ShouldRender from '../basic/ShouldRender';
 
-export class Component extends Component<ComponentProps>{
+export class Component extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
     state = {
@@ -20,8 +20,7 @@ export class Component extends Component<ComponentProps>{
         page: 1,
     };
 
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchSsos();
 
         window.addEventListener('keydown', this.handleKeyboard);
@@ -32,7 +31,6 @@ export class Component extends Component<ComponentProps>{
     }
 
     handleKeyboard = (event: $TSFixMe) => {
-
         const { modalId, modalList }: $TSFixMe = this.props;
         const { ssoModalId }: $TSFixMe = this.state;
 
@@ -52,21 +50,18 @@ export class Component extends Component<ComponentProps>{
     };
 
     addSso = async () => {
-
         this.props.openModal({
             id: this.state.ssoModalId,
-            onConfirm: () => { },
+            onConfirm: () => {},
             content: SsoAddModal,
         });
         this.setState({ page: 1 });
     };
 
     deleteSso = async (ssoId: $TSFixMe) => {
-
         this.props.openModal({
             id: ssoId,
             onConfirm: async () => {
-
                 await this.props.deleteSso(ssoId);
 
                 await this.props.fetchSsoDefaultRoles();
@@ -78,13 +73,11 @@ export class Component extends Component<ComponentProps>{
     };
 
     editSso = async (ssoId: $TSFixMe) => {
-
         this.props.fetchSso(ssoId);
 
         this.props.openModal({
             id: ssoId,
             onConfirm: async () => {
-
                 return this.props.fetchSsos();
             },
             content: SsoUpdateModal,
@@ -92,7 +85,6 @@ export class Component extends Component<ComponentProps>{
     };
 
     previousClicked = async () => {
-
         const { ssos }: $TSFixMe = this.props;
         const { skip, limit }: $TSFixMe = ssos;
 
@@ -101,7 +93,6 @@ export class Component extends Component<ComponentProps>{
     };
 
     nextClicked = async () => {
-
         const { ssos }: $TSFixMe = this.props;
         const { skip, limit }: $TSFixMe = ssos;
 
@@ -110,7 +101,6 @@ export class Component extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { ssos }: $TSFixMe = this.props;
         const { count, skip, limit }: $TSFixMe = ssos;
         const canPrev: $TSFixMe = skip > 0;
@@ -249,7 +239,6 @@ export class Component extends Component<ComponentProps>{
                                                 height: '1px',
                                                 minWidth: '270px',
                                             }}
-
                                             colSpan="5"
                                         >
                                             <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
@@ -271,106 +260,114 @@ export class Component extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 )}
-                                {ssos.ssos.map((sso: $TSFixMe) => <tr
-                                    key={sso._id}
-                                    className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink"
-                                >
-                                    <td
-                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                        style={{
-                                            height: '1px',
-                                            minWidth: '270px',
-                                        }}
-                                    >
-                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                            <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                <div className="Box-root Margin-right--16">
-                                                    <span id="sso-domain">
-                                                        {sso.domain}
+                                {ssos.ssos.map((sso: $TSFixMe) => {
+                                    return (
+                                        <tr
+                                            key={sso._id}
+                                            className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink"
+                                        >
+                                            <td
+                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                style={{
+                                                    height: '1px',
+                                                    minWidth: '270px',
+                                                }}
+                                            >
+                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                        <div className="Box-root Margin-right--16">
+                                                            <span id="sso-domain">
+                                                                {sso.domain}
+                                                            </span>
+                                                        </div>
                                                     </span>
                                                 </div>
-                                            </span>
-                                        </div>
-                                    </td>
-                                    <td
-                                        aria-hidden="true"
-                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                        style={{
-                                            height: '1px',
-                                            maxWidth: '48px',
-                                            minWidth: '48px',
-                                            width: '48px',
-                                        }}
-                                    >
-                                        <div className="db-ListViewItem-link">
-                                            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                ⁣
-                                            </div>
-                                        </div>
-                                    </td>
-                                    <td
-                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                        style={{ height: '1px' }}
-                                    >
-                                        <div className="db-ListViewItem-link">
-                                            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                {moment(
-                                                    sso.createdAt
-                                                ).fromNow()}
-                                            </div>
-                                        </div>
-                                    </td>
-                                    <td
-                                        aria-hidden="true"
-                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                        style={{
-                                            height: '1px',
-                                            maxWidth: '48px',
-                                            minWidth: '48px',
-                                            width: '48px',
-                                        }}
-                                    >
-                                        <div className="db-ListViewItem-link">
-                                            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                ⁣
-                                            </div>
-                                        </div>
-                                    </td>
-                                    <td
-                                        className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                        style={{
-                                            height: '1px',
-                                            textAlign: 'right',
-                                        }}
-                                    >
-                                        <div
-                                            className="db-ListViewItem-link"
-                                            style={{
-                                                marginTop: 10,
-                                                paddingRight: 20,
-                                            }}
-                                        >
-                                            <button
-                                                className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
-                                                id="edit-button"
-                                                onClick={() =>
-                                                    this.editSso(sso._id)
-                                                }
+                                            </td>
+                                            <td
+                                                aria-hidden="true"
+                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                style={{
+                                                    height: '1px',
+                                                    maxWidth: '48px',
+                                                    minWidth: '48px',
+                                                    width: '48px',
+                                                }}
                                             >
-                                                Edit
-                                            </button>
-                                            <button
-                                                className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--delete"
-                                                id="delete-button"
-                                                onClick={() =>
-                                                    this.deleteSso(sso._id)
-                                                }
+                                                <div className="db-ListViewItem-link">
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        ⁣
+                                                    </div>
+                                                </div>
+                                            </td>
+                                            <td
+                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                style={{ height: '1px' }}
                                             >
-                                                Delete
-                                            </button>
-                                        </div>
-                                    </td>
-                                </tr>)}
+                                                <div className="db-ListViewItem-link">
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        {moment(
+                                                            sso.createdAt
+                                                        ).fromNow()}
+                                                    </div>
+                                                </div>
+                                            </td>
+                                            <td
+                                                aria-hidden="true"
+                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                style={{
+                                                    height: '1px',
+                                                    maxWidth: '48px',
+                                                    minWidth: '48px',
+                                                    width: '48px',
+                                                }}
+                                            >
+                                                <div className="db-ListViewItem-link">
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        ⁣
+                                                    </div>
+                                                </div>
+                                            </td>
+                                            <td
+                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                style={{
+                                                    height: '1px',
+                                                    textAlign: 'right',
+                                                }}
+                                            >
+                                                <div
+                                                    className="db-ListViewItem-link"
+                                                    style={{
+                                                        marginTop: 10,
+                                                        paddingRight: 20,
+                                                    }}
+                                                >
+                                                    <button
+                                                        className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--edit"
+                                                        id="edit-button"
+                                                        onClick={() => {
+                                                            return this.editSso(
+                                                                sso._id
+                                                            );
+                                                        }}
+                                                    >
+                                                        Edit
+                                                    </button>
+                                                    <button
+                                                        className="bs-Button bs-DeprecatedButton db-Trends-editButton bs-Button--icon bs-Button--delete"
+                                                        id="delete-button"
+                                                        onClick={() => {
+                                                            return this.deleteSso(
+                                                                sso._id
+                                                            );
+                                                        }}
+                                                    >
+                                                        Delete
+                                                    </button>
+                                                </div>
+                                            </td>
+                                        </tr>
+                                    );
+                                })}
                             </tbody>
                         </table>
 
@@ -439,10 +436,8 @@ export class Component extends Component<ComponentProps>{
     }
 }
 
-
 Component.displayName = 'SettingsForm';
 
-
 Component.propTypes = {
     ssos: PropTypes.object.isRequired,
     fetchSsos: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/Settings/sso/SsoDeleteModal.tsx b/AdminDashboard/src/Components/Settings/sso/SsoDeleteModal.tsx
index 94279469ba..734eed5917 100644
--- a/AdminDashboard/src/Components/Settings/sso/SsoDeleteModal.tsx
+++ b/AdminDashboard/src/Components/Settings/sso/SsoDeleteModal.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
 class SsoDeleteModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -17,10 +16,8 @@ class SsoDeleteModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -28,12 +25,13 @@ class SsoDeleteModal extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { confirmThisDialog, closeThisDialog }: $TSFixMe = this.props;
 
         return (
             <div
-                onKeyDown={e => e.key === 'Escape' && closeThisDialog()}
+                onKeyDown={e => {
+                    return e.key === 'Escape' && closeThisDialog();
+                }}
                 className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center"
             >
                 <div
@@ -88,10 +86,8 @@ class SsoDeleteModal extends Component<ComponentProps> {
     }
 }
 
-
 SsoDeleteModal.displayName = 'SsoDeleteModal';
 
-
 SsoDeleteModal.propTypes = {
     confirmThisDialog: PropTypes.func.isRequired,
     closeThisDialog: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/sso/SsoModal.tsx b/AdminDashboard/src/Components/Settings/sso/SsoModal.tsx
index 98f7a45294..0ddca0ed71 100644
--- a/AdminDashboard/src/Components/Settings/sso/SsoModal.tsx
+++ b/AdminDashboard/src/Components/Settings/sso/SsoModal.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { bindActionCreators, Dispatch } from 'redux';
+import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { RenderField } from '../../basic/RenderField';
 import { API_URL, Validate } from '../../../config';
@@ -15,22 +15,18 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.text(values.domain)) {
-
         errors.domain = 'Domain is not valid.';
     }
 
     if (!Validate.text(values.entityId)) {
-
         errors.entityId = 'Application ID is not valid.';
     }
 
     if (!Validate.text(values.remoteLoginUrl)) {
-
         errors.remoteLoginUrl = 'SSO URL is not valid.';
     }
 
     if (!Validate.text(values.remoteLogoutUrl)) {
-
         errors.remoteLogoutUrl = 'Remote logout URL is not valid.';
     }
 
@@ -44,24 +40,24 @@ const fields: $TSFixMe = [
         description:
             'SAML is an industry standard SSO framework typically used by large enterprises for communicating identities across the internet.',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="saml-enabled"
-                    id="saml-enabled"
-                />
-                <span
-                    id="saml-enabled-slider"
-                    className="TogglerBtn-slider round"
-                ></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="saml-enabled"
+                        id="saml-enabled"
+                    />
+                    <span
+                        id="saml-enabled-slider"
+                        className="TogglerBtn-slider round"
+                    ></span>
+                </label>
+            );
+        },
     },
     {
         key: 'ssoCallbackUrl',
@@ -137,7 +133,9 @@ class Component extends Component<ComponentProps> {
 
         this.setState({ copied: true });
         // reset it after 0.5 secs
-        setTimeout(() => this.setState({ copied: false }), 500);
+        setTimeout(() => {
+            return this.setState({ copied: false });
+        }, 500);
     };
     override componentDidMount() {
         window.addEventListener('keydown', this.handleKeyboard);
@@ -150,7 +148,6 @@ class Component extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -158,7 +155,6 @@ class Component extends Component<ComponentProps> {
     };
 
     submitForm = async (data: $TSFixMe) => {
-
         const { closeThisDialog }: $TSFixMe = this.props;
         const { _id: id } = data;
 
@@ -172,7 +168,6 @@ class Component extends Component<ComponentProps> {
 
     override render() {
         const {
-
             handleSubmit,
 
             closeThisDialog,
@@ -189,7 +184,6 @@ class Component extends Component<ComponentProps> {
             <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
                 <div
                     className="ModalLayer-contents"
-
                     tabIndex="-1"
                     style={{ marginTop: '40px' }}
                 >
@@ -259,15 +253,13 @@ class Component extends Component<ComponentProps> {
                                                                                 'no-repeat',
                                                                             backgroundSize:
                                                                                 'contain',
-                                                                            cursor:
-                                                                                'pointer',
+                                                                            cursor: 'pointer',
                                                                         }}
-                                                                        onClick={() =>
-                                                                            this.handleCopyToClipboard(
+                                                                        onClick={() => {
+                                                                            return this.handleCopyToClipboard(
                                                                                 field.value
-                                                                            )
-                                                                        }
-
+                                                                            );
+                                                                        }}
                                                                         disabled={
                                                                             this
                                                                                 .state
@@ -323,12 +315,11 @@ class Component extends Component<ComponentProps> {
                                                                     sso.requesting
                                                                 }
                                                                 style={{
-                                                                    width:
-                                                                        '350px',
+                                                                    width: '350px',
                                                                 }}
                                                                 autoFocus={
                                                                     field.key ===
-                                                                        'domain'
+                                                                    'domain'
                                                                         ? true
                                                                         : false
                                                                 }
@@ -387,10 +378,8 @@ class Component extends Component<ComponentProps> {
     }
 }
 
-
 Component.displayName = 'SsoModal';
 
-
 Component.propTypes = {
     handleSubmit: PropTypes.func.isRequired,
     // eslint-disable-next-line react/no-unused-prop-types
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles.tsx
index 5c020d24fd..c729c43624 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles.tsx
@@ -13,39 +13,32 @@ import { CreateDefaultRoleModal } from './ssoDefaultRoles/DefaultRoleModal';
 
 class Box extends Component<ComponentProps> {
     async previousClicked() {
-
         const { skip, limit }: $TSFixMe = this.props.ssoPaginate;
         if (0 <= skip - limit) {
-
             await this.props.fetchSsoDefaultRoles(skip - limit, limit);
 
             this.props.paginate('prev');
         }
     }
     async nextClicked() {
-
         const { skip, limit }: $TSFixMe = this.props.ssoPaginate;
 
         const { count, paginate }: $TSFixMe = this.props;
         if (skip + limit < count) {
-
             await this.props.fetchSsoDefaultRoles(skip + limit, limit);
             paginate('next');
         }
     }
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         this.props.fetchProjects(0, 0);
 
         await this.props.fetchSsoDefaultRoles(0, 10);
     }
     override render() {
-
         const { ssoDefaultRoles, openModal, count }: $TSFixMe = this.props;
 
         const canPrev: $TSFixMe = this.props.ssoPaginate.skip > 0;
         const canNext: $TSFixMe =
-
             this.props.ssoPaginate.skip + this.props.ssoPaginate.limit < count;
         const numberOfPages: $TSFixMe = Math.ceil(parseInt(count) / 10);
         return (
@@ -57,17 +50,16 @@ class Box extends Component<ComponentProps> {
                     <BoxHeader
                         title="SSO default roles "
                         description="Default roles of the members"
-
                         buttons={[
                             <Button
                                 text="Define new configurations"
                                 key="config"
                                 shortcut="M"
-                                onClick={() =>
-                                    openModal({
+                                onClick={() => {
+                                    return openModal({
                                         content: CreateDefaultRoleModal,
-                                    })
-                                }
+                                    });
+                                }}
                             />,
                         ]}
                     />
@@ -75,13 +67,14 @@ class Box extends Component<ComponentProps> {
                         <Table ssoDefaultRoles={ssoDefaultRoles} />
                         <BoxFooter
                             recordsCount={count}
-
                             canPrev={canPrev}
-
                             canNext={canNext}
-                            previousClicked={() => this.previousClicked()}
-                            nextClicked={() => this.nextClicked()}
-
+                            previousClicked={() => {
+                                return this.previousClicked();
+                            }}
+                            nextClicked={() => {
+                                return this.nextClicked();
+                            }}
                             page={this.props.page}
                             numberOfPages={numberOfPages}
                         />
@@ -92,7 +85,6 @@ class Box extends Component<ComponentProps> {
     }
 }
 
-
 Box.displayName = 'ssoDefaultRoles';
 
 Box.propTypes = {
@@ -105,20 +97,24 @@ Box.propTypes = {
     page: PropTypes.number,
     ssoPaginate: PropTypes.object,
 };
-const mapStateToProps: Function = (state: RootState) => ({
-    ssoDefaultRoles: state.ssoDefaultRoles.ssoDefaultRoles.ssoDefaultRoles,
-    count: state.ssoDefaultRoles.ssoDefaultRoles.count,
-    ssoPaginate: state.ssoDefaultRoles.ssoDefaultRoles,
-    page: state.ssoDefaultRoles.page
-});
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        fetchSsoDefaultRoles,
-        fetchProjects,
-        openModal,
-        paginate,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        ssoDefaultRoles: state.ssoDefaultRoles.ssoDefaultRoles.ssoDefaultRoles,
+        count: state.ssoDefaultRoles.ssoDefaultRoles.count,
+        ssoPaginate: state.ssoDefaultRoles.ssoDefaultRoles,
+        page: state.ssoDefaultRoles.page,
+    };
+};
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            fetchSsoDefaultRoles,
+            fetchProjects,
+            openModal,
+            paginate,
+        },
+        dispatch
+    );
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(Box);
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxFooter.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxFooter.tsx
index 9d22b08261..fcbefc8346 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxFooter.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxFooter.tsx
@@ -8,60 +8,64 @@ const BoxFooter: Function = ({
     previousClicked,
     nextClicked,
     page,
-    numberOfPages
-}: $TSFixMe) => (
-    <div className="bs-Tail bs-Tail--separated bs-Tail--short">
-        <div className="bs-Tail-copy">
-            <span>
-                {numberOfPages > 0
-                    ? `Page ${page} of ${numberOfPages} (${recordsCount} record${
-                          recordsCount === 1 ? '' : 's'
-                      })`
-                    : `${recordsCount} record${recordsCount === 1 ? '' : 's'}`}
-            </span>
-        </div>
-        <div className="bs-Tail-actions">
-            <div className="ButtonGroup Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
-                <div className="Box-root Margin-right--8">
-                    <button
-                        onClick={previousClicked}
-                        className={
-                            'Button bs-ButtonLegacy' +
-                            (canPrev ? '' : 'Is--disabled')
-                        }
-                        disabled={!canPrev}
-                        data-db-analytics-name="list_view.pagination.previous"
-                        type="button"
-                    >
-                        <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
-                            <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
-                                <span>Previous</span>
-                            </span>
-                        </div>
-                    </button>
-                </div>
-                <div className="Box-root">
-                    <button
-                        onClick={nextClicked}
-                        className={
-                            'Button bs-ButtonLegacy' +
-                            (canNext ? '' : 'Is--disabled')
-                        }
-                        disabled={!canNext}
-                        data-db-analytics-name="list_view.pagination.next"
-                        type="button"
-                    >
-                        <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
-                            <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
-                                <span>Next</span>
-                            </span>
-                        </div>
-                    </button>
+    numberOfPages,
+}: $TSFixMe) => {
+    return (
+        <div className="bs-Tail bs-Tail--separated bs-Tail--short">
+            <div className="bs-Tail-copy">
+                <span>
+                    {numberOfPages > 0
+                        ? `Page ${page} of ${numberOfPages} (${recordsCount} record${
+                              recordsCount === 1 ? '' : 's'
+                          })`
+                        : `${recordsCount} record${
+                              recordsCount === 1 ? '' : 's'
+                          }`}
+                </span>
+            </div>
+            <div className="bs-Tail-actions">
+                <div className="ButtonGroup Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
+                    <div className="Box-root Margin-right--8">
+                        <button
+                            onClick={previousClicked}
+                            className={
+                                'Button bs-ButtonLegacy' +
+                                (canPrev ? '' : 'Is--disabled')
+                            }
+                            disabled={!canPrev}
+                            data-db-analytics-name="list_view.pagination.previous"
+                            type="button"
+                        >
+                            <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
+                                <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
+                                    <span>Previous</span>
+                                </span>
+                            </div>
+                        </button>
+                    </div>
+                    <div className="Box-root">
+                        <button
+                            onClick={nextClicked}
+                            className={
+                                'Button bs-ButtonLegacy' +
+                                (canNext ? '' : 'Is--disabled')
+                            }
+                            disabled={!canNext}
+                            data-db-analytics-name="list_view.pagination.next"
+                            type="button"
+                        >
+                            <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
+                                <span className="Button-label Text-color--default Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--noWrap">
+                                    <span>Next</span>
+                                </span>
+                            </div>
+                        </button>
+                    </div>
                 </div>
             </div>
         </div>
-    </div>
-);
+    );
+};
 BoxFooter.displayName = 'ssoDefaultRoles';
 
 BoxFooter.propTypes = {
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxHeader.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxHeader.tsx
index 491dfc3836..4d6b429af3 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxHeader.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/BoxHeader.tsx
@@ -4,35 +4,40 @@ import PropTypes from 'prop-types';
 const BoxHeader: Function = ({
     title,
     description,
-    buttons = []
-}: $TSFixMe) => (
-    <div className="ContentHeader Box-root Box-background--white Box-divider--surface-bottom-1 Flex-flex Flex-direction--column Padding-horizontal--20 Padding-vertical--16">
-        <div className="Box-root Flex-flex Flex-direction--row Flex-justifyContent--spaceBetween">
-            <div className="ContentHeader-center Box-root Flex-flex Flex-direction--column Flex-justifyContent--center">
-                <span className="ContentHeader-title Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--28 Text-typeface--base Text-wrap--wrap">
-                    <span
-                        style={{
-                            textTransform: 'capitalize',
-                        }}
-                    >
-                        {title}
+    buttons = [],
+}: $TSFixMe) => {
+    return (
+        <div className="ContentHeader Box-root Box-background--white Box-divider--surface-bottom-1 Flex-flex Flex-direction--column Padding-horizontal--20 Padding-vertical--16">
+            <div className="Box-root Flex-flex Flex-direction--row Flex-justifyContent--spaceBetween">
+                <div className="ContentHeader-center Box-root Flex-flex Flex-direction--column Flex-justifyContent--center">
+                    <span className="ContentHeader-title Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--28 Text-typeface--base Text-wrap--wrap">
+                        <span
+                            style={{
+                                textTransform: 'capitalize',
+                            }}
+                        >
+                            {title}
+                        </span>
                     </span>
-                </span>
-                <span className="ContentHeader-description Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                    <span>{description}</span>
-                </span>
-            </div>
-            <div className="ContentHeader-end Box-root Flex-flex Flex-alignItems--center Margin-left--16">
-                <div className="Box-root">
-                    <div className="ContentHeader-end Box-root Flex-flex Flex-alignItems--center Margin-left--16">
-
-                        <div>{buttons.map(button => button)}</div>
+                    <span className="ContentHeader-description Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                        <span>{description}</span>
+                    </span>
+                </div>
+                <div className="ContentHeader-end Box-root Flex-flex Flex-alignItems--center Margin-left--16">
+                    <div className="Box-root">
+                        <div className="ContentHeader-end Box-root Flex-flex Flex-alignItems--center Margin-left--16">
+                            <div>
+                                {buttons.map(button => {
+                                    return button;
+                                })}
+                            </div>
+                        </div>
                     </div>
                 </div>
             </div>
         </div>
-    </div>
-);
+    );
+};
 
 BoxHeader.displayName = 'BoxHeader';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Button.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Button.tsx
index 15e21da4f3..2d2cd6a4b3 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Button.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Button.tsx
@@ -5,25 +5,27 @@ const Button: Function = ({
     id,
     onClick = () => {},
     text,
-    shortcut
-}: $TSFixMe) => (
-    <button
-        id={id}
-        className="bs-Button bs-ButtonLegacy ActionIconParent"
-        type="button"
-        onClick={onClick}
-        style={{
-            marginLeft: '8px',
-            paddingTop: 3,
-            paddingBottom: 3,
-        }}
-    >
-        <span className="bs-FileUploadButton bs-Button--icon bs-Button--new keycode__wrapper">
-            <span>{text}</span>
-            <span className="new-btn__keycode">{shortcut}</span>
-        </span>
-    </button>
-);
+    shortcut,
+}: $TSFixMe) => {
+    return (
+        <button
+            id={id}
+            className="bs-Button bs-ButtonLegacy ActionIconParent"
+            type="button"
+            onClick={onClick}
+            style={{
+                marginLeft: '8px',
+                paddingTop: 3,
+                paddingBottom: 3,
+            }}
+        >
+            <span className="bs-FileUploadButton bs-Button--icon bs-Button--new keycode__wrapper">
+                <span>{text}</span>
+                <span className="new-btn__keycode">{shortcut}</span>
+            </span>
+        </button>
+    );
+};
 
 Button.displayName = 'Button';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/DefaultRoleModal.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/DefaultRoleModal.tsx
index 7ce3dc0efe..4f66dd549a 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/DefaultRoleModal.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/DefaultRoleModal.tsx
@@ -42,17 +42,14 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.text(values.domain)) {
-
         errors.domain = 'Domain is required.';
     }
 
     if (!Validate.text(values.project)) {
-
         errors.project = 'Project is required.';
     }
 
     if (!Validate.text(values.role)) {
-
         errors.role = 'Role is required.';
     }
 
@@ -67,17 +64,21 @@ const Form: Function = ({
     errorMessage,
     handleSubmit,
     fetchSsoDefaultRoles,
-    closeThisDialog
+    closeThisDialog,
 }: $TSFixMe) => {
     const optionsArray: $TSFixMe = [
-        ssos.map((sso: $TSFixMe) => ({
-            value: sso._id,
-            label: sso.domain
-        })),
-        projects.map((project: $TSFixMe) => ({
-            value: project._id,
-            label: project.name
-        })),
+        ssos.map((sso: $TSFixMe) => {
+            return {
+                value: sso._id,
+                label: sso.domain,
+            };
+        }),
+        projects.map((project: $TSFixMe) => {
+            return {
+                value: project._id,
+                label: project.name,
+            };
+        }),
         [
             { value: 'Administrator', label: 'Administrator' },
             { value: 'Member', label: 'Member' },
@@ -87,7 +88,9 @@ const Form: Function = ({
     const submitForm: Function = async (data: $TSFixMe) => {
         const { _id: id } = data;
         const success: $TSFixMe = await onSubmit({ id, data });
-        if (!success) return;
+        if (!success) {
+            return;
+        }
         fetchSsoDefaultRoles();
         closeThisDialog();
     };
@@ -95,7 +98,6 @@ const Form: Function = ({
         <div className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
             <div
                 className="ModalLayer-contents"
-
                 tabIndex="-1"
                 style={{ marginTop: '40px' }}
             >
@@ -118,59 +120,65 @@ const Form: Function = ({
                             <div className="bs-Fieldset-wrapper Box-root Margin-bottom--2">
                                 <fieldset className="bs-Fieldset">
                                     <div className="bs-Fieldset-rows">
-                                        {fields.map((field, index) => (
-                                            <div
-                                                key={field.key}
-                                                className="bs-Fieldset-row"
-                                            >
-                                                <label className="bs-Fieldset-label">
-                                                    {field.label}
-                                                </label>
+                                        {fields.map((field, index) => {
+                                            return (
                                                 <div
-                                                    className="bs-Fieldset-fields"
-                                                    style={{
-                                                        paddingTop: 3,
-                                                    }}
+                                                    key={field.key}
+                                                    className="bs-Fieldset-row"
                                                 >
-                                                    <Field
-                                                        className="db-select-nw"
-                                                        name={field.key}
-                                                        id={field.key}
-                                                        placeholder={
-                                                            field.placeholder
-                                                        }
-                                                        component={
-                                                            field.component
-                                                        }
-                                                        // disabled={
-                                                        //   sso &&
-                                                        //   sso.requesting
-                                                        // }
+                                                    <label className="bs-Fieldset-label">
+                                                        {field.label}
+                                                    </label>
+                                                    <div
+                                                        className="bs-Fieldset-fields"
                                                         style={{
-                                                            width: '350px',
-                                                        }}
-                                                        autoFocus={
-                                                            field.key ===
-                                                                'domain'
-                                                                ? true
-                                                                : false
-                                                        }
-                                                        options={
-                                                            optionsArray[index]
-                                                        }
-                                                        required
-                                                    />
-                                                    <span
-                                                        style={{
-                                                            marginTop: '10px',
+                                                            paddingTop: 3,
                                                         }}
                                                     >
-
-                                                        {field.description}
-                                                    </span>
+                                                        <Field
+                                                            className="db-select-nw"
+                                                            name={field.key}
+                                                            id={field.key}
+                                                            placeholder={
+                                                                field.placeholder
+                                                            }
+                                                            component={
+                                                                field.component
+                                                            }
+                                                            /*
+                                                             * disabled={
+                                                             *   sso &&
+                                                             *   sso.requesting
+                                                             * }
+                                                             */
+                                                            style={{
+                                                                width: '350px',
+                                                            }}
+                                                            autoFocus={
+                                                                field.key ===
+                                                                'domain'
+                                                                    ? true
+                                                                    : false
+                                                            }
+                                                            options={
+                                                                optionsArray[
+                                                                    index
+                                                                ]
+                                                            }
+                                                            required
+                                                        />
+                                                        <span
+                                                            style={{
+                                                                marginTop:
+                                                                    '10px',
+                                                            }}
+                                                        >
+                                                            {field.description}
+                                                        </span>
+                                                    </div>
                                                 </div>
-                                            </div>
-                                        ))}
+                                            );
+                                        })}
                                     </div>
                                 </fieldset>
                             </div>
@@ -196,9 +204,11 @@ const Form: Function = ({
                             <button
                                 id="save-button"
                                 className="bs-Button bs-Button--blue btn__modal"
-                            // disabled={updatingSso || addingSso}
-                            // type="submit"
-                            // autoFocus={formTitle === 'Update SSO'}
+                                /*
+                                 * disabled={updatingSso || addingSso}
+                                 * type="submit"
+                                 * autoFocus={formTitle === 'Update SSO'}
+                                 */
                             >
                                 <span>Save</span>
                                 <span className="create-btn__keycode">
@@ -232,52 +242,53 @@ Form.propTypes = {
 };
 
 export const CreateDefaultRoleModal: $TSFixMe = connect(
-    state => ({
-        formTitle: 'Create New Default Role',
+    state => {
+        return {
+            formTitle: 'Create New Default Role',
 
-        ssos: state.sso.ssos.ssos,
+            ssos: state.sso.ssos.ssos,
 
-        projects: state.project.projects.projects,
+            projects: state.project.projects.projects,
 
-        errorMessage: state.ssoDefaultRoles.addSsoDefaultRole.error,
-    }),
-    dispatch => ({
-        onSubmit: ({
-            data
+            errorMessage: state.ssoDefaultRoles.addSsoDefaultRole.error,
+        };
+    },
+    dispatch => {
+        return {
+            onSubmit: ({ data }: $TSFixMe) => {
+                return dispatch(addSsoDefaultRole({ data }));
+            },
 
-        }: $TSFixMe) => dispatch(addSsoDefaultRole({ data })),
-
-        fetchSsoDefaultRoles: () => dispatch(fetchSsoDefaultRoles()),
-    })
+            fetchSsoDefaultRoles: () => {
+                return dispatch(fetchSsoDefaultRoles());
+            },
+        };
+    }
 )(ReduxConnectedForm);
 
 export const UpdateDefaultRoleModal: $TSFixMe = connect(
     state => {
         const initialValues: $TSFixMe = {
-
             ...state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole,
 
             ...(state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole.domain
                 ? {
-                    domain:
-
-                        state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole
-                            .domain._id,
-                }
+                      domain: state.ssoDefaultRoles.ssoDefaultRole
+                          .ssoDefaultRole.domain._id,
+                  }
                 : {
-                    domain: null,
-                }),
+                      domain: null,
+                  }),
 
             ...(state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole.project
                 ? {
-                    project:
-
-                        state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole
-                            .project._id,
-                }
+                      project:
+                          state.ssoDefaultRoles.ssoDefaultRole.ssoDefaultRole
+                              .project._id,
+                  }
                 : {
-                    project: null,
-                }),
+                      project: null,
+                  }),
         };
         return {
             initialValues,
@@ -289,14 +300,15 @@ export const UpdateDefaultRoleModal: $TSFixMe = connect(
             errorMessage: state.ssoDefaultRoles.updateSsoDefaultRole.error,
         };
     },
-    dispatch => ({
-        onSubmit: ({
-            id,
-            data
-        }: $TSFixMe) =>
+    dispatch => {
+        return {
+            onSubmit: ({ id, data }: $TSFixMe) => {
+                return dispatch(updateSsoDefaultRole({ id, data }));
+            },
 
-            dispatch(updateSsoDefaultRole({ id, data })),
-
-        fetchSsoDefaultRoles: () => dispatch(fetchSsoDefaultRoles()),
-    })
+            fetchSsoDefaultRoles: () => {
+                return dispatch(fetchSsoDefaultRoles());
+            },
+        };
+    }
 )(ReduxConnectedForm);
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/RoleDeleteModal.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/RoleDeleteModal.tsx
index a9ede4ea76..4dba97e6bd 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/RoleDeleteModal.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/RoleDeleteModal.tsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 
 class RoleDeleteModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -17,10 +16,8 @@ class RoleDeleteModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -28,12 +25,13 @@ class RoleDeleteModal extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { confirmThisDialog, closeThisDialog }: $TSFixMe = this.props;
 
         return (
             <div
-                onKeyDown={e => e.key === 'Escape' && closeThisDialog()}
+                onKeyDown={e => {
+                    return e.key === 'Escape' && closeThisDialog();
+                }}
                 className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center"
             >
                 <div
@@ -88,10 +86,8 @@ class RoleDeleteModal extends Component<ComponentProps> {
     }
 }
 
-
 RoleDeleteModal.displayName = 'RoleDeleteModal';
 
-
 RoleDeleteModal.propTypes = {
     confirmThisDialog: PropTypes.func.isRequired,
     closeThisDialog: PropTypes.func,
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Table.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Table.tsx
index 16ed8f9871..5335cdd30f 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Table.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/Table.tsx
@@ -2,14 +2,14 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import TableBody from './TableBody';
 import TableHeader from './TableHeader';
-const Table: Function = ({
-    ssoDefaultRoles
-}: $TSFixMe) => (
-    <table className="Table">
-        <TableHeader />
-        <TableBody ssoDefaultRoles={ssoDefaultRoles} />
-    </table>
-);
+const Table: Function = ({ ssoDefaultRoles }: $TSFixMe) => {
+    return (
+        <table className="Table">
+            <TableHeader />
+            <TableBody ssoDefaultRoles={ssoDefaultRoles} />
+        </table>
+    );
+};
 
 Table.displayName = 'Table';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableBody.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableBody.tsx
index f61e58ec4a..45b8470718 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableBody.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableBody.tsx
@@ -3,19 +3,19 @@ import PropTypes from 'prop-types';
 import TableRow from './TableRow';
 import TableEmptyRow from './TableEmptyRow';
 
-const TableBody: Function = ({
-    ssoDefaultRoles
-}: $TSFixMe) => (
-    <tbody className="Table-body">
-        {ssoDefaultRoles.length ? (
-            ssoDefaultRoles.map((item: $TSFixMe, index: $TSFixMe) => (
-                <TableRow key={index} data={item} />
-            ))
-        ) : (
-            <TableEmptyRow />
-        )}
-    </tbody>
-);
+const TableBody: Function = ({ ssoDefaultRoles }: $TSFixMe) => {
+    return (
+        <tbody className="Table-body">
+            {ssoDefaultRoles.length ? (
+                ssoDefaultRoles.map((item: $TSFixMe, index: $TSFixMe) => {
+                    return <TableRow key={index} data={item} />;
+                })
+            ) : (
+                <TableEmptyRow />
+            )}
+        </tbody>
+    );
+};
 
 TableBody.displayName = 'TableBody';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableEmptyRow.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableEmptyRow.tsx
index 9173ecec78..966c428fb0 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableEmptyRow.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableEmptyRow.tsx
@@ -1,33 +1,34 @@
 import React from 'react';
 
-const TableEmptyRow: Function = () => (
-    <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-            style={{
-                height: '1px',
-                minWidth: '270px',
-            }}
-
-            colSpan="5"
-        >
-            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                    <div
-                        id="no-sso-message"
-                        style={{
-                            textAlign: 'center',
-                            marginTop: '10px',
-                        }}
-                        className="Box-root Margin-right--16"
-                    >
-                        <span>No Roles created yet</span>
-                    </div>
-                </span>
-            </div>
-        </td>
-    </tr>
-);
+const TableEmptyRow: Function = () => {
+    return (
+        <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                style={{
+                    height: '1px',
+                    minWidth: '270px',
+                }}
+                colSpan="5"
+            >
+                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                        <div
+                            id="no-sso-message"
+                            style={{
+                                textAlign: 'center',
+                                marginTop: '10px',
+                            }}
+                            className="Box-root Margin-right--16"
+                        >
+                            <span>No Roles created yet</span>
+                        </div>
+                    </span>
+                </div>
+            </td>
+        </tr>
+    );
+};
 
 TableEmptyRow.displayName = 'TableEmptyRow';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableHeader.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableHeader.tsx
index ca4c0ab1dc..c42145678a 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableHeader.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableHeader.tsx
@@ -1,81 +1,82 @@
 import React from 'react';
-const TableHeader: Function = () => (
-    <thead className="Table-body">
-        <tr className="Table-row db-ListViewItem db-ListViewItem-header">
-            <td
-                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{
-                    height: '1px',
-                    minWidth: '270px',
-                }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
-                        <span>domain</span>
-                    </span>
-                </div>
-            </td>
-            <td
-                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{
-                    height: '1px',
-                    minWidth: '270px',
-                }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
-                        <span>Project</span>
-                    </span>
-                </div>
-            </td>
-            <td
-                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{
-                    height: '1px',
-                    minWidth: '130px',
-                }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
-                        <span>Role</span>
-                    </span>
-                </div>
-            </td>
+const TableHeader: Function = () => {
+    return (
+        <thead className="Table-body">
+            <tr className="Table-row db-ListViewItem db-ListViewItem-header">
+                <td
+                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{
+                        height: '1px',
+                        minWidth: '270px',
+                    }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
+                            <span>domain</span>
+                        </span>
+                    </div>
+                </td>
+                <td
+                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{
+                        height: '1px',
+                        minWidth: '270px',
+                    }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
+                            <span>Project</span>
+                        </span>
+                    </div>
+                </td>
+                <td
+                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{
+                        height: '1px',
+                        minWidth: '130px',
+                    }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
+                            <span>Role</span>
+                        </span>
+                    </div>
+                </td>
 
-            <td
-                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{ height: '1px' }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
-                        <span>actions</span>
-                    </span>
-                </div>
-            </td>
-            <td
-                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{ height: '1px' }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
-                        <span>Created At</span>
-                    </span>
-                </div>
-            </td>
-            <td
-                id="overflow"
-
-                type="action"
-                className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                style={{ height: '1px' }}
-            >
-                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    <span className="db-ListViewItem-text Text-align--right Text-color--dark Text-display--block Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap"></span>
-                </div>
-            </td>
-        </tr>
-    </thead>
-);
+                <td
+                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{ height: '1px' }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
+                            <span>actions</span>
+                        </span>
+                    </div>
+                </td>
+                <td
+                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{ height: '1px' }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-color--dark Text-display--inline Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap">
+                            <span>Created At</span>
+                        </span>
+                    </div>
+                </td>
+                <td
+                    id="overflow"
+                    type="action"
+                    className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                    style={{ height: '1px' }}
+                >
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        <span className="db-ListViewItem-text Text-align--right Text-color--dark Text-display--block Text-fontSize--13 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--upper Text-wrap--wrap"></span>
+                    </div>
+                </td>
+            </tr>
+        </thead>
+    );
+};
 
 TableHeader.displayName = 'TableHeader';
 
diff --git a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableRow.tsx b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableRow.tsx
index 1d1c8911be..79d284fa0e 100644
--- a/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableRow.tsx
+++ b/AdminDashboard/src/Components/Settings/ssoDefaultRoles/TableRow.tsx
@@ -5,7 +5,7 @@ import {
     deleteSsoDefaultRole,
 } from '../../../actions/ssoDefaultRoles';
 import { connect } from 'react-redux';
-import { bindActionCreators, Dispatch } from 'redux';
+import { bindActionCreators } from 'redux';
 import { openModal } from '../../../actions/Modal';
 import RoleDeleteModal from './RoleDeleteModal';
 import { UpdateDefaultRoleModal } from './DefaultRoleModal';
@@ -15,114 +15,120 @@ const TableRow: Function = ({
     data,
     fetchSsoDefaultRole,
     deleteSsoDefaultRole,
-    openModal
-}: $TSFixMe) => (
-    <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-            style={{
-                height: '1px',
-                minWidth: '270px',
-            }}
-        >
-            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                    <div className="Box-root Margin-right--16">
-                        <span>{data && data.domain && data.domain.domain}</span>
-                    </div>
-                </span>
-            </div>
-        </td>
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-            style={{
-                height: '1px',
-                minWidth: '270px',
-            }}
-        >
-            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                    <div className="Box-root Margin-right--16">
-                        <span>
-                            {data && data.project && (
-                                <>
-                                    {data.project._id}/
-                                    <br />
-                                    {data.project.name}
-                                </>
-                            )}
-                        </span>
-                    </div>
-                </span>
-            </div>
-        </td>
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-            style={{
-                height: '1px',
-                minWidth: '130px',
-            }}
-        >
-            <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                    <div className="Box-root Margin-right--16">
-                        <span>{data && data.role}</span>
-                    </div>
-                </span>
-            </div>
-        </td>
-
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-            style={{ height: '1px' }}
-        >
-            <div className="db-ListViewItem-link">
-                <button
-                    className="bs-Button bs-Button--blue Box-background--blue edit-button"
-                    onClick={() => {
-                        fetchSsoDefaultRole(data && data._id);
-                        openModal({
-                            onConfirm: async () => {
-                                return await deleteSsoDefaultRole(
-                                    data && data._id
-                                );
-                            },
-                            content: UpdateDefaultRoleModal,
-                        });
-                    }}
-                >
-                    Edit
-                </button>
-                <button
-                    className="bs-Button bs-Button--red Box-background--red delete-button"
-                    onClick={() =>
-                        openModal({
-                            onConfirm: async () => {
-                                return await deleteSsoDefaultRole(
-                                    data && data._id
-                                );
-                            },
-                            content: RoleDeleteModal,
-                        })
-                    }
-                >
-                    Delete
-                </button>
-            </div>
-        </td>
-        <td
-            className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-            style={{ height: '1px' }}
-        >
-            <div className="db-ListViewItem-link">
+    openModal,
+}: $TSFixMe) => {
+    return (
+        <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                style={{
+                    height: '1px',
+                    minWidth: '270px',
+                }}
+            >
                 <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                    {data && data.createdAt && moment(data.createdAt).fromNow()}
+                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                        <div className="Box-root Margin-right--16">
+                            <span>
+                                {data && data.domain && data.domain.domain}
+                            </span>
+                        </div>
+                    </span>
                 </div>
-            </div>
-        </td>
-        <td className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"></td>
-    </tr>
-);
+            </td>
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                style={{
+                    height: '1px',
+                    minWidth: '270px',
+                }}
+            >
+                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                        <div className="Box-root Margin-right--16">
+                            <span>
+                                {data && data.project && (
+                                    <>
+                                        {data.project._id}/
+                                        <br />
+                                        {data.project.name}
+                                    </>
+                                )}
+                            </span>
+                        </div>
+                    </span>
+                </div>
+            </td>
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                style={{
+                    height: '1px',
+                    minWidth: '130px',
+                }}
+            >
+                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                        <div className="Box-root Margin-right--16">
+                            <span>{data && data.role}</span>
+                        </div>
+                    </span>
+                </div>
+            </td>
+
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                style={{ height: '1px' }}
+            >
+                <div className="db-ListViewItem-link">
+                    <button
+                        className="bs-Button bs-Button--blue Box-background--blue edit-button"
+                        onClick={() => {
+                            fetchSsoDefaultRole(data && data._id);
+                            openModal({
+                                onConfirm: async () => {
+                                    return await deleteSsoDefaultRole(
+                                        data && data._id
+                                    );
+                                },
+                                content: UpdateDefaultRoleModal,
+                            });
+                        }}
+                    >
+                        Edit
+                    </button>
+                    <button
+                        className="bs-Button bs-Button--red Box-background--red delete-button"
+                        onClick={() => {
+                            return openModal({
+                                onConfirm: async () => {
+                                    return await deleteSsoDefaultRole(
+                                        data && data._id
+                                    );
+                                },
+                                content: RoleDeleteModal,
+                            });
+                        }}
+                    >
+                        Delete
+                    </button>
+                </div>
+            </td>
+            <td
+                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                style={{ height: '1px' }}
+            >
+                <div className="db-ListViewItem-link">
+                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                        {data &&
+                            data.createdAt &&
+                            moment(data.createdAt).fromNow()}
+                    </div>
+                </div>
+            </td>
+            <td className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"></td>
+        </tr>
+    );
+};
 
 TableRow.displayName = 'ssoDefaultTableRow';
 
@@ -132,13 +138,13 @@ TableRow.propTypes = {
     deleteSsoDefaultRole: PropTypes.func,
     openModal: PropTypes.func,
 };
-export default connect(null, dispatch =>
-    bindActionCreators(
+export default connect(null, dispatch => {
+    return bindActionCreators(
         {
             openModal,
             fetchSsoDefaultRole,
             deleteSsoDefaultRole,
         },
         dispatch
-    )
-)(TableRow);
+    );
+})(TableRow);
diff --git a/AdminDashboard/src/Components/Settings/twilio.tsx b/AdminDashboard/src/Components/Settings/twilio.tsx
index f2745b0c4c..aedcce1d76 100644
--- a/AdminDashboard/src/Components/Settings/twilio.tsx
+++ b/AdminDashboard/src/Components/Settings/twilio.tsx
@@ -14,70 +14,66 @@ function validate(values: $TSFixMe) {
     const errors: $TSFixMe = {};
 
     if (!Validate.text(values['account-sid'])) {
-
         errors['account-sid'] = 'Account SID is not valid.';
     }
 
     if (!Validate.text(values['authentication-token'])) {
-
         errors['authentication-token'] = 'Authentication token is not valid.';
     }
 
     if (!Validate.text(values.phone)) {
-
         errors.phone = 'Phone is not valid.';
     }
 
     if (!Validate.number(values['alert-limit'])) {
-
         errors['alert-limit'] = 'Alert limit is not valid.';
     }
 
     return errors;
 }
 
-const  settingsType: string = 'twilio';
+const settingsType: string = 'twilio';
 
 const fields: $TSFixMe = [
     {
         key: 'call-enabled',
         label: 'Enable Call Alerts',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="call-enabled"
-                    id="call-enabled"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="call-enabled"
+                        id="call-enabled"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
     },
     {
         key: 'sms-enabled',
         label: 'Enable SMS Alerts',
 
-        component: ({
-            input: { value, onChange }
-        }: $TSFixMe) => (
-            <label className="Toggler-wrap">
-                <input
-                    className="btn-toggler"
-                    checked={value}
-                    onChange={onChange}
-                    type="checkbox"
-                    name="sms-enabled"
-                    id="sms-enabled"
-                />
-                <span className="TogglerBtn-slider round"></span>
-            </label>
-        ),
+        component: ({ input: { value, onChange } }: $TSFixMe) => {
+            return (
+                <label className="Toggler-wrap">
+                    <input
+                        className="btn-toggler"
+                        checked={value}
+                        onChange={onChange}
+                        type="checkbox"
+                        name="sms-enabled"
+                        id="sms-enabled"
+                    />
+                    <span className="TogglerBtn-slider round"></span>
+                </label>
+            );
+        },
     },
     {
         key: 'account-sid',
@@ -106,22 +102,19 @@ const fields: $TSFixMe = [
     },
 ];
 
-export class Component extends Component<ComponentProps>{
+export class Component extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
     handleKeyBoard: $TSFixMe;
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         await this.props.fetchSettings(settingsType);
     }
 
     submitForm = (values: $TSFixMe) => {
-
         this.props.saveSettings(settingsType, values);
     };
 
     override render() {
-
         const { settings, handleSubmit }: $TSFixMe = this.props;
         return (
             <div
@@ -154,40 +147,44 @@ export class Component extends Component<ComponentProps>{
                                 <div className="bs-Fieldset-wrapper Box-root Margin-bottom--2">
                                     <fieldset className="bs-Fieldset">
                                         <div className="bs-Fieldset-rows">
-                                            {fields.map(field => (
-                                                <div
-                                                    key={field.key}
-                                                    className="bs-Fieldset-row"
-                                                >
-                                                    <label className="bs-Fieldset-label">
-                                                        {field.label}
-                                                    </label>
+                                            {fields.map(field => {
+                                                return (
                                                     <div
-                                                        className="bs-Fieldset-fields"
-                                                        style={{
-                                                            paddingTop: 3,
-                                                        }}
+                                                        key={field.key}
+                                                        className="bs-Fieldset-row"
                                                     >
-                                                        <Field
-                                                            className="db-BusinessSettings-input TextInput bs-TextInput"
-                                                            type={field.type}
-                                                            name={field.key}
-                                                            id={field.key}
-                                                            placeholder={
-                                                                field.placeholder ||
-                                                                field.label
-                                                            }
-                                                            component={
-                                                                field.component
-                                                            }
-                                                            disabled={
-                                                                settings &&
-                                                                settings.requesting
-                                                            }
-                                                        />
+                                                        <label className="bs-Fieldset-label">
+                                                            {field.label}
+                                                        </label>
+                                                        <div
+                                                            className="bs-Fieldset-fields"
+                                                            style={{
+                                                                paddingTop: 3,
+                                                            }}
+                                                        >
+                                                            <Field
+                                                                className="db-BusinessSettings-input TextInput bs-TextInput"
+                                                                type={
+                                                                    field.type
+                                                                }
+                                                                name={field.key}
+                                                                id={field.key}
+                                                                placeholder={
+                                                                    field.placeholder ||
+                                                                    field.label
+                                                                }
+                                                                component={
+                                                                    field.component
+                                                                }
+                                                                disabled={
+                                                                    settings &&
+                                                                    settings.requesting
+                                                                }
+                                                            />
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            ))}
+                                                );
+                                            })}
                                         </div>
                                     </fieldset>
                                 </div>
@@ -235,10 +232,8 @@ export class Component extends Component<ComponentProps>{
     }
 }
 
-
 Component.displayName = 'SettingsForm';
 
-
 Component.propTypes = {
     settings: PropTypes.object.isRequired,
     handleSubmit: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/SmsLogs/DeleteConfirmationModal.tsx b/AdminDashboard/src/Components/SmsLogs/DeleteConfirmationModal.tsx
index 5cca0edf86..a359ec5c63 100644
--- a/AdminDashboard/src/Components/SmsLogs/DeleteConfirmationModal.tsx
+++ b/AdminDashboard/src/Components/SmsLogs/DeleteConfirmationModal.tsx
@@ -10,7 +10,6 @@ import { deleteSmsLogs } from '../../actions/smsLogs';
 import { FormLoader } from '../basic/Loader';
 
 class DeleteConfirmationModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +24,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
                 return this.handleDelete();
@@ -35,8 +33,8 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     };
 
     handleDelete = () => {
-
-        const { error, deleteSmsLogs, closeModal, modalId }: $TSFixMe = this.props;
+        const { error, deleteSmsLogs, closeModal, modalId }: $TSFixMe =
+            this.props;
         deleteSmsLogs().then(() => {
             if (!error) {
                 return closeModal({ id: modalId });
@@ -44,7 +42,6 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
         });
     };
     override render() {
-
         const { closeThisDialog, deleteRequest, error }: $TSFixMe = this.props;
 
         return (
@@ -102,8 +99,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <button
                                             id="cancelSmsDelete"
-                                            className={`bs-Button btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={deleteRequest}
@@ -115,8 +114,10 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${deleteRequest &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                deleteRequest &&
+                                                'bs-is-disabled'
+                                            }`}
                                             onClick={this.handleDelete}
                                             disabled={deleteRequest}
                                             autoFocus={true}
@@ -144,18 +145,20 @@ class DeleteConfirmationModal extends Component<ComponentProps> {
     }
 }
 
-const mapStateToProps: Function = (state: RootState) => ({
-    deleteRequest: state.smsLogs.smsLogs.deleteRequest,
-    error: state.smsLogs.smsLogs.error,
-    modalId: state.modal.modals[0].id
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ closeModal, deleteSmsLogs }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        deleteRequest: state.smsLogs.smsLogs.deleteRequest,
+        error: state.smsLogs.smsLogs.error,
+        modalId: state.modal.modals[0].id,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ closeModal, deleteSmsLogs }, dispatch);
+};
 
 DeleteConfirmationModal.displayName = 'Delete Confirmation Modal';
 
-
 DeleteConfirmationModal.propTypes = {
     closeThisDialog: PropTypes.func,
     deleteRequest: PropTypes.bool,
diff --git a/AdminDashboard/src/Components/SmsLogs/SmsLogsContentViewModal.tsx b/AdminDashboard/src/Components/SmsLogs/SmsLogsContentViewModal.tsx
index 9fc8837696..ea54bfca77 100644
--- a/AdminDashboard/src/Components/SmsLogs/SmsLogsContentViewModal.tsx
+++ b/AdminDashboard/src/Components/SmsLogs/SmsLogsContentViewModal.tsx
@@ -5,7 +5,6 @@ import { connect } from 'react-redux';
 import ClickOutside from 'react-click-outside';
 import ShouldRender from '../basic/ShouldRender';
 class SmsLogsContentViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,7 +19,6 @@ class SmsLogsContentViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -28,8 +26,8 @@ class SmsLogsContentViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
 
         return (
             <div className="db-SmsLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
@@ -99,8 +97,9 @@ class SmsLogsContentViewModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -122,7 +121,6 @@ class SmsLogsContentViewModal extends Component<ComponentProps> {
     }
 }
 
-
 SmsLogsContentViewModal.displayName = 'SmsLogsContentViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -138,7 +136,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 SmsLogsContentViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/SmsLogs/SmsLogsErrorViewModal.tsx b/AdminDashboard/src/Components/SmsLogs/SmsLogsErrorViewModal.tsx
index 4b1233e431..7e2116a46c 100644
--- a/AdminDashboard/src/Components/SmsLogs/SmsLogsErrorViewModal.tsx
+++ b/AdminDashboard/src/Components/SmsLogs/SmsLogsErrorViewModal.tsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import ShouldRender from '../basic/ShouldRender';
 class SmsLogsErrorViewModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -18,7 +17,6 @@ class SmsLogsErrorViewModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             default:
                 return false;
@@ -26,8 +24,8 @@ class SmsLogsErrorViewModal extends Component<ComponentProps> {
     };
 
     override render() {
-
-        const { isRequesting, error, closeThisDialog, content }: $TSFixMe = this.props;
+        const { isRequesting, error, closeThisDialog, content }: $TSFixMe =
+            this.props;
         return (
             <div className="db-SmsLogsContentViewModal ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center">
                 <div
@@ -78,8 +76,9 @@ class SmsLogsErrorViewModal extends Component<ComponentProps> {
                                         </div>
                                     </ShouldRender>
                                     <button
-                                        className={`bs-Button btn__modal ${isRequesting &&
-                                            'bs-is-disabled'}`}
+                                        className={`bs-Button btn__modal ${
+                                            isRequesting && 'bs-is-disabled'
+                                        }`}
                                         type="button"
                                         onClick={closeThisDialog}
                                         disabled={isRequesting}
@@ -100,7 +99,6 @@ class SmsLogsErrorViewModal extends Component<ComponentProps> {
     }
 }
 
-
 SmsLogsErrorViewModal.displayName = 'SmsLogsErrorViewModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -116,7 +114,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 SmsLogsErrorViewModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/SmsLogs/SmsLogsList.tsx b/AdminDashboard/src/Components/SmsLogs/SmsLogsList.tsx
index 03c8abf7e0..f8870ad5f2 100644
--- a/AdminDashboard/src/Components/SmsLogs/SmsLogsList.tsx
+++ b/AdminDashboard/src/Components/SmsLogs/SmsLogsList.tsx
@@ -15,7 +15,7 @@ import ShouldRender from '../basic/ShouldRender';
 
 import { history, RootState } from '../../store';
 
-export class SmsLogsList extends Component<ComponentProps>{
+export class SmsLogsList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -25,7 +25,6 @@ export class SmsLogsList extends Component<ComponentProps>{
     }
 
     handleDelete = () => {
-
         const { openModal }: $TSFixMe = this.props;
 
         const { deleteModalId }: $TSFixMe = this.state;
@@ -38,7 +37,6 @@ export class SmsLogsList extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -47,58 +45,46 @@ export class SmsLogsList extends Component<ComponentProps>{
 
     override render() {
         if (
-
             this.props.smsLogs &&
-
             this.props.smsLogs.skip &&
-
             typeof this.props.smsLogs.skip === 'string'
         ) {
-
             this.props.smsLogs.skip = parseInt(this.props.smsLogs.skip, 10);
         }
         if (
-
             this.props.smsLogs &&
-
             this.props.smsLogs.limit &&
-
             typeof this.props.smsLogs.limit === 'string'
         ) {
-
             this.props.smsLogs.limit = parseInt(this.props.smsLogs.limit, 10);
         }
 
-        if (!this.props.smsLogs.skip) this.props.smsLogs.skip = 0;
+        if (!this.props.smsLogs.skip) {
+            this.props.smsLogs.skip = 0;
+        }
 
-        if (!this.props.smsLogs.limit) this.props.smsLogs.limit = 0;
+        if (!this.props.smsLogs.limit) {
+            this.props.smsLogs.limit = 0;
+        }
 
         let canNext =
-
             this.props.smsLogs &&
-
-                this.props.smsLogs.count &&
-
-                this.props.smsLogs.count >
-
+            this.props.smsLogs.count &&
+            this.props.smsLogs.count >
                 this.props.smsLogs.skip + this.props.smsLogs.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.smsLogs && this.props.smsLogs.skip <= 0 ? false : true;
 
         if (
-
             this.props.smsLogs &&
-
             (this.props.requesting || !this.props.smsLogs.smsLogs)
         ) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.smsLogs && this.props.smsLogs.count) / 10
         );
         return (
@@ -173,7 +159,6 @@ export class SmsLogsList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -194,223 +179,206 @@ export class SmsLogsList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.smsLogs &&
-
-                                this.props.smsLogs.smsLogs &&
-
-                                this.props.smsLogs.smsLogs.length > 0 ? (
-
-                                this.props.smsLogs.smsLogs.map((smsLog: $TSFixMe) => {
-                                    return (
-                                        <tr
-                                            key={smsLog._id}
-                                            className="Table-row db-ListViewItem bs-ActionsParent"
-                                        >
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{
-                                                    height: '1px',
-                                                }}
+                              this.props.smsLogs.smsLogs &&
+                              this.props.smsLogs.smsLogs.length > 0 ? (
+                                this.props.smsLogs.smsLogs.map(
+                                    (smsLog: $TSFixMe) => {
+                                        return (
+                                            <tr
+                                                key={smsLog._id}
+                                                className="Table-row db-ListViewItem bs-ActionsParent"
                                             >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <div
-                                                                className={`Badge Badge--color--${smsLog.status ===
-                                                                    'Success'
-                                                                    ? 'green'
-                                                                    : 'red'
-                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
-                                                            >
-                                                                <span
-                                                                    className={`Badge-text Text-color--${smsLog.status ===
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{
+                                                        height: '1px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <div
+                                                                    className={`Badge Badge--color--${
+                                                                        smsLog.status ===
                                                                         'Success'
-                                                                        ? 'green'
-                                                                        : 'red'
-                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
+                                                                            ? 'green'
+                                                                            : 'red'
+                                                                    } Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2`}
                                                                 >
-                                                                    <span>
-                                                                        {smsLog.status
-                                                                            ? smsLog.status
-                                                                            : 'N/A'}
-                                                                    </span>
-                                                                </span>
-                                                            </div>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                    cursor: 'pointer',
-
-                                                    textDecoration: smsLog.projectId
-                                                        ? 'underline'
-                                                        : null,
-                                                }}
-                                                onClick={() => {
-                                                    history.push(
-                                                        '/admin/projects/' +
-                                                        smsLog.projectId._id
-                                                    );
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    {smsLog.projectId
-                                                                        ? smsLog
-                                                                            .projectId
-                                                                            .name
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{
-                                                    height: '1px',
-                                                    cursor: 'pointer',
-
-                                                    textDecoration: smsLog.userId
-                                                        ? 'underline'
-                                                        : null,
-                                                }}
-                                                onClick={() => {
-                                                    if (smsLog.userId) {
-                                                        history.push(
-                                                            '/admin/users/' +
-                                                            smsLog.userId
-                                                                ._id
-                                                        );
-                                                    }
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <span>
-                                                                {smsLog.userId
-                                                                    ? smsLog
-                                                                        .userId
-                                                                        .name
-                                                                    : 'N/A'}
-                                                            </span>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {smsLog.sentTo
-                                                                        ? smsLog.sentTo
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <span>
-                                                                    {smsLog.createdAt
-                                                                        ? moment
-                                                                            .utc(
-                                                                                smsLog.createdAt
-                                                                            )
-                                                                            .local()
-                                                                            .format(
-                                                                                'ddd, YYYY/MM/DD, h:mm:ss'
-                                                                            )
-                                                                        : 'N/A'}
-                                                                </span>
-                                                            </div>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div
-                                                        className="db-ListViewItem-cellContent Box-root Padding-all--8"
-                                                        style={{
-                                                            float: 'right',
-                                                        }}
-                                                    >
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root">
-                                                                <span>
-                                                                    <button
-                                                                        onClick={() => {
-
-                                                                            this.props.openModal(
-                                                                                {
-                                                                                    id: uuidv4(),
-                                                                                    onConfirm: () => {
-                                                                                        return Promise.resolve();
-                                                                                    },
-                                                                                    content: (props: $TSFixMe) => <SmsLogsContentViewModal
-                                                                                        {...props}
-                                                                                        content={
-                                                                                            smsLog.content
-                                                                                        }
-                                                                                    />,
-                                                                                }
-                                                                            );
-                                                                        }}
-                                                                        id="view"
-                                                                        className="bs-Button"
+                                                                    <span
+                                                                        className={`Badge-text Text-color--${
+                                                                            smsLog.status ===
+                                                                            'Success'
+                                                                                ? 'green'
+                                                                                : 'red'
+                                                                        } Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap`}
                                                                     >
                                                                         <span>
-                                                                            View
-                                                                            Content
+                                                                            {smsLog.status
+                                                                                ? smsLog.status
+                                                                                : 'N/A'}
                                                                         </span>
-                                                                    </button>
-                                                                    {smsLog.error ? (
+                                                                    </span>
+                                                                </div>
+                                                            </div>
+                                                        </span>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                        cursor: 'pointer',
+
+                                                        textDecoration:
+                                                            smsLog.projectId
+                                                                ? 'underline'
+                                                                : null,
+                                                    }}
+                                                    onClick={() => {
+                                                        history.push(
+                                                            '/admin/projects/' +
+                                                                smsLog.projectId
+                                                                    ._id
+                                                        );
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
+                                                                        {smsLog.projectId
+                                                                            ? smsLog
+                                                                                  .projectId
+                                                                                  .name
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{
+                                                        height: '1px',
+                                                        cursor: 'pointer',
+
+                                                        textDecoration:
+                                                            smsLog.userId
+                                                                ? 'underline'
+                                                                : null,
+                                                    }}
+                                                    onClick={() => {
+                                                        if (smsLog.userId) {
+                                                            history.push(
+                                                                '/admin/users/' +
+                                                                    smsLog
+                                                                        .userId
+                                                                        ._id
+                                                            );
+                                                        }
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <span>
+                                                                    {smsLog.userId
+                                                                        ? smsLog
+                                                                              .userId
+                                                                              .name
+                                                                        : 'N/A'}
+                                                                </span>
+                                                            </div>
+                                                        </span>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {smsLog.sentTo
+                                                                            ? smsLog.sentTo
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--wrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <span>
+                                                                        {smsLog.createdAt
+                                                                            ? moment
+                                                                                  .utc(
+                                                                                      smsLog.createdAt
+                                                                                  )
+                                                                                  .local()
+                                                                                  .format(
+                                                                                      'ddd, YYYY/MM/DD, h:mm:ss'
+                                                                                  )
+                                                                            : 'N/A'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div
+                                                            className="db-ListViewItem-cellContent Box-root Padding-all--8"
+                                                            style={{
+                                                                float: 'right',
+                                                            }}
+                                                        >
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root">
+                                                                    <span>
                                                                         <button
                                                                             onClick={() => {
-
                                                                                 this.props.openModal(
                                                                                     {
                                                                                         id: uuidv4(),
-                                                                                        onConfirm: () => {
-                                                                                            return Promise.resolve();
-                                                                                        },
-                                                                                        content: (props: $TSFixMe) => <SmsLogsErrorViewModal
-                                                                                            {...props}
-                                                                                            content={
-                                                                                                smsLog.error
-                                                                                            }
-                                                                                        />,
+                                                                                        onConfirm:
+                                                                                            () => {
+                                                                                                return Promise.resolve();
+                                                                                            },
+                                                                                        content:
+                                                                                            (
+                                                                                                props: $TSFixMe
+                                                                                            ) => {
+                                                                                                return (
+                                                                                                    <SmsLogsContentViewModal
+                                                                                                        {...props}
+                                                                                                        content={
+                                                                                                            smsLog.content
+                                                                                                        }
+                                                                                                    />
+                                                                                                );
+                                                                                            },
                                                                                     }
                                                                                 );
                                                                             }}
@@ -419,19 +387,54 @@ export class SmsLogsList extends Component<ComponentProps>{
                                                                         >
                                                                             <span>
                                                                                 View
-                                                                                Error
+                                                                                Content
                                                                             </span>
                                                                         </button>
-                                                                    ) : null}
-                                                                </span>
-                                                            </div>
-                                                        </span>
+                                                                        {smsLog.error ? (
+                                                                            <button
+                                                                                onClick={() => {
+                                                                                    this.props.openModal(
+                                                                                        {
+                                                                                            id: uuidv4(),
+                                                                                            onConfirm:
+                                                                                                () => {
+                                                                                                    return Promise.resolve();
+                                                                                                },
+                                                                                            content:
+                                                                                                (
+                                                                                                    props: $TSFixMe
+                                                                                                ) => {
+                                                                                                    return (
+                                                                                                        <SmsLogsErrorViewModal
+                                                                                                            {...props}
+                                                                                                            content={
+                                                                                                                smsLog.error
+                                                                                                            }
+                                                                                                        />
+                                                                                                    );
+                                                                                                },
+                                                                                        }
+                                                                                    );
+                                                                                }}
+                                                                                id="view"
+                                                                                className="bs-Button"
+                                                                            >
+                                                                                <span>
+                                                                                    View
+                                                                                    Error
+                                                                                </span>
+                                                                            </button>
+                                                                        ) : null}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
-                                        </tr>
-                                    );
-                                })
+                                                </td>
+                                            </tr>
+                                        );
+                                    }
+                                )
                             ) : (
                                 <tr></tr>
                             )}
@@ -442,21 +445,15 @@ export class SmsLogsList extends Component<ComponentProps>{
                     id="logsStatus"
                     style={{ textAlign: 'center', marginTop: '10px' }}
                 >
-
                     {this.props.smsLogs &&
-
-                        (!this.props.smsLogs.smsLogs ||
-
-                            !this.props.smsLogs.smsLogs.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.smsLogs.error
+                    (!this.props.smsLogs.smsLogs ||
+                        !this.props.smsLogs.smsLogs.length) &&
+                    !this.props.requesting &&
+                    !this.props.smsLogs.error
                         ? "We don't have any logs yet"
                         : null}
 
                     {this.props.smsLogs && this.props.smsLogs.error
-
                         ? this.props.smsLogs.error
                         : null}
                 </div>
@@ -470,22 +467,17 @@ export class SmsLogsList extends Component<ComponentProps>{
                                 >
                                     <ShouldRender
                                         if={
-
                                             this.props.smsLogs &&
-
                                             this.props.smsLogs.count
                                         }
                                     >
-
                                         Page {this.props.page} of{' '}
                                         {numberOfPages} (
                                         <span id="sms-log-count">
-
                                             {this.props.smsLogs.count}
                                         </span>{' '}
                                         Log
                                         <ShouldRender
-
                                             if={this.props.smsLogs.count > 0}
                                         >
                                             s
@@ -502,9 +494,7 @@ export class SmsLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.smsLogs.skip,
 
                                             this.props.smsLogs.limit
@@ -529,9 +519,7 @@ export class SmsLogsList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.smsLogs.skip,
 
                                             this.props.smsLogs.limit
@@ -559,7 +547,6 @@ export class SmsLogsList extends Component<ComponentProps>{
                                     className={'Button bs-ButtonLegacy'}
                                     // data-db-analytics-name="list_view.pagination.next"
                                     type="button"
-
                                     disabled={this.props.requesting}
                                 >
                                     <div className="Button-fill bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
@@ -588,10 +575,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 SmsLogsList.displayName = 'ProjectList';
 
-
 SmsLogsList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/TimezoneSelect.tsx b/AdminDashboard/src/Components/TimezoneSelect.tsx
index 087705dfbf..a31a01ef4e 100644
--- a/AdminDashboard/src/Components/TimezoneSelect.tsx
+++ b/AdminDashboard/src/Components/TimezoneSelect.tsx
@@ -1,3415 +1,3417 @@
 import React from 'react';
-import { bindActionCreators, Dispatch } from 'redux';
+import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
-const TimezoneSelect: Function = () => (
-    <div>
-        <div className="bs-BIM">
-            <div className="ContextualLayer-layer--topleft ContextualLayer-layer--anytop ContextualLayer-layer--anyleft ContextualLayer-context--bottomleft ContextualLayer-context--anybottom ContextualLayer-context--anyleft ContextualLayer-container ContextualLayer--pointerEvents">
-                <div
-                    className="SearchableSelect-layerContents"
-                    style={{ width: '323px' }}
-                >
-                    <input
-                        aria-activedescendant="searchable-select-results-38-item-5"
-                        aria-autocomplete="list"
-                        aria-expanded="true"
-                        aria-haspopup="true"
-                        aria-owns="searchable-select-results-38"
-                        className="SearchableSelect-input"
-                        role="combobox"
-                        value=""
-                    />
+const TimezoneSelect: Function = () => {
+    return (
+        <div>
+            <div className="bs-BIM">
+                <div className="ContextualLayer-layer--topleft ContextualLayer-layer--anytop ContextualLayer-layer--anyleft ContextualLayer-context--bottomleft ContextualLayer-context--anybottom ContextualLayer-context--anyleft ContextualLayer-container ContextualLayer--pointerEvents">
                     <div
-                        className="ScrollableMenu SearchableSelect-items"
-                        id="searchable-select-results-38"
-                        role="listbox"
+                        className="SearchableSelect-layerContents"
+                        style={{ width: '323px' }}
                     >
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACDT/ACST - Adelaide
+                        <input
+                            aria-activedescendant="searchable-select-results-38-item-5"
+                            aria-autocomplete="list"
+                            aria-expanded="true"
+                            aria-haspopup="true"
+                            aria-owns="searchable-select-results-38"
+                            className="SearchableSelect-input"
+                            role="combobox"
+                            value=""
+                        />
+                        <div
+                            className="ScrollableMenu SearchableSelect-items"
+                            id="searchable-select-results-38"
+                            role="listbox"
+                        >
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACDT/ACST - Adelaide
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACDT/ACST - Broken Hill
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACDT/ACST - Broken Hill
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACDT/ACST - South
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACDT/ACST - South
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACDT/ACST - Yancowinna
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACDT/ACST - Yancowinna
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACST - Darwin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACST - Darwin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="true" role="option">
-                            <div>
-                                <div className="SearchableSelect-item SearchableSelect-item--highlighted">
-                                    ACST - North
+                            <div aria-selected="true" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item SearchableSelect-item--highlighted">
+                                        ACST - North
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ACWST - Eucla
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ACWST - Eucla
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - ACT
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - ACT
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Canberra
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Canberra
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Currie
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Currie
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Hobart
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Hobart
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Melbourne
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Melbourne
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - NSW
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - NSW
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Sydney
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Sydney
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Tasmania
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Tasmania
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEDT/AEST - Victoria
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEDT/AEST - Victoria
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEST - Brisbane
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEST - Brisbane
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEST - Lindeman
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEST - Lindeman
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AEST - Queensland
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AEST - Queensland
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AFT - Kabul
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AFT - Kabul
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Alaska
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Alaska
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Anchorage
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Anchorage
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Juneau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Juneau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Nome
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Nome
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Sitka
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Sitka
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AKST/AKDT - Yakutat
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AKST/AKDT - Yakutat
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ALMT - Almaty
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ALMT - Almaty
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMST/AMT - Campo Grande
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMST/AMT - Campo Grande
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMST/AMT - Cuiaba
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMST/AMT - Cuiaba
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Acre
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Acre
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Boa Vista
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Boa Vista
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Eirunepe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Eirunepe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Manaus
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Manaus
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Porto Acre
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Porto Acre
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Porto Velho
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Porto Velho
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Rio Branco
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Rio Branco
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - West
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - West
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AMT - Yerevan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AMT - Yerevan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ANAT - Anadyr
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ANAT - Anadyr
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AQTT - Aqtau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AQTT - Aqtau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AQTT - Aqtobe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AQTT - Aqtobe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Buenos Aires
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Buenos Aires
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Catamarca
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Catamarca
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Comod Rivadavia, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Comod Rivadavia, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Cordoba
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Cordoba
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Jujuy
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Jujuy
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - La Rioja, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - La Rioja, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Mendoza
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Mendoza
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Rio Gallegos, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Rio Gallegos, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Rosario
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Rosario
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Salta, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Salta, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - San Juan, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - San Juan, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - San Luis, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - San Luis, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Tucuman, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Tucuman, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ART - Ushuaia, Argentina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ART - Ushuaia, Argentina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Aden
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Aden
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Anguilla
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Anguilla
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Antigua
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Antigua
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Aruba
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Aruba
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Baghdad
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Baghdad
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Bahrain
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Bahrain
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Barbados
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Barbados
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Blanc-Sablon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Blanc-Sablon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Curacao
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Curacao
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Dominica
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Dominica
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Grenada
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Grenada
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Guadeloupe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Guadeloupe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Kralendijk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Kralendijk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Kuwait
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Kuwait
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Lower Princes
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Lower Princes
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Marigot
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Marigot
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Martinique
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Martinique
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Montserrat
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Montserrat
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Port of Spain
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Port of Spain
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Puerto Rico
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Puerto Rico
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Qatar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Qatar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Riyadh
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Riyadh
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Santo Domingo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Santo Domingo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - St Barthelemy
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - St Barthelemy
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - St Kitts
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - St Kitts
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - St Lucia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - St Lucia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - St Thomas
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - St Thomas
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - St Vincent
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - St Vincent
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Tortola
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Tortola
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST - Virgin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST - Virgin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Bermuda
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Bermuda
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Glace Bay
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Glace Bay
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Goose Bay
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Goose Bay
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Halifax
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Halifax
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Moncton
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Moncton
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AST/ADT - Thule
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AST/ADT - Thule
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AWST - Casey
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AWST - Casey
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AWST - Perth
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AWST - Perth
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AWST - West
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AWST - West
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AZOT/AZOST - Azores
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AZOT/AZOST - Azores
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    AZT/AZST - Baku
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        AZT/AZST - Baku
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BDT - Dacca
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BDT - Dacca
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BDT - Dhaka
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BDT - Dhaka
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BNT - Brunei
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BNT - Brunei
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BOT - La Paz
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BOT - La Paz
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRST/BRT - Araguaina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRST/BRT - Araguaina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRST/BRT - East
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRST/BRT - East
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRST/BRT - Sao Paulo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRST/BRT - Sao Paulo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Bahia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Bahia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Belem
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Belem
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Fortaleza
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Fortaleza
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Maceio
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Maceio
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Recife
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Recife
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BRT - Santarem
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BRT - Santarem
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BTT - Thimbu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BTT - Thimbu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    BTT - Thimphu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        BTT - Thimphu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Blantyre
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Blantyre
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Bujumbura
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Bujumbura
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Gaborone
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Gaborone
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Harare
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Harare
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Kigali
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Kigali
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Lubumbashi
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Lubumbashi
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Lusaka
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Lusaka
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CAT - Maputo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CAT - Maputo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CCT - Cocos
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CCT - Cocos
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET - Algiers
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET - Algiers
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET - Tunis
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET - Tunis
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Amsterdam
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Amsterdam
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Andorra
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Andorra
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Belgrade
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Belgrade
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Berlin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Berlin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Bratislava
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Bratislava
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Brussels
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Brussels
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Budapest
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Budapest
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Busingen
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Busingen
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Ceuta
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Ceuta
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Copenhagen
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Copenhagen
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Gibraltar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Gibraltar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Jan Mayen
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Jan Mayen
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Ljubljana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Ljubljana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Longyearbyen
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Longyearbyen
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Luxembourg
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Luxembourg
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Madrid
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Madrid
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Malta
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Malta
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Monaco
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Monaco
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Oslo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Oslo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Paris
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Paris
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Podgorica
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Podgorica
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Prague
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Prague
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Rome
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Rome
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - San Marino
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - San Marino
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Sarajevo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Sarajevo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Skopje
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Skopje
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Stockholm
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Stockholm
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Tirane
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Tirane
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Tripoli
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Tripoli
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Vaduz
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Vaduz
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Vatican
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Vatican
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Vienna
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Vienna
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Warsaw
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Warsaw
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Zagreb
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Zagreb
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CET/CEST - Zurich
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CET/CEST - Zurich
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CHADT/CHAST - Chatham
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CHADT/CHAST - Chatham
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CHOT - Choibalsan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CHOT - Choibalsan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CHUT - Chuuk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CHUT - Chuuk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CHUT - Truk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CHUT - Truk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CHUT - Yap
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CHUT - Yap
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CKT - Rarotonga
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CKT - Rarotonga
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CLST/CLT - Continental
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CLST/CLT - Continental
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CLST/CLT - Palmer
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CLST/CLT - Palmer
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CLST/CLT - Santiago
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CLST/CLT - Santiago
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    COT - Bogota
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        COT - Bogota
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Belize
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Belize
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Chongqing
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Chongqing
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Chungking
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Chungking
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Costa Rica
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Costa Rica
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - East-Saskatchewan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - East-Saskatchewan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - El Salvador
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - El Salvador
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Guatemala
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Guatemala
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Harbin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Harbin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Macao
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Macao
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Macau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Macau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Managua
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Managua
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Regina
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Regina
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Saskatchewan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Saskatchewan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Shanghai
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Shanghai
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Swift Current
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Swift Current
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Taipei
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Taipei
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST - Tegucigalpa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST - Tegucigalpa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Bahia Banderas
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Bahia Banderas
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Beulah, North Dakota
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Beulah, North Dakota
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Cancun
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Cancun
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Center, North Dakota
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Center, North Dakota
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Central
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Central
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Chicago
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Chicago
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - General
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - General
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Havana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Havana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Indiana-Starke
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Indiana-Starke
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Knox I&#39;N
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Knox I&#39;N
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Knox, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Knox, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Matamoros
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Matamoros
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Menominee
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Menominee
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Merida
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Merida
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Mexico City
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Mexico City
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Monterrey
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Monterrey
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - New Salem, North Dakota
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - New Salem, North Dakota
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Rainy River
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Rainy River
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Rankin Inlet
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Rankin Inlet
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Resolute
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Resolute
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Tell City, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Tell City, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CST/CDT - Winnipeg
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CST/CDT - Winnipeg
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CVT - Cape Verde
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CVT - Cape Verde
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    CXT - Christmas
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        CXT - Christmas
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ChST - Guam
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ChST - Guam
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ChST - Saipan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ChST - Saipan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    DAVT - Davis
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        DAVT - Davis
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    DDUT - Dumont D&#39;Urville
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        DDUT - Dumont D&#39;Urville
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EASST/EAST - Easter Island
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EASST/EAST - Easter Island
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Addis Ababa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Addis Ababa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Antananarivo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Antananarivo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Asmara
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Asmara
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Comoro
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Comoro
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Dar es Salaam
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Dar es Salaam
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Djibouti
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Djibouti
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Juba
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Juba
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Kampala
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Kampala
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Khartoum
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Khartoum
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Mayotte
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Mayotte
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Mogadishu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Mogadishu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EAT - Nairobi
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EAT - Nairobi
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ECT - Guayaquil
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ECT - Guayaquil
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EEST - Amman
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EEST - Amman
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET - Cairo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET - Cairo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Athens
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Athens
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Beirut
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Beirut
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Bucharest
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Bucharest
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Chisinau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Chisinau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Damascus
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Damascus
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Gaza
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Gaza
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Hebron
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Hebron
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Helsinki
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Helsinki
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Istanbul
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Istanbul
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Istanbul
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Istanbul
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Kiev
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Kiev
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Mariehamn
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Mariehamn
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Nicosia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Nicosia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Nicosia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Nicosia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Riga
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Riga
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Simferopol
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Simferopol
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Sofia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Sofia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Tallinn
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Tallinn
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Tiraspol
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Tiraspol
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Uzhgorod
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Uzhgorod
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Vilnius
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Vilnius
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EET/EEST - Zaporozhye
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EET/EEST - Zaporozhye
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EGT/EGST - Scoresbysund
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EGT/EGST - Scoresbysund
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST - Atikokan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST - Atikokan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST - Cayman
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST - Cayman
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST - Coral Harbour
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST - Coral Harbour
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST - Jamaica
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST - Jamaica
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST - Panama
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST - Panama
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Detroit
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Detroit
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - East-Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - East-Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Eastern
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Eastern
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Fort Wayne
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Fort Wayne
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Grand Turk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Grand Turk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Indianapolis
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Indianapolis
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Iqaluit
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Iqaluit
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Louisville
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Louisville
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Marengo, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Marengo, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Michigan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Michigan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Montreal
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Montreal
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Nassau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Nassau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - New York
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - New York
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Nipigon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Nipigon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Pangnirtung
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Pangnirtung
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Petersburg, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Petersburg, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Port-au-Prince
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Port-au-Prince
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Thunder Bay
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Thunder Bay
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Toronto
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Toronto
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Vevay, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Vevay, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Vincennes, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Vincennes, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    EST/EDT - Winamac, Indiana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        EST/EDT - Winamac, Indiana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FET - Kaliningrad
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FET - Kaliningrad
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FET - Minsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FET - Minsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FJST/FJT - Fiji
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FJST/FJT - Fiji
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FKST - Stanley
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FKST - Stanley
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FNT - De Noronha
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FNT - De Noronha
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    FNT - Noronha
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        FNT - Noronha
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GALT - Galapagos
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GALT - Galapagos
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GAMT - Gambier
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GAMT - Gambier
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GET - Tbilisi
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GET - Tbilisi
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GFT - Cayenne
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GFT - Cayenne
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GILT - Tarawa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GILT - Tarawa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Abidjan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Abidjan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Accra
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Accra
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Bamako
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Bamako
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Banjul
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Banjul
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Bissau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Bissau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Conakry
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Conakry
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Dakar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Dakar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Danmarkshavn
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Danmarkshavn
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Freetown
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Freetown
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Greenwich
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Greenwich
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Lome
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Lome
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Monrovia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Monrovia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Nouakchott
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Nouakchott
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Ouagadougou
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Ouagadougou
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Reykjavik
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Reykjavik
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Sao Tome
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Sao Tome
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - St Helena
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - St Helena
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT - Timbuktu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT - Timbuktu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/BST - Belfast
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/BST - Belfast
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/BST - Guernsey
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/BST - Guernsey
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/BST - Isle of Man
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/BST - Isle of Man
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/BST - Jersey
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/BST - Jersey
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/BST - London
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/BST - London
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GMT/IST - Dublin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GMT/IST - Dublin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GST - Dubai
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GST - Dubai
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GST - Muscat
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GST - Muscat
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GST - South Georgia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GST - South Georgia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    GYT - Guyana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        GYT - Guyana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HAST/HADT - Adak
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HAST/HADT - Adak
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HAST/HADT - Aleutian
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HAST/HADT - Aleutian
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HAST/HADT - Atka
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HAST/HADT - Atka
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HKT - Hong Kong
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HKT - Hong Kong
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HOVT - Hovd
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HOVT - Hovd
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HST - Hawaii
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HST - Hawaii
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HST - Honolulu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HST - Honolulu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    HST - Johnston
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        HST - Johnston
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ICT - Bangkok
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ICT - Bangkok
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ICT - Ho Chi Minh
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ICT - Ho Chi Minh
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ICT - Phnom Penh
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ICT - Phnom Penh
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ICT - Saigon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ICT - Saigon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ICT - Vientiane
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ICT - Vientiane
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IOT - Chagos
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IOT - Chagos
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IRKT - Irkutsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IRKT - Irkutsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IRST/IRDT - Tehran
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IRST/IRDT - Tehran
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IST - Calcutta
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IST - Calcutta
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IST - Colombo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IST - Colombo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IST - Kolkata
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IST - Kolkata
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IST/IDT - Jerusalem
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IST/IDT - Jerusalem
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    IST/IDT - Tel Aviv
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        IST/IDT - Tel Aviv
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    JST - Tokyo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        JST - Tokyo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    KGT - Bishkek
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        KGT - Bishkek
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    KOST - Kosrae
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        KOST - Kosrae
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    KRAT - Krasnoyarsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        KRAT - Krasnoyarsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    KST - Pyongyang
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        KST - Pyongyang
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    KST - Seoul
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        KST - Seoul
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    LHDT/LHST - LHI
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        LHDT/LHST - LHI
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    LHDT/LHST - Lord Howe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        LHDT/LHST - Lord Howe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    LINT - Kiritimati
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        LINT - Kiritimati
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MAGT - Magadan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MAGT - Magadan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MART - Marquesas
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MART - Marquesas
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MAWT - Mawson
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MAWT - Mawson
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MHT - Kwajalein
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MHT - Kwajalein
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MHT - Majuro
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MHT - Majuro
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MMT - Rangoon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MMT - Rangoon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MSK - Moscow
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MSK - Moscow
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MSK - Volgograd
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MSK - Volgograd
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST - Arizona
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST - Arizona
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST - Creston
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST - Creston
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST - Dawson Creek
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST - Dawson Creek
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST - Hermosillo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST - Hermosillo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST - Phoenix
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST - Phoenix
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Baja Sur
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Baja Sur
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Boise
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Boise
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Cambridge Bay
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Cambridge Bay
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Chihuahua
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Chihuahua
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Denver
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Denver
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Edmonton
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Edmonton
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Inuvik
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Inuvik
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Mazatlan
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Mazatlan
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Mountain
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Mountain
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Ojinaga
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Ojinaga
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Shiprock
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Shiprock
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MST/MDT - Yellowknife
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MST/MDT - Yellowknife
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MUT - Mauritius
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MUT - Mauritius
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MVT - Maldives
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MVT - Maldives
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MYT - Kuala Lumpur
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MYT - Kuala Lumpur
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    MYT - Kuching
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        MYT - Kuching
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NCT - Noumea
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NCT - Noumea
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NFT - Norfolk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NFT - Norfolk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NOVT - Novokuznetsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NOVT - Novokuznetsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NOVT - Novosibirsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NOVT - Novosibirsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NPT - Kathmandu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NPT - Kathmandu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NPT - Katmandu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NPT - Katmandu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NRT - Nauru
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NRT - Nauru
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NST/NDT - Newfoundland
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NST/NDT - Newfoundland
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NST/NDT - St Johns
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NST/NDT - St Johns
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NUT - Niue
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NUT - Niue
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NZDT/NZST - Auckland
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NZDT/NZST - Auckland
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NZDT/NZST - McMurdo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NZDT/NZST - McMurdo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    NZDT/NZST - South Pole
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        NZDT/NZST - South Pole
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    OMST - Omsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        OMST - Omsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ORAT - Oral
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ORAT - Oral
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PET - Lima
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PET - Lima
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PETT - Kamchatka
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PETT - Kamchatka
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PGT - Port Moresby
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PGT - Port Moresby
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PHOT - Enderbury
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PHOT - Enderbury
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PHT - Manila
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PHT - Manila
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PKT - Karachi
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PKT - Karachi
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PMST/PMDT - Miquelon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PMST/PMDT - Miquelon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PONT - Pohnpei
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PONT - Pohnpei
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PONT - Ponape
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PONT - Ponape
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST - Metlakatla
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST - Metlakatla
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST - Pitcairn
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST - Pitcairn
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Baja Norte
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Baja Norte
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Dawson
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Dawson
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Ensenada
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Ensenada
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Los Angeles
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Los Angeles
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Pacific
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Pacific
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Santa Isabel
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Santa Isabel
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Tijuana
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Tijuana
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Vancouver
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Vancouver
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Whitehorse
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Whitehorse
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PST/PDT - Yukon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PST/PDT - Yukon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PWT - Palau
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PWT - Palau
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    PYST/PYT - Asuncion
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        PYST/PYT - Asuncion
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    QYZT - Qyzylorda
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        QYZT - Qyzylorda
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    RET - Reunion
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        RET - Reunion
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ROTT - Rothera
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ROTT - Rothera
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SAKT - Sakhalin
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SAKT - Sakhalin
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SAMT - Samara
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SAMT - Samara
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SAST - Johannesburg
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SAST - Johannesburg
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SAST - Maseru
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SAST - Maseru
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SAST - Mbabane
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SAST - Mbabane
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SBT - Guadalcanal
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SBT - Guadalcanal
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SCT - Mahe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SCT - Mahe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SGT - Singapore
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SGT - Singapore
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SRT - Paramaribo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SRT - Paramaribo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SST - Midway
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SST - Midway
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SST - Pago Pago
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SST - Pago Pago
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SST - Samoa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SST - Samoa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SST - Samoa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SST - Samoa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    SYOT - Syowa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        SYOT - Syowa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TAHT - Tahiti
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TAHT - Tahiti
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TFT - Kerguelen
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TFT - Kerguelen
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TJT - Dushanbe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TJT - Dushanbe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TKT - Fakaofo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TKT - Fakaofo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TLT - Dili
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TLT - Dili
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TMT - Ashgabat
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TMT - Ashgabat
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TMT - Ashkhabad
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TMT - Ashkhabad
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TOT - Tongatapu
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TOT - Tongatapu
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    TVT - Funafuti
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        TVT - Funafuti
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ULAT - Ulaanbaatar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ULAT - Ulaanbaatar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    ULAT - Ulan Bator
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        ULAT - Ulan Bator
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    UTC - UTC
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        UTC - UTC
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    UYST/UYT - Montevideo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        UYST/UYT - Montevideo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    UZT - Samarkand
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        UZT - Samarkand
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    UZT - Tashkent
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        UZT - Tashkent
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    VET - Caracas
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        VET - Caracas
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    VLAT - Ust-Nera
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        VLAT - Ust-Nera
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    VLAT - Vladivostok
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        VLAT - Vladivostok
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    VOST - Vostok
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        VOST - Vostok
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    VUT - Efate
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        VUT - Efate
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAKT - Wake
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAKT - Wake
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAST/WAT - Windhoek
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAST/WAT - Windhoek
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Bangui
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Bangui
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Brazzaville
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Brazzaville
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Douala
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Douala
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Kinshasa
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Kinshasa
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Lagos
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Lagos
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Libreville
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Libreville
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Luanda
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Luanda
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Malabo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Malabo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Ndjamena
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Ndjamena
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Niamey
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Niamey
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WAT - Porto-Novo
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WAT - Porto-Novo
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Canary
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Canary
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Casablanca
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Casablanca
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - El Aaiun
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - El Aaiun
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Faeroe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Faeroe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Faroe
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Faroe
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Lisbon
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Lisbon
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WET/WEST - Madeira
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WET/WEST - Madeira
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WFT - Wallis
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WFT - Wallis
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WGT/WGST - Godthab
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WGT/WGST - Godthab
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WIB - Jakarta
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WIB - Jakarta
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WIB - Pontianak
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WIB - Pontianak
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WIT - Jayapura
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WIT - Jayapura
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WITA - Makassar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WITA - Makassar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WITA - Ujung Pandang
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WITA - Ujung Pandang
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    WSDT/WSST - Apia
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        WSDT/WSST - Apia
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    XJT - Kashgar
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        XJT - Kashgar
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    XJT - Urumqi
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        XJT - Urumqi
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    YAKT - Khandyga
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        YAKT - Khandyga
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    YAKT - Yakutsk
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        YAKT - Yakutsk
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                        <div aria-selected="false" role="option">
-                            <div>
-                                <div className="SearchableSelect-item">
-                                    YEKT - Yekaterinburg
+                            <div aria-selected="false" role="option">
+                                <div>
+                                    <div className="SearchableSelect-item">
+                                        YEKT - Yekaterinburg
+                                    </div>
                                 </div>
                             </div>
                         </div>
@@ -3417,8 +3419,8 @@ const TimezoneSelect: Function = () => (
                 </div>
             </div>
         </div>
-    </div>
-);
+    );
+};
 
 TimezoneSelect.displayName = 'TimezoneSelect';
 
diff --git a/AdminDashboard/src/Components/User/HistroyList.tsx b/AdminDashboard/src/Components/User/HistroyList.tsx
index f44a63f10a..baffddadd6 100644
--- a/AdminDashboard/src/Components/User/HistroyList.tsx
+++ b/AdminDashboard/src/Components/User/HistroyList.tsx
@@ -5,60 +5,49 @@ import { connect } from 'react-redux';
 import moment from 'moment';
 import { ListLoader } from '../basic/Loader';
 
-export class HistoryList extends Component<ComponentProps>{
+export class HistoryList extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     override render() {
         if (
-
             this.props.history &&
-
             this.props.history.skip &&
-
             typeof this.props.history.skip === 'string'
         ) {
-
             this.props.history.skip = parseInt(this.props.history.skip, 10);
         }
         if (
-
             this.props.history &&
-
             this.props.history.limit &&
-
             typeof this.props.history.limit === 'string'
         ) {
-
             this.props.history.limit = parseInt(this.props.history.limit, 10);
         }
 
-        if (!this.props.history.skip) this.props.history.skip = 0;
+        if (!this.props.history.skip) {
+            this.props.history.skip = 0;
+        }
 
-        if (!this.props.history.limit) this.props.history.limit = 0;
+        if (!this.props.history.limit) {
+            this.props.history.limit = 0;
+        }
 
         let canNext =
-
             this.props.history &&
-
-                this.props.history.count &&
-
-                this.props.history.count >
-
+            this.props.history.count &&
+            this.props.history.count >
                 this.props.history.skip + this.props.history.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.history && this.props.history.skip <= 0 ? false : true;
 
-
         if (this.props.requesting) {
             canNext = false;
             canPrev = false;
         }
         const numberOfPages: $TSFixMe = Math.ceil(
-
             parseInt(this.props.history && this.props.history.count) / 10
         );
         return (
@@ -157,7 +146,6 @@ export class HistoryList extends Component<ComponentProps>{
                                 </td>
                                 <td
                                     id="overflow"
-
                                     type="action"
                                     className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
                                     style={{ height: '1px' }}
@@ -169,7 +157,6 @@ export class HistoryList extends Component<ComponentProps>{
                             </tr>
                         </thead>
                         <tbody className="Table-body">
-
                             {this.props.requesting ? (
                                 <Fragment>
                                     <tr className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink">
@@ -190,119 +177,120 @@ export class HistoryList extends Component<ComponentProps>{
                                         </td>
                                     </tr>
                                 </Fragment>
-
                             ) : this.props.history &&
-
-                                this.props.history.logs &&
-
-                                this.props.history.logs.length > 0 ? (
-
-                                this.props.history.logs.map((log: $TSFixMe, index: $TSFixMe) => {
-                                    return (
-                                        <tr
-                                            key={log._id}
-                                            className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink"
-                                            id={`log_${index}`}
-                                        >
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{
-                                                    height: '1px',
-                                                    minWidth: '150px',
-                                                }}
+                              this.props.history.logs &&
+                              this.props.history.logs.length > 0 ? (
+                                this.props.history.logs.map(
+                                    (log: $TSFixMe, index: $TSFixMe) => {
+                                        return (
+                                            <tr
+                                                key={log._id}
+                                                className="Table-row db-ListViewItem bs-ActionsParent db-ListViewItem--hasLink"
+                                                id={`log_${index}`}
                                             >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <span>
-                                                                {log.ipLocation &&
-                                                                    log.ipLocation
-                                                                        .ip
-                                                                    ? log
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{
+                                                        height: '1px',
+                                                        minWidth: '150px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <span>
+                                                                    {log.ipLocation &&
+                                                                    log
                                                                         .ipLocation
                                                                         .ip
-                                                                    : 'Unknown'}
-                                                            </span>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
-                                                style={{
-                                                    height: '1px',
-                                                    minWidth: '150px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                    <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                        <div className="Box-root Margin-right--16">
-                                                            <span>
-                                                                {log.ipLocation &&
-                                                                    log.ipLocation
-                                                                        .city
-                                                                    ? `${log.ipLocation.city}, ${log.ipLocation.country}`
-                                                                    : 'Unknown'}
-                                                            </span>
-                                                        </div>
-                                                    </span>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="db-RadarRulesListUserName Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
-                                                                <span>
-                                                                    {log.device &&
-                                                                        log.device
-                                                                            .client &&
-                                                                        log.device
-                                                                            .client
-                                                                            .name
                                                                         ? log
-                                                                            .device
-                                                                            .client
-                                                                            .name
+                                                                              .ipLocation
+                                                                              .ip
                                                                         : 'Unknown'}
                                                                 </span>
                                                             </div>
                                                         </span>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                aria-hidden="true"
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                    maxWidth: '48px',
-                                                    minWidth: '48px',
-                                                    width: '48px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--wrap db-ListViewItem-cell db-ListViewItem-cell--breakWord"
+                                                    style={{
+                                                        height: '1px',
+                                                        minWidth: '150px',
+                                                    }}
+                                                >
                                                     <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        ⁣
+                                                        <span className="db-ListViewItem-text Text-color--cyan Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                            <div className="Box-root Margin-right--16">
+                                                                <span>
+                                                                    {log.ipLocation &&
+                                                                    log
+                                                                        .ipLocation
+                                                                        .city
+                                                                        ? `${log.ipLocation.city}, ${log.ipLocation.country}`
+                                                                        : 'Unknown'}
+                                                                </span>
+                                                            </div>
+                                                        </span>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                                            <div className="Box-root Flex-flex">
-                                                                <div className="Box-root Flex-flex">
-                                                                    <div className="db-RadarRulesListUserName Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="db-RadarRulesListUserName Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
+                                                                    <span>
                                                                         {log.device &&
+                                                                        log
+                                                                            .device
+                                                                            .client &&
+                                                                        log
+                                                                            .device
+                                                                            .client
+                                                                            .name
+                                                                            ? log
+                                                                                  .device
+                                                                                  .client
+                                                                                  .name
+                                                                            : 'Unknown'}
+                                                                    </span>
+                                                                </div>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    aria-hidden="true"
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                        maxWidth: '48px',
+                                                        minWidth: '48px',
+                                                        width: '48px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            ⁣
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            <span className="db-ListViewItem-text Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                                                <div className="Box-root Flex-flex">
+                                                                    <div className="Box-root Flex-flex">
+                                                                        <div className="db-RadarRulesListUserName Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart">
+                                                                            {log.device &&
                                                                             log
                                                                                 .device
                                                                                 .os &&
@@ -310,82 +298,85 @@ export class HistoryList extends Component<ComponentProps>{
                                                                                 .device
                                                                                 .os
                                                                                 .name
-                                                                            ? `${log.device.device.brand}, ${log.device.os.name}`
-                                                                            : 'Unknown'}
+                                                                                ? `${log.device.device.brand}, ${log.device.os.name}`
+                                                                                : 'Unknown'}
+                                                                        </div>
                                                                     </div>
                                                                 </div>
-                                                            </div>
-                                                        </span>
+                                                            </span>
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
+                                                </td>
 
-                                            <td
-                                                aria-hidden="true"
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{
-                                                    height: '1px',
-                                                    maxWidth: '48px',
-                                                    minWidth: '48px',
-                                                    width: '48px',
-                                                }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        ⁣
+                                                <td
+                                                    aria-hidden="true"
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{
+                                                        height: '1px',
+                                                        maxWidth: '48px',
+                                                        minWidth: '48px',
+                                                        width: '48px',
+                                                    }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            ⁣
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        {log.status ===
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            {log.status ===
                                                             'successful' ? (
-                                                            <div className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2">
-                                                                <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
-                                                                    <span>
-                                                                        {
-                                                                            log.status
-                                                                        }
+                                                                <div className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2">
+                                                                    <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
+                                                                        <span>
+                                                                            {
+                                                                                log.status
+                                                                            }
+                                                                        </span>
                                                                     </span>
-                                                                </span>
-                                                            </div>
-                                                        ) : (
-                                                            <div className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2">
-                                                                <span className="Badge-text Text-color--red Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
-                                                                    <span>
-                                                                        {
-                                                                            log.status
-                                                                        }
+                                                                </div>
+                                                            ) : (
+                                                                <div className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2">
+                                                                    <span className="Badge-text Text-color--red Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
+                                                                        <span>
+                                                                            {
+                                                                                log.status
+                                                                            }
+                                                                        </span>
                                                                     </span>
-                                                                </span>
-                                                            </div>
-                                                        )}
-                                                    </div>
-                                                </div>
-                                            </td>
-                                            <td
-                                                className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
-                                                style={{ height: '1px' }}
-                                            >
-                                                <div className="db-ListViewItem-link">
-                                                    <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
-                                                        {moment
-                                                            .utc(log.createdAt)
-                                                            .local()
-                                                            .format(
-                                                                'ddd, YYYY/MM/DD, h:mm:ss'
+                                                                </div>
                                                             )}
+                                                        </div>
                                                     </div>
-                                                </div>
-                                            </td>
-                                            <td className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"></td>
-                                        </tr>
-                                    );
-                                })
+                                                </td>
+                                                <td
+                                                    className="Table-cell Table-cell--align--left Table-cell--verticalAlign--top Table-cell--width--minimized Table-cell--wrap--noWrap db-ListViewItem-cell"
+                                                    style={{ height: '1px' }}
+                                                >
+                                                    <div className="db-ListViewItem-link">
+                                                        <div className="db-ListViewItem-cellContent Box-root Padding-all--8">
+                                                            {moment
+                                                                .utc(
+                                                                    log.createdAt
+                                                                )
+                                                                .local()
+                                                                .format(
+                                                                    'ddd, YYYY/MM/DD, h:mm:ss'
+                                                                )}
+                                                        </div>
+                                                    </div>
+                                                </td>
+                                                <td className="Table-cell Table-cell--align--right Table-cell--verticalAlign--top Table-cell--wrap--noWrap db-ListViewItem-cell"></td>
+                                            </tr>
+                                        );
+                                    }
+                                )
                             ) : (
                                 <tr></tr>
                             )}
@@ -393,21 +384,15 @@ export class HistoryList extends Component<ComponentProps>{
                     </table>
                 </div>
                 <div style={{ textAlign: 'center', marginTop: '10px' }}>
-
                     {this.props.history &&
-
-                        (!this.props.history.logs ||
-
-                            !this.props.history.logs.length) &&
-
-                        !this.props.requesting &&
-
-                        !this.props.history.error
+                    (!this.props.history.logs ||
+                        !this.props.history.logs.length) &&
+                    !this.props.requesting &&
+                    !this.props.history.error
                         ? "We don't have any projects yet"
                         : null}
 
                     {this.props.history && this.props.history.error
-
                         ? this.props.history.error
                         : null}
                 </div>
@@ -417,32 +402,29 @@ export class HistoryList extends Component<ComponentProps>{
                             <span>
                                 <span className="Text-color--inherit Text-display--inline Text-fontSize--14 Text-fontWeight--medium Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
                                     {numberOfPages > 0
-
-                                        ? `Page ${this.props.history.skip / 10 +
-                                        1} of ${numberOfPages} (${this
-
-                                            .props.history &&
-
-                                        this.props.history.count} Log${this.props.history &&
-
-                                            this.props.history.count === 1
-                                            ? ''
-                                            : 's'
-                                        })`
-
+                                        ? `Page ${
+                                              this.props.history.skip / 10 + 1
+                                          } of ${numberOfPages} (${
+                                              this.props.history &&
+                                              this.props.history.count
+                                          } Log${
+                                              this.props.history &&
+                                              this.props.history.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          })`
                                         : this.props.history &&
-
-                                            this.props.history.count
-
-                                            ? `${this.props.history &&
-
-                                            this.props.history.count} Log${this.props.history &&
-
-                                                this.props.history.count === 1
-                                                ? ''
-                                                : 's'
-                                            }`
-                                            : null}
+                                          this.props.history.count
+                                        ? `${
+                                              this.props.history &&
+                                              this.props.history.count
+                                          } Log${
+                                              this.props.history &&
+                                              this.props.history.count === 1
+                                                  ? ''
+                                                  : 's'
+                                          }`
+                                        : null}
                                 </span>
                             </span>
                         </span>
@@ -453,9 +435,7 @@ export class HistoryList extends Component<ComponentProps>{
                                 <button
                                     id="btnPrev"
                                     onClick={() => {
-
                                         this.props.prevClicked(
-
                                             this.props.history.skip,
 
                                             this.props.history.limit
@@ -480,9 +460,7 @@ export class HistoryList extends Component<ComponentProps>{
                                 <button
                                     id="btnNext"
                                     onClick={() => {
-
                                         this.props.nextClicked(
-
                                             this.props.history.skip,
 
                                             this.props.history.limit
@@ -521,10 +499,8 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 HistoryList.displayName = 'HistoryList';
 
-
 HistoryList.propTypes = {
     nextClicked: PropTypes.func.isRequired,
     prevClicked: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Components/User/MessageModal.tsx b/AdminDashboard/src/Components/User/MessageModal.tsx
index 610d4a7047..3fe59ed53a 100644
--- a/AdminDashboard/src/Components/User/MessageModal.tsx
+++ b/AdminDashboard/src/Components/User/MessageModal.tsx
@@ -9,7 +9,9 @@ const MessageModal: Function = (props: $TSFixMe) => {
 
     return (
         <div
-            onKeyDown={e => e.key === 'Escape' && closeThisDialog()}
+            onKeyDown={e => {
+                return e.key === 'Escape' && closeThisDialog();
+            }}
             className="ModalLayer-wash Box-root Flex-flex Flex-alignItems--flexStart Flex-justifyContent--center"
         >
             <div
diff --git a/AdminDashboard/src/Components/User/UserAddModal.tsx b/AdminDashboard/src/Components/User/UserAddModal.tsx
index 08ff97598f..bb190468ae 100644
--- a/AdminDashboard/src/Components/User/UserAddModal.tsx
+++ b/AdminDashboard/src/Components/User/UserAddModal.tsx
@@ -13,7 +13,6 @@ import { Validate } from '../../config';
 import { addUser, resetAddUser } from '../../actions/user';
 
 class UserAddModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -26,17 +25,16 @@ class UserAddModal extends Component<ComponentProps> {
     }
 
     submitForm = (values: $TSFixMe) => {
-
         const { addUser, closeThisDialog, resetAddUser }: $TSFixMe = this.props;
 
         addUser(values).then(
-            function (val: $TSFixMe) {
+            (val: $TSFixMe) => {
                 if (val === 'ok') {
                     resetAddUser();
                     closeThisDialog();
                 }
             },
-            function () {
+            () => {
                 //do nothing.
             }
         );
@@ -45,7 +43,6 @@ class UserAddModal extends Component<ComponentProps> {
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 this.props.resetAddUser();
 
                 return this.props.closeThisDialog();
@@ -56,7 +53,6 @@ class UserAddModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             handleSubmit,
 
             closeThisDialog,
@@ -72,7 +68,6 @@ class UserAddModal extends Component<ComponentProps> {
         return (
             <div
                 className="ModalLayer-contents"
-
                 tabIndex="-1"
                 style={{ marginTop: '40px' }}
             >
@@ -335,65 +330,64 @@ class UserAddModal extends Component<ComponentProps> {
     }
 }
 
-
 UserAddModal.displayName = 'UserAddModalForm';
 
 const validate: $TSFixMe = function (values: $TSFixMe) {
     const error: $TSFixMe = {};
 
+    if (!Validate.text(values.name)) {
+        error.name = 'Name is required.';
+    }
 
-    if (!Validate.text(values.name)) error.name = 'Name is required.';
-
-    if (Validate.text(values.name) && !Validate.isValidName(values.name))
-
+    if (Validate.text(values.name) && !Validate.isValidName(values.name)) {
         error.name = 'Name is not valid.';
+    }
 
+    if (!Validate.text(values.email)) {
+        error.email = 'Email is required.';
+    }
 
-    if (!Validate.text(values.email)) error.email = 'Email is required.';
-
-    if (Validate.text(values.email) && !Validate.email(values.email))
-
+    if (Validate.text(values.email) && !Validate.email(values.email)) {
         error.email = 'Email is not valid.';
+    }
 
     if (
         !Validate.isValidBusinessEmail(values.email) &&
         Validate.email(values.email)
-    )
-
+    ) {
         error.email = 'Please enter a business email address.';
+    }
 
-    if (!Validate.text(values.companyName))
-
+    if (!Validate.text(values.companyName)) {
         error.companyName = 'Company name is required.';
+    }
 
-    if (!Validate.text(values.companyPhoneNumber))
-
+    if (!Validate.text(values.companyPhoneNumber)) {
         error.companyPhoneNumber = 'Phone number is required.';
+    }
 
     if (
         Validate.text(values.companyPhoneNumber) &&
         !Validate.isValidNumber(values.companyPhoneNumber)
-    )
-
+    ) {
         error.companyPhoneNumber = 'Phone number is invalid.';
+    }
 
-    if (!Validate.text(values.password))
-
+    if (!Validate.text(values.password)) {
         error.password = 'Password is required.';
+    }
     if (
         Validate.text(values.password) &&
         !Validate.isStrongPassword(values.password)
     ) {
-
         error.password = 'Password should be atleast 8 characters long';
     }
 
-    if (!Validate.text(values.confirmPassword))
-
+    if (!Validate.text(values.confirmPassword)) {
         error.confirmPassword = 'Confirm Password is required.';
+    }
 
     if (!Validate.compare(values.password, values.confirmPassword)) {
-
         error.confirmPassword = 'Password and confirm password should match.';
     }
 
@@ -416,7 +410,6 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 UserAddModal.propTypes = {
     addUser: PropTypes.func,
     addUserState: PropTypes.object,
diff --git a/AdminDashboard/src/Components/User/UserAdminModeDisableBox.tsx b/AdminDashboard/src/Components/User/UserAdminModeDisableBox.tsx
index 66742e12cc..c8a0fe0d15 100644
--- a/AdminDashboard/src/Components/User/UserAdminModeDisableBox.tsx
+++ b/AdminDashboard/src/Components/User/UserAdminModeDisableBox.tsx
@@ -6,7 +6,7 @@ import { FormLoader } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 import { disableAdminMode } from '../../actions/user';
 
-export class UserAdminModeDisableBox extends Component<ComponentProps>{
+export class UserAdminModeDisableBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -15,13 +15,11 @@ export class UserAdminModeDisableBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { disableAdminMode, userId }: $TSFixMe = this.props;
         disableAdminMode(userId);
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -66,13 +64,16 @@ export class UserAdminModeDisableBox extends Component<ComponentProps>{
     }
 }
 
-
 UserAdminModeDisableBox.displayName = 'UserAdminModeDisableBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ disableAdminMode }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ disableAdminMode }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
-    const userId: $TSFixMe = state.user.user.user ? state.user.user.user._id : null;
+    const userId: $TSFixMe = state.user.user.user
+        ? state.user.user.user._id
+        : null;
 
     return {
         userId,
@@ -83,14 +84,12 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserAdminModeDisableBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     disableAdminMode: PropTypes.func.isRequired,
     userId: PropTypes.string,
 };
 
-
 UserAdminModeDisableBox.contextTypes = {};
 
 export default connect(
diff --git a/AdminDashboard/src/Components/User/UserAdminModeEnableBox.tsx b/AdminDashboard/src/Components/User/UserAdminModeEnableBox.tsx
index 314b43a3b0..4bb5a52e5d 100644
--- a/AdminDashboard/src/Components/User/UserAdminModeEnableBox.tsx
+++ b/AdminDashboard/src/Components/User/UserAdminModeEnableBox.tsx
@@ -10,7 +10,7 @@ import { enableAdminMode } from '../../actions/user';
 import UserAdminModeEnableModal from './UserAdminModeEnableModal';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class UserAdminModeEnableBox extends Component<ComponentProps>{
+export class UserAdminModeEnableBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,12 +20,10 @@ export class UserAdminModeEnableBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { enableAdminMode, userId }: $TSFixMe = this.props;
 
         const { AdminModeModalId }: $TSFixMe = this.state;
 
-
         this.props.openModal({
             id: AdminModeModalId,
             onConfirm: (values: $TSFixMe) => {
@@ -38,9 +36,7 @@ export class UserAdminModeEnableBox extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({
-
                     id: this.state.AdminModeModalId,
                 });
             default:
@@ -49,7 +45,6 @@ export class UserAdminModeEnableBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -98,13 +93,19 @@ export class UserAdminModeEnableBox extends Component<ComponentProps>{
     }
 }
 
-
 UserAdminModeEnableBox.displayName = 'UserAdminModeEnableBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ enableAdminMode, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { enableAdminMode, openModal, closeModal },
+        dispatch
+    );
+};
 
 const mapStateToProps: Function = (state: RootState) => {
-    const userId: $TSFixMe = state.user.user.user ? state.user.user.user._id : null;
+    const userId: $TSFixMe = state.user.user.user
+        ? state.user.user.user._id
+        : null;
 
     return {
         userId,
@@ -115,7 +116,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserAdminModeEnableBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     enableAdminMode: PropTypes.func.isRequired,
@@ -124,7 +124,6 @@ UserAdminModeEnableBox.propTypes = {
     userId: PropTypes.string,
 };
 
-
 UserAdminModeEnableBox.contextTypes = {};
 
 export default connect(
diff --git a/AdminDashboard/src/Components/User/UserAdminModeEnableModal.tsx b/AdminDashboard/src/Components/User/UserAdminModeEnableModal.tsx
index cc6536cc95..96a9c092a4 100644
--- a/AdminDashboard/src/Components/User/UserAdminModeEnableModal.tsx
+++ b/AdminDashboard/src/Components/User/UserAdminModeEnableModal.tsx
@@ -10,10 +10,9 @@ import { reduxForm, Field } from 'redux-form';
 import { RenderField } from '../basic/RenderField';
 import { ValidateField } from '../../config';
 
-const  formName: string = 'UserAdminModeEnableForm';
+const formName: string = 'UserAdminModeEnableForm';
 
 class UserAdminModeEnableModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -26,17 +25,14 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
     }
 
     submitForm = (values: $TSFixMe) => {
-
         return this.props.confirmThisDialog(values);
     };
 
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return document.getElementById('enableAdminMode').click();
             default:
                 return false;
@@ -45,7 +41,6 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             enableAdminModeError,
@@ -139,8 +134,7 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
                                                         <div className="Box-root">
                                                             <span
                                                                 style={{
-                                                                    color:
-                                                                        'red',
+                                                                    color: 'red',
                                                                 }}
                                                             >
                                                                 {
@@ -152,8 +146,10 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
                                                 </div>
                                             </ShouldRender>
                                             <button
-                                                className={`bs-Button btn__modal ${isRequesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button btn__modal ${
+                                                    isRequesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 type="button"
                                                 onClick={closeThisDialog}
                                                 disabled={isRequesting}
@@ -165,8 +161,10 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
                                             </button>
                                             <button
                                                 id="enableAdminMode"
-                                                className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                    'bs-is-disabled'}`}
+                                                className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                    isRequesting &&
+                                                    'bs-is-disabled'
+                                                }`}
                                                 type="submit"
                                                 disabled={isRequesting}
                                                 autoFocus={true}
@@ -191,7 +189,6 @@ class UserAdminModeEnableModal extends Component<ComponentProps> {
     }
 }
 
-
 UserAdminModeEnableModal.displayName = 'UserAdminModeEnableModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -207,7 +204,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserAdminModeEnableModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/User/UserBlockBox.tsx b/AdminDashboard/src/Components/User/UserBlockBox.tsx
index 6baae70bd6..00b723b98c 100644
--- a/AdminDashboard/src/Components/User/UserBlockBox.tsx
+++ b/AdminDashboard/src/Components/User/UserBlockBox.tsx
@@ -10,7 +10,7 @@ import { blockUser } from '../../actions/user';
 import UserBlockModal from './UserBlockModal';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class UserBlockBox extends Component<ComponentProps>{
+export class UserBlockBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,12 +20,10 @@ export class UserBlockBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { blockUser, userId }: $TSFixMe = this.props;
 
         const { blockModalId }: $TSFixMe = this.state;
 
-
         this.props.openModal({
             id: blockModalId,
             onConfirm: () => {
@@ -38,7 +36,6 @@ export class UserBlockBox extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.blockModalId });
             default:
                 return false;
@@ -46,7 +43,6 @@ export class UserBlockBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -93,13 +89,16 @@ export class UserBlockBox extends Component<ComponentProps>{
     }
 }
 
-
 UserBlockBox.displayName = 'UserBlockBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ blockUser, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ blockUser, openModal, closeModal }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
-    const userId: $TSFixMe = state.user.user.user ? state.user.user.user._id : null;
+    const userId: $TSFixMe = state.user.user.user
+        ? state.user.user.user._id
+        : null;
 
     return {
         userId,
@@ -110,7 +109,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserBlockBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     blockUser: PropTypes.func.isRequired,
@@ -119,7 +117,6 @@ UserBlockBox.propTypes = {
     userId: PropTypes.string,
 };
 
-
 UserBlockBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(UserBlockBox);
diff --git a/AdminDashboard/src/Components/User/UserBlockModal.tsx b/AdminDashboard/src/Components/User/UserBlockModal.tsx
index 4120613f5c..c0e7c20c87 100644
--- a/AdminDashboard/src/Components/User/UserBlockModal.tsx
+++ b/AdminDashboard/src/Components/User/UserBlockModal.tsx
@@ -7,7 +7,6 @@ import { Spinner } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 
 class UserBlockModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,10 +21,8 @@ class UserBlockModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -34,7 +31,6 @@ class UserBlockModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             error,
@@ -99,8 +95,9 @@ class UserBlockModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -112,8 +109,9 @@ class UserBlockModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             onClick={confirmThisDialog}
                                             disabled={isRequesting}
                                             autoFocus={true}
@@ -137,7 +135,6 @@ class UserBlockModal extends Component<ComponentProps> {
     }
 }
 
-
 UserBlockModal.displayName = 'UserBlockModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -150,7 +147,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserBlockModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/User/UserDeleteBox.tsx b/AdminDashboard/src/Components/User/UserDeleteBox.tsx
index 078e0a272a..f63256e1ff 100644
--- a/AdminDashboard/src/Components/User/UserDeleteBox.tsx
+++ b/AdminDashboard/src/Components/User/UserDeleteBox.tsx
@@ -10,7 +10,7 @@ import { deleteUser } from '../../actions/user';
 import UserDeleteModal from './UserDeleteModal';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class UserDeleteBox extends Component<ComponentProps>{
+export class UserDeleteBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -20,12 +20,10 @@ export class UserDeleteBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { deleteUser, userId }: $TSFixMe = this.props;
 
         const { deleteModalId }: $TSFixMe = this.state;
 
-
         this.props.openModal({
             id: deleteModalId,
             onConfirm: () => {
@@ -38,7 +36,6 @@ export class UserDeleteBox extends Component<ComponentProps>{
     handleKeyBoard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeModal({ id: this.state.deleteModalId });
             default:
                 return false;
@@ -46,7 +43,6 @@ export class UserDeleteBox extends Component<ComponentProps>{
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -93,13 +89,16 @@ export class UserDeleteBox extends Component<ComponentProps>{
     }
 }
 
-
 UserDeleteBox.displayName = 'UserDeleteBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ deleteUser, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ deleteUser, openModal, closeModal }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
-    const userId: $TSFixMe = state.user.user.user ? state.user.user.user._id : null;
+    const userId: $TSFixMe = state.user.user.user
+        ? state.user.user.user._id
+        : null;
 
     return {
         userId,
@@ -110,7 +109,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserDeleteBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     userId: PropTypes.oneOfType([
@@ -122,7 +120,6 @@ UserDeleteBox.propTypes = {
     openModal: PropTypes.func.isRequired,
 };
 
-
 UserDeleteBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(UserDeleteBox);
diff --git a/AdminDashboard/src/Components/User/UserDeleteModal.tsx b/AdminDashboard/src/Components/User/UserDeleteModal.tsx
index 6765440b10..04ef7c38f8 100644
--- a/AdminDashboard/src/Components/User/UserDeleteModal.tsx
+++ b/AdminDashboard/src/Components/User/UserDeleteModal.tsx
@@ -7,7 +7,6 @@ import { Spinner } from '../basic/Loader';
 import ShouldRender from '../basic/ShouldRender';
 
 class UserDeleteModal extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -22,10 +21,8 @@ class UserDeleteModal extends Component<ComponentProps> {
     handleKeyboard = (e: $TSFixMe) => {
         switch (e.key) {
             case 'Escape':
-
                 return this.props.closeThisDialog();
             case 'Enter':
-
                 return this.props.confirmThisDialog();
             default:
                 return false;
@@ -34,7 +31,6 @@ class UserDeleteModal extends Component<ComponentProps> {
 
     override render() {
         const {
-
             isRequesting,
 
             error,
@@ -99,8 +95,9 @@ class UserDeleteModal extends Component<ComponentProps> {
                                             </div>
                                         </ShouldRender>
                                         <button
-                                            className={`bs-Button btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             type="button"
                                             onClick={closeThisDialog}
                                             disabled={isRequesting}
@@ -112,8 +109,9 @@ class UserDeleteModal extends Component<ComponentProps> {
                                         </button>
                                         <button
                                             id="confirmDelete"
-                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${isRequesting &&
-                                                'bs-is-disabled'}`}
+                                            className={`bs-Button bs-Button--red Box-background--red btn__modal ${
+                                                isRequesting && 'bs-is-disabled'
+                                            }`}
                                             onClick={confirmThisDialog}
                                             disabled={isRequesting}
                                             autoFocus={true}
@@ -137,7 +135,6 @@ class UserDeleteModal extends Component<ComponentProps> {
     }
 }
 
-
 UserDeleteModal.displayName = 'UserDeleteModal';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -151,7 +148,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserDeleteModal.propTypes = {
     isRequesting: PropTypes.oneOfType([
         PropTypes.bool,
diff --git a/AdminDashboard/src/Components/User/UserHistory.tsx b/AdminDashboard/src/Components/User/UserHistory.tsx
index 0506912f80..4c0573dcd4 100644
--- a/AdminDashboard/src/Components/User/UserHistory.tsx
+++ b/AdminDashboard/src/Components/User/UserHistory.tsx
@@ -7,12 +7,10 @@ import { fetchUserloginHistory } from '../../actions/user';
 
 class UserHistory extends Component<ComponentProps> {
     constructor() {
-
         super();
         this.state = { page: 1 };
     }
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { userId }: $TSFixMe = this.props;
 
         this.props.fetchUserloginHistory(
@@ -25,7 +23,6 @@ class UserHistory extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { userId }: $TSFixMe = this.props;
 
         this.props.fetchUserloginHistory(userId, skip + limit, 10);
@@ -34,7 +31,7 @@ class UserHistory extends Component<ComponentProps> {
     };
     override render() {
         return (
-            <div className="bs-BIM" >
+            <div className="bs-BIM">
                 <div className="Box-root Margin-bottom--12">
                     <div className="bs-ContentSection Card-root Card-shadow--medium">
                         <div className="Box-root">
@@ -55,7 +52,6 @@ class UserHistory extends Component<ComponentProps> {
                             </div>
                         </div>
                         <HistoryList
-
                             history={this.props.history}
                             prevClicked={this.prevClicked}
                             nextClicked={this.nextClicked}
@@ -67,14 +63,12 @@ class UserHistory extends Component<ComponentProps> {
     }
 }
 
-
 UserHistory.displayName = 'UserHistory';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
     return bindActionCreators({ fetchUserloginHistory }, dispatch);
 };
 
-
 UserHistory.propTypes = {
     fetchUserloginHistory: PropTypes.func.isRequired,
     userId: PropTypes.string,
diff --git a/AdminDashboard/src/Components/User/UserList.tsx b/AdminDashboard/src/Components/User/UserList.tsx
index 7a32b8bd79..a9aab3a4d9 100644
--- a/AdminDashboard/src/Components/User/UserList.tsx
+++ b/AdminDashboard/src/Components/User/UserList.tsx
@@ -3,10 +3,8 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import moment from 'moment';
 
-const UserList: Function = ({
-    users
-}: $TSFixMe) =>
-    users.map((user: $TSFixMe, k: $TSFixMe) => {
+const UserList: Function = ({ users }: $TSFixMe) => {
+    return users.map((user: $TSFixMe, k: $TSFixMe) => {
         return (
             <Link
                 id={
@@ -32,10 +30,11 @@ const UserList: Function = ({
                 </div>
                 <div className="bs-ObjectList-cell bs-u-v-middle">
                     <div className="bs-ObjectList-cell-row">
-                        {`${user.projects && user.projects[0]
+                        {`${
+                            user.projects && user.projects[0]
                                 ? user.projects[0].name
                                 : 'Not Added Yet'
-                            }`}{' '}
+                        }`}{' '}
                         {user.projects && user.projects.length - 1 > 0
                             ? user.projects.length - 1 > 1
                                 ? `and ${user.projects.length - 1} others`
@@ -68,7 +67,7 @@ const UserList: Function = ({
                                 <span>
                                     {user.name
                                         ? 'Online ' +
-                                        moment(user.lastActive).fromNow()
+                                          moment(user.lastActive).fromNow()
                                         : 'Invitation Sent'}
                                 </span>
                             </span>
@@ -82,6 +81,7 @@ const UserList: Function = ({
             </Link>
         );
     });
+};
 
 UserList.displayName = 'UserList';
 
diff --git a/AdminDashboard/src/Components/User/UserProject.tsx b/AdminDashboard/src/Components/User/UserProject.tsx
index 2b556c86a5..a26e02eb46 100644
--- a/AdminDashboard/src/Components/User/UserProject.tsx
+++ b/AdminDashboard/src/Components/User/UserProject.tsx
@@ -7,12 +7,10 @@ import { fetchUserProjects } from '../../actions/project';
 
 class UserProject extends Component<ComponentProps> {
     constructor() {
-
         super();
         this.state = { page: 1 };
     }
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { userId }: $TSFixMe = this.props;
 
         this.props.fetchUserProjects(
@@ -25,7 +23,6 @@ class UserProject extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { userId }: $TSFixMe = this.props;
 
         this.props.fetchUserProjects(userId, skip + limit, 10);
@@ -34,7 +31,7 @@ class UserProject extends Component<ComponentProps> {
     };
     override render() {
         return (
-            <div className="bs-BIM" >
+            <div className="bs-BIM">
                 <div className="Box-root Margin-bottom--12">
                     <div className="bs-ContentSection Card-root Card-shadow--medium">
                         <div className="Box-root">
@@ -56,13 +53,10 @@ class UserProject extends Component<ComponentProps> {
                             </div>
                         </div>
                         <ProjectList
-
                             projects={this.props.projects || {}}
                             prevClicked={this.prevClicked}
                             nextClicked={this.nextClicked}
-
                             userId={this.props.userId}
-
                             page={this.state.page}
                         />
                     </div>
@@ -72,7 +66,6 @@ class UserProject extends Component<ComponentProps> {
     }
 }
 
-
 UserProject.displayName = 'UserProject';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -80,7 +73,9 @@ const mapDispatchToProps: Function = (dispatch: Dispatch) => {
 };
 
 const mapStateToProps: Function = (state: RootState) => {
-    const userId: $TSFixMe = state.user.user.user ? state.user.user.user._id : null;
+    const userId: $TSFixMe = state.user.user.user
+        ? state.user.user.user._id
+        : null;
 
     return {
         userId,
diff --git a/AdminDashboard/src/Components/User/UserRestoreBox.tsx b/AdminDashboard/src/Components/User/UserRestoreBox.tsx
index 1c731cd2e6..1258cb51a6 100644
--- a/AdminDashboard/src/Components/User/UserRestoreBox.tsx
+++ b/AdminDashboard/src/Components/User/UserRestoreBox.tsx
@@ -7,7 +7,7 @@ import ShouldRender from '../basic/ShouldRender';
 import { restoreUser } from '../../actions/user';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class UserRestoreBox extends Component<ComponentProps>{
+export class UserRestoreBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -16,13 +16,11 @@ export class UserRestoreBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { restoreUser, userId }: $TSFixMe = this.props;
         return restoreUser(userId);
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -66,10 +64,11 @@ export class UserRestoreBox extends Component<ComponentProps>{
     }
 }
 
-
 UserRestoreBox.displayName = 'UserRestoreBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ restoreUser, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ restoreUser, openModal, closeModal }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const user: $TSFixMe = state.user.user.user || {};
@@ -85,7 +84,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserRestoreBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     userId: PropTypes.oneOfType([
@@ -95,7 +93,6 @@ UserRestoreBox.propTypes = {
     restoreUser: PropTypes.func.isRequired,
 };
 
-
 UserRestoreBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(UserRestoreBox);
diff --git a/AdminDashboard/src/Components/User/UserSetting.tsx b/AdminDashboard/src/Components/User/UserSetting.tsx
index bf93ba95d5..72cc9b4bf9 100644
--- a/AdminDashboard/src/Components/User/UserSetting.tsx
+++ b/AdminDashboard/src/Components/User/UserSetting.tsx
@@ -9,7 +9,7 @@ import { updateTwoFactorAuthToken, setTwoFactorAuth } from '../../actions/user';
 import { openModal } from 'CommonUI/actions/Modal';
 import MessageModal from './MessageModal';
 
-export class UserSetting extends Component<ComponentProps>{
+export class UserSetting extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -21,34 +21,31 @@ export class UserSetting extends Component<ComponentProps>{
     }
 
     handleChange = () => {
-
-        const { user, updateTwoFactorAuthToken, setTwoFactorAuth }: $TSFixMe = this.props;
+        const { user, updateTwoFactorAuthToken, setTwoFactorAuth }: $TSFixMe =
+            this.props;
         if (user) {
             return !user.twoFactorAuthEnabled && user.role === 'user'
-
                 ? this.props.openModal({
-
-                    id: this.state.messageModalId,
-                    content: MessageModal,
-                })
+                      id: this.state.messageModalId,
+                      content: MessageModal,
+                  })
                 : !user.twoFactorAuthEnabled && user.role !== 'user'
-                    ? updateTwoFactorAuthToken(user._id, {
-                        twoFactorAuthEnabled: true,
-                        email: user.email,
-                    }).then(() => {
-                        setTwoFactorAuth(true);
-                    })
-                    : updateTwoFactorAuthToken(user._id, {
-                        twoFactorAuthEnabled: false,
-                        email: user.email,
-                    }).then(() => {
-                        setTwoFactorAuth(false);
-                    });
+                ? updateTwoFactorAuthToken(user._id, {
+                      twoFactorAuthEnabled: true,
+                      email: user.email,
+                  }).then(() => {
+                      setTwoFactorAuth(true);
+                  })
+                : updateTwoFactorAuthToken(user._id, {
+                      twoFactorAuthEnabled: false,
+                      email: user.email,
+                  }).then(() => {
+                      setTwoFactorAuth(false);
+                  });
         }
     };
 
     override render() {
-
         let { twoFactorAuthEnabled } = this.props.user;
         if (twoFactorAuthEnabled === undefined) {
             twoFactorAuthEnabled = false;
@@ -61,7 +58,6 @@ export class UserSetting extends Component<ComponentProps>{
                         <div className="Box-root" style={{ width: '100%' }}>
                             <span className="Text-color--inherit Text-display--inline Text-fontSize--16 Text-fontWeight--medium Text-lineHeight--24 Text-typeface--base Text-wrap--wrap">
                                 <div>
-
                                     {this.props.user.deleted ? (
                                         <div
                                             className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
@@ -71,7 +67,6 @@ export class UserSetting extends Component<ComponentProps>{
                                                 <span>Deleted</span>
                                             </span>
                                         </div>
-
                                     ) : this.props.user.isBlocked ? (
                                         <div
                                             className="Badge Badge--color--yellow Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
@@ -81,7 +76,6 @@ export class UserSetting extends Component<ComponentProps>{
                                                 <span>Blocked</span>
                                             </span>
                                         </div>
-
                                     ) : this.props.user.isAdminMode ? (
                                         <div
                                             className="Badge Badge--color--red Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
@@ -140,12 +134,9 @@ export class UserSetting extends Component<ComponentProps>{
                                                 }}
                                             >
                                                 <span className="value">
-
                                                     {this.props.user !==
                                                         undefined &&
-
-                                                        this.props.user.name
-
+                                                    this.props.user.name
                                                         ? this.props.user.name
                                                         : 'LOADING...'}
                                                 </span>
@@ -175,11 +166,8 @@ export class UserSetting extends Component<ComponentProps>{
                                                 }}
                                             >
                                                 <span className="value">
-
                                                     {this.props.user !== null &&
-
-                                                        this.props.user.email
-
+                                                    this.props.user.email
                                                         ? this.props.user.email
                                                         : 'LOADING...'}
                                                 </span>
@@ -232,13 +220,10 @@ export class UserSetting extends Component<ComponentProps>{
                                                 }}
                                             >
                                                 <span className="value">
-
                                                     {this.props.user !== null &&
-
-                                                        this.props.user.companyName
-
+                                                    this.props.user.companyName
                                                         ? this.props.user
-                                                            .companyName
+                                                              .companyName
                                                         : 'LOADING...'}
                                                 </span>
                                             </div>
@@ -266,20 +251,16 @@ export class UserSetting extends Component<ComponentProps>{
                                                 }}
                                             >
                                                 <span className="value">
-
                                                     {this.props.user !== null &&
-
-                                                        this.props.user
-                                                            .companyPhoneNumber
-
+                                                    this.props.user
+                                                        .companyPhoneNumber
                                                         ? this.props.user
-                                                            .companyPhoneNumber
+                                                              .companyPhoneNumber
                                                         : 'LOADING...'}
                                                 </span>
                                             </div>
                                         </div>
                                         <ShouldRender
-
                                             if={this.props.user.role === 'user'}
                                         >
                                             <div
@@ -345,7 +326,6 @@ export class UserSetting extends Component<ComponentProps>{
                                 className="Flex-flex Flex-direction--row"
                                 style={{ marginTop: '10px' }}
                             >
-
                                 <ShouldRender if={!this.props.user}>
                                     <div className="Box-root Margin-right--8">
                                         <div className="Icon Icon--info Icon--color--red Icon--size--14 Box-root" />
@@ -365,7 +345,6 @@ export class UserSetting extends Component<ComponentProps>{
     }
 }
 
-
 UserSetting.displayName = 'UserSetting';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -383,7 +362,6 @@ function mapStateToProps(state: RootState) {
     };
 }
 
-
 UserSetting.propTypes = {
     user: PropTypes.object.isRequired,
     updateTwoFactorAuthToken: PropTypes.func,
@@ -392,7 +370,6 @@ UserSetting.propTypes = {
     isVerified: PropTypes.bool,
 };
 
-
 UserSetting.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(UserSetting);
diff --git a/AdminDashboard/src/Components/User/UserUnblockBox.tsx b/AdminDashboard/src/Components/User/UserUnblockBox.tsx
index bcf943a754..d06379210a 100644
--- a/AdminDashboard/src/Components/User/UserUnblockBox.tsx
+++ b/AdminDashboard/src/Components/User/UserUnblockBox.tsx
@@ -7,7 +7,7 @@ import ShouldRender from '../basic/ShouldRender';
 import { unblockUser } from '../../actions/user';
 import { openModal, closeModal } from 'CommonUI/actions/Modal';
 
-export class UserUnblockBox extends Component<ComponentProps>{
+export class UserUnblockBox extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
@@ -16,13 +16,11 @@ export class UserUnblockBox extends Component<ComponentProps>{
     }
 
     handleClick = () => {
-
         const { unblockUser, userId }: $TSFixMe = this.props;
         return unblockUser(userId);
     };
 
     override render() {
-
         const { isRequesting }: $TSFixMe = this.props;
 
         return (
@@ -66,10 +64,11 @@ export class UserUnblockBox extends Component<ComponentProps>{
     }
 }
 
-
 UserUnblockBox.displayName = 'UserUnblockBox';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ unblockUser, openModal, closeModal }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ unblockUser, openModal, closeModal }, dispatch);
+};
 
 const mapStateToProps: Function = (state: RootState) => {
     const user: $TSFixMe = state.user.user.user || {};
@@ -84,7 +83,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 UserUnblockBox.propTypes = {
     isRequesting: PropTypes.oneOf([null, undefined, true, false]),
     userId: PropTypes.oneOfType([
@@ -94,7 +92,6 @@ UserUnblockBox.propTypes = {
     unblockUser: PropTypes.func.isRequired,
 };
 
-
 UserUnblockBox.contextTypes = {};
 
 export default connect(mapStateToProps, mapDispatchToProps)(UserUnblockBox);
diff --git a/AdminDashboard/src/Containers/BackboneModals.tsx b/AdminDashboard/src/Containers/BackboneModals.tsx
index 4ae54dade7..6c723e63c5 100644
--- a/AdminDashboard/src/Containers/BackboneModals.tsx
+++ b/AdminDashboard/src/Containers/BackboneModals.tsx
@@ -1,32 +1,33 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { bindActionCreators, Dispatch } from 'redux';
+import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import Modal from '../components/Modal';
 import { closeModal } from '../actions/Modal';
 
-export class Modals extends Component<ComponentProps>{
+export class Modals extends Component<ComponentProps> {
     public static displayName = '';
     public static propTypes = {};
 
     override render() {
-
         const modals = this.props.modals.map((item: $TSFixMe, i: $TSFixMe) => {
             const ModalComponent: $TSFixMe = Modal(item.content);
             return (
-                //  Modal(item.content)({
-                // 	item,
-                // 	zIndex: i,
-                // 	key: i,
-                // 	onClose: item => this.props.closeModal(item)
-                // })
+                /*
+                 *  Modal(item.content)({
+                 * 	item,
+                 * 	zIndex: i,
+                 * 	key: i,
+                 * 	onClose: item => this.props.closeModal(item)
+                 * })
+                 */
                 <ModalComponent
-
                     item={item}
                     key={i}
                     zIndex={i}
-
-                    onClose={(item: $TSFixMe) => this.props.closeModal(item)}
+                    onClose={(item: $TSFixMe) => {
+                        return this.props.closeModal(item);
+                    }}
                 />
             );
         });
@@ -34,18 +35,15 @@ export class Modals extends Component<ComponentProps>{
     }
 }
 
-
 Modals.propTypes = {
     modals: PropTypes.array.isRequired,
     closeModal: PropTypes.func.isRequired,
 };
 
-
 Modals.displayName = 'BlackBoneModals';
 
 export default connect(
     (state) => {
-
         return state.modal;
     },
     (dispatch) => {
diff --git a/AdminDashboard/src/Pages/AuditLogs.tsx b/AdminDashboard/src/Pages/AuditLogs.tsx
index f78260a9c0..8e89f2f894 100644
--- a/AdminDashboard/src/Pages/AuditLogs.tsx
+++ b/AdminDashboard/src/Pages/AuditLogs.tsx
@@ -12,7 +12,6 @@ import {
     fetchAuditLogStatus,
 } from '../actions/auditLogs';
 
-
 import { Link } from 'react-router-dom';
 import AlertPanel from '../components/basic/AlertPanel';
 import ShouldRender from '../components/basic/ShouldRender';
@@ -28,7 +27,6 @@ class AuditLogs extends Component<ComponentProps> {
     }
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchAuditLogs, searchAuditLogs }: $TSFixMe = this.props;
@@ -47,7 +45,6 @@ class AuditLogs extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchAuditLogs, searchAuditLogs }: $TSFixMe = this.props;
@@ -62,7 +59,6 @@ class AuditLogs extends Component<ComponentProps> {
     };
 
     override componentDidMount() {
-
         this.props.fetchAuditLogs();
 
         this.props.fetchAuditLogStatus();
@@ -79,7 +75,6 @@ class AuditLogs extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { auditLogStatus }: $TSFixMe = this.props;
         return (
             <div
@@ -151,7 +146,6 @@ class AuditLogs extends Component<ComponentProps> {
                                                     }
                                                 >
                                                     <AlertPanel
-
                                                         className=""
                                                         message={
                                                             <span id="auditLogDisabled">
@@ -176,18 +170,13 @@ class AuditLogs extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <AuditLogsList
-
                                             auditLogs={
-
                                                 this.props.auditLogs || {}
                                             }
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             userId={this.props.userId}
-
                                             requesting={this.props.requesting}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -201,7 +190,6 @@ class AuditLogs extends Component<ComponentProps> {
     }
 }
 
-
 AuditLogs.displayName = 'AuditLogs';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -234,7 +222,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 AuditLogs.propTypes = {
     fetchAuditLogs: PropTypes.func.isRequired,
     searchAuditLogs: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Pages/CallLogs.tsx b/AdminDashboard/src/Pages/CallLogs.tsx
index 54196e448e..b1b9a051f0 100644
--- a/AdminDashboard/src/Pages/CallLogs.tsx
+++ b/AdminDashboard/src/Pages/CallLogs.tsx
@@ -10,7 +10,6 @@ import {
     fetchCallLogStatus,
 } from '../actions/callLogs';
 
-
 import { Link } from 'react-router-dom';
 import AlertPanel from '../components/basic/AlertPanel';
 import ShouldRender from '../components/basic/ShouldRender';
@@ -26,7 +25,6 @@ class CallLogs extends Component<ComponentProps> {
     }
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchCallLogs, searchCallLogs }: $TSFixMe = this.props;
@@ -45,7 +43,6 @@ class CallLogs extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchCallLogs, searchCallLogs }: $TSFixMe = this.props;
@@ -60,7 +57,6 @@ class CallLogs extends Component<ComponentProps> {
     };
 
     override componentDidMount() {
-
         this.props.fetchCallLogs();
 
         this.props.fetchCallLogStatus();
@@ -77,7 +73,6 @@ class CallLogs extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { callLogStatus }: $TSFixMe = this.props;
         return (
             <div
@@ -148,7 +143,6 @@ class CallLogs extends Component<ComponentProps> {
                                                     }
                                                 >
                                                     <AlertPanel
-
                                                         className=""
                                                         message={
                                                             <span id="callLogDisabled">
@@ -172,15 +166,11 @@ class CallLogs extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <CallLogsList
-
                                             callLogs={this.props.callLogs || {}}
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             userId={this.props.userId}
-
                                             requesting={this.props.requesting}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -194,7 +184,6 @@ class CallLogs extends Component<ComponentProps> {
     }
 }
 
-
 CallLogs.displayName = 'CallLogs';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
diff --git a/AdminDashboard/src/Pages/EmailLogs.tsx b/AdminDashboard/src/Pages/EmailLogs.tsx
index 1f876d7e9d..020d08eace 100644
--- a/AdminDashboard/src/Pages/EmailLogs.tsx
+++ b/AdminDashboard/src/Pages/EmailLogs.tsx
@@ -10,7 +10,6 @@ import {
     fetchEmailLogStatus,
 } from '../actions/emailLogs';
 
-
 import { Link } from 'react-router-dom';
 import AlertPanel from '../components/basic/AlertPanel';
 import ShouldRender from '../components/basic/ShouldRender';
@@ -26,7 +25,6 @@ class EmailLogs extends Component<ComponentProps> {
     }
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchEmailLogs, searchEmailLogs }: $TSFixMe = this.props;
@@ -45,7 +43,6 @@ class EmailLogs extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchEmailLogs, searchEmailLogs }: $TSFixMe = this.props;
@@ -60,7 +57,6 @@ class EmailLogs extends Component<ComponentProps> {
     };
 
     override componentDidMount() {
-
         this.props.fetchEmailLogs();
 
         this.props.fetchEmailLogStatus();
@@ -77,7 +73,6 @@ class EmailLogs extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { emailLogStatus }: $TSFixMe = this.props;
         return (
             <div
@@ -148,7 +143,6 @@ class EmailLogs extends Component<ComponentProps> {
                                                     }
                                                 >
                                                     <AlertPanel
-
                                                         className=""
                                                         message={
                                                             <span id="emailLogDisabled">
@@ -173,18 +167,13 @@ class EmailLogs extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <EmailLogsList
-
                                             emailLogs={
-
                                                 this.props.emailLogs || {}
                                             }
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             userId={this.props.userId}
-
                                             requesting={this.props.requesting}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -198,7 +187,6 @@ class EmailLogs extends Component<ComponentProps> {
     }
 }
 
-
 EmailLogs.displayName = 'EmailLogs';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
diff --git a/AdminDashboard/src/Pages/License.tsx b/AdminDashboard/src/Pages/License.tsx
index d65ef5bc90..9977f20d9e 100644
--- a/AdminDashboard/src/Pages/License.tsx
+++ b/AdminDashboard/src/Pages/License.tsx
@@ -6,18 +6,16 @@ import LicenseSetting from '../components/license/LicenseSetting';
 import { fetchLicense } from '../actions/license';
 
 class License extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     componentDidMount = async () => {
-
         await this.props.fetchLicense();
     };
 
     override render() {
         return (
-            <div className="Box-root Margin-vertical--12" >
+            <div className="Box-root Margin-vertical--12">
                 <div>
                     <div>
                         <div className="db-BackboneViewContainer">
@@ -43,15 +41,14 @@ class License extends Component<ComponentProps> {
     }
 }
 
-
 License.displayName = 'License';
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ fetchLicense }, dispatch);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ fetchLicense }, dispatch);
+};
 
 License.contextTypes = {};
 
-
 License.propTypes = {
     fetchLicense: PropTypes.func.isRequired,
 };
diff --git a/AdminDashboard/src/Pages/Probes.tsx b/AdminDashboard/src/Pages/Probes.tsx
index cbf6c23abb..b64ef13d0d 100644
--- a/AdminDashboard/src/Pages/Probes.tsx
+++ b/AdminDashboard/src/Pages/Probes.tsx
@@ -30,7 +30,6 @@ class Probes extends Component<ComponentProps> {
     }
 
     handleKeyboard = (event: $TSFixMe) => {
-
         const { modalId, modalList }: $TSFixMe = this.props;
 
         const { addModalId }: $TSFixMe = this.state;
@@ -51,7 +50,6 @@ class Probes extends Component<ComponentProps> {
     };
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         this.props.getProbes(
             (skip || 0) > (limit || 10) ? skip - limit : 0,
             10
@@ -61,19 +59,19 @@ class Probes extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         this.props.getProbes(skip + limit, 10);
 
         this.setState({ page: this.state.page + 1 });
     };
 
     handleClick = () => {
-
         const { addModalId }: $TSFixMe = this.state;
 
         this.props.openModal({
             id: addModalId,
-            onConfirm: () => true,
+            onConfirm: () => {
+                return true;
+            },
             content: ProbeAddModal,
         });
     };
@@ -174,10 +172,8 @@ class Probes extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <ProbeList
-
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -191,7 +187,6 @@ class Probes extends Component<ComponentProps> {
     }
 }
 
-
 Probes.displayName = 'Probes';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -205,7 +200,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 Probes.propTypes = {
     getProbes: PropTypes.func.isRequired,
     openModal: PropTypes.func,
diff --git a/AdminDashboard/src/Pages/Project.tsx b/AdminDashboard/src/Pages/Project.tsx
index 9f0d045afb..9c63bf2d26 100644
--- a/AdminDashboard/src/Pages/Project.tsx
+++ b/AdminDashboard/src/Pages/Project.tsx
@@ -19,21 +19,18 @@ import ProjectBalance from '../components/project/ProjectBalance';
 import ProjectDomain from '../components/project/ProjectDomain';
 
 class Project extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     componentDidMount = async () => {
-
         this.props.fetchProject(this.props.slug);
 
         if (this.props.project._id) {
-
             this.props.fetchProjectTeam(this.props.project._id);
         }
 
-
-        const { fetchProject, slug, fetchProjectTeam, project }: $TSFixMe = this.props;
+        const { fetchProject, slug, fetchProjectTeam, project }: $TSFixMe =
+            this.props;
         fetchProject(slug);
         if (project._id) {
             fetchProjectTeam(project._id);
@@ -41,11 +38,8 @@ class Project extends Component<ComponentProps> {
     };
 
     componentDidUpdate(prevProps: $TSFixMe) {
-
         if (prevProps.project._id !== this.props.project._id) {
-
             if (this.props.project._id) {
-
                 this.props.fetchProjectTeam(this.props.project._id);
             }
         }
@@ -53,7 +47,7 @@ class Project extends Component<ComponentProps> {
 
     override render() {
         return (
-            <div className="Box-root Margin-vertical--12" >
+            <div className="Box-root Margin-vertical--12">
                 <div>
                     <div>
                         <div className="db-BackboneViewContainer">
@@ -65,90 +59,65 @@ class Project extends Component<ComponentProps> {
                                         </div>
                                         <div className="Box-root Margin-bottom--12">
                                             <AdminNotes
-
                                                 id={
-
                                                     this.props.project &&
-
                                                     this.props.project._id
                                                 }
                                                 addNote={
-
                                                     this.props.addProjectNote
                                                 }
                                                 initialValues={
-
                                                     this.props.initialValues
                                                 }
                                             />
                                         </div>
                                         <div className="Box-root Margin-bottom--12">
                                             <ProjectUsers
-
                                                 paginate={this.props.paginate}
                                                 projectName={
-
                                                     this.props.project &&
-
                                                     this.props.project.name
                                                 }
                                                 users={
-
                                                     this.props.projectUsers &&
-
                                                     this.props.projectUsers.team
                                                 }
                                                 projectId={
-
                                                     this.props.project &&
-
                                                     this.props.project._id
                                                 }
                                                 pages={
-
                                                     this.props.projectUsers &&
-
                                                     this.props.projectUsers.page
                                                 }
                                                 membersPerPage={10}
                                                 count={
-
                                                     this.props.projectUsers &&
-
                                                     this.props.projectUsers
                                                         .team &&
-
                                                     this.props.projectUsers.team
                                                         .count
                                                 }
                                                 page={
-
                                                     this.props.projectUsers &&
-
                                                     this.props.projectUsers.page
                                                 }
                                                 canPaginateBackward={
-
                                                     this.props.projectUsers &&
-
-                                                        this.props.projectUsers
-                                                            .page > 1
+                                                    this.props.projectUsers
+                                                        .page > 1
                                                         ? true
                                                         : false
                                                 }
                                                 canPaginateForward={
-
                                                     this.props.projectUsers &&
-
-                                                        this.props.projectUsers
-                                                            .team &&
-
-                                                        this.props.projectUsers.team
-                                                            .count >
-
+                                                    this.props.projectUsers
+                                                        .team &&
+                                                    this.props.projectUsers.team
+                                                        .count >
                                                         this.props.projectUsers
                                                             .page *
-                                                        10
+                                                            10
                                                         ? true
                                                         : false
                                                 }
@@ -156,39 +125,28 @@ class Project extends Component<ComponentProps> {
                                         </div>
                                         <div className="Box-root Margin-bottom--12">
                                             <ProjectDomain
-
                                                 projectId={
-
                                                     this.props.project &&
-
                                                     this.props.project._id
                                                 }
                                             />
                                         </div>
                                         <div className="Box-root Margin-bottom--12">
                                             <ProjectBalance
-
                                                 balance={
-
                                                     this.props.project &&
-
                                                     this.props.project.balance
                                                 }
                                                 projectId={
-
                                                     this.props.project &&
-
                                                     this.props.project._id
                                                 }
                                             />
                                         </div>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 !this.props.project.deleted &&
-
                                                 !this.props.project.isBlocked &&
                                                 IS_SAAS_SERVICE
                                             }
@@ -199,11 +157,8 @@ class Project extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 !this.props.project.deleted &&
-
                                                 !this.props.project.isBlocked
                                             }
                                         >
@@ -213,9 +168,7 @@ class Project extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 this.props.project
                                                     .alertLimitReached
                                             }
@@ -226,11 +179,8 @@ class Project extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 !this.props.project.deleted &&
-
                                                 this.props.project.isBlocked
                                             }
                                         >
@@ -240,9 +190,7 @@ class Project extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 !this.props.project.deleted
                                             }
                                         >
@@ -252,9 +200,7 @@ class Project extends Component<ComponentProps> {
                                         </ShouldRender>
                                         <ShouldRender
                                             if={
-
                                                 this.props.project &&
-
                                                 this.props.project.deleted
                                             }
                                         >
@@ -298,10 +244,8 @@ const mapStateToProps: Function = (state: RootState, props: $TSFixMe) => {
     };
 };
 
-
 Project.contextTypes = {};
 
-
 Project.propTypes = {
     addProjectNote: PropTypes.func.isRequired,
     initialValues: PropTypes.object,
@@ -313,7 +257,6 @@ Project.propTypes = {
     slug: PropTypes.string,
 };
 
-
 Project.displayName = 'Project';
 
 export default connect(mapStateToProps, mapDispatchToProps)(Project);
diff --git a/AdminDashboard/src/Pages/Projects.tsx b/AdminDashboard/src/Pages/Projects.tsx
index 73605fc48e..8bdf8c0018 100644
--- a/AdminDashboard/src/Pages/Projects.tsx
+++ b/AdminDashboard/src/Pages/Projects.tsx
@@ -18,7 +18,6 @@ class Projects extends Component<ComponentProps> {
     }
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchProjects, searchProjects }: $TSFixMe = this.props;
@@ -37,7 +36,6 @@ class Projects extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchProjects, searchProjects }: $TSFixMe = this.props;
@@ -52,7 +50,6 @@ class Projects extends Component<ComponentProps> {
     };
 
     componentDidMount = () => {
-
         this.props.fetchProjects();
     };
 
@@ -134,15 +131,11 @@ class Projects extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <ProjectList
-
                                             projects={this.props.projects || {}}
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             userId={this.props.userId}
-
                                             requesting={this.props.requesting}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -156,7 +149,6 @@ class Projects extends Component<ComponentProps> {
     }
 }
 
-
 Projects.displayName = 'Projects';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -179,7 +171,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 Projects.propTypes = {
     fetchProjects: PropTypes.func.isRequired,
     searchProjects: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Pages/Settings.tsx b/AdminDashboard/src/Pages/Settings.tsx
index 40df007605..78c3b61835 100644
--- a/AdminDashboard/src/Pages/Settings.tsx
+++ b/AdminDashboard/src/Pages/Settings.tsx
@@ -10,7 +10,6 @@ import EmailLog from '../components/settings/emailLog';
 import CallLog from '../components/settings/callLog';
 import SmsLog from '../components/settings/smsLog';
 
-
 const getChild: Function = (key: $TSFixMe) => {
     switch (key) {
         case '/admin/settings/smtp':
@@ -37,9 +36,7 @@ const getChild: Function = (key: $TSFixMe) => {
     }
 };
 
-const Component: Function = ({
-    location: { pathname }
-}: $TSFixMe) => {
+const Component: Function = ({ location: { pathname } }: $TSFixMe) => {
     return (
         <div className="Box-root Margin-vertical--12">
             <div>
diff --git a/AdminDashboard/src/Pages/SmsLogs.tsx b/AdminDashboard/src/Pages/SmsLogs.tsx
index 127656d0f9..59fdc5dba1 100644
--- a/AdminDashboard/src/Pages/SmsLogs.tsx
+++ b/AdminDashboard/src/Pages/SmsLogs.tsx
@@ -10,7 +10,6 @@ import {
     fetchSmsLogStatus,
 } from '../actions/smsLogs';
 
-
 import { Link } from 'react-router-dom';
 import AlertPanel from '../components/basic/AlertPanel';
 import ShouldRender from '../components/basic/ShouldRender';
@@ -26,7 +25,6 @@ class SmsLogs extends Component<ComponentProps> {
     }
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchSmsLogs, searchSmsLogs }: $TSFixMe = this.props;
@@ -45,7 +43,6 @@ class SmsLogs extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchSmsLogs, searchSmsLogs }: $TSFixMe = this.props;
@@ -60,7 +57,6 @@ class SmsLogs extends Component<ComponentProps> {
     };
 
     componentDidMount = () => {
-
         this.props.fetchSmsLogs();
 
         this.props.fetchSmsLogStatus();
@@ -77,7 +73,6 @@ class SmsLogs extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { smsLogStatus }: $TSFixMe = this.props;
         return (
             <div
@@ -147,7 +142,6 @@ class SmsLogs extends Component<ComponentProps> {
                                                     }
                                                 >
                                                     <AlertPanel
-
                                                         className=""
                                                         message={
                                                             <span id="smsLogDisabled">
@@ -171,15 +165,11 @@ class SmsLogs extends Component<ComponentProps> {
                                             </div>
                                         </div>
                                         <SmsLogsList
-
                                             smsLogs={this.props.smsLogs || {}}
                                             prevClicked={this.prevClicked}
                                             nextClicked={this.nextClicked}
-
                                             userId={this.props.userId}
-
                                             requesting={this.props.requesting}
-
                                             page={this.state.page}
                                         />
                                     </div>
@@ -193,7 +183,6 @@ class SmsLogs extends Component<ComponentProps> {
     }
 }
 
-
 SmsLogs.displayName = 'SmsLogs';
 
 const mapDispatchToProps: Function = (dispatch: Dispatch) => {
@@ -226,7 +215,6 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 SmsLogs.propTypes = {
     fetchSmsLogs: PropTypes.func.isRequired,
     searchSmsLogs: PropTypes.func.isRequired,
diff --git a/AdminDashboard/src/Pages/User.tsx b/AdminDashboard/src/Pages/User.tsx
index bfe5451d1d..087b3c6668 100644
--- a/AdminDashboard/src/Pages/User.tsx
+++ b/AdminDashboard/src/Pages/User.tsx
@@ -19,12 +19,10 @@ import UserAdminModeDisableBox from '../components/user/UserAdminModeDisableBox'
 import { User as LsUser } from '../config';
 
 class User extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
     componentDidMount = async () => {
-
         await this.props.fetchUserProjects(this.props.match.params.userId);
 
         await this.props.fetchUser(this.props.match.params.userId);
@@ -34,7 +32,7 @@ class User extends Component<ComponentProps> {
 
     override render() {
         return (
-            <div className="Box-root Margin-vertical--12" >
+            <div className="Box-root Margin-vertical--12">
                 <div>
                     <div>
                         <div className="db-BackboneViewContainer">
@@ -50,18 +48,14 @@ class User extends Component<ComponentProps> {
                                             </div>
                                             <div className="Box-root Margin-bottom--12">
                                                 <AdminNotes
-
                                                     id={
-
                                                         this.props.match.params
                                                             .userId
                                                     }
                                                     addNote={
-
                                                         this.props.addUserNote
                                                     }
                                                     initialValues={
-
                                                         this.props.initialValues
                                                     }
                                                 />
@@ -69,7 +63,6 @@ class User extends Component<ComponentProps> {
                                             <ShouldRender
                                                 if={
                                                     LsUser.getUserId() !==
-
                                                     this.props.match.params
                                                         .userId
                                                 }
@@ -77,10 +70,8 @@ class User extends Component<ComponentProps> {
                                                 <div className="Box-root Margin-bottom--12">
                                                     <ShouldRender
                                                         if={
-
                                                             !this.props?.user
                                                                 ?.isAdminMode &&
-
                                                             !this.props?.user
                                                                 .deleted
                                                         }
@@ -89,10 +80,8 @@ class User extends Component<ComponentProps> {
                                                     </ShouldRender>
                                                     <ShouldRender
                                                         if={
-
                                                             this.props?.user
                                                                 ?.isAdminMode &&
-
                                                             !this.props?.user
                                                                 .deleted
                                                         }
@@ -103,10 +92,8 @@ class User extends Component<ComponentProps> {
                                             </ShouldRender>
                                             <div className="Box-root Margin-bottom--12">
                                                 <UserHistory
-
                                                     history={this.props.history}
                                                     userId={
-
                                                         this.props.match.params
                                                             .userId
                                                     }
@@ -115,19 +102,15 @@ class User extends Component<ComponentProps> {
                                             <ShouldRender
                                                 if={
                                                     LsUser.getUserId() !==
-
                                                     this.props.match.params
                                                         .userId
                                                 }
                                             >
                                                 <ShouldRender
                                                     if={
-
                                                         this.props.user &&
-
                                                         !this.props.user
                                                             .deleted &&
-
                                                         !this.props.user
                                                             .isBlocked
                                                     }
@@ -138,12 +121,9 @@ class User extends Component<ComponentProps> {
                                                 </ShouldRender>
                                                 <ShouldRender
                                                     if={
-
                                                         this.props.user &&
-
                                                         !this.props.user
                                                             .deleted &&
-
                                                         this.props.user
                                                             .isBlocked
                                                     }
@@ -154,9 +134,7 @@ class User extends Component<ComponentProps> {
                                                 </ShouldRender>
                                                 <ShouldRender
                                                     if={
-
                                                         this.props.user &&
-
                                                         !this.props.user.deleted
                                                     }
                                                 >
@@ -166,9 +144,7 @@ class User extends Component<ComponentProps> {
                                                 </ShouldRender>
                                                 <ShouldRender
                                                     if={
-
                                                         this.props.user &&
-
                                                         this.props.user.deleted
                                                     }
                                                 >
@@ -207,10 +183,8 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 User.contextTypes = {};
 
-
 User.propTypes = {
     match: PropTypes.object.isRequired,
     fetchUserProjects: PropTypes.func.isRequired,
@@ -222,7 +196,6 @@ User.propTypes = {
     fetchUserloginHistory: PropTypes.func,
 };
 
-
 User.displayName = 'User';
 
 export default connect(mapStateToProps, mapDispatchToProps)(User);
diff --git a/AdminDashboard/src/Pages/Users.tsx b/AdminDashboard/src/Pages/Users.tsx
index b9c3b79443..138a30d85a 100644
--- a/AdminDashboard/src/Pages/Users.tsx
+++ b/AdminDashboard/src/Pages/Users.tsx
@@ -14,7 +14,6 @@ import UserAddModal from '../components/user/UserAddModal';
 import * as _ from 'lodash';
 
 class Users extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -39,7 +38,6 @@ class Users extends Component<ComponentProps> {
     }
 
     handleKeyboard = (event: $TSFixMe) => {
-
         const { modalId }: $TSFixMe = this.props;
 
         const { addModalId }: $TSFixMe = this.state;
@@ -60,7 +58,6 @@ class Users extends Component<ComponentProps> {
     };
 
     prevClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchUsers, searchUsers }: $TSFixMe = this.props;
@@ -79,7 +76,6 @@ class Users extends Component<ComponentProps> {
     };
 
     nextClicked = (skip: PositiveNumber, limit: PositiveNumber) => {
-
         const { searchBox }: $TSFixMe = this.state;
 
         const { fetchUsers, searchUsers }: $TSFixMe = this.props;
@@ -104,46 +100,41 @@ class Users extends Component<ComponentProps> {
     };
 
     handleClick = () => {
-
         const { addModalId }: $TSFixMe = this.state;
 
         this.props.openModal({
             id: addModalId,
-            onConfirm: () => true,
+            onConfirm: () => {
+                return true;
+            },
             content: UserAddModal,
         });
     };
 
     override render() {
-
         const { users, user, requesting }: $TSFixMe = this.props;
         let canNext =
-
             this.props.user.users &&
-
-                this.props.user.users.count &&
-
-                this.props.user.users.count >
-
+            this.props.user.users.count &&
+            this.props.user.users.count >
                 this.props.user.users.skip + this.props.user.users.limit
                 ? true
                 : false;
         let canPrev =
-
             this.props.user.users && this.props.user.users.skip <= 0
                 ? false
                 : true;
 
         if (
-
             this.props.user.users &&
-
             (this.props.user.users.requesting || !this.props.user.users)
         ) {
             canNext = false;
             canPrev = false;
         }
-        const numberOfPages: $TSFixMe = Math.ceil(parseInt(user.users.count) / 10);
+        const numberOfPages: $TSFixMe = Math.ceil(
+            parseInt(user.users.count) / 10
+        );
         return (
             <div
                 onKeyDown={this.handleKeyBoard}
@@ -293,27 +284,31 @@ class Users extends Component<ComponentProps> {
                                                 <div className="bs-Tail-copy">
                                                     <span>
                                                         {numberOfPages > 0
-                                                            ? `Page ${this.state
-
-                                                                .page
-                                                            } of ${numberOfPages} (${user.users
-                                                                .count
-                                                            } OneUptime User${user.users
-                                                                .count ===
-                                                                1
-                                                                ? ''
-                                                                : 's'
-                                                            })`
+                                                            ? `Page ${
+                                                                  this.state
+                                                                      .page
+                                                              } of ${numberOfPages} (${
+                                                                  user.users
+                                                                      .count
+                                                              } OneUptime User${
+                                                                  user.users
+                                                                      .count ===
+                                                                  1
+                                                                      ? ''
+                                                                      : 's'
+                                                              })`
                                                             : user.users
-                                                                .count &&
-                                                            `${user.users
-                                                                .count
-                                                            } OneUptime User${user.users
-                                                                .count ===
-                                                                1
-                                                                ? ''
-                                                                : 's'
-                                                            }`}
+                                                                  .count &&
+                                                              `${
+                                                                  user.users
+                                                                      .count
+                                                              } OneUptime User${
+                                                                  user.users
+                                                                      .count ===
+                                                                  1
+                                                                      ? ''
+                                                                      : 's'
+                                                              }`}
                                                     </span>
                                                 </div>
                                                 <div className="bs-Tail-actions">
@@ -325,13 +320,11 @@ class Users extends Component<ComponentProps> {
                                                                     this.prevClicked(
                                                                         this
                                                                             .props
-
                                                                             .user
                                                                             .users
                                                                             .skip,
                                                                         this
                                                                             .props
-
                                                                             .user
                                                                             .users
                                                                             .limit
@@ -365,13 +358,11 @@ class Users extends Component<ComponentProps> {
                                                                     this.nextClicked(
                                                                         this
                                                                             .props
-
                                                                             .user
                                                                             .users
                                                                             .skip,
                                                                         this
                                                                             .props
-
                                                                             .user
                                                                             .users
                                                                             .limit
@@ -434,10 +425,8 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-
 Users.contextTypes = {};
 
-
 Users.propTypes = {
     user: PropTypes.object.isRequired,
     users: PropTypes.array,
@@ -448,7 +437,6 @@ Users.propTypes = {
     modalId: PropTypes.string,
 };
 
-
 Users.displayName = 'Users';
 
 export default connect(mapStateToProps, mapDispatchToProps)(Users);
diff --git a/AdminDashboard/src/config.tsx b/AdminDashboard/src/config.tsx
index 480b8f5cab..999414e442 100644
--- a/AdminDashboard/src/config.tsx
+++ b/AdminDashboard/src/config.tsx
@@ -11,13 +11,12 @@ import { emaildomains } from './constants/emaildomains';
 import booleanParser from './utils/booleanParser';
 
 export const env: Function = (value: $TSFixMe) => {
-
     const { _env }: $TSFixMe = window;
     return (
         (_env && _env[`REACT_APP_${value}`]) ||
         process.env[`REACT_APP_${value}`]
     );
-}
+};
 
 let apiUrl = window.location.origin + '/api';
 let dashboardUrl = window.location.origin + '/dashboard';
@@ -38,8 +37,8 @@ if (
     const address: $TSFixMe = window.location.host.includes('localhost:')
         ? 'localhost'
         : window.location.host.includes('0.0.0.0:')
-            ? '0.0.0.0'
-            : '127.0.0.1';
+        ? '0.0.0.0'
+        : '127.0.0.1';
     apiUrl = window.location.protocol + `//${address}:3002`;
     dashboardUrl = window.location.protocol + `//${address}:3000/dashboard`;
     adminDashboardUrl = window.location.protocol + `//${address}:3100/admin`;
@@ -162,9 +161,8 @@ export const Validate: $TSFixMe = {
     number(number: $TSFixMe) {
         if (number && number.length && !isNaN(number)) {
             return true;
-        } else {
-            return false;
         }
+        return false;
     },
 
     isValidNumber(number: $TSFixMe) {
@@ -180,9 +178,8 @@ export const Validate: $TSFixMe = {
 
         if (number && !isNaN(number) && number > 0) {
             return true;
-        } else {
-            return false;
         }
+        return false;
     },
 
     isStrongPassword(password: $TSFixMe) {
@@ -193,7 +190,9 @@ export const Validate: $TSFixMe = {
     },
 
     email(email: $TSFixMe) {
-        if (this.text(email)) return isEmail(email);
+        if (this.text(email)) {
+            return isEmail(email);
+        }
         return false;
     },
 
@@ -202,7 +201,9 @@ export const Validate: $TSFixMe = {
     },
     isValidBusinessEmails(emails: $TSFixMe) {
         for (const email of emails) {
-            if (!emaildomains.test(email)) return false;
+            if (!emaildomains.test(email)) {
+                return false;
+            }
         }
         return true;
     },
@@ -261,41 +262,61 @@ export const Validate: $TSFixMe = {
 };
 
 export const ValidateField: $TSFixMe = {
-    required: (value: $TSFixMe) => value && value.length ? undefined : 'This field is required',
+    required: (value: $TSFixMe) => {
+        return value && value.length ? undefined : 'This field is required';
+    },
 
-    select: (value: $TSFixMe) => value && value.length && value.trim() !== ''
-        ? undefined
-        : 'Please select a value',
+    select: (value: $TSFixMe) => {
+        return value && value.length && value.trim() !== ''
+            ? undefined
+            : 'Please select a value';
+    },
 
-    maxValue10000: (value: $TSFixMe) => value && value.length && value < 10000
-        ? undefined
-        : `input value should be less than ${10000}`,
+    maxValue10000: (value: $TSFixMe) => {
+        return value && value.length && value < 10000
+            ? undefined
+            : `input value should be less than ${10000}`;
+    },
 
-    isDomain: (domain: $TSFixMe) => domain.search(/\./) >= 0 ? undefined : 'Please enter a valid Domain',
+    isDomain: (domain: $TSFixMe) => {
+        return domain.search(/\./) >= 0
+            ? undefined
+            : 'Please enter a valid Domain';
+    },
 
-    url: (url: URL) => validUrl.isUri(url) ? undefined : 'Please enter a valid Url',
+    url: (url: URL) => {
+        return validUrl.isUri(url) ? undefined : 'Please enter a valid Url';
+    },
 
-    text: (text: $TSFixMe) => !text || text.trim() === ''
-        ? 'This field cannot be left blank'
-        : undefined,
+    text: (text: $TSFixMe) => {
+        return !text || text.trim() === ''
+            ? 'This field cannot be left blank'
+            : undefined;
+    },
 
-    number: (number: $TSFixMe) => number && number.length && !isNaN(number)
-        ? undefined
-        : 'Please enter a valid number',
+    number: (number: $TSFixMe) => {
+        return number && number.length && !isNaN(number)
+            ? undefined
+            : 'Please enter a valid number';
+    },
 
+    email: (email: $TSFixMe) => {
+        return this.text(email) && isEmail(email)
+            ? undefined
+            : 'Please enter a valid email';
+    },
 
-    email: (email: $TSFixMe) => this.text(email) && isEmail(email)
-        ? undefined
-        : 'Please enter a valid email',
+    compare: (text1: $TSFixMe, text2: $TSFixMe) => {
+        return text1 === text2 ? undefined : 'These texts donot match';
+    },
 
-    compare: (text1: $TSFixMe, text2: $TSFixMe) =>
-        text1 === text2 ? undefined : 'These texts donot match',
-
-    password6: (password: $TSFixMe) => !password || !password.length
-        ? 'Password cannot be blank'
-        : password.length < 6
+    password6: (password: $TSFixMe) => {
+        return !password || !password.length
+            ? 'Password cannot be blank'
+            : password.length < 6
             ? 'Password must be a minimum of 6 characters'
-            : undefined,
+            : undefined;
+    },
 };
 
 export const PricingPlan: $TSFixMe = {
@@ -348,58 +369,61 @@ export const PricingPlan: $TSFixMe = {
                     details: '$99/mo per user paid annually. ',
                 },
             ];
-        } else {
-            return [
-                {
-                    category: 'Startup',
-                    planId: 'plan_GoVgVbvNdbWwlm',
-                    type: 'month',
-                    amount: 25,
-                    details: '$25 / Month / User',
-                },
-                {
-                    category: 'Startup',
-                    planId: 'plan_GoVgJu5PKMLRJU',
-                    type: 'annual',
-                    amount: 264,
-                    details: '$22/mo per user paid annually. ',
-                },
-                {
-                    category: 'Growth',
-                    planId: 'plan_GoVi9EIa6MU0fG',
-                    type: 'month',
-                    amount: 59,
-                    details: '$59 / Month / User',
-                },
-                {
-                    category: 'Growth',
-                    planId: 'plan_GoViZshjqzZ0vv',
-                    type: 'annual',
-                    amount: 588,
-                    details: '$49/mo per user paid annually. ',
-                },
-                {
-                    category: 'Scale',
-                    planId: 'plan_H9Ii6Qj3HLdtty',
-                    type: 'month',
-                    amount: 99,
-                    details: '$120 / Month / User',
-                },
-                {
-                    category: 'Scale',
-                    planId: 'plan_H9IjvX2Flsvlcg',
-                    type: 'annual',
-                    amount: 1188,
-                    details: '$99/mo per user paid annually. ',
-                },
-            ];
         }
+        return [
+            {
+                category: 'Startup',
+                planId: 'plan_GoVgVbvNdbWwlm',
+                type: 'month',
+                amount: 25,
+                details: '$25 / Month / User',
+            },
+            {
+                category: 'Startup',
+                planId: 'plan_GoVgJu5PKMLRJU',
+                type: 'annual',
+                amount: 264,
+                details: '$22/mo per user paid annually. ',
+            },
+            {
+                category: 'Growth',
+                planId: 'plan_GoVi9EIa6MU0fG',
+                type: 'month',
+                amount: 59,
+                details: '$59 / Month / User',
+            },
+            {
+                category: 'Growth',
+                planId: 'plan_GoViZshjqzZ0vv',
+                type: 'annual',
+                amount: 588,
+                details: '$49/mo per user paid annually. ',
+            },
+            {
+                category: 'Scale',
+                planId: 'plan_H9Ii6Qj3HLdtty',
+                type: 'month',
+                amount: 99,
+                details: '$120 / Month / User',
+            },
+            {
+                category: 'Scale',
+                planId: 'plan_H9IjvX2Flsvlcg',
+                type: 'annual',
+                amount: 1188,
+                details: '$99/mo per user paid annually. ',
+            },
+        ];
     },
 
     getPlanById(id: $TSFixMe) {
         const plans: $TSFixMe = this.getPlans();
-        if (id) return plans.find(plan => plan.planId === id);
-        else return plans[0];
+        if (id) {
+            return plans.find((plan) => {
+                return plan.planId === id;
+            });
+        }
+        return plans[0];
     },
 };
 
@@ -476,19 +500,27 @@ export const tutorials: $TSFixMe = {
 };
 
 export const getQueryVar: Function = (variable: $TSFixMe, url: URL) => {
-    if (!url) return null;
+    if (!url) {
+        return null;
+    }
     variable = variable.replace(/[[\]]/g, '\\$&');
     const regex: $TSFixMe = new RegExp('[?&]' + variable + '(=([^&#]*)|&|#|$)'),
         results = regex.exec(url);
-    if (!results) return null;
-    if (!results[2]) return '';
+    if (!results) {
+        return null;
+    }
+    if (!results[2]) {
+        return '';
+    }
     return decodeURIComponent(results[2].replace(/\+/g, ' '));
-}
+};
 
 export const saveFile: Function = (content: $TSFixMe, filename: $TSFixMe) => {
-    const blob: $TSFixMe = new Blob([content], { type: 'text/plain;charset=utf-8' });
+    const blob: $TSFixMe = new Blob([content], {
+        type: 'text/plain;charset=utf-8',
+    });
     FileSaver.saveAs(blob, filename);
-}
+};
 
 export const makeCriteria: Function = (val: $TSFixMe) => {
     const val2: $TSFixMe = {};
@@ -498,23 +530,18 @@ export const makeCriteria: Function = (val: $TSFixMe) => {
     for (let i = 0; i < val.length; i++) {
         const val3: $TSFixMe = {};
         if (val[i].responseType && val[i].responseType.length) {
-
             val3.responseType = val[i].responseType;
         }
         if (val[i].filter && val[i].filter.length) {
-
             val3.filter = val[i].filter;
         }
         if (val[i].field1 && val[i].field1.length) {
-
             val3.field1 = val[i].field1;
         }
         if (val[i].field2 && val[i].field2.length) {
-
             val3.field2 = val[i].field2;
         }
         if (val[i].collection && val[i].collection.length) {
-
             val3.collection = makeCriteria(val[i].collection);
         }
         if (val[0].match && val[0].match.length && val[0].match === 'all') {
@@ -529,7 +556,7 @@ export const makeCriteria: Function = (val: $TSFixMe) => {
 
     val2.or = or;
     return val2;
-}
+};
 
 export const mapCriteria: Function = (val: $TSFixMe) => {
     const val2: $TSFixMe = [];
@@ -537,35 +564,28 @@ export const mapCriteria: Function = (val: $TSFixMe) => {
         for (let i = 0; i < val.and.length; i++) {
             const val3: $TSFixMe = {};
             if (val.and[i].responseType && val.and[i].responseType.length) {
-
                 val3.responseType = val.and[i].responseType;
             }
             if (val.and[i].filter && val.and[i].filter.length) {
-
                 val3.filter = val.and[i].filter;
             }
             if (val.and[i].field1 && val.and[i].field1.length) {
-
                 val3.field1 = val.and[i].field1;
             }
             if (val.and[i].field2 && val.and[i].field2.length) {
-
                 val3.field2 = val.and[i].field2;
             }
             if (
                 val.and[i].collection &&
                 (val.and[i].collection.and || val.and[i].collection.or)
             ) {
-
                 val3.field3 = true;
 
                 val3.collection = mapCriteria(val.and[i].collection);
             } else {
-
                 val3.field3 = false;
             }
             if (i === 0) {
-
                 val3.match = 'all';
             }
             val2.push(val3);
@@ -575,39 +595,32 @@ export const mapCriteria: Function = (val: $TSFixMe) => {
         for (let i = 0; i < val.or.length; i++) {
             const val3: $TSFixMe = {};
             if (val.or[i].responseType && val.or[i].responseType.length) {
-
                 val3.responseType = val.or[i].responseType;
             }
             if (val.or[i].filter && val.or[i].filter.length) {
-
                 val3.filter = val.or[i].filter;
             }
             if (val.or[i].field1 && val.or[i].field1.length) {
-
                 val3.field1 = val.or[i].field1;
             }
             if (val.or[i].field2 && val.or[i].field2.length) {
-
                 val3.field2 = val.or[i].field2;
             }
             if (
                 val.or[i].collection &&
                 (val.or[i].collection.and || val.or[i].collection.or)
             ) {
-
                 val3.field3 = true;
 
                 val3.collection = mapCriteria(val.or[i].collection);
             } else {
-
                 val3.field3 = false;
             }
             if (i === 0) {
-
                 val3.match = 'any';
             }
             val2.push(val3);
         }
         return val2;
     }
-}
+};
diff --git a/AdminDashboard/src/index.tsx b/AdminDashboard/src/index.tsx
index 567d37fe57..a95e0834b6 100644
--- a/AdminDashboard/src/index.tsx
+++ b/AdminDashboard/src/index.tsx
@@ -10,7 +10,6 @@ import ErrorBoundary from './components/basic/ErrorBoundary';
 const target: $TSFixMe = document.getElementById('root');
 
 render(
-
     <Provider store={store} history={history}>
         <ErrorBoundary>
             <App />
diff --git a/CommonUI/src/Components/404.tsx b/CommonUI/src/Components/404.tsx
index 8c37d466f5..c3cd7f7ae0 100644
--- a/CommonUI/src/Components/404.tsx
+++ b/CommonUI/src/Components/404.tsx
@@ -1,22 +1,16 @@
 import React, { FunctionComponent, ReactElement } from 'react';
 
-export interface ComponentProps { }
+export interface ComponentProps {}
 
 const NotFound: FunctionComponent = (_props: ComponentProps): ReactElement => {
-
     return (
         <div>
             <div>
                 <div>
-
-                    <div>
-                        The page you requested does not exist.
-                    </div>
-
+                    <div>The page you requested does not exist.</div>
                 </div>
             </div>
         </div>
     );
-
-}
+};
 export default NotFound;
diff --git a/CommonUI/src/Components/Basic/Button/Button.tsx b/CommonUI/src/Components/Basic/Button/Button.tsx
index caac623386..87b3115d86 100644
--- a/CommonUI/src/Components/Basic/Button/Button.tsx
+++ b/CommonUI/src/Components/Basic/Button/Button.tsx
@@ -13,8 +13,9 @@ export interface ComponentProps {
     isLoading?: boolean;
 }
 
-const Button: FunctionComponent<ComponentProps> = (props: ComponentProps): ReactElement => {
-
+const Button: FunctionComponent<ComponentProps> = (
+    props: ComponentProps
+): ReactElement => {
     // props validation
     if (!props.type) {
         props.type = ButtonType.Button;
@@ -23,21 +24,27 @@ const Button: FunctionComponent<ComponentProps> = (props: ComponentProps): React
     useEffect(() => {
         // componentDidMount
         if (props.shortcutKey) {
-            window.addEventListener('keydown', (e) => handleKeyboard(e as KeyboardEventProp));
+            window.addEventListener('keydown', (e) => {
+                return handleKeyboard(e as KeyboardEventProp);
+            });
         }
 
         // componentDidUnmount
         return () => {
             if (props.shortcutKey) {
-                window.removeEventListener('keydown', (e) => handleKeyboard(e as KeyboardEventProp));
+                window.removeEventListener('keydown', (e) => {
+                    return handleKeyboard(e as KeyboardEventProp);
+                });
             }
-        }
-    })
-
+        };
+    });
 
     const handleKeyboard = (event: KeyboardEventProp) => {
-
-        if (event.target instanceof HTMLBodyElement && event.key && props.shortcutKey) {
+        if (
+            event.target instanceof HTMLBodyElement &&
+            event.key &&
+            props.shortcutKey
+        ) {
             switch (event.key) {
                 case props.shortcutKey.toUpperCase():
                 case props.shortcutKey.toLowerCase():
@@ -47,30 +54,33 @@ const Button: FunctionComponent<ComponentProps> = (props: ComponentProps): React
                     return;
             }
         }
-    }
+    };
 
-    return (<button
-        id={props.id}
-        onClick={props.onClick}
-        className={`${'Button bs-ButtonLegacy ActionIconParent'} ${props.disabled ? 'Is--disabled' : ''
+    return (
+        <button
+            id={props.id}
+            onClick={props.onClick}
+            className={`${'Button bs-ButtonLegacy ActionIconParent'} ${
+                props.disabled ? 'Is--disabled' : ''
             }`}
-        type={props.type}
-        disabled={props.disabled}
-    >
-        <div className="bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
-            <div className="Box-root Margin-right--8">
-                <div className="SVGInline SVGInline--cleaned Button-icon ActionIcon ActionIcon--color--inherit Box-root Flex-flex"></div>
+            type={props.type}
+            disabled={props.disabled}
+        >
+            <div className="bs-ButtonLegacy-fill Box-root Box-background--white Flex-inlineFlex Flex-alignItems--center Flex-direction--row Padding-horizontal--8 Padding-vertical--4">
+                <div className="Box-root Margin-right--8">
+                    <div className="SVGInline SVGInline--cleaned Button-icon ActionIcon ActionIcon--color--inherit Box-root Flex-flex"></div>
+                </div>
+                <span className="bs-Button bs-FileUploadButton bs-Button--icon bs-Button--new keycode__wrapper">
+                    <span>{props.title}</span>
+                    {props.shortcutKey && (
+                        <span className="new-btn__keycode">
+                            {props.shortcutKey}
+                        </span>
+                    )}
+                </span>
             </div>
-            <span className="bs-Button bs-FileUploadButton bs-Button--icon bs-Button--new keycode__wrapper">
-                <span>{props.title}</span>
-                {props.shortcutKey && (
-                    <span className="new-btn__keycode">
-                        {props.shortcutKey}
-                    </span>
-                )}
-            </span>
-        </div>
-    </button>);
-}
+        </button>
+    );
+};
 
-export default Button;
\ No newline at end of file
+export default Button;
diff --git a/CommonUI/src/Components/Basic/Icon/Icon.tsx b/CommonUI/src/Components/Basic/Icon/Icon.tsx
index 70a113e31d..ad8c55b255 100644
--- a/CommonUI/src/Components/Basic/Icon/Icon.tsx
+++ b/CommonUI/src/Components/Basic/Icon/Icon.tsx
@@ -1,18 +1,16 @@
-import React, { FunctionComponent, ReactElement } from 'react'
-import {
-    FontAwesomeIcon,
-} from '@fortawesome/react-fontawesome'
+import React, { FunctionComponent, ReactElement } from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 export enum SizeProp {
-    ExtraSmall = "xs",
-    Small = "sm",
-    Regular = "1x",
-    Large = "lg",
-    ExtraLarge = "3x"
+    ExtraSmall = 'xs',
+    Small = 'sm',
+    Regular = '1x',
+    Large = 'lg',
+    ExtraLarge = '3x',
 }
 
 export enum IconProp {
-    File = "file",
+    File = 'file',
 }
 
 export interface ComponentProps {
@@ -22,13 +20,13 @@ export interface ComponentProps {
 
 const Icon: FunctionComponent<ComponentProps> = ({
     icon,
-    size
+    size,
 }: ComponentProps): ReactElement => {
     return (
         <span>
             <FontAwesomeIcon icon={icon} size={size} />
         </span>
     );
-}
+};
 
-export default Icon;
\ No newline at end of file
+export default Icon;
diff --git a/CommonUI/src/Components/Basic/Modal/Modal.tsx b/CommonUI/src/Components/Basic/Modal/Modal.tsx
index d46b33b617..c1881f2c13 100644
--- a/CommonUI/src/Components/Basic/Modal/Modal.tsx
+++ b/CommonUI/src/Components/Basic/Modal/Modal.tsx
@@ -8,14 +8,13 @@ export interface ComponentProps {
     body: object;
 }
 
-const Modal: FunctionComponent<ComponentProps> = (_props: ComponentProps): ReactElement => {
-
+const Modal: FunctionComponent<ComponentProps> = (
+    _props: ComponentProps
+): ReactElement => {
     const mainClass: string = `modal-dialog-view`;
 
     return (
-        <div
-            className={mainClass}
-        >
+        <div className={mainClass}>
             <div
                 className="modal_overlay"
                 style={{
@@ -35,13 +34,10 @@ const Modal: FunctionComponent<ComponentProps> = (_props: ComponentProps): React
                         display: 'block',
                         top: '0px',
                     }}
-                >
-
-                </div>
+                ></div>
             </div>
         </div>
     );
-}
-
+};
 
 export default Modal;
diff --git a/CommonUI/src/Components/Dashboard/Account/Account.tsx b/CommonUI/src/Components/Dashboard/Account/Account.tsx
index ff4b50bc9b..999c97890a 100644
--- a/CommonUI/src/Components/Dashboard/Account/Account.tsx
+++ b/CommonUI/src/Components/Dashboard/Account/Account.tsx
@@ -11,7 +11,9 @@ const Account = (): ReactElement => {
         <div className="account">
             <div
                 className="preview"
-                onClick={() => setShowProfile(!showProfile)}
+                onClick={() => {
+                    return setShowProfile(!showProfile);
+                }}
             >
                 <FontAwesomeIcon icon={faUser} />
             </div>
diff --git a/CommonUI/src/Components/Dashboard/ProjectPicker/CurrentProject.tsx b/CommonUI/src/Components/Dashboard/ProjectPicker/CurrentProject.tsx
index 3a250beb79..85dea9461b 100644
--- a/CommonUI/src/Components/Dashboard/ProjectPicker/CurrentProject.tsx
+++ b/CommonUI/src/Components/Dashboard/ProjectPicker/CurrentProject.tsx
@@ -9,7 +9,12 @@ const CurrentProject = (): ReactElement => {
 
     return (
         <div className="projectPreview">
-            <div className="preview" onClick={() => setShowList(!showList)}>
+            <div
+                className="preview"
+                onClick={() => {
+                    return setShowList(!showList);
+                }}
+            >
                 <img src="img/placeholder.png" alt="Project Image" />
                 <p>Flow</p>
                 <FontAwesomeIcon icon={faCaretDown} />
diff --git a/CommonUI/src/Components/ErrorBoundary.tsx b/CommonUI/src/Components/ErrorBoundary.tsx
index dc66d2f9cf..5b5bbfd90c 100644
--- a/CommonUI/src/Components/ErrorBoundary.tsx
+++ b/CommonUI/src/Components/ErrorBoundary.tsx
@@ -5,8 +5,9 @@ export interface ComponentProps {
     children: ReactElement;
 }
 
-const ErrorBoundary: FunctionComponent<ComponentProps> = (props: ComponentProps): ReactElement  => {
-    
+const ErrorBoundary: FunctionComponent<ComponentProps> = (
+    props: ComponentProps
+): ReactElement => {
     const [error, setError] = useState<string | null>(null);
 
     try {
@@ -35,11 +36,11 @@ const ErrorBoundary: FunctionComponent<ComponentProps> = (props: ComponentProps)
             }}
         >
             <div>
-                An unexpected error has occured. Please reload the page
-                to continue
+                An unexpected error has occured. Please reload the page to
+                continue
             </div>
         </div>
     );
-}
+};
 
 export default ErrorBoundary;
diff --git a/CommonUI/src/Components/Forms/BasicForm.tsx b/CommonUI/src/Components/Forms/BasicForm.tsx
index de78dc8093..fd0999ae64 100644
--- a/CommonUI/src/Components/Forms/BasicForm.tsx
+++ b/CommonUI/src/Components/Forms/BasicForm.tsx
@@ -42,7 +42,7 @@ const BasicForm = <T extends Object>(
     props: ComponentProps<T>
 ): ReactElement => {
     const getFormField = (field: DataField<T>, index: number): ReactElement => {
-        let fieldType: string = field.fieldType
+        const fieldType: string = field.fieldType
             ? getFieldType(field.fieldType)
             : 'text';
 
@@ -159,7 +159,6 @@ const BasicForm = <T extends Object>(
                     if (result) {
                         errors[name] = result;
                     }
-                    
                 }
             } else if (field.required) {
                 errors[name] = `${field.title || name} is required.`;
diff --git a/StatusPage/src/App.tsx b/StatusPage/src/App.tsx
index 043cf39ee0..52e4e182f6 100755
--- a/StatusPage/src/App.tsx
+++ b/StatusPage/src/App.tsx
@@ -6,20 +6,27 @@ import {
     Route,
     Switch,
     Redirect,
-
 } from 'react-router-dom';
 import { User } from './config';
 import queryString from 'query-string';
 import { removeQuery } from './store';
-const Main = lazy((): $TSFixMe => import('./components/Main'));
-const ScheduledEvent = lazy((): $TSFixMe => import('./components/ScheduledEvent'));
-const Incident = lazy((): $TSFixMe => import('./components/Incident'));
-const SingleAnnouncement = lazy((): $TSFixMe =>
-    import('./components/SingleAnnouncement')
-);
+const Main = lazy((): $TSFixMe => {
+    return import('./components/Main');
+});
+const ScheduledEvent = lazy((): $TSFixMe => {
+    return import('./components/ScheduledEvent');
+});
+const Incident = lazy((): $TSFixMe => {
+    return import('./components/Incident');
+});
+const SingleAnnouncement = lazy((): $TSFixMe => {
+    return import('./components/SingleAnnouncement');
+});
 
 const userId: $TSFixMe = queryString.parse(window.location.search).userId;
-const accessToken: $TSFixMe = queryString.parse(window.location.search).accessToken;
+const accessToken: $TSFixMe = queryString.parse(
+    window.location.search
+).accessToken;
 
 if (userId && accessToken) {
     User.setUserId(userId);
@@ -27,38 +34,40 @@ if (userId && accessToken) {
     removeQuery();
 }
 
-const AppLoader: Function = () => (
-    <div
-        id="app-loading"
-        style={{
-            position: 'fixed',
-            top: '0',
-            bottom: '0',
-            left: '0',
-            right: '0',
-            zIndex: '999',
-            display: 'flex',
-            justifyContent: 'center',
-            alignItems: 'center',
-        }}
-    >
-        <div style={{ transform: 'scale(2)' }}>
-            <svg
-                viewBox="0 0 24 24"
-                xmlns="http://www.w3.org/2000/svg"
-                className="bs-Spinner-svg"
-            >
-                <ellipse
-                    cx="12"
-                    cy="12"
-                    rx="10"
-                    ry="10"
-                    className="bs-Spinner-ellipse"
-                ></ellipse>
-            </svg>
+const AppLoader: Function = () => {
+    return (
+        <div
+            id="app-loading"
+            style={{
+                position: 'fixed',
+                top: '0',
+                bottom: '0',
+                left: '0',
+                right: '0',
+                zIndex: '999',
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+            }}
+        >
+            <div style={{ transform: 'scale(2)' }}>
+                <svg
+                    viewBox="0 0 24 24"
+                    xmlns="http://www.w3.org/2000/svg"
+                    className="bs-Spinner-svg"
+                >
+                    <ellipse
+                        cx="12"
+                        cy="12"
+                        rx="10"
+                        ry="10"
+                        className="bs-Spinner-ellipse"
+                    ></ellipse>
+                </svg>
+            </div>
         </div>
-    </div>
-);
+    );
+};
 
 const App: Function = () => {
     return (
diff --git a/StatusPage/src/Components/Announcement.tsx b/StatusPage/src/Components/Announcement.tsx
index 7483187e7b..9790b9dfa0 100644
--- a/StatusPage/src/Components/Announcement.tsx
+++ b/StatusPage/src/Components/Announcement.tsx
@@ -32,7 +32,6 @@ class Announcement extends Component<ComponentProps> {
 
     handleRouting = (announcementSlug: $TSFixMe) => {
         const {
-
             history,
 
             statusPage: { slug },
@@ -42,7 +41,6 @@ class Announcement extends Component<ComponentProps> {
 
     addMore = async () => {
         const {
-
             getAnnouncements,
 
             statusPage: { projectId, _id },
@@ -52,13 +50,11 @@ class Announcement extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { announcement, monitorState }: $TSFixMe = this.props;
         return (
             <>
                 {announcement && (
                     <>
-
                         {this.props.theme ? (
                             <div
                                 className="clean_ann"
@@ -67,7 +63,7 @@ class Announcement extends Component<ComponentProps> {
                                     this.handleRouting(announcement.slug);
                                 }}
                             >
-                                <span className="ann_header">{ }</span>
+                                <span className="ann_header">{}</span>
                                 <AnnouncementBox
                                     announcement={announcement}
                                     monitorState={monitorState}
@@ -98,10 +94,8 @@ class Announcement extends Component<ComponentProps> {
     }
 }
 
-
 Announcement.displayName = 'Announcement';
 
-
 Announcement.propTypes = {
     theme: PropTypes.string,
     getAnnouncements: PropTypes.func,
@@ -123,7 +117,9 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ getAnnouncements }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ getAnnouncements }, dispatch);
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(Announcement);
 
@@ -136,43 +132,49 @@ interface AnnouncementBoxProps {
 function AnnouncementBox({
     announcement,
     monitorState,
-    type
+    type,
 }: AnnouncementBoxProps) {
-    return <>
-        <div className="icon_ann">
-            <div className={type ? 'ann_title classic_font' : 'ann_title'}>
-                {announcement.name}
+    return (
+        <>
+            <div className="icon_ann">
+                <div className={type ? 'ann_title classic_font' : 'ann_title'}>
+                    {announcement.name}
+                </div>
             </div>
-        </div>
-        <div className="ann_desc" style={{ whiteSpace: 'pre-wrap' }}>
-            {announcement?.description &&
-                announcement.description.split('\n').map((elem: $TSFixMe, index: $TSFixMe) => (
-                    <Markdown
-                        key={`${elem}-${index}`}
-                        options={{
-                            forceBlock: true,
-                        }}
-                    >
-                        {elem}
-                    </Markdown>
-                ))}
-        </div>
-        <ShouldRender if={announcement.monitors.length > 0}>
-            <div className={'resources_aff'}>
-                <span className={type && 'classic_font'}>
-                    <Translate>Resources Affected: </Translate>
-                </span>
-                <span>
-                    {' '}
-                    {announcement &&
-                        handleResources(monitorState, announcement)}
-                </span>
+            <div className="ann_desc" style={{ whiteSpace: 'pre-wrap' }}>
+                {announcement?.description &&
+                    announcement.description
+                        .split('\n')
+                        .map((elem: $TSFixMe, index: $TSFixMe) => {
+                            return (
+                                <Markdown
+                                    key={`${elem}-${index}`}
+                                    options={{
+                                        forceBlock: true,
+                                    }}
+                                >
+                                    {elem}
+                                </Markdown>
+                            );
+                        })}
             </div>
-        </ShouldRender>
-        <div className="ongoing__schedulebox classic_icon_x">
-            <span className="sp__icon sp__icon--more"></span>
-        </div>
-    </>;
+            <ShouldRender if={announcement.monitors.length > 0}>
+                <div className={'resources_aff'}>
+                    <span className={type && 'classic_font'}>
+                        <Translate>Resources Affected: </Translate>
+                    </span>
+                    <span>
+                        {' '}
+                        {announcement &&
+                            handleResources(monitorState, announcement)}
+                    </span>
+                </div>
+            </ShouldRender>
+            <div className="ongoing__schedulebox classic_icon_x">
+                <span className="sp__icon sp__icon--more"></span>
+            </div>
+        </>
+    );
 }
 
 AnnouncementBox.propTypes = {
diff --git a/StatusPage/src/Components/AnnouncementLogs.tsx b/StatusPage/src/Components/AnnouncementLogs.tsx
index 419b5dd112..6a5e901152 100644
--- a/StatusPage/src/Components/AnnouncementLogs.tsx
+++ b/StatusPage/src/Components/AnnouncementLogs.tsx
@@ -11,7 +11,6 @@ import { handleResources } from '../config';
 import Markdown from 'markdown-to-jsx';
 
 class AnnouncementLogs extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -21,7 +20,6 @@ class AnnouncementLogs extends Component<ComponentProps> {
 
     more = () => {
         const {
-
             fetchAnnouncementLogs,
 
             projectId,
@@ -36,7 +34,6 @@ class AnnouncementLogs extends Component<ComponentProps> {
     };
     override render() {
         const {
-
             theme,
 
             logs: { announcementLogs, limit, count },
@@ -45,371 +42,390 @@ class AnnouncementLogs extends Component<ComponentProps> {
 
             monitorState,
         } = this.props;
-        return <>
-            {theme ? (
-                <>
-                    <div className="new-theme-incident">
-                        <div
-                            style={{ marginBottom: '40px' }}
-                            className="font-largest"
-                        >
-                            <Translate> Announcements</Translate>
-                        </div>
-                        {announcementLogs && announcementLogs.length > 0 ? (
-                            announcementLogs.map((log: $TSFixMe, index: $TSFixMe) => {
-                                return (
-                                    <div
-                                        className="incident-object"
-                                        key={index}
-                                    >
-                                        <ShouldRender if={log.style}>
-                                            <div className="date-big">
-                                                {moment(
-                                                    log.createdAt
-                                                ).format(
-                                                    'MMMM Do, YYYY'
-                                                )}{' '}
-                                            </div>
-                                        </ShouldRender>
-                                        <ShouldRender if={!log.style}>
-                                            <div className="border-width-90"></div>
-                                        </ShouldRender>
-                                        <div className="list_k">
-                                            <b id={`event-name`}>
-                                                {log.announcementId.name}
-                                            </b>
-                                            <ShouldRender if={!log.endDate}>
-                                                <div
-                                                    style={{
-                                                        marginLeft: 5,
-                                                    }}
-                                                    className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
-                                                >
-                                                    <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
-                                                        <span id="ongoing-event">
-                                                            <Translate>
-                                                                Active{' '}
-                                                            </Translate>
-                                                        </span>
-                                                    </span>
-                                                </div>
-                                            </ShouldRender>
-                                        </div>
-                                        <div
-                                            className="incident_desc"
-                                            id={`event-description-`}
-                                            style={{
-                                                whiteSpace: 'pre-wrap',
-                                            }}
-                                        >
-                                            {log.announcementId
-                                                .description &&
-                                                log.announcementId.description
-                                                    .split('\n')
-                                                    .map((elem: $TSFixMe, index: $TSFixMe) => (
-                                                        <Markdown
-                                                            key={`${elem}-${index}`}
-                                                            options={{
-                                                                forceBlock: true,
-                                                            }}
-                                                        >
-                                                            {elem}
-                                                        </Markdown>
-                                                    ))}
-                                        </div>
-                                        <ShouldRender
-                                            if={
-                                                log.announcementId.monitors
-                                                    .length > 0
-                                            }
-                                        >
-                                            <span
-                                                className="ongoing__affectedmonitor--title"
-                                                style={{
-                                                    color:
-                                                        'rgba(76, 76, 76, 0.8)',
-                                                }}
-                                            >
-                                                <Translate>
-                                                    Resources Affected
-                                                </Translate>
-                                                :{' '}
-                                            </span>
-                                            <span
-                                                className="ongoing__affectedmonitor--content"
-                                                style={{
-                                                    color:
-                                                        'rgba(0, 0, 0, 0.5)',
-                                                }}
-                                            >
-                                                {log.announcementId &&
-                                                    handleResources(
-                                                        monitorState,
-                                                        log.announcementId
-                                                    )}
-                                            </span>
-                                        </ShouldRender>
-                                        <div
-                                            style={{
-                                                display: 'flex',
-                                                justifyContent:
-                                                    'space-between',
-                                                alignItems: 'center',
-                                            }}
-                                        >
-                                            <div
-                                                className="incident-date"
-                                                id="event-date"
-                                            >
-                                                <span>
-                                                    {moment(
-                                                        log.startDate
-                                                    ).format(
-                                                        'MMMM Do YYYY, h:mm a'
-                                                    )}{' '}
-                                                    <ShouldRender
-                                                        if={log.endDate}
-                                                    >
-                                                        &nbsp;&nbsp;-
-                                                        &nbsp;&nbsp;
-                                                        {moment(
-                                                            log.endDate
-                                                        ).format(
-                                                            'MMMM Do YYYY, h:mm a'
-                                                        )}
-                                                    </ShouldRender>
-                                                </span>
-                                            </div>
-                                        </div>
-                                    </div>
-                                );
-                            })
-                        ) : (
-                            <div className="nt_list">
-                                {error ? (
-                                    <span style={{ color: '#f00' }}>
-                                        <Translate>{error} </Translate>
-                                    </span>
-                                ) : (
-                                    <Translate>
-                                        No announcements at this time.
-                                    </Translate>
-                                )}
-                            </div>
-                        )}
-                    </div>
-                </>
-            ) : (
-                <>
-                    <div
-                        id="scheduledEvents"
-                        className="twitter-feed white box"
-                        style={{ overflow: 'visible' }}
-                    >
-                        <div
-                            className="messages"
-                            style={{ position: 'relative' }}
-                        >
+        return (
+            <>
+                {theme ? (
+                    <>
+                        <div className="new-theme-incident">
                             <div
-                                className="box-inner"
-                                style={{
-                                    paddingLeft: 0,
-                                    paddingRight: 0,
-                                    width: '100%',
-                                }}
+                                style={{ marginBottom: '40px' }}
+                                className="font-largest"
                             >
-                                <div
-                                    style={{ display: 'block' }}
-                                    className="feed-header"
-                                >
-                                    <span className="feed-title">
-                                        <Translate>
-                                            Announcement History
-                                        </Translate>
-                                    </span>
-                                    <ul className="feed-contents plain">
-                                        {announcementLogs &&
-                                            announcementLogs.length > 0 ? (
-                                            announcementLogs.map(
-                                                (log: $TSFixMe, index: $TSFixMe) => {
-                                                    return (
-                                                        <li
-                                                            className="incidentlist feed-item clearfix"
+                                <Translate> Announcements</Translate>
+                            </div>
+                            {announcementLogs && announcementLogs.length > 0 ? (
+                                announcementLogs.map(
+                                    (log: $TSFixMe, index: $TSFixMe) => {
+                                        return (
+                                            <div
+                                                className="incident-object"
+                                                key={index}
+                                            >
+                                                <ShouldRender if={log.style}>
+                                                    <div className="date-big">
+                                                        {moment(
+                                                            log.createdAt
+                                                        ).format(
+                                                            'MMMM Do, YYYY'
+                                                        )}{' '}
+                                                    </div>
+                                                </ShouldRender>
+                                                <ShouldRender if={!log.style}>
+                                                    <div className="border-width-90"></div>
+                                                </ShouldRender>
+                                                <div className="list_k">
+                                                    <b id={`event-name`}>
+                                                        {
+                                                            log.announcementId
+                                                                .name
+                                                        }
+                                                    </b>
+                                                    <ShouldRender
+                                                        if={!log.endDate}
+                                                    >
+                                                        <div
                                                             style={{
-                                                                margin:
-                                                                    '0 0 10px',
-                                                                cursor:
-                                                                    'text',
+                                                                marginLeft: 5,
                                                             }}
-                                                            key={index}
+                                                            className="Badge Badge--color--green Box-root Flex-inlineFlex Flex-alignItems--center Padding-horizontal--8 Padding-vertical--2"
                                                         >
-                                                            <div className="ct_header">
-                                                                {
-                                                                    log
-                                                                        .announcementId
-                                                                        .name
-                                                                }
-                                                            </div>
-                                                            <div
-                                                                className="ct_desc"
-                                                                style={{
-                                                                    whiteSpace:
-                                                                        'pre-wrap',
-                                                                }}
-                                                            >
-                                                                <Translate>
-                                                                    {log
-                                                                        .announcementId
-                                                                        .description &&
-                                                                        log.announcementId.description
-                                                                            .split(
-                                                                                '\n'
-                                                                            )
-                                                                            .map(
-                                                                                (
-                                                                                    elem: $TSFixMe,
-                                                                                    index: $TSFixMe
-                                                                                ) => (
-                                                                                    <Markdown
-                                                                                        key={`${elem}-${index}`}
-                                                                                        options={{
-                                                                                            forceBlock: true,
-                                                                                        }}
-                                                                                    >
-                                                                                        {
-                                                                                            elem
-                                                                                        }
-                                                                                    </Markdown>
-                                                                                )
-                                                                            )}
-                                                                </Translate>
-                                                            </div>
-                                                            <ShouldRender
-                                                                if={
-                                                                    log
-                                                                        .announcementId
-                                                                        .monitors
-                                                                        .length >
-                                                                    0
-                                                                }
-                                                            >
-                                                                <div
-                                                                    className="ongoing__affectedmonitor"
-                                                                    style={{
-                                                                        marginTop: 10,
-                                                                    }}
-                                                                >
-                                                                    <span
-                                                                        className="ongoing__affectedmonitor--title"
-                                                                        style={{
-                                                                            color:
-                                                                                'rgba(76, 76, 76, 0.8)',
-                                                                        }}
-                                                                    >
-                                                                        <Translate>
-                                                                            Resource
-                                                                            Affected:
-                                                                        </Translate>
-                                                                    </span>{' '}
-                                                                    <span
-                                                                        className="ongoing__affectedmonitor--content"
-                                                                        style={{
-                                                                            color:
-                                                                                'rgba(0, 0, 0, 0.5)',
-                                                                            fontSize:
-                                                                                '13px',
-                                                                        }}
-                                                                    >
-                                                                        {log.announcementId &&
-                                                                            handleResources(
-                                                                                monitorState,
-                                                                                log.announcementId
-                                                                            )}
-                                                                    </span>
-                                                                </div>
-                                                            </ShouldRender>
-                                                            <div>
-                                                                <span className="ct_time time">
-                                                                    {moment(
-                                                                        log.startDate
-                                                                    ).format(
-                                                                        'MMMM Do YYYY, h:mm a'
-                                                                    )}
-                                                                    &nbsp;&nbsp;-
-                                                                    &nbsp;&nbsp;
-                                                                    <ShouldRender
-                                                                        if={
-                                                                            log.endDate
-                                                                        }
-                                                                    >
-                                                                        {moment(
-                                                                            log.endDate
-                                                                        ).format(
-                                                                            'MMMM Do YYYY, h:mm a'
-                                                                        )}
-                                                                    </ShouldRender>
-                                                                    <ShouldRender
-                                                                        if={
-                                                                            !log.endDate
-                                                                        }
-                                                                    >
-                                                                        <span>
-                                                                            <Translate>
-                                                                                active
-                                                                            </Translate>
-                                                                        </span>
-                                                                    </ShouldRender>
+                                                            <span className="Badge-text Text-color--green Text-display--inline Text-fontSize--12 Text-fontWeight--bold Text-lineHeight--16 Text-typeface--upper Text-wrap--noWrap">
+                                                                <span id="ongoing-event">
+                                                                    <Translate>
+                                                                        Active{' '}
+                                                                    </Translate>
                                                                 </span>
-                                                            </div>
-                                                        </li>
-                                                    );
-                                                }
-                                            )
-                                        ) : (
-                                            <li className="cl_nolist">
-                                                {error ? (
+                                                            </span>
+                                                        </div>
+                                                    </ShouldRender>
+                                                </div>
+                                                <div
+                                                    className="incident_desc"
+                                                    id={`event-description-`}
+                                                    style={{
+                                                        whiteSpace: 'pre-wrap',
+                                                    }}
+                                                >
+                                                    {log.announcementId
+                                                        .description &&
+                                                        log.announcementId.description
+                                                            .split('\n')
+                                                            .map(
+                                                                (
+                                                                    elem: $TSFixMe,
+                                                                    index: $TSFixMe
+                                                                ) => {
+                                                                    return (
+                                                                        <Markdown
+                                                                            key={`${elem}-${index}`}
+                                                                            options={{
+                                                                                forceBlock:
+                                                                                    true,
+                                                                            }}
+                                                                        >
+                                                                            {
+                                                                                elem
+                                                                            }
+                                                                        </Markdown>
+                                                                    );
+                                                                }
+                                                            )}
+                                                </div>
+                                                <ShouldRender
+                                                    if={
+                                                        log.announcementId
+                                                            .monitors.length > 0
+                                                    }
+                                                >
                                                     <span
+                                                        className="ongoing__affectedmonitor--title"
                                                         style={{
-                                                            color: '#f00',
+                                                            color: 'rgba(76, 76, 76, 0.8)',
                                                         }}
                                                     >
                                                         <Translate>
-                                                            {error}
+                                                            Resources Affected
                                                         </Translate>
+                                                        :{' '}
                                                     </span>
-                                                ) : (
-                                                    <Translate>
-                                                        No announcements at
-                                                        this time.{' '}
-                                                    </Translate>
-                                                )}
-                                            </li>
-                                        )}
-                                    </ul>
-                                    <ShouldRender
-                                        if={count > Number(limit)}
+                                                    <span
+                                                        className="ongoing__affectedmonitor--content"
+                                                        style={{
+                                                            color: 'rgba(0, 0, 0, 0.5)',
+                                                        }}
+                                                    >
+                                                        {log.announcementId &&
+                                                            handleResources(
+                                                                monitorState,
+                                                                log.announcementId
+                                                            )}
+                                                    </span>
+                                                </ShouldRender>
+                                                <div
+                                                    style={{
+                                                        display: 'flex',
+                                                        justifyContent:
+                                                            'space-between',
+                                                        alignItems: 'center',
+                                                    }}
+                                                >
+                                                    <div
+                                                        className="incident-date"
+                                                        id="event-date"
+                                                    >
+                                                        <span>
+                                                            {moment(
+                                                                log.startDate
+                                                            ).format(
+                                                                'MMMM Do YYYY, h:mm a'
+                                                            )}{' '}
+                                                            <ShouldRender
+                                                                if={log.endDate}
+                                                            >
+                                                                &nbsp;&nbsp;-
+                                                                &nbsp;&nbsp;
+                                                                {moment(
+                                                                    log.endDate
+                                                                ).format(
+                                                                    'MMMM Do YYYY, h:mm a'
+                                                                )}
+                                                            </ShouldRender>
+                                                        </span>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        );
+                                    }
+                                )
+                            ) : (
+                                <div className="nt_list">
+                                    {error ? (
+                                        <span style={{ color: '#f00' }}>
+                                            <Translate>{error} </Translate>
+                                        </span>
+                                    ) : (
+                                        <Translate>
+                                            No announcements at this time.
+                                        </Translate>
+                                    )}
+                                </div>
+                            )}
+                        </div>
+                    </>
+                ) : (
+                    <>
+                        <div
+                            id="scheduledEvents"
+                            className="twitter-feed white box"
+                            style={{ overflow: 'visible' }}
+                        >
+                            <div
+                                className="messages"
+                                style={{ position: 'relative' }}
+                            >
+                                <div
+                                    className="box-inner"
+                                    style={{
+                                        paddingLeft: 0,
+                                        paddingRight: 0,
+                                        width: '100%',
+                                    }}
+                                >
+                                    <div
+                                        style={{ display: 'block' }}
+                                        className="feed-header"
                                     >
-                                        <button
-                                            className="more button-as-anchor anchor-centered"
-                                            onClick={() => this.more()}
+                                        <span className="feed-title">
+                                            <Translate>
+                                                Announcement History
+                                            </Translate>
+                                        </span>
+                                        <ul className="feed-contents plain">
+                                            {announcementLogs &&
+                                            announcementLogs.length > 0 ? (
+                                                announcementLogs.map(
+                                                    (
+                                                        log: $TSFixMe,
+                                                        index: $TSFixMe
+                                                    ) => {
+                                                        return (
+                                                            <li
+                                                                className="incidentlist feed-item clearfix"
+                                                                style={{
+                                                                    margin: '0 0 10px',
+                                                                    cursor: 'text',
+                                                                }}
+                                                                key={index}
+                                                            >
+                                                                <div className="ct_header">
+                                                                    {
+                                                                        log
+                                                                            .announcementId
+                                                                            .name
+                                                                    }
+                                                                </div>
+                                                                <div
+                                                                    className="ct_desc"
+                                                                    style={{
+                                                                        whiteSpace:
+                                                                            'pre-wrap',
+                                                                    }}
+                                                                >
+                                                                    <Translate>
+                                                                        {log
+                                                                            .announcementId
+                                                                            .description &&
+                                                                            log.announcementId.description
+                                                                                .split(
+                                                                                    '\n'
+                                                                                )
+                                                                                .map(
+                                                                                    (
+                                                                                        elem: $TSFixMe,
+                                                                                        index: $TSFixMe
+                                                                                    ) => {
+                                                                                        return (
+                                                                                            <Markdown
+                                                                                                key={`${elem}-${index}`}
+                                                                                                options={{
+                                                                                                    forceBlock:
+                                                                                                        true,
+                                                                                                }}
+                                                                                            >
+                                                                                                {
+                                                                                                    elem
+                                                                                                }
+                                                                                            </Markdown>
+                                                                                        );
+                                                                                    }
+                                                                                )}
+                                                                    </Translate>
+                                                                </div>
+                                                                <ShouldRender
+                                                                    if={
+                                                                        log
+                                                                            .announcementId
+                                                                            .monitors
+                                                                            .length >
+                                                                        0
+                                                                    }
+                                                                >
+                                                                    <div
+                                                                        className="ongoing__affectedmonitor"
+                                                                        style={{
+                                                                            marginTop: 10,
+                                                                        }}
+                                                                    >
+                                                                        <span
+                                                                            className="ongoing__affectedmonitor--title"
+                                                                            style={{
+                                                                                color: 'rgba(76, 76, 76, 0.8)',
+                                                                            }}
+                                                                        >
+                                                                            <Translate>
+                                                                                Resource
+                                                                                Affected:
+                                                                            </Translate>
+                                                                        </span>{' '}
+                                                                        <span
+                                                                            className="ongoing__affectedmonitor--content"
+                                                                            style={{
+                                                                                color: 'rgba(0, 0, 0, 0.5)',
+                                                                                fontSize:
+                                                                                    '13px',
+                                                                            }}
+                                                                        >
+                                                                            {log.announcementId &&
+                                                                                handleResources(
+                                                                                    monitorState,
+                                                                                    log.announcementId
+                                                                                )}
+                                                                        </span>
+                                                                    </div>
+                                                                </ShouldRender>
+                                                                <div>
+                                                                    <span className="ct_time time">
+                                                                        {moment(
+                                                                            log.startDate
+                                                                        ).format(
+                                                                            'MMMM Do YYYY, h:mm a'
+                                                                        )}
+                                                                        &nbsp;&nbsp;-
+                                                                        &nbsp;&nbsp;
+                                                                        <ShouldRender
+                                                                            if={
+                                                                                log.endDate
+                                                                            }
+                                                                        >
+                                                                            {moment(
+                                                                                log.endDate
+                                                                            ).format(
+                                                                                'MMMM Do YYYY, h:mm a'
+                                                                            )}
+                                                                        </ShouldRender>
+                                                                        <ShouldRender
+                                                                            if={
+                                                                                !log.endDate
+                                                                            }
+                                                                        >
+                                                                            <span>
+                                                                                <Translate>
+                                                                                    active
+                                                                                </Translate>
+                                                                            </span>
+                                                                        </ShouldRender>
+                                                                    </span>
+                                                                </div>
+                                                            </li>
+                                                        );
+                                                    }
+                                                )
+                                            ) : (
+                                                <li className="cl_nolist">
+                                                    {error ? (
+                                                        <span
+                                                            style={{
+                                                                color: '#f00',
+                                                            }}
+                                                        >
+                                                            <Translate>
+                                                                {error}
+                                                            </Translate>
+                                                        </span>
+                                                    ) : (
+                                                        <Translate>
+                                                            No announcements at
+                                                            this time.{' '}
+                                                        </Translate>
+                                                    )}
+                                                </li>
+                                            )}
+                                        </ul>
+                                        <ShouldRender
+                                            if={count > Number(limit)}
                                         >
-                                            <Translate>More</Translate>
-                                        </button>
-                                    </ShouldRender>
+                                            <button
+                                                className="more button-as-anchor anchor-centered"
+                                                onClick={() => {
+                                                    return this.more();
+                                                }}
+                                            >
+                                                <Translate>More</Translate>
+                                            </button>
+                                        </ShouldRender>
+                                    </div>
                                 </div>
                             </div>
-                        </div>
-                    </div>{' '}
-                </>
-            )}
-        </>;
+                        </div>{' '}
+                    </>
+                )}
+            </>
+        );
     }
 }
 
-
 AnnouncementLogs.displayName = 'AnnouncementLogs';
 
-
 AnnouncementLogs.propTypes = {
     theme: PropTypes.oneOfType([
         PropTypes.string,
@@ -426,12 +442,16 @@ AnnouncementLogs.propTypes = {
     monitorState: PropTypes.array,
 };
 
-const mapStateToProps: Function = (state: RootState) => ({
-    logs: state.status.announcementLogs.logsList,
-    requesting: state.status.announcementLogs.requesting,
-    error: state.status.announcementLogs.error
-});
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        logs: state.status.announcementLogs.logsList,
+        requesting: state.status.announcementLogs.requesting,
+        error: state.status.announcementLogs.error,
+    };
+};
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ fetchAnnouncementLogs }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ fetchAnnouncementLogs }, dispatch);
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(AnnouncementLogs);
diff --git a/StatusPage/src/Components/BlockChart.tsx b/StatusPage/src/Components/BlockChart.tsx
index 13fb499c99..e233c12ace 100755
--- a/StatusPage/src/Components/BlockChart.tsx
+++ b/StatusPage/src/Components/BlockChart.tsx
@@ -30,14 +30,11 @@ class BlockChart extends Component<ComponentProps> {
     }
 
     requestday = (need: $TSFixMe, date: $TSFixMe) => {
-
         this.props.showIncidentCard(false);
 
         const theme: $TSFixMe = this.props.theme ? true : false;
         if (need) {
-
             this.props.getStatusPageIndividualNote(
-
                 this.props.statusData.projectId._id,
 
                 this.props.monitorId,
@@ -47,34 +44,26 @@ class BlockChart extends Component<ComponentProps> {
                 need,
                 theme
             );
+        } else if (this.props.time && this.props.time.emptytime) {
+            this.props.notmonitoredDays(
+                this.props.monitorId,
+
+                this.props.time.emptytime,
+
+                this.props.monitorName,
+                'No data available for this date'
+            );
         } else {
+            this.props.notmonitoredDays(
+                this.props.monitorId,
+                date,
 
-            if (this.props.time && this.props.time.emptytime) {
-
-                this.props.notmonitoredDays(
-
-                    this.props.monitorId,
-
-                    this.props.time.emptytime,
-
-                    this.props.monitorName,
-                    'No data available for this date'
-                );
-            } else {
-
-                this.props.notmonitoredDays(
-
-                    this.props.monitorId,
-                    date,
-
-                    this.props.monitorName,
-                    'No incidents yet'
-                );
-            }
+                this.props.monitorName,
+                'No incidents yet'
+            );
         }
 
         this.props.getIndividualEvent(
-
             this.props.statusData.projectId._id,
 
             this.props.monitorId,
@@ -92,26 +81,24 @@ class BlockChart extends Component<ComponentProps> {
         let need = false;
         let backgroundColor;
 
-
         const { colors }: $TSFixMe = this.props.statusData;
 
         if (this.props.time && this.props.time.status) {
-
             if (this.props.time.status === 'disabled') {
                 let disabledTimeInMinutes, disabledtime;
 
                 if (this.props.time.disabledTime < 60) {
-
                     disabledTimeInMinutes = this.props.time.disabledTime;
-                    disabledtime = `${disabledTimeInMinutes} second${disabledTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    disabledtime = `${disabledTimeInMinutes} second${
+                        disabledTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 } else {
                     disabledTimeInMinutes = Math.floor(
-
                         this.props.time.disabledTime / 60
                     );
-                    disabledtime = `${disabledTimeInMinutes} minute${disabledTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    disabledtime = `${disabledTimeInMinutes} minute${
+                        disabledTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 }
 
                 if (disabledTimeInMinutes > 60) {
@@ -125,30 +112,30 @@ class BlockChart extends Component<ComponentProps> {
                 title = moment(this.props.time.date).format('LL');
                 title1 = `Disabled for ${disabledtime}`;
                 need = true;
-                if (colors)
+                if (colors) {
                     backgroundColor = `rgba(${colors.disabled.r}, ${colors.disabled.g}, ${colors.disabled.b}, ${colors.disabled.a})`;
-
+                }
             } else if (this.props.time.status === 'offline') {
                 let downTimeInMinutes, downtime;
 
                 if (this.props.time.downTime < 60) {
-
                     downTimeInMinutes = this.props.time.downTime;
-                    downtime = `${downTimeInMinutes} second${downTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    downtime = `${downTimeInMinutes} second${
+                        downTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 } else {
                     downTimeInMinutes = Math.floor(
-
                         this.props.time.downTime / 60
                     );
-                    downtime = `${downTimeInMinutes} minute${downTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    downtime = `${downTimeInMinutes} minute${
+                        downTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 }
 
                 if (downTimeInMinutes > 60) {
-                    downtime = `${Math.floor(
-                        downTimeInMinutes / 60
-                    )} hrs ${downTimeInMinutes % 60} minutes`;
+                    downtime = `${Math.floor(downTimeInMinutes / 60)} hrs ${
+                        downTimeInMinutes % 60
+                    } minutes`;
                 }
 
                 bar = 'bar down';
@@ -156,25 +143,25 @@ class BlockChart extends Component<ComponentProps> {
                 title = moment(this.props.time.date).format('LL');
                 title1 = `Down for ${downtime}`;
                 need = true;
-                if (colors)
+                if (colors) {
                     backgroundColor = `rgba(${colors.downtime.r}, ${colors.downtime.g}, ${colors.downtime.b}, ${colors.downtime.a})`;
-
+                }
             } else if (this.props.time.status === 'degraded') {
                 let degradedTimeInMinutes;
                 let degradedtime;
 
                 if (this.props.time.degradedTime < 60) {
-
                     degradedTimeInMinutes = this.props.time.degradedTime;
-                    degradedtime = `${degradedTimeInMinutes} second${degradedTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    degradedtime = `${degradedTimeInMinutes} second${
+                        degradedTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 } else {
                     degradedTimeInMinutes = Math.floor(
-
                         this.props.time.degradedTime / 60
                     );
-                    degradedtime = `${degradedTimeInMinutes} minute${degradedTimeInMinutes === 1 ? '' : 's'
-                        }`;
+                    degradedtime = `${degradedTimeInMinutes} minute${
+                        degradedTimeInMinutes === 1 ? '' : 's'
+                    }`;
                 }
 
                 if (degradedTimeInMinutes > 60) {
@@ -188,34 +175,35 @@ class BlockChart extends Component<ComponentProps> {
                 title = moment(this.props.time.date).format('LL');
                 title1 = `Degraded for ${degradedtime}`;
                 need = true;
-                if (colors)
+                if (colors) {
                     backgroundColor = `rgba(${colors.degraded.r}, ${colors.degraded.g}, ${colors.degraded.b}, ${colors.degraded.a})`;
+                }
             } else {
                 bar = 'bar';
 
                 title = moment(this.props.time.date).format('LL');
                 title1 = 'No downtime';
                 need = true;
-                if (colors)
+                if (colors) {
                     backgroundColor = `rgba(${colors.uptime.r}, ${colors.uptime.g}, ${colors.uptime.b}, ${colors.uptime.a})`;
+                }
             }
         } else {
             bar = 'bar empty';
 
             title = this.props.time
-
                 ? moment(this.props.time.date).format('LL')
                 : 'N/A';
             title1 = '100% uptime';
-            if (colors)
+            if (colors) {
                 backgroundColor = `rgba(${colors.uptime.r}, ${colors.uptime.g}, ${colors.uptime.b}, ${colors.uptime.a})`;
+            }
         }
 
         const dateId: $TSFixMe = title.replace(/, | /g, '');
-        const  extra: string = ' resize-style';
+        const extra: string = ' resize-style';
         let style, classes, content;
 
-
         if (this.props.theme) {
             style = {
                 outline: 'none',
@@ -223,10 +211,10 @@ class BlockChart extends Component<ComponentProps> {
                     backgroundColor === 'rgba(108, 219, 86, 1)'
                         ? '#49c3b1'
                         : backgroundColor === 'rgba(250, 109, 70, 1)'
-                            ? '#FA6D46'
-                            : backgroundColor === 'rgba(255, 222, 36, 1)'
-                                ? '#e39f48'
-                                : backgroundColor,
+                        ? '#FA6D46'
+                        : backgroundColor === 'rgba(255, 222, 36, 1)'
+                        ? '#e39f48'
+                        : backgroundColor,
                 opacity: 1,
                 width: '7px',
             };
@@ -234,14 +222,12 @@ class BlockChart extends Component<ComponentProps> {
             content = (
                 <div className="tooltip">
                     <div
-
                         id={`block${this.props.monitorId}${dateId}`}
                         className={classes}
                         style={style}
-                        onClick={() =>
-
-                            this.requestday(need, this.props.time.date)
-                        }
+                        onClick={() => {
+                            return this.requestday(need, this.props.time.date);
+                        }}
                     ></div>
                     <div className="tooltip_div">
                         <div className="tooltiptext-chart">
@@ -259,14 +245,14 @@ class BlockChart extends Component<ComponentProps> {
             classes = bar;
             content = (
                 <div
-
                     id={`block${this.props.monitorId}${dateId}`}
                     className={classes}
                     style={style}
                     title={`${title}
                     ${title1}`}
-
-                    onClick={() => this.requestday(need, this.props.time.date)}
+                    onClick={() => {
+                        return this.requestday(need, this.props.time.date);
+                    }}
                 ></div>
             );
         }
@@ -275,23 +261,25 @@ class BlockChart extends Component<ComponentProps> {
     }
 }
 
-
 BlockChart.displayName = 'BlockChart';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    statusData: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        getStatusPageIndividualNote,
-        getIndividualEvent,
-        notmonitoredDays,
-        showIncidentCard,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        statusData: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            getStatusPageIndividualNote,
+            getIndividualEvent,
+            notmonitoredDays,
+            showIncidentCard,
+        },
+        dispatch
+    );
+};
 
 BlockChart.propTypes = {
     time: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]),
diff --git a/StatusPage/src/Components/Events.tsx b/StatusPage/src/Components/Events.tsx
index 0c4d0e308b..8f0531b11b 100644
--- a/StatusPage/src/Components/Events.tsx
+++ b/StatusPage/src/Components/Events.tsx
@@ -20,7 +20,6 @@ interface EventsProps {
 
 class Events extends Component<ComponentProps> {
     handleNavigation = (statusPageSlug: $TSFixMe, eventSlug: $TSFixMe) => {
-
         const { history }: $TSFixMe = this.props;
 
         history.push(
@@ -29,29 +28,27 @@ class Events extends Component<ComponentProps> {
     };
 
     override render() {
-
         const { statusPageSlug }: $TSFixMe = this.props;
         return (
-
             <ShouldRender if={this.props.events}>
-
                 {this.props.events.map((event: $TSFixMe, i: $TSFixMe) => {
-                    if (!event)
+                    if (!event) {
                         return (
                             <div>
                                 <Translate>No event</Translate>
                             </div>
                         );
+                    }
                     return (
                         <li
                             className="scheduledEvent feed-item clearfix"
                             key={i}
-                            onClick={() =>
-                                this.handleNavigation(
+                            onClick={() => {
+                                return this.handleNavigation(
                                     statusPageSlug,
                                     event.slug
-                                )
-                            }
+                                );
+                            }}
                         >
                             <div
                                 className="message"
@@ -76,7 +73,6 @@ class Events extends Component<ComponentProps> {
                                         className="feed-title"
                                         id="eventTitle"
                                         style={{
-
                                             ...this.props.secondaryTextColor,
                                             color: 'rgba(76, 76, 76, 0.8)',
                                             fontWeight: 'bold',
@@ -87,7 +83,6 @@ class Events extends Component<ComponentProps> {
                                     </span>
                                     <span
                                         style={{
-
                                             ...this.props.primaryTextColor,
                                             color: 'rgba(0, 0, 0, 0.5)',
                                             display: 'block',
@@ -107,7 +102,6 @@ class Events extends Component<ComponentProps> {
                                 }
                             >
                                 <AffectedResources
-
                                     monitorState={this.props.monitorState}
                                     event={event}
                                     colorStyle="grey"
@@ -148,10 +142,8 @@ class Events extends Component<ComponentProps> {
     }
 }
 
-
 Events.displayName = 'Events';
 
-
 Events.propTypes = {
     events: PropTypes.array,
     secondaryTextColor: PropTypes.object,
diff --git a/StatusPage/src/Components/EventsMain.tsx b/StatusPage/src/Components/EventsMain.tsx
index 6cc842d47c..a20f789b0f 100644
--- a/StatusPage/src/Components/EventsMain.tsx
+++ b/StatusPage/src/Components/EventsMain.tsx
@@ -39,11 +39,9 @@ class EventsMain extends Component<ComponentProps> {
     }
 
     getAll = () => {
-
         this.props.showEventCard(true);
 
         this.props.fetchFutureEvents(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -52,9 +50,7 @@ class EventsMain extends Component<ComponentProps> {
     };
 
     more = () => {
-
         this.props.fetchMoreFutureEvents(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -72,7 +68,6 @@ class EventsMain extends Component<ComponentProps> {
         const subheading: $TSFixMe = {};
 
         if (this.props.statusPage) {
-
             const colors: $TSFixMe = this.props.statusPage.colors;
             contentBackground = {
                 background: `rgba(${colors.statusPageBackground.r}, ${colors.statusPageBackground.g}, ${colors.statusPageBackground.b}, ${colors.statusPageBackground.a})`,
@@ -91,55 +86,39 @@ class EventsMain extends Component<ComponentProps> {
         }
 
         if (this.props.futureEvents && this.props.futureEvents.events) {
-
             event = (
                 <Events
-
                     events={this.props.futureEvents.events}
                     secondaryTextColor={secondaryTextColor}
                     primaryTextColor={primaryTextColor}
                     noteBackgroundColor={noteBackgroundColor}
-
                     statusPageId={this.props.statusPageId}
-
                     statusPageSlug={this.props.statusPageSlug}
-
                     monitorState={this.props.monitorState}
                 />
             );
         }
 
         if (
-
             this.props.individualEvents.show &&
-
             this.props.individualEvents.events
         ) {
-
             event = (
                 <Events
-
                     events={this.props.individualEvents.events}
                     secondaryTextColor={secondaryTextColor}
                     primaryTextColor={primaryTextColor}
                     noteBackgroundColor={noteBackgroundColor}
-
                     statusPageId={this.props.statusPageId}
-
                     statusPageSlug={this.props.statusPageSlug}
-
                     monitorState={this.props.monitorState}
                 />
             );
         }
 
-
         return (!this.props.individualEvents.show &&
-
             this.props.futureEvents.events.length > 0) ||
-
             this.props.individualEvents.show ||
-
             this.props.showEventCardState ? (
             <div
                 id="scheduledEvents"
@@ -149,9 +128,7 @@ class EventsMain extends Component<ComponentProps> {
                 <div className="messages" style={{ position: 'relative' }}>
                     <ShouldRender
                         if={
-
                             this.props.futureEvents &&
-
                             !this.props.futureEvents.error
                         }
                     >
@@ -165,7 +142,6 @@ class EventsMain extends Component<ComponentProps> {
                         >
                             <div className="feed-header">
                                 <ShouldRender
-
                                     if={!this.props.individualEvents.show}
                                 >
                                     <span
@@ -178,7 +154,6 @@ class EventsMain extends Component<ComponentProps> {
                                     </span>
                                 </ShouldRender>
                                 <ShouldRender
-
                                     if={this.props.individualEvents.show}
                                 >
                                     <span
@@ -186,34 +161,26 @@ class EventsMain extends Component<ComponentProps> {
                                         style={primaryTextColor}
                                     >
                                         Scheduled Events for{' '}
-
                                         {this.props.individualEvents.monitorName
-
                                             ? this.props.individualEvents
-                                                .monitorName
+                                                  .monitorName
                                             : ''}{' '}
                                         on{' '}
-
                                         {this.props.individualEvents.date
                                             ? moment(
-
-                                                this.props.individualEvents
-                                                    .date
-                                            ).format('LL')
+                                                  this.props.individualEvents
+                                                      .date
+                                              ).format('LL')
                                             : ''}
                                     </span>
                                 </ShouldRender>
                             </div>
                             <ShouldRender
                                 if={
-
                                     (!this.props.individualEvents.show &&
-
                                         this.props.futureEvents.events.length >
-                                        0) ||
-
+                                            0) ||
                                     (this.props.individualEvents.show &&
-
                                         this.props.individualEvents.events
                                             .length > 0)
                                 }
@@ -222,9 +189,7 @@ class EventsMain extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     this.props.individualEvents.show &&
-
                                     this.props.individualEvents.events
                                         .length === 0
                                 }
@@ -258,12 +223,9 @@ class EventsMain extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     this.props.showEventCardState &&
-
                                     this.props.futureEvents.events.length ===
-                                    0 &&
-
+                                        0 &&
                                     this.props.individualEvents.events
                                         .length === 0
                                 }
@@ -299,29 +261,22 @@ class EventsMain extends Component<ComponentProps> {
 
                         <ShouldRender
                             if={
-
                                 this.props.futureEvents &&
-
                                 this.props.futureEvents.events &&
-
                                 this.props.futureEvents.events.length &&
-
                                 this.props.count >
-
-                                this.props.futureEvents.events.length &&
-
+                                    this.props.futureEvents.events.length &&
                                 !this.props.futureEvents.requesting &&
-
                                 !this.props.requestingmoreevents &&
-
                                 !this.props.futureEvents.error &&
-
                                 !this.props.individualEvents.show
                             }
                         >
                             <button
                                 className="more button-as-anchor anchor-centered"
-                                onClick={() => this.more()}
+                                onClick={() => {
+                                    return this.more();
+                                }}
                             >
                                 <Translate> More</Translate>
                             </button>
@@ -336,19 +291,17 @@ class EventsMain extends Component<ComponentProps> {
                         >
                             <ShouldRender
                                 if={
-
                                     this.props.futureEvents &&
-
                                     !this.props.futureEvents.error &&
-
                                     !this.props.futureEvents.requesting &&
-
                                     this.props.individualEvents.show
                                 }
                             >
                                 <button
                                     className="all__btn"
-                                    onClick={() => this.getAll()}
+                                    onClick={() => {
+                                        return this.getAll();
+                                    }}
                                 >
                                     <Translate> All Scheduled Events</Translate>
                                 </button>
@@ -357,9 +310,7 @@ class EventsMain extends Component<ComponentProps> {
 
                         <ShouldRender
                             if={
-
                                 this.props.futureEvents.requesting ||
-
                                 this.props.requestingmoreevents
                             }
                         >
@@ -382,7 +333,6 @@ class EventsMain extends Component<ComponentProps> {
     }
 }
 
-
 EventsMain.displayName = 'EventsMain';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -413,15 +363,16 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        fetchMoreFutureEvents,
-        fetchFutureEvents,
-        showEventCard,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            fetchMoreFutureEvents,
+            fetchFutureEvents,
+            showEventCard,
+        },
+        dispatch
+    );
+};
 
 EventsMain.propTypes = {
     fetchMoreFutureEvents: PropTypes.func,
diff --git a/StatusPage/src/Components/ExternalStatusPages.tsx b/StatusPage/src/Components/ExternalStatusPages.tsx
index f0e52b79e3..b6fcc32abb 100644
--- a/StatusPage/src/Components/ExternalStatusPages.tsx
+++ b/StatusPage/src/Components/ExternalStatusPages.tsx
@@ -13,10 +13,8 @@ interface ExternalStatusPagesProps {
 }
 
 class ExternalStatusPages extends Component<ComponentProps> {
-    async override componentDidMount() {
-
+    override async componentDidMount() {
         this.props.fetchExternalStatusPages(
-
             this.props.statusPage.projectId._id,
 
             this.props.statusPage._id
@@ -24,7 +22,6 @@ class ExternalStatusPages extends Component<ComponentProps> {
     }
 
     override render() {
-
         const { externalStatusPages, theme }: $TSFixMe = this.props;
         return (
             <div>
@@ -90,7 +87,7 @@ class ExternalStatusPages extends Component<ComponentProps> {
                                                         'translateY(-50%)',
                                                     color:
                                                         link.description ===
-                                                            'All Systems Operational'
+                                                        'All Systems Operational'
                                                             ? '#49c3b1'
                                                             : 'red',
                                                     fontWeight: '500',
@@ -202,7 +199,7 @@ class ExternalStatusPages extends Component<ComponentProps> {
                                                                     'translateY(-50%)',
                                                                 color:
                                                                     link.description ===
-                                                                        'All Systems Operational'
+                                                                    'All Systems Operational'
                                                                         ? '#49c3b1'
                                                                         : 'red',
                                                                 fontWeight:
@@ -244,17 +241,19 @@ class ExternalStatusPages extends Component<ComponentProps> {
     }
 }
 
-
 ExternalStatusPages.displayName = 'ExternalStatusPages';
-const mapStateToProps: Function = (state: RootState) => ({
-    statusPage: state.status.statusPage,
-    externalStatusPages: state.status.externalStatusPages,
-    requesting: state.status.announcementLogs.requesting,
-    error: state.status.announcementLogs.error
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ fetchExternalStatusPages }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        statusPage: state.status.statusPage,
+        externalStatusPages: state.status.externalStatusPages,
+        requesting: state.status.announcementLogs.requesting,
+        error: state.status.announcementLogs.error,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ fetchExternalStatusPages }, dispatch);
+};
 
 ExternalStatusPages.propTypes = {
     externalStatusPages: PropTypes.object,
diff --git a/StatusPage/src/Components/Footer.tsx b/StatusPage/src/Components/Footer.tsx
index 2e2a7a3fc1..491d4cb603 100755
--- a/StatusPage/src/Components/Footer.tsx
+++ b/StatusPage/src/Components/Footer.tsx
@@ -8,16 +8,16 @@ export interface ComponentProps {
 
 class Footer extends Component<ComponentProps> {
     override render() {
-
         const { link }: $TSFixMe = this.props;
-        if (!link.url) return null;
+        if (!link.url) {
+            return null;
+        }
         return (
             <li>
                 <a
                     rel="noopener noreferrer"
                     target="_blank"
                     href={link.url}
-
                     style={this.props.textColor}
                 >
                     {link.name}
@@ -27,10 +27,8 @@ class Footer extends Component<ComponentProps> {
     }
 }
 
-
 Footer.displayName = 'Footer';
 
-
 Footer.propTypes = {
     link: PropTypes.object,
     textColor: PropTypes.object,
diff --git a/StatusPage/src/Components/Incident.tsx b/StatusPage/src/Components/Incident.tsx
index 73ed0e3afe..916d91392a 100644
--- a/StatusPage/src/Components/Incident.tsx
+++ b/StatusPage/src/Components/Incident.tsx
@@ -44,7 +44,6 @@ class Incident extends Component<ComponentProps> {
     handleIncidentStatus: $TSFixMe;
     override componentDidMount() {
         const {
-
             match: { params },
 
             statusData,
@@ -84,13 +83,10 @@ class Incident extends Component<ComponentProps> {
             url = window.location.host;
         }
 
-
         this.props.getStatusPage(statusPageSlug, url).catch((err: $TSFixMe) => {
             if (err.message === 'Request failed with status code 401') {
-
                 const { loginRequired }: $TSFixMe = this.props.login;
                 if (loginRequired) {
-
                     window.location.href = `${ACCOUNTS_URL}/login?statusPage=true&statusPageURL=${window.location.href}`;
                 }
             }
@@ -105,7 +101,6 @@ class Incident extends Component<ComponentProps> {
 
     componentDidUpdate(prevProps: $TSFixMe) {
         const {
-
             match: { params },
 
             statusData,
@@ -127,7 +122,6 @@ class Incident extends Component<ComponentProps> {
 
     more() {
         const {
-
             statusData,
 
             match: { params },
@@ -147,13 +141,13 @@ class Incident extends Component<ComponentProps> {
     }
 
     renderError = () => {
-
         const { error }: $TSFixMe = this.props.status;
         if (error === 'Input data schema mismatch.') {
             return 'Page Not Found';
         } else if (error === 'Project Not present') {
             return 'Invalid Project.';
-        } else return error;
+        }
+        return error;
     };
 
     handleMonitorList = (monitors: $TSFixMe) => {
@@ -168,15 +162,15 @@ class Incident extends Component<ComponentProps> {
                 return `${monitors[0].monitorId.name}, ${monitors[1].monitorId.name} and ${monitors[2].monitorId.name}`;
             }
             if (monitors.length > 3) {
-                return `${monitors[0].monitorId.name}, ${monitors[1].monitorId.name
-                    } and ${monitors.length - 2} others`;
+                return `${monitors[0].monitorId.name}, ${
+                    monitors[1].monitorId.name
+                } and ${monitors.length - 2} others`;
             }
         }
     };
 
     override render() {
         const {
-
             count,
 
             history,
@@ -197,14 +191,10 @@ class Incident extends Component<ComponentProps> {
 
         let downtimeColor, uptimeColor, degradedColor;
         if (
-
             !this.props.requestingStatus &&
-
             this.props.statusData &&
-
             this.props.statusData.colors
         ) {
-
             const colors: $TSFixMe = this.props.statusData.colors;
             downtimeColor = {
                 backgroundColor: `rgba(${colors.downtime.r}, ${colors.downtime.g}, ${colors.downtime.b})`,
@@ -222,7 +212,6 @@ class Incident extends Component<ComponentProps> {
                 className="page-main-wrapper"
                 style={{ background: 'rgb(247, 247, 247)' }}
             >
-
                 {this.props.statusData.theme === 'Clean Theme' && (
                     <div
                         className="new-main-container"
@@ -303,120 +292,130 @@ class Incident extends Component<ComponentProps> {
                                             return -1;
                                         } else if (b.diff(a) < 0) {
                                             return 1;
-                                        } else {
-                                            return 0;
                                         }
+                                        return 0;
                                     })
-                                    .map((note: $TSFixMe) => <div
-                                        key={note._id}
-                                        style={{
-                                            width: '100%',
-                                            display: 'grid',
-                                            gridTemplateColumns: '1fr 3fr',
-                                            gridColumnGap: 10,
-                                            marginTop: 20,
-                                        }}
-                                    >
-                                        <div>
-                                            <span
+                                    .map((note: $TSFixMe) => {
+                                        return (
+                                            <div
+                                                key={note._id}
                                                 style={{
-                                                    display: 'block',
-                                                    fontWeight: 'bold',
+                                                    width: '100%',
+                                                    display: 'grid',
+                                                    gridTemplateColumns:
+                                                        '1fr 3fr',
+                                                    gridColumnGap: 10,
+                                                    marginTop: 20,
                                                 }}
                                             >
-                                                {note.incident_state}
-                                            </span>
-                                        </div>
-                                        <div>
-                                            <span
-                                                style={{
-                                                    color:
-                                                        'rgba(0, 0, 0, 0.6)',
-                                                    fontSize: 14,
-                                                    display: 'block',
-                                                    textAlign: 'justify',
-                                                }}
-                                            >
-                                                {note.content && (
-                                                    <div
-                                                        style={{
-                                                            whiteSpace:
-                                                                'pre-wrap',
-                                                        }}
-                                                    >
-                                                        {note.content
-                                                            .split('\n')
-                                                            .map(
-                                                                (
-                                                                    elem: $TSFixMe,
-                                                                    index: $TSFixMe
-                                                                ) => (
-                                                                    <Markdown
-                                                                        key={`${elem}-${index}`}
-                                                                        options={{
-                                                                            forceBlock: true,
-                                                                        }}
-                                                                    >
-                                                                        {
-                                                                            elem
-                                                                        }
-                                                                    </Markdown>
-                                                                )
-                                                            )}
-                                                    </div>
-                                                )}
-                                            </span>
-                                            {note.incident_state ===
-                                                'Identified' && (
+                                                <div>
                                                     <span
                                                         style={{
                                                             display: 'block',
-                                                            marginTop: 10,
-                                                            color: '#AAA',
-                                                            fontSize: 12,
+                                                            fontWeight: 'bold',
+                                                        }}
+                                                    >
+                                                        {note.incident_state}
+                                                    </span>
+                                                </div>
+                                                <div>
+                                                    <span
+                                                        style={{
+                                                            color: 'rgba(0, 0, 0, 0.6)',
+                                                            fontSize: 14,
+                                                            display: 'block',
+                                                            textAlign:
+                                                                'justify',
+                                                        }}
+                                                    >
+                                                        {note.content && (
+                                                            <div
+                                                                style={{
+                                                                    whiteSpace:
+                                                                        'pre-wrap',
+                                                                }}
+                                                            >
+                                                                {note.content
+                                                                    .split('\n')
+                                                                    .map(
+                                                                        (
+                                                                            elem: $TSFixMe,
+                                                                            index: $TSFixMe
+                                                                        ) => {
+                                                                            return (
+                                                                                <Markdown
+                                                                                    key={`${elem}-${index}`}
+                                                                                    options={{
+                                                                                        forceBlock:
+                                                                                            true,
+                                                                                    }}
+                                                                                >
+                                                                                    {
+                                                                                        elem
+                                                                                    }
+                                                                                </Markdown>
+                                                                            );
+                                                                        }
+                                                                    )}
+                                                            </div>
+                                                        )}
+                                                    </span>
+                                                    {note.incident_state ===
+                                                        'Identified' && (
+                                                        <span
+                                                            style={{
+                                                                display:
+                                                                    'block',
+                                                                marginTop: 10,
+                                                                color: '#AAA',
+                                                                fontSize: 12,
+                                                            }}
+                                                        >
+                                                            <span
+                                                                style={{
+                                                                    fontWeight: 600,
+                                                                }}
+                                                            >
+                                                                <Translate>
+                                                                    Resource
+                                                                    Affected -
+                                                                </Translate>
+                                                            </span>{' '}
+                                                            <span>
+                                                                {this.handleMonitorList(
+                                                                    incident.monitors
+                                                                )}
+                                                            </span>
+                                                        </span>
+                                                    )}
+                                                    <span
+                                                        style={{
+                                                            display: 'flex',
+                                                            marginTop: 5,
+                                                            alignItems:
+                                                                'center',
                                                         }}
                                                     >
                                                         <span
                                                             style={{
-                                                                fontWeight: 600,
+                                                                color: '#AAA',
+                                                                fontSize: 12,
+                                                                display:
+                                                                    'block',
                                                             }}
                                                         >
-                                                            <Translate>
-                                                                Resource
-                                                                Affected -
-                                                            </Translate>
-                                                        </span>{' '}
-                                                        <span>
-                                                            {this.handleMonitorList(
-                                                                incident.monitors
+                                                            Posted on{' '}
+                                                            {moment(
+                                                                note.createdAt
+                                                            ).format(
+                                                                'MMMM Do YYYY, h:mm a'
                                                             )}
                                                         </span>
                                                     </span>
-                                                )}
-                                            <span
-                                                style={{
-                                                    display: 'flex',
-                                                    marginTop: 5,
-                                                    alignItems: 'center',
-                                                }}
-                                            >
-                                                <span
-                                                    style={{
-                                                        color: '#AAA',
-                                                        fontSize: 12,
-                                                        display: 'block',
-                                                    }}
-                                                >
-                                                    Posted on{' '}
-                                                    {moment(
-                                                        note.createdAt
-                                                    ).format(
-                                                        'MMMM Do YYYY, h:mm a'
-                                                    )}
-                                                </span>
-                                            </span>
-                                        </div>
-                                    </div>)}
+                                                </div>
+                                            </div>
+                                        );
+                                    })}
 
                             {!fetchingIncidentNotes &&
                                 incidentNotes &&
@@ -450,7 +449,6 @@ class Incident extends Component<ComponentProps> {
                     </div>
                 )}
                 <div className="innernew">
-
                     {this.props.statusData.theme === 'Classic Theme' && (
                         <>
                             <div
@@ -471,7 +469,6 @@ class Incident extends Component<ComponentProps> {
                                             paddingBottom: 20,
                                         }}
                                     >
-
                                         {!this.props.requestingStatus &&
                                             !fetchingIncident &&
                                             incident.incidentType && (
@@ -480,15 +477,12 @@ class Incident extends Component<ComponentProps> {
                                                     style={{
                                                         backgroundColor:
                                                             incident.incidentType ===
-                                                                'online'
-
+                                                            'online'
                                                                 ? uptimeColor.backgroundColor
                                                                 : incident.incidentType ===
-                                                                    'offline'
-
-                                                                    ? downtimeColor.backgroundColor
-
-                                                                    : degradedColor.backgroundColor,
+                                                                  'offline'
+                                                                ? downtimeColor.backgroundColor
+                                                                : degradedColor.backgroundColor,
                                                     }}
                                                 ></div>
                                             )}
@@ -510,16 +504,16 @@ class Incident extends Component<ComponentProps> {
                                                 <div
                                                     className="individual-header"
                                                     style={{
-                                                        marginBottom: incident.description
-                                                            ? 25
-                                                            : 10,
+                                                        marginBottom:
+                                                            incident.description
+                                                                ? 25
+                                                                : 10,
                                                     }}
                                                 >
                                                     <span
                                                         className="feed-title"
                                                         style={{
-                                                            color:
-                                                                'rgba(76, 76, 76, 0.8)',
+                                                            color: 'rgba(76, 76, 76, 0.8)',
                                                             fontWeight: 'bold',
                                                             marginBottom: 10,
                                                             textTransform:
@@ -530,8 +524,7 @@ class Incident extends Component<ComponentProps> {
                                                     </span>
                                                     <span
                                                         style={{
-                                                            color:
-                                                                'rgba(0, 0, 0, 0.5)',
+                                                            color: 'rgba(0, 0, 0, 0.5)',
                                                         }}
                                                     >
                                                         {incident.description}
@@ -544,8 +537,7 @@ class Incident extends Component<ComponentProps> {
                                                     <span
                                                         className="ongoing__affectedmonitor--title"
                                                         style={{
-                                                            color:
-                                                                'rgba(76, 76, 76, 0.8)',
+                                                            color: 'rgba(76, 76, 76, 0.8)',
                                                         }}
                                                     >
                                                         <Translate>
@@ -555,8 +547,7 @@ class Incident extends Component<ComponentProps> {
                                                     <span
                                                         className="ongoing__affectedmonitor--content"
                                                         style={{
-                                                            color:
-                                                                'rgba(0, 0, 0, 0.5)',
+                                                            color: 'rgba(0, 0, 0, 0.5)',
                                                         }}
                                                     >
                                                         {this.handleMonitorList(
@@ -579,8 +570,7 @@ class Incident extends Component<ComponentProps> {
                                                 <span
                                                     style={{
                                                         fontSize: 14,
-                                                        color:
-                                                            'rgba(0, 0, 0, 0.5)',
+                                                        color: 'rgba(0, 0, 0, 0.5)',
                                                         paddingTop: 7,
                                                         display: 'block',
                                                     }}
@@ -628,8 +618,7 @@ class Incident extends Component<ComponentProps> {
                                                 <span
                                                     className="feed-title"
                                                     style={{
-                                                        color:
-                                                            'rgba(76, 76, 76, 0.8)',
+                                                        color: 'rgba(76, 76, 76, 0.8)',
                                                         fontWeight: 'bold',
                                                     }}
                                                 >
@@ -648,95 +637,102 @@ class Incident extends Component<ComponentProps> {
                                             {!fetchingIncidentNotes &&
                                                 incidentNotes &&
                                                 incidentNotes.length > 0 &&
-                                                incidentNotes.map((note: $TSFixMe) => <li
-                                                    key={note._id}
-                                                    className="feed-item clearfix"
-                                                >
-                                                    <div
-                                                        className="message"
-                                                        style={{
-                                                            width: '100%',
-                                                            marginLeft: 0,
-                                                            background:
-                                                                'rgb(247, 247, 247)',
-                                                        }}
-                                                    >
-                                                        <div className="note__wrapper">
-                                                            <span
-                                                                style={{
-                                                                    color:
-                                                                        'rgba(0, 0, 0, 0.5)',
-                                                                    fontSize: 14,
-                                                                    display:
-                                                                        'block',
-                                                                    textAlign:
-                                                                        'justify',
-                                                                    whiteSpace:
-                                                                        'pre-wrap',
-                                                                }}
+                                                incidentNotes.map(
+                                                    (note: $TSFixMe) => {
+                                                        return (
+                                                            <li
+                                                                key={note._id}
+                                                                className="feed-item clearfix"
                                                             >
-                                                                {note.content
-                                                                    .split(
-                                                                        '\n'
-                                                                    )
-                                                                    .map(
-                                                                        (
-                                                                            elem: $TSFixMe,
-                                                                            index: $TSFixMe
-                                                                        ) => (
-                                                                            <Markdown
-                                                                                key={`${elem}-${index}`}
-                                                                                options={{
-                                                                                    forceBlock: true,
+                                                                <div
+                                                                    className="message"
+                                                                    style={{
+                                                                        width: '100%',
+                                                                        marginLeft: 0,
+                                                                        background:
+                                                                            'rgb(247, 247, 247)',
+                                                                    }}
+                                                                >
+                                                                    <div className="note__wrapper">
+                                                                        <span
+                                                                            style={{
+                                                                                color: 'rgba(0, 0, 0, 0.5)',
+                                                                                fontSize: 14,
+                                                                                display:
+                                                                                    'block',
+                                                                                textAlign:
+                                                                                    'justify',
+                                                                                whiteSpace:
+                                                                                    'pre-wrap',
+                                                                            }}
+                                                                        >
+                                                                            {note.content
+                                                                                .split(
+                                                                                    '\n'
+                                                                                )
+                                                                                .map(
+                                                                                    (
+                                                                                        elem: $TSFixMe,
+                                                                                        index: $TSFixMe
+                                                                                    ) => {
+                                                                                        return (
+                                                                                            <Markdown
+                                                                                                key={`${elem}-${index}`}
+                                                                                                options={{
+                                                                                                    forceBlock:
+                                                                                                        true,
+                                                                                                }}
+                                                                                            >
+                                                                                                {
+                                                                                                    elem
+                                                                                                }
+                                                                                            </Markdown>
+                                                                                        );
+                                                                                    }
+                                                                                )}
+                                                                        </span>
+                                                                        <span
+                                                                            style={{
+                                                                                display:
+                                                                                    'flex',
+                                                                                marginTop: 15,
+                                                                                alignItems:
+                                                                                    'center',
+                                                                            }}
+                                                                        >
+                                                                            <span
+                                                                                style={{
+                                                                                    color: 'rgba(0, 0, 0, 0.5)',
+                                                                                    fontSize: 12,
+                                                                                    display:
+                                                                                        'block',
                                                                                 }}
+                                                                            >
+                                                                                Posted
+                                                                                on{' '}
+                                                                                {moment(
+                                                                                    note.createdAt
+                                                                                ).format(
+                                                                                    'MMMM Do YYYY, h:mm a'
+                                                                                )}
+                                                                            </span>
+                                                                            <span
+                                                                                style={{
+                                                                                    marginLeft: 15,
+                                                                                }}
+                                                                                className="note-badge badge badge__color--green"
                                                                             >
                                                                                 {
-                                                                                    elem
+                                                                                    note.incident_state
                                                                                 }
-                                                                            </Markdown>
-                                                                        )
-                                                                    )}
-                                                            </span>
-                                                            <span
-                                                                style={{
-                                                                    display:
-                                                                        'flex',
-                                                                    marginTop: 15,
-                                                                    alignItems:
-                                                                        'center',
-                                                                }}
-                                                            >
-                                                                <span
-                                                                    style={{
-                                                                        color:
-                                                                            'rgba(0, 0, 0, 0.5)',
-                                                                        fontSize: 12,
-                                                                        display:
-                                                                            'block',
-                                                                    }}
-                                                                >
-                                                                    Posted
-                                                                    on{' '}
-                                                                    {moment(
-                                                                        note.createdAt
-                                                                    ).format(
-                                                                        'MMMM Do YYYY, h:mm a'
-                                                                    )}
-                                                                </span>
-                                                                <span
-                                                                    style={{
-                                                                        marginLeft: 15,
-                                                                    }}
-                                                                    className="note-badge badge badge__color--green"
-                                                                >
-                                                                    {
-                                                                        note.incident_state
-                                                                    }
-                                                                </span>
-                                                            </span>
-                                                        </div>
-                                                    </div>
-                                                </li>)}
+                                                                            </span>
+                                                                        </span>
+                                                                    </div>
+                                                                </div>
+                                                            </li>
+                                                        );
+                                                    }
+                                                )}
 
                                             {!fetchingIncidentNotes &&
                                                 incidentNotes &&
@@ -762,8 +758,7 @@ class Incident extends Component<ComponentProps> {
                                                                     '0.8em',
                                                                 marginLeft:
                                                                     '0px',
-                                                                color:
-                                                                    'rgb(76, 76, 76)',
+                                                                color: 'rgb(76, 76, 76)',
                                                             }}
                                                         >
                                                             <Translate>
@@ -785,7 +780,9 @@ class Incident extends Component<ComponentProps> {
                                     >
                                         <button
                                             className="more button-as-anchor anchor-centered"
-                                            onClick={() => this.more()}
+                                            onClick={() => {
+                                                return this.more();
+                                            }}
                                         >
                                             <Translate>More</Translate>
                                         </button>
@@ -833,7 +830,9 @@ class Incident extends Component<ComponentProps> {
                         style={{ display: 'flex', alignItems: 'center' }}
                     >
                         <span
-                            onClick={() => history.goBack()}
+                            onClick={() => {
+                                return history.goBack();
+                            }}
                             className="sp__icon sp__icon--back"
                             style={{
                                 color: 'rgb(76, 76, 76)',
@@ -865,10 +864,8 @@ class Incident extends Component<ComponentProps> {
     }
 }
 
-
 Incident.displayName = 'Incident';
 
-
 Incident.propTypes = {
     match: PropTypes.object,
     statusData: PropTypes.object,
@@ -907,15 +904,17 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        getStatusPage,
-        fetchIncident,
-        fetchIncidentNotes,
-        moreIncidentNotes,
-        fetchLastIncidentTimeline,
-    },
-    dispatch
-);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            getStatusPage,
+            fetchIncident,
+            fetchIncidentNotes,
+            moreIncidentNotes,
+            fetchLastIncidentTimeline,
+        },
+        dispatch
+    );
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(Incident);
diff --git a/StatusPage/src/Components/LanguageBox.tsx b/StatusPage/src/Components/LanguageBox.tsx
index a55379265f..5cc4fa613c 100644
--- a/StatusPage/src/Components/LanguageBox.tsx
+++ b/StatusPage/src/Components/LanguageBox.tsx
@@ -8,7 +8,6 @@ import { translateLanguage } from '../actions/status';
 
 import { openLanguageMenu } from '../actions/subscribe';
 
-
 import ClickOutHandler from 'react-onclickout';
 
 interface LanguageBoxProps {
@@ -27,7 +26,6 @@ class LanguageBox extends Component<ComponentProps> {
         };
     }
     translateButton = () => {
-
         this.props.handleCloseButtonClick();
     };
     handleChange = (event: $TSFixMe) => {
@@ -37,19 +35,21 @@ class LanguageBox extends Component<ComponentProps> {
         });
     };
     handleTranslate = () => {
-
         this.props.translateLanguage(this.state.language);
         this.translateButton();
     };
     override render() {
-
         const { statusPage }: $TSFixMe = this.props;
         const languages: $TSFixMe = statusPage.multipleLanguages;
 
         const theme: $TSFixMe = this.props.theme;
         return (
             <div className="subscribe-overlay">
-                <ClickOutHandler onClickOut={() => this.translateButton()}>
+                <ClickOutHandler
+                    onClickOut={() => {
+                        return this.translateButton();
+                    }}
+                >
                     <div
                         className={'white box subscribe-box'}
                         style={{
@@ -94,7 +94,9 @@ class LanguageBox extends Component<ComponentProps> {
 
                             <button
                                 id="updates-dropdown-close-btn"
-                                onClick={() => this.translateButton()}
+                                onClick={() => {
+                                    return this.translateButton();
+                                }}
                                 className="icon-container"
                                 style={{
                                     width: '70px',
@@ -121,29 +123,33 @@ class LanguageBox extends Component<ComponentProps> {
                             style={{ paddingTop: 0 }}
                         >
                             <select
-
                                 value={this.state.language}
                                 onChange={this.handleChange}
                                 name="country"
                                 className="select-full"
                             >
-                                {languages.map((language: $TSFixMe) => <option
-                                    value={language.toLowerCase()}
-                                    key={language}
-                                >
-                                    {language}
-                                </option>)}
+                                {languages.map((language: $TSFixMe) => {
+                                    return (
+                                        <option
+                                            value={language.toLowerCase()}
+                                            key={language}
+                                        >
+                                            {language}
+                                        </option>
+                                    );
+                                })}
                             </select>
                             <div style={{ marginTop: 10 }}>
                                 <button
                                     className={
-
                                         this.props.theme
                                             ? 'subscribe-btn-full bs-theme-btn'
                                             : 'subscribe-btn-full'
                                     }
                                     id="subscribe-btn-sms"
-                                    onClick={() => this.handleTranslate()}
+                                    onClick={() => {
+                                        return this.handleTranslate();
+                                    }}
                                 >
                                     <Translate>Translate Page</Translate>
                                 </button>
@@ -156,17 +162,22 @@ class LanguageBox extends Component<ComponentProps> {
     }
 }
 
-
 LanguageBox.displayName = 'LanguageBox';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    select: state.subscribe.selectedMenu,
-    subscribed: state.subscribe.subscribed,
-    statusPage: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ openLanguageMenu, translateLanguage }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        select: state.subscribe.selectedMenu,
+        subscribed: state.subscribe.subscribed,
+        statusPage: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { openLanguageMenu, translateLanguage },
+        dispatch
+    );
+};
 
 LanguageBox.propTypes = {
     statusPage: PropTypes.object,
diff --git a/StatusPage/src/Components/LineChartsContainer.tsx b/StatusPage/src/Components/LineChartsContainer.tsx
index 8ef42b2632..059714f2d7 100644
--- a/StatusPage/src/Components/LineChartsContainer.tsx
+++ b/StatusPage/src/Components/LineChartsContainer.tsx
@@ -15,16 +15,24 @@ interface ChartContainerProps {
 const ChartContainer: Function = ({
     label,
     name,
-    data
-}: ChartContainerProps) => (
-    <Fragment>
-        <span style={{ fontSize: '13px', display: 'block', marginTop: '10px' }}>
-            {label}
-        </span>
+    data,
+}: ChartContainerProps) => {
+    return (
+        <Fragment>
+            <span
+                style={{
+                    fontSize: '13px',
+                    display: 'block',
+                    marginTop: '10px',
+                }}
+            >
+                {label}
+            </span>
 
-        <AreaChart name={name} data={data} />
-    </Fragment>
-);
+            <AreaChart name={name} data={data} />
+        </Fragment>
+    );
+};
 
 ChartContainer.displayName = 'ChartContainer';
 
@@ -44,7 +52,6 @@ interface LineChartsContainerProps {
 
 class LineChartsContainer extends React.Component<LineChartsContainerProps> {
     override render() {
-
         const { _id: monitorId } = this.props.monitor;
         let requesting = true;
         let data = [];
@@ -57,14 +64,14 @@ class LineChartsContainer extends React.Component<LineChartsContainerProps> {
             }
         }
 
-        if (requesting) return null;
+        if (requesting) {
+            return null;
+        }
 
         let earliestDate =
             data.length === 0 ? Date.now() : data[data.length - 1].createdAt;
         while (data.length < 90) {
-            earliestDate = moment(earliestDate)
-                .subtract(1, 'day')
-                .format();
+            earliestDate = moment(earliestDate).subtract(1, 'day').format();
             data.push({
                 createdAt: earliestDate,
                 cpuLoad: 0,
@@ -77,7 +84,6 @@ class LineChartsContainer extends React.Component<LineChartsContainerProps> {
 
         return (
             <Fragment>
-
                 {this.props.selectedCharts.memory && (
                     <ChartContainer label="Memory" name="memory" data={data} />
                 )}
@@ -118,10 +124,8 @@ class LineChartsContainer extends React.Component<LineChartsContainerProps> {
     }
 }
 
-
 LineChartsContainer.displayName = 'LineChartsContainer';
 
-
 LineChartsContainer.propTypes = {
     monitor: PropTypes.object,
     selectedCharts: PropTypes.object.isRequired,
@@ -136,12 +140,14 @@ const mapStateToProps: Function = (state: RootState) => {
     } = state;
     return { logs };
 };
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        fetchMonitorLogs,
-    },
-    dispatch
-);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            fetchMonitorLogs,
+        },
+        dispatch
+    );
+};
 
 export default connect(
     mapStateToProps,
diff --git a/StatusPage/src/Components/MonitorInfo.tsx b/StatusPage/src/Components/MonitorInfo.tsx
index 9aaec76be4..76a6f4ff65 100755
--- a/StatusPage/src/Components/MonitorInfo.tsx
+++ b/StatusPage/src/Components/MonitorInfo.tsx
@@ -24,7 +24,6 @@ function debounce(this: $TSFixMe, fn: $TSFixMe, ms: $TSFixMe) {
 }
 
 class MonitorInfo extends Component<ComponentProps> {
-
     public static displayName = '';
     public static propTypes = {};
 
@@ -44,14 +43,12 @@ class MonitorInfo extends Component<ComponentProps> {
     }
 
     override componentDidMount() {
-
         const { monitor }: $TSFixMe = this.props;
 
         if (monitor) {
             const endDate: $TSFixMe = moment(Date.now());
             const startDate: $TSFixMe = moment(Date.now()).subtract(90, 'days');
 
-
             this.props.fetchMonitorStatuses(
                 monitor.projectId._id || monitor.projectId,
                 monitor._id,
@@ -71,7 +68,6 @@ class MonitorInfo extends Component<ComponentProps> {
 
     componentDidUpdate(prevProps: $TSFixMe) {
         const {
-
             monitor,
 
             calculateTime,
@@ -85,7 +81,6 @@ class MonitorInfo extends Component<ComponentProps> {
             monitorStatus,
         } = this.props;
 
-
         let { range } = this.props;
 
         let currentProbe =
@@ -95,34 +90,34 @@ class MonitorInfo extends Component<ComponentProps> {
         const prevProbe: $TSFixMe =
             prevProps.probes && prevProps.probes.length > 0
                 ? prevProps.probes[
-                prevProps.probes.length < 2 ? 0 : activeProbe
-                ]
+                      prevProps.probes.length < 2 ? 0 : activeProbe
+                  ]
                 : null;
 
         if (
             prevProbe?._id !== currentProbe?._id ||
             JSON.stringify(prevProps.monitorStatus) !==
-
-            JSON.stringify(this.props.monitorStatus) ||
+                JSON.stringify(this.props.monitorStatus) ||
             prevProps.range !== range
         ) {
-
             range = !this.props.theme ? 90 : range;
 
             const now: $TSFixMe = Date.now();
 
-            const monitorData: $TSFixMe = monitorState.find(
-                (a: $TSFixMe) => String(a._id) === String(monitor._id)
-            );
+            const monitorData: $TSFixMe = monitorState.find((a: $TSFixMe) => {
+                return String(a._id) === String(monitor._id);
+            });
 
             //this fixes the problem if the monitor is just created and its an api monitor
             if (monitorData?.statuses?.length === 1) {
                 currentProbe =
                     probes && probes.length > 0
-                        ? probes.filter(
-                            (probe: $TSFixMe) => String(probe._id) ===
-                                String(monitorData.statuses[0]._id)
-                        )[0]
+                        ? probes.filter((probe: $TSFixMe) => {
+                              return (
+                                  String(probe._id) ===
+                                  String(monitorData.statuses[0]._id)
+                              );
+                          })[0]
                         : null;
             }
 
@@ -137,7 +132,10 @@ class MonitorInfo extends Component<ComponentProps> {
         if (JSON.stringify(prevProps.monitor) !== JSON.stringify(monitor)) {
             if (monitor) {
                 const endDate: $TSFixMe = moment(Date.now());
-                const startDate: $TSFixMe = moment(Date.now()).subtract(90, 'days');
+                const startDate: $TSFixMe = moment(Date.now()).subtract(
+                    90,
+                    'days'
+                );
 
                 this.props.fetchMonitorStatuses(
                     monitor.projectId._id || monitor.projectId,
@@ -161,7 +159,9 @@ class MonitorInfo extends Component<ComponentProps> {
     resizeHandler() {
         // block chart scroll wrapper
         const scrollWrapper: $TSFixMe = this.scrollWrapper.current;
-        if (!scrollWrapper) return;
+        if (!scrollWrapper) {
+            return;
+        }
         scrollWrapper.style.width = 'auto';
 
         // block chart scroll content
@@ -189,20 +189,18 @@ class MonitorInfo extends Component<ComponentProps> {
     }
 
     handleMonitorStatus = (status: $TSFixMe) => {
-
         const { onlineText, offlineText, degradedText }: $TSFixMe = this.props;
         return status === 'online'
             ? onlineText
             : status === 'degraded'
-                ? degradedText
-                : offlineText;
+            ? degradedText
+            : offlineText;
     };
 
     checkOngoingEventMonitor = (events: $TSFixMe) => {
         let result = false;
         for (const event of events) {
             for (const monitor of event.monitors) {
-
                 if (monitor.monitorId._id === this.props.monitor._id) {
                     result = true;
                 }
@@ -213,7 +211,6 @@ class MonitorInfo extends Component<ComponentProps> {
 
     override render() {
         const {
-
             monitorState,
 
             monitor,
@@ -235,9 +232,7 @@ class MonitorInfo extends Component<ComponentProps> {
 
         let range = !this.props.theme && 90;
 
-
         if (this.props.theme) {
-
             const { windowSize }: $TSFixMe = this.state;
             if (windowSize <= 600) {
                 range = 30;
@@ -250,9 +245,9 @@ class MonitorInfo extends Component<ComponentProps> {
             }
         }
 
-        const monitorData: $TSFixMe = monitorState.find(
-            (a: $TSFixMe) => String(a._id) === String(monitor._id)
-        );
+        const monitorData: $TSFixMe = monitorState.find((a: $TSFixMe) => {
+            return String(a._id) === String(monitor._id);
+        });
 
         const probe: $TSFixMe =
             probes && probes.length > 0
@@ -265,7 +260,9 @@ class MonitorInfo extends Component<ComponentProps> {
             ? monitorInfo.requesting[monitor._id]
             : true;
 
-        const info: $TSFixMe = monitor ? monitorInfo.info[monitor._id] || {} : {};
+        const info: $TSFixMe = monitor
+            ? monitorInfo.info[monitor._id] || {}
+            : {};
         const timeBlock: $TSFixMe = info.timeBlock || [];
         const uptimePercent: $TSFixMe = info.uptimePercent || 'N/A';
 
@@ -291,15 +288,12 @@ class MonitorInfo extends Component<ComponentProps> {
             for (let i = 0; i < range; i++) {
                 block.unshift(
                     <BlockChart
-
                         monitorId={monitor._id}
                         monitorName={monitor.name}
                         time={timeBlock[i]}
                         key={i}
                         id={i}
-
                         theme={this.props.theme}
-
                         windowSize={this.state.windowSize}
                         range={range}
                     />
@@ -326,27 +320,22 @@ class MonitorInfo extends Component<ComponentProps> {
         const subheading: $TSFixMe = {};
         const primaryText: $TSFixMe = {};
         if (colors) {
-
             subheading.color = `rgba(${colors.subheading.r}, ${colors.subheading.g}, ${colors.subheading.b}, ${colors.subheading.a})`;
 
             primaryText.color = `rgba(${colors.primaryText.r}, ${colors.primaryText.g}, ${colors.primaryText.b}, ${colors.primaryText.a})`;
             if (monitorStatus === 'degraded') {
-
                 status.backgroundColor = `rgba(${colors.degraded.r}, ${colors.degraded.g}, ${colors.degraded.b}, ${colors.degraded.a})`; // "degraded-status";
 
                 status.font = `rgba(${colors.degraded.r}, ${colors.degraded.g}, ${colors.degraded.b}, ${colors.degraded.a})`; // "degraded-status";
             } else if (monitorStatus === 'online') {
-
                 status.backgroundColor = `rgba(${colors.uptime.r}, ${colors.uptime.g}, ${colors.uptime.b}, ${colors.uptime.a})`; // "online-status";
 
                 status.font = `rgba(${colors.uptime.r}, ${colors.uptime.g}, ${colors.uptime.b}, ${colors.uptime.a})`; // "online-status";
             } else if (monitorStatus === 'offline') {
-
                 status.backgroundColor = `rgba(${colors.downtime.r}, ${colors.downtime.g}, ${colors.downtime.b}, ${colors.downtime.a})`; // "red-downtime";
 
                 status.font = `rgba(${colors.downtime.r}, ${colors.downtime.g}, ${colors.downtime.b}, ${colors.downtime.a})`; // "red-downtime";
             } else {
-
                 status.backgroundColor = `rgba(${colors.disabled.r}, ${colors.disabled.g}, ${colors.disabled.b}, ${colors.disabled.a})`; // "grey-disabled";
 
                 status.font = `rgba(${colors.disabled.r}, ${colors.disabled.g}, ${colors.disabled.b}, ${colors.disabled.a})`; // "grey-disabled";
@@ -355,7 +344,6 @@ class MonitorInfo extends Component<ComponentProps> {
 
         return (
             <>
-
                 <ShouldRender if={this.props.theme}>
                     <>
                         <div className="op-disp">
@@ -366,7 +354,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                     >
                                         <div
                                             id={`monitorCategory_${monitor.name}`}
-
                                             style={monitorCategoryStyle}
                                         >
                                             <span>
@@ -415,32 +402,24 @@ class MonitorInfo extends Component<ComponentProps> {
                             <div
                                 style={{
                                     color:
-
                                         (this.props.ongoing &&
-
                                             this.props.ongoing.length > 0) ||
-
-                                            status.font === 'rgba(255, 222, 36, 1)'
+                                        status.font === 'rgba(255, 222, 36, 1)'
                                             ? '#e39f48'
-
                                             : status.font ===
-                                                'rgba(108, 219, 86, 1)'
-                                                ? '#49c3b1'
-
-                                                : status.font ===
-                                                    'rgba(250, 109, 70, 1)'
-                                                    ? '#FA6D46'
-
-                                                    : status.font,
+                                              'rgba(108, 219, 86, 1)'
+                                            ? '#49c3b1'
+                                            : status.font ===
+                                              'rgba(250, 109, 70, 1)'
+                                            ? '#FA6D46'
+                                            : status.font,
                                     textTransform: 'capitalize',
                                 }}
                             >
-
                                 {this.props.ongoing &&
-                                    this.checkOngoingEventMonitor(
-
-                                        this.props.ongoing
-                                    )
+                                this.checkOngoingEventMonitor(
+                                    this.props.ongoing
+                                )
                                     ? 'Ongoing Scheduled Event'
                                     : this.handleMonitorStatus(monitorStatus)}
                             </div>
@@ -450,7 +429,6 @@ class MonitorInfo extends Component<ComponentProps> {
                         >
                             <div
                                 className="uptime-graph-section dashboard-uptime-graph ma-t-20"
-
                                 id={this.props.id}
                                 ref={this.container}
                             >
@@ -459,7 +437,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                         ref={this.scrollWrapper}
                                         className="block-chart"
                                         style={{
-
                                             overflowX: this.props.theme
                                                 ? 'none'
                                                 : 'scroll',
@@ -491,9 +468,8 @@ class MonitorInfo extends Component<ComponentProps> {
                                 <div className="alerts_days">
                                     <div
                                         style={
-
                                             subheading.color ===
-                                                'rgba(76, 76, 76, 1)'
+                                            'rgba(76, 76, 76, 1)'
                                                 ? { color: '#aaaaaa' }
                                                 : subheading
                                         }
@@ -502,14 +478,12 @@ class MonitorInfo extends Component<ComponentProps> {
                                     </div>
                                     <div
                                         style={
-
                                             subheading.color ===
-                                                'rgba(76, 76, 76, 1)'
+                                            'rgba(76, 76, 76, 1)'
                                                 ? { color: '#aaaaaa' }
                                                 : subheading
                                         }
                                         className={
-
                                             this.props.checkUptime
                                                 ? 'spacer bs-mar-right'
                                                 : 'spacer'
@@ -520,12 +494,11 @@ class MonitorInfo extends Component<ComponentProps> {
                                         {uptime === 'N/A' ? (
                                             <div
                                                 style={
-
                                                     subheading.color ===
-                                                        'rgba(76, 76, 76, 1)'
+                                                    'rgba(76, 76, 76, 1)'
                                                         ? {
-                                                            color: '#aaaaaa',
-                                                        }
+                                                              color: '#aaaaaa',
+                                                          }
                                                         : subheading
                                                 }
                                             >
@@ -534,12 +507,11 @@ class MonitorInfo extends Component<ComponentProps> {
                                         ) : (
                                             <div
                                                 style={
-
                                                     subheading.color ===
-                                                        'rgba(76, 76, 76, 1)'
+                                                    'rgba(76, 76, 76, 1)'
                                                         ? {
-                                                            color: '#aaaaaa',
-                                                        }
+                                                              color: '#aaaaaa',
+                                                          }
                                                         : subheading
                                                 }
                                             >
@@ -550,14 +522,12 @@ class MonitorInfo extends Component<ComponentProps> {
                                     </ShouldRender>
                                     <div
                                         style={
-
                                             subheading.color ===
-                                                'rgba(76, 76, 76, 1)'
+                                            'rgba(76, 76, 76, 1)'
                                                 ? { color: '#aaaaaa' }
                                                 : subheading
                                         }
                                         className={
-
                                             this.props.checkUptime
                                                 ? 'spacer bs-mar-left'
                                                 : 'spacer'
@@ -565,9 +535,8 @@ class MonitorInfo extends Component<ComponentProps> {
                                     ></div>
                                     <div
                                         style={
-
                                             subheading.color ===
-                                                'rgba(76, 76, 76, 1)'
+                                            'rgba(76, 76, 76, 1)'
                                                 ? { color: '#aaaaaa' }
                                                 : subheading
                                         }
@@ -580,11 +549,9 @@ class MonitorInfo extends Component<ComponentProps> {
                     </>
                 </ShouldRender>
 
-
                 <ShouldRender if={!this.props.theme}>
                     <div
                         className="uptime-graph-section dashboard-uptime-graph monitorLists"
-
                         id={this.props.id}
                         ref={this.container}
                     >
@@ -598,7 +565,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                 <ShouldRender if={isGroupedByMonitorCategory}>
                                     <div
                                         id={`monitorCategory_${monitor.name}`}
-
                                         style={monitorCategoryStyle}
                                     >
                                         <span>
@@ -613,7 +579,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                     </div>
                                 </ShouldRender>
                                 <div style={{ display: 'flex' }}>
-
                                     <ShouldRender if={!this.props.theme}>
                                         <div>
                                             <span style={status}></span>
@@ -648,7 +613,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                     className="percentage"
                                     style={primaryText}
                                 >
-
                                     <ShouldRender if={!this.props.checkUptime}>
                                         {uptime === 'N/A' ? (
                                             <>
@@ -669,7 +633,6 @@ class MonitorInfo extends Component<ComponentProps> {
                                 ref={this.scrollWrapper}
                                 className="block-chart"
                                 style={{
-
                                     overflowX: this.props.theme
                                         ? 'none'
                                         : 'scroll',
@@ -700,7 +663,6 @@ class MonitorInfo extends Component<ComponentProps> {
     }
 }
 
-
 MonitorInfo.displayName = 'UptimeGraphs';
 
 function mapStateToProps(state: RootState, ownProps: $TSFixMe) {
@@ -708,11 +670,12 @@ function mapStateToProps(state: RootState, ownProps: $TSFixMe) {
         state.status &&
         state.status.ongoing &&
         state.status.ongoing.ongoing &&
-        state.status.ongoing.ongoing.filter(
-            (ongoingSchedule: $TSFixMe) => !ongoingSchedule.cancelled
-        );
+        state.status.ongoing.ongoing.filter((ongoingSchedule: $TSFixMe) => {
+            return !ongoingSchedule.cancelled;
+        });
 
-    const monitorStatus: $TSFixMe = state.status.monitorStatuses[ownProps.monitor._id];
+    const monitorStatus: $TSFixMe =
+        state.status.monitorStatuses[ownProps.monitor._id];
 
     return {
         monitorState: state.status.statusPage.monitorsData,
@@ -726,14 +689,15 @@ function mapStateToProps(state: RootState, ownProps: $TSFixMe) {
     };
 }
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        fetchMonitorStatuses,
-        calculateTime,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            fetchMonitorStatuses,
+            calculateTime,
+        },
+        dispatch
+    );
+};
 
 MonitorInfo.propTypes = {
     monitor: PropTypes.object,
diff --git a/StatusPage/src/Components/NewThemeEvent.tsx b/StatusPage/src/Components/NewThemeEvent.tsx
index 19cfba9ac3..eac8cb56ae 100644
--- a/StatusPage/src/Components/NewThemeEvent.tsx
+++ b/StatusPage/src/Components/NewThemeEvent.tsx
@@ -11,7 +11,7 @@ import { capitalize } from '../config';
 const AffectedResources: Function = ({
     event,
     monitorState,
-    colorStyle
+    colorStyle,
 }: $TSFixMe) => {
     const affectedMonitors: $TSFixMe = [];
     let monitorCount = 0;
@@ -32,8 +32,10 @@ const AffectedResources: Function = ({
         }
         return monitor;
     });
-    // check if the length of monitors on status page equals the monitor count
-    // if they are equal then all the monitors in status page is in a particular scheduled event
+    /*
+     * check if the length of monitors on status page equals the monitor count
+     * if they are equal then all the monitors in status page is in a particular scheduled event
+     */
     if (monitorCount === monitorState.length) {
         return (
             <>
@@ -59,8 +61,9 @@ const AffectedResources: Function = ({
                 </span>
             </>
         );
-    } else {
-        return <>
+    }
+    return (
+        <>
             <span
                 className="ongoing__affectedmonitor--title"
                 style={
@@ -81,12 +84,14 @@ const AffectedResources: Function = ({
             >
                 {affectedMonitors
 
-                    .map(monitor => capitalize(monitor.name))
+                    .map((monitor) => {
+                        return capitalize(monitor.name);
+                    })
                     .join(', ')
                     .replace(/, ([^,]*)$/, ' and $1')}
             </span>
-        </>;
-    }
+        </>
+    );
 };
 
 interface NewThemeEventProps {
@@ -108,7 +113,6 @@ class NewThemeEvent extends Component<ComponentProps> {
             for (const item of items) {
                 const date: $TSFixMe = String(item.createdAt).slice(0, 10);
 
-
                 if (!track[date]) {
                     item.style = true;
 
@@ -124,7 +128,7 @@ class NewThemeEvent extends Component<ComponentProps> {
         };
 
         const formatMsg: Function = (data: $TSFixMe) => {
-            const result: $TSFixMe = data.reduce(function (r: $TSFixMe, a: $TSFixMe) {
+            const result: $TSFixMe = data.reduce((r: $TSFixMe, a: $TSFixMe) => {
                 r[a.event_state] = r[a.event_state] || [];
                 r[a.event_state].push(a);
                 return r;
@@ -133,14 +137,10 @@ class NewThemeEvent extends Component<ComponentProps> {
             return result;
         };
 
-
         const data: $TSFixMe = this.props.filteredEvents.success
-
             ? this.props.filteredEvents.events
-
             : this.props.events;
 
-
         const noteBackgroundColor: $TSFixMe = this.props.noteBackgroundColor;
 
         const currentTime: $TSFixMe = moment();
@@ -153,7 +153,7 @@ class NewThemeEvent extends Component<ComponentProps> {
                         style={{
                             backgroundColor:
                                 noteBackgroundColor.background ===
-                                    'rgba(247, 247, 247, 1)'
+                                'rgba(247, 247, 247, 1)'
                                     ? 'rgba(255,255,255,1)'
                                     : noteBackgroundColor.background,
                         }}
@@ -175,13 +175,11 @@ class NewThemeEvent extends Component<ComponentProps> {
                                     <b
                                         id={`event-name-${event.name}`}
                                         style={{ cursor: 'pointer' }}
-                                        onClick={() =>
-
-                                            this.props.history.push(
-
+                                        onClick={() => {
+                                            return this.props.history.push(
                                                 `/StatusPage/${this.props.statusPageSlug}/scheduledEvent/${event.slug}`
-                                            )
-                                        }
+                                            );
+                                        }}
                                     >
                                         {event.name}
                                     </b>
@@ -216,8 +214,8 @@ class NewThemeEvent extends Component<ComponentProps> {
                                             </span>
                                         </div>
                                     ) : currentTime >=
-                                        moment(event.startDate) &&
-                                        currentTime < moment(event.endDate) ? (
+                                          moment(event.startDate) &&
+                                      currentTime < moment(event.endDate) ? (
                                         <div
                                             style={{
                                                 marginLeft: 15,
@@ -233,7 +231,7 @@ class NewThemeEvent extends Component<ComponentProps> {
                                             </span>
                                         </div>
                                     ) : currentTime <
-                                        moment(event.startDate) ? (
+                                      moment(event.startDate) ? (
                                         <div
                                             style={{
                                                 marginLeft: 15,
@@ -250,7 +248,7 @@ class NewThemeEvent extends Component<ComponentProps> {
                                         </div>
                                     ) : (
                                         currentTime >=
-                                        moment(event.endDate) && (
+                                            moment(event.endDate) && (
                                             <div
                                                 style={{
                                                     marginLeft: 15,
@@ -276,16 +274,24 @@ class NewThemeEvent extends Component<ComponentProps> {
                                     >
                                         {event.description
                                             .split('\n')
-                                            .map((elem: $TSFixMe, index: $TSFixMe) => (
-                                                <Markdown
-                                                    key={`${elem}-${index}`}
-                                                    options={{
-                                                        forceBlock: true,
-                                                    }}
-                                                >
-                                                    {elem}
-                                                </Markdown>
-                                            ))}
+                                            .map(
+                                                (
+                                                    elem: $TSFixMe,
+                                                    index: $TSFixMe
+                                                ) => {
+                                                    return (
+                                                        <Markdown
+                                                            key={`${elem}-${index}`}
+                                                            options={{
+                                                                forceBlock:
+                                                                    true,
+                                                            }}
+                                                        >
+                                                            {elem}
+                                                        </Markdown>
+                                                    );
+                                                }
+                                            )}
                                     </div>
                                 </ShouldRender>
                                 {AffectedResources({
@@ -346,7 +352,10 @@ class NewThemeEvent extends Component<ComponentProps> {
                                                             {formatMsg(
                                                                 event.notes
                                                             )[key].map(
-                                                                (item: $TSFixMe, i: $TSFixMe) => {
+                                                                (
+                                                                    item: $TSFixMe,
+                                                                    i: $TSFixMe
+                                                                ) => {
                                                                     return (
                                                                         <div
                                                                             className="incident-brief"
@@ -361,10 +370,10 @@ class NewThemeEvent extends Component<ComponentProps> {
                                                                             ]
                                                                                 .length >
                                                                                 1 && (
-                                                                                    <span className="big_dot">
-                                                                                        &#9679;
-                                                                                    </span>
-                                                                                )}
+                                                                                <span className="big_dot">
+                                                                                    &#9679;
+                                                                                </span>
+                                                                            )}
                                                                             {
                                                                                 item.content
                                                                             }
@@ -379,23 +388,26 @@ class NewThemeEvent extends Component<ComponentProps> {
                                                             {formatMsg(
                                                                 event.notes
                                                             )[key].map(
-                                                                (time: $TSFixMe, i: $TSFixMe) => {
+                                                                (
+                                                                    time: $TSFixMe,
+                                                                    i: $TSFixMe
+                                                                ) => {
                                                                     return (
                                                                         <>
                                                                             {i ===
                                                                                 0 && (
-                                                                                    <div
-                                                                                        key={
-                                                                                            i
-                                                                                        }
-                                                                                    >
-                                                                                        {moment(
-                                                                                            time.createdAt
-                                                                                        ).format(
-                                                                                            'LLL'
-                                                                                        )}
-                                                                                    </div>
-                                                                                )}
+                                                                                <div
+                                                                                    key={
+                                                                                        i
+                                                                                    }
+                                                                                >
+                                                                                    {moment(
+                                                                                        time.createdAt
+                                                                                    ).format(
+                                                                                        'LLL'
+                                                                                    )}
+                                                                                </div>
+                                                                            )}
                                                                         </>
                                                                     );
                                                                 }
@@ -420,10 +432,8 @@ class NewThemeEvent extends Component<ComponentProps> {
             })
         ) : (
             <>
-
                 <ShouldRender if={this.props.filteredEvents.date}>
                     <div className="date-big ma-t-20">
-
                         {moment(this.props.filteredEvents.date).format('LL')}
                     </div>
                 </ShouldRender>
@@ -435,10 +445,8 @@ class NewThemeEvent extends Component<ComponentProps> {
     }
 }
 
-
 NewThemeEvent.displayName = 'NewThemeEvent';
 
-
 NewThemeEvent.propTypes = {
     events: PropTypes.array,
     filteredEvents: PropTypes.object,
@@ -456,15 +464,15 @@ const mapStateToProps: Function = (state: RootState, ownProps: $TSFixMe) => {
         state.status &&
         state.status.ongoing &&
         state.status.ongoing.ongoing &&
-        state.status.ongoing.ongoing.filter(
-            (ongoingSchedule: $TSFixMe) => !ongoingSchedule.cancelled
-        );
+        state.status.ongoing.ongoing.filter((ongoingSchedule: $TSFixMe) => {
+            return !ongoingSchedule.cancelled;
+        });
     const events: $TSFixMe =
         type === 'future'
             ? futureEvents
             : type === 'past'
-                ? pastEvents
-                : ongoing;
+            ? pastEvents
+            : ongoing;
     return {
         events,
         filteredEvents: state.status.individualEvents,
diff --git a/StatusPage/src/Components/NewThemeSubscriber.tsx b/StatusPage/src/Components/NewThemeSubscriber.tsx
index 0a918f6f12..25959d465d 100644
--- a/StatusPage/src/Components/NewThemeSubscriber.tsx
+++ b/StatusPage/src/Components/NewThemeSubscriber.tsx
@@ -9,24 +9,24 @@ const NewThemeSubscriber: Function = () => {
     const subRef: $TSFixMe = useRef();
 
     const handleToggleButtonClick: Function = () => {
-        setIsShown(prevState => !prevState);
+        setIsShown(prevState => {
+            return !prevState;
+        });
     };
     const handleCloseButtonClick: Function = () => {
         setIsShown(false);
     };
     useEffect(() => {
         const listener: Function = (event: $TSFixMe) => {
-
             if (!popupRef.current || popupRef.current.contains(event.target)) {
                 return;
             }
 
             if (isShown && subRef.current.contains(event.target)) {
                 return;
-            } else {
-
-                handleCloseButtonClick(event);
             }
+
+            handleCloseButtonClick(event);
         };
         document.addEventListener('mousedown', listener);
         document.addEventListener('touchstart', listener);
@@ -39,7 +39,6 @@ const NewThemeSubscriber: Function = () => {
     return (
         <div className="popup-menu-container" id="subscriber-button">
             <button
-
                 ref={subRef}
                 className="subscribe_btn"
                 onClick={handleToggleButtonClick}
@@ -48,11 +47,9 @@ const NewThemeSubscriber: Function = () => {
             </button>
             <div
                 className={`popup-menu ${isShown ? 'shown' : ''}`}
-
                 ref={popupRef}
             >
                 <SubscribeBox
-
                     theme={true}
                     handleCloseButtonClick={handleCloseButtonClick}
                 />
diff --git a/StatusPage/src/Components/NoMonitor.tsx b/StatusPage/src/Components/NoMonitor.tsx
index 3983793607..cb4af0d7dc 100755
--- a/StatusPage/src/Components/NoMonitor.tsx
+++ b/StatusPage/src/Components/NoMonitor.tsx
@@ -2,20 +2,22 @@ import React from 'react';
 
 import { Translate } from 'react-auto-translate';
 
-const NoMonitor: Function = () => (
-    <div className="largestatus">
-        <span className="legend-item">
-            <div className="title-wrapper">
-                <label className="status-time">
-                    <Translate>
-                        {' '}
-                        No monitors added yet. Please, add a monitor.
-                    </Translate>
-                </label>
-            </div>
-        </span>
-    </div>
-);
+const NoMonitor: Function = () => {
+    return (
+        <div className="largestatus">
+            <span className="legend-item">
+                <div className="title-wrapper">
+                    <label className="status-time">
+                        <Translate>
+                            {' '}
+                            No monitors added yet. Please, add a monitor.
+                        </Translate>
+                    </label>
+                </div>
+            </span>
+        </div>
+    );
+};
 
 NoMonitor.displayName = 'NoMonitor';
 
diff --git a/StatusPage/src/Components/Notes.tsx b/StatusPage/src/Components/Notes.tsx
index f5b9762f39..e89618cd8c 100755
--- a/StatusPage/src/Components/Notes.tsx
+++ b/StatusPage/src/Components/Notes.tsx
@@ -57,9 +57,7 @@ class Notes extends Component<ComponentProps> {
             }
 
             if (
-
                 !incidentTimeline.incident_state &&
-
                 incidentTimeline.status === 'investigation notes deleted'
             ) {
                 timelineStatus = (
@@ -72,7 +70,6 @@ class Notes extends Component<ComponentProps> {
             if (incidentTimeline.incident_state) {
                 timelineStatus = (
                     <span className="note_status">
-
                         {capitalize(incidentTimeline.incident_state)}
                     </span>
                 );
@@ -82,7 +79,6 @@ class Notes extends Component<ComponentProps> {
         return timelineStatus;
     };
     handleNavigation = (statusPageSlug: $TSFixMe, noteSlug: $TSFixMe) => {
-
         const { history }: $TSFixMe = this.props;
 
         history.push(`/StatusPage/${statusPageSlug}/incident/${noteSlug}`);
@@ -100,15 +96,15 @@ class Notes extends Component<ComponentProps> {
                 return `${monitors[0].monitorId.name}, ${monitors[1].monitorId.name} and ${monitors[2].monitorId.name}`;
             }
             if (monitors.length > 3) {
-                return `${monitors[0].monitorId.name}, ${monitors[1].monitorId.name
-                    } and ${monitors.length - 2} others`;
+                return `${monitors[0].monitorId.name}, ${
+                    monitors[1].monitorId.name
+                } and ${monitors.length - 2} others`;
             }
         }
     };
 
     override render() {
         const {
-
             statusPageSlug,
 
             uptimeColor,
@@ -121,24 +117,26 @@ class Notes extends Component<ComponentProps> {
         } = this.props;
 
         return (
-
             <ShouldRender if={this.props.notes}>
-
                 {this.props.notes.map((note: $TSFixMe, i: $TSFixMe) => {
-                    if (!note)
+                    if (!note) {
                         return (
                             <div>
                                 <Translate>No note</Translate>
                             </div>
                         );
+                    }
 
                     return (
                         <li
                             className="incidentlist feed-item clearfix"
                             key={i}
-                            onClick={() =>
-                                this.handleNavigation(statusPageSlug, note.slug)
-                            }
+                            onClick={() => {
+                                return this.handleNavigation(
+                                    statusPageSlug,
+                                    note.slug
+                                );
+                            }}
                         >
                             <div
                                 className="incident-status-bubble"
@@ -147,8 +145,8 @@ class Notes extends Component<ComponentProps> {
                                         note.incidentType === 'online'
                                             ? uptimeColor.backgroundColor
                                             : note.incidentType === 'offline'
-                                                ? downtimeColor.backgroundColor
-                                                : degradedColor.backgroundColor,
+                                            ? downtimeColor.backgroundColor
+                                            : degradedColor.backgroundColor,
                                 }}
                             ></div>
                             <div
@@ -183,7 +181,6 @@ class Notes extends Component<ComponentProps> {
                                     </span>
                                     <span
                                         style={{
-
                                             ...this.props.secondaryTextColor,
                                             color: 'rgba(0, 0, 0, 0.5)',
                                             display: 'block',
@@ -233,7 +230,6 @@ class Notes extends Component<ComponentProps> {
                                     <span
                                         className="time"
                                         style={{
-
                                             ...this.props.secondaryTextColor,
                                             marginLeft: 0,
                                             display: 'inline-block',
@@ -272,10 +268,8 @@ class Notes extends Component<ComponentProps> {
     }
 }
 
-
 Notes.displayName = 'Notes';
 
-
 Notes.propTypes = {
     notes: PropTypes.array,
     secondaryTextColor: PropTypes.object,
diff --git a/StatusPage/src/Components/NotesMain.tsx b/StatusPage/src/Components/NotesMain.tsx
index bbcb141b43..2f1c8d36f5 100755
--- a/StatusPage/src/Components/NotesMain.tsx
+++ b/StatusPage/src/Components/NotesMain.tsx
@@ -61,13 +61,9 @@ class NotesMain extends Component<ComponentProps> {
     }
 
     componentDidUpdate(prevProps: $TSFixMe) {
-
         if (prevProps.statusPage !== this.props.statusPage) {
-
             if (this.props.individualnote) {
-
                 this.props.getStatusPageIndividualNote(
-
                     this.props.projectId,
 
                     this.props.individualnote._id,
@@ -82,11 +78,9 @@ class NotesMain extends Component<ComponentProps> {
     }
 
     getAll = () => {
-
         this.props.showIncidentCard(true);
 
         this.props.getStatusPageNote(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -95,9 +89,7 @@ class NotesMain extends Component<ComponentProps> {
     };
 
     more = () => {
-
         this.props.getMoreNote(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -106,7 +98,6 @@ class NotesMain extends Component<ComponentProps> {
         );
 
         this.props.fetchLastIncidentTimelines(
-
             this.props.projectId,
 
             this.props.statusPageSlug
@@ -114,7 +105,6 @@ class NotesMain extends Component<ComponentProps> {
     };
 
     subscribebutton = () => {
-
         this.props.openSubscribeMenu();
     };
 
@@ -135,7 +125,6 @@ class NotesMain extends Component<ComponentProps> {
             if (incident.resolved) {
                 timelineStatus = (
                     <Badge backgroundColor={'#fff'} fontColor={'#49c3b1'}>
-
                         <Translate>Resolved</Translate>
                     </Badge>
                 );
@@ -155,7 +144,6 @@ class NotesMain extends Component<ComponentProps> {
                                 : 'rgb(250, 109, 70)'
                         }
                     >
-
                         <Translate>Acknowledged</Translate>
                     </Badge>
                 );
@@ -174,21 +162,17 @@ class NotesMain extends Component<ComponentProps> {
                                 : 'rgb(250, 109, 70)'
                         }
                     >
-
                         <Translate>Active Incident</Translate>
                     </Badge>
                 );
             }
 
             if (
-
                 !incidentTimeline.incident_state &&
-
                 incidentTimeline.status === 'investigation notes deleted'
             ) {
                 timelineStatus = (
                     <Badge backgroundColor={'#fff'} fontColor={'#49c3b1'}>
-
                         <Translate>Deleted a note</Translate>
                     </Badge>
                 );
@@ -197,7 +181,6 @@ class NotesMain extends Component<ComponentProps> {
             if (incidentTimeline.incident_state) {
                 timelineStatus = (
                     <Badge backgroundColor={'#fff'} fontColor={'#49c3b1'}>
-
                         {capitalize(incidentTimeline.incident_state)}
                     </Badge>
                 );
@@ -219,7 +202,6 @@ class NotesMain extends Component<ComponentProps> {
         const subheading: $TSFixMe = {};
 
         if (this.props.statusPage) {
-
             const colors: $TSFixMe = this.props.statusPage.colors;
             contentBackground = {
                 background: `rgba(${colors.statusPageBackground.r}, ${colors.statusPageBackground.g}, ${colors.statusPageBackground.b}, ${colors.statusPageBackground.a})`,
@@ -246,17 +228,12 @@ class NotesMain extends Component<ComponentProps> {
             };
         }
         if (
-
             this.props.noteData &&
-
             this.props.noteData.notes &&
-
             this.props.lastIncidentTimelines
         ) {
-
             note = (
                 <Notes
-
                     notes={this.props.noteData.notes}
                     secondaryTextColor={secondaryTextColor}
                     primaryTextColor={primaryTextColor}
@@ -264,11 +241,8 @@ class NotesMain extends Component<ComponentProps> {
                     uptimeColor={uptimeColor}
                     degradedColor={degradedColor}
                     noteBackgroundColor={noteBackgroundColor}
-
                     statusPageId={this.props.statusPageId}
-
                     incidentTimelines={this.props.lastIncidentTimelines}
-
                     statusPageSlug={this.props.statusPageSlug}
                 />
             );
@@ -278,7 +252,6 @@ class NotesMain extends Component<ComponentProps> {
             smsNotification,
             webhookNotification,
             emailNotification,
-
         } = this.props.statusPage;
         const showSubscriberOption: $TSFixMe =
             enableRSSFeed ||
@@ -294,7 +267,6 @@ class NotesMain extends Component<ComponentProps> {
             for (const item of items) {
                 const date: $TSFixMe = String(item.createdAt).slice(0, 10);
 
-
                 if (!track[date]) {
                     item.style = true;
 
@@ -309,25 +281,18 @@ class NotesMain extends Component<ComponentProps> {
             return result;
         };
 
-
         const incidentNoteData: $TSFixMe = this.props.noteData;
         if (
-
             this.props.theme === 'Clean Theme' &&
-
             this.props.noteData.notes.length > countNum &&
-
             !this.props.noteData.notes[1].idNumber &&
-
             !this.props.noteData.notes[1].style
         ) {
-
             this.props.noteData.notes.splice(1, 1);
 
             incidentNoteData.notes = this.props.noteData.notes;
         }
 
-
         if (this.props.theme === 'Clean Theme') {
             return incidentNoteData && incidentNoteData.requesting ? (
                 <div>
@@ -361,7 +326,7 @@ class NotesMain extends Component<ComponentProps> {
                             className="incident-object"
                             style={
                                 noteBackgroundColor.background ===
-                                    'rgba(247, 247, 247, 1)'
+                                'rgba(247, 247, 247, 1)'
                                     ? { background: 'rgba(255,255,255,1)' }
                                     : noteBackgroundColor
                             }
@@ -394,13 +359,11 @@ class NotesMain extends Component<ComponentProps> {
                                     <div
                                         className="list_k"
                                         style={{ cursor: 'pointer' }}
-                                        onClick={() =>
-
-                                            this.props.history.push(
-
+                                        onClick={() => {
+                                            return this.props.history.push(
                                                 `/StatusPage/${this.props.statusPageSlug}/incident/${note.slug}`
-                                            )
-                                        }
+                                            );
+                                        }}
                                     >
                                         <b>{note.title}</b>
                                     </div>
@@ -426,60 +389,72 @@ class NotesMain extends Component<ComponentProps> {
                                     </div>
                                     {note.message &&
                                         note.message
-                                            .sort((a: $TSFixMe, b: $TSFixMe) => {
-                                                (a = moment(a.createdAt)),
-                                                    (b = moment(b.createdAt));
-                                                // order in ascending order
-                                                if (b.diff(a) > 0) {
-                                                    return -1;
-                                                } else if (b.diff(a) < 0) {
-                                                    return 1;
-                                                } else {
+                                            .sort(
+                                                (a: $TSFixMe, b: $TSFixMe) => {
+                                                    (a = moment(a.createdAt)),
+                                                        (b = moment(
+                                                            b.createdAt
+                                                        ));
+                                                    // order in ascending order
+                                                    if (b.diff(a) > 0) {
+                                                        return -1;
+                                                    } else if (b.diff(a) < 0) {
+                                                        return 1;
+                                                    }
                                                     return 0;
                                                 }
-                                            })
-                                            .map((message: $TSFixMe) => <div key={message._id}>
-                                                <div
-                                                    className="incident_desc"
-                                                    style={{
-                                                        marginBottom: 5,
-                                                        whiteSpace:
-                                                            'pre-wrap',
-                                                    }}
-                                                    key={message._id}
-                                                >
-                                                    <b>
-                                                        {
-                                                            message.incident_state
-                                                        }
-                                                    </b>{' '}
-                                                    {message.content
-                                                        .split('\n')
-                                                        .map(
-                                                            (
-                                                                elem: $TSFixMe,
-                                                                index: $TSFixMe
-                                                            ) => (
-                                                                <Markdown
-                                                                    key={`${elem}-${index}`}
-                                                                    options={{
-                                                                        forceBlock: true,
-                                                                    }}
-                                                                    id={`note-${i}`}
-                                                                >
-                                                                    {elem}
-                                                                </Markdown>
-                                                            )
-                                                        )}
-                                                </div>
-                                                <div className="incident-date">
-                                                    <span>
-                                                        {moment(
-                                                            message.createdAt
-                                                        ).format('LLL')}
-                                                    </span>
-                                                </div>
-                                            </div>)}
+                                            )
+                                            .map((message: $TSFixMe) => {
+                                                return (
+                                                    <div key={message._id}>
+                                                        <div
+                                                            className="incident_desc"
+                                                            style={{
+                                                                marginBottom: 5,
+                                                                whiteSpace:
+                                                                    'pre-wrap',
+                                                            }}
+                                                            key={message._id}
+                                                        >
+                                                            <b>
+                                                                {
+                                                                    message.incident_state
+                                                                }
+                                                            </b>{' '}
+                                                            {message.content
+                                                                .split('\n')
+                                                                .map(
+                                                                    (
+                                                                        elem: $TSFixMe,
+                                                                        index: $TSFixMe
+                                                                    ) => {
+                                                                        return (
+                                                                            <Markdown
+                                                                                key={`${elem}-${index}`}
+                                                                                options={{
+                                                                                    forceBlock:
+                                                                                        true,
+                                                                                }}
+                                                                                id={`note-${i}`}
+                                                                            >
+                                                                                {
+                                                                                    elem
+                                                                                }
+                                                                            </Markdown>
+                                                                        );
+                                                                    }
+                                                                )}
+                                                        </div>
+                                                        <div className="incident-date">
+                                                            <span>
+                                                                {moment(
+                                                                    message.createdAt
+                                                                ).format('LLL')}
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                );
+                                            })}
                                 </span>
                             ) : (
                                 <div
@@ -499,24 +474,19 @@ class NotesMain extends Component<ComponentProps> {
                 <div className="no_monitor">
                     <ShouldRender
                         if={
-
                             this.props.individualnote &&
-
                             this.props.individualnote
                         }
                     >
                         <div className="date-big bs-color-b">
                             {moment(
-
                                 this.props.individualnote &&
-
-                                this.props.individualnote.date
+                                    this.props.individualnote.date
                             ).format('LL')}
                         </div>
                     </ShouldRender>
 
                     {typeof this.props.notesmessage === 'string' ? (
-
                         this.props.notesmessage
                     ) : (
                         <div>
@@ -525,369 +495,306 @@ class NotesMain extends Component<ComponentProps> {
                     )}
                 </div>
             );
-        } else {
+        }
 
-            if (this.props.noteData && this.props.noteData.requesting) {
-                return (
-                    <div
-                        className="twitter-feed white box"
-                        style={{ overflow: 'visible', ...contentBackground }}
-                    >
-                        <div
-                            className="messages"
-                            style={{ position: 'relative' }}
-                        >
-                            <ShouldRender
-                                if={
-
-                                    this.props.noteData &&
-
-                                    !this.props.noteData.error
-                                }
-                            >
-                                <div
-                                    className="box-inner"
-                                    style={{
-                                        paddingLeft: 0,
-                                        paddingRight: 0,
-                                        width: '100%',
-                                    }}
-                                >
-                                    <div className="feed-header">
-                                        <ShouldRender
-
-                                            if={!this.props.individualnote}
-                                        >
-                                            <span
-                                                className="feed-title"
-                                                style={subheading}
-                                            >
-                                                <Translate>Incidents</Translate>
-                                            </span>
-                                        </ShouldRender>
-                                        <ShouldRender
-
-                                            if={this.props.individualnote}
-                                        >
-                                            <span
-                                                className="feed-title"
-                                                style={primaryTextColor}
-                                            >
-                                                Incidents for{' '}
-
-                                                {this.props.individualnote
-
-                                                    ? this.props.individualnote
-                                                        .name
-                                                    : ''}{' '}
-                                                on{' '}
-
-                                                {this.props.individualnote
-                                                    ? moment(
-                                                        this.props
-
-                                                            .individualnote
-                                                            .date
-                                                    ).format('LL')
-                                                    : ''}
-                                            </span>
-                                        </ShouldRender>
-                                    </div>
-                                    <ShouldRender
-                                        if={
-
-                                            this.props.noteData &&
-
-                                            this.props.noteData.requesting
-                                        }
-                                    >
-                                        <div
-                                            className="ball-beat"
-                                            id="notes-loader"
-                                            style={{ marginBottom: 0 }}
-                                        >
-                                            <div
-                                                style={{
-                                                    height: '12px',
-                                                    width: '12px',
-                                                }}
-                                            ></div>
-                                            <div
-                                                style={{
-                                                    height: '12px',
-                                                    width: '12px',
-                                                }}
-                                            ></div>
-                                            <div
-                                                style={{
-                                                    height: '12px',
-                                                    width: '12px',
-                                                }}
-                                            ></div>
-                                        </div>
-                                    </ShouldRender>
-                                </div>
-                            </ShouldRender>
-                        </div>
-                    </div>
-                );
-            }
-
-
-            return this.props.noteData ||
-
-                this.props.individualnote ||
-
-                this.props.showIncidentCardState ? (
+        if (this.props.noteData && this.props.noteData.requesting) {
+            return (
                 <div
                     className="twitter-feed white box"
-                    style={{
-                        overflow: 'visible',
-                        marginBottom: 40,
-                        ...contentBackground,
-                    }}
-                    id="incidentCard"
+                    style={{ overflow: 'visible', ...contentBackground }}
                 >
                     <div className="messages" style={{ position: 'relative' }}>
-                        <div
-                            className="box-inner"
-                            style={{
-                                paddingLeft: 0,
-                                paddingRight: 0,
-                                width: '100%',
-                            }}
+                        <ShouldRender
+                            if={
+                                this.props.noteData &&
+                                !this.props.noteData.error
+                            }
                         >
-                            <div className="feed-header">
-
-                                <ShouldRender if={!this.props.individualnote}>
-                                    <span
-                                        className="feed-title"
-                                        style={subheading}
-                                    >
-                                        <Translate>Incidents</Translate>
-                                    </span>
-                                </ShouldRender>
-
-                                <ShouldRender if={this.props.individualnote}>
-                                    <span
-                                        className="feed-title"
-                                        style={primaryTextColor}
-                                    >
-                                        Incidents for{' '}
-
-                                        {this.props.individualnote
-
-                                            ? this.props.individualnote.name
-                                            : ''}{' '}
-                                        on{' '}
-
-                                        {this.props.individualnote
-                                            ? moment(
-
-                                                this.props.individualnote.date
-                                            ).format('LL')
-                                            : ''}
-                                    </span>
-                                </ShouldRender>
-                                <ShouldRender
-                                    if={
-
-                                        this.props.isSubscriberEnabled ===
-                                        true && showSubscriberOption
-                                    }
-                                >
-                                    <button
-                                        className="bs-Button-subscribe"
-                                        type="submit"
-                                        onClick={() => this.subscribebutton()}
-                                    >
-                                        <span>
-                                            <Translate>Subscribe</Translate>
-                                        </span>
-                                    </button>
-                                </ShouldRender>
-                            </div>
-                            <ShouldRender
-                                if={
-
-                                    this.props.subscribed &&
-                                    showSubscriberOption
-                                }
+                            <div
+                                className="box-inner"
+                                style={{
+                                    paddingLeft: 0,
+                                    paddingRight: 0,
+                                    width: '100%',
+                                }}
                             >
-                                <SubscribeBox />
-                            </ShouldRender>
-                            <ShouldRender
-                                if={
-
-                                    this.props.noteData &&
-
-                                    !this.props.noteData.requesting &&
-
-                                    this.props.noteData.notes &&
-
-                                    this.props.noteData.notes.length
-                                }
-                            >
-                                <ul className="feed-contents plain">{note}</ul>
-                            </ShouldRender>
-
-                            <ShouldRender
-                                if={
-
-                                    (this.props.noteData &&
-
-                                        !this.props.noteData.requesting &&
-
-                                        this.props.noteData.notes &&
-
-                                        !this.props.noteData.notes.length) ||
-
-                                    (this.props.showIncidentCardState &&
-
-                                        !this.props.noteData.notes.length)
-                                }
-                            >
-                                <ul className="feed-contents plain">
-                                    <li
-                                        className="feed-item clearfix"
-                                        style={{
-                                            minHeight: '5px',
-                                            marginBottom: '10px',
-                                            display: 'flex',
-                                            flexDirection: 'row',
-                                            flexWrap: 'nowrap',
-                                            justifyContent: 'center',
-                                        }}
+                                <div className="feed-header">
+                                    <ShouldRender
+                                        if={!this.props.individualnote}
                                     >
                                         <span
-                                            className="time"
-                                            style={{
-                                                fontSize: '0.8em',
-                                                marginLeft: '0px',
-                                                ...secondaryTextColor,
-                                            }}
+                                            className="feed-title"
+                                            style={subheading}
                                         >
-
-                                            {this.props.notesmessage ? (
-
-                                                this.props.notesmessage
-                                            ) : (
-                                                <Translate>
-                                                    No incidents yet
-                                                </Translate>
-                                            )}
-                                            .
+                                            <Translate>Incidents</Translate>
                                         </span>
-                                    </li>
-                                </ul>
-                            </ShouldRender>
-                        </div>
-
-                        <ShouldRender
-                            if={
-
-                                this.props.noteData &&
-
-                                this.props.noteData.notes &&
-
-                                this.props.noteData.notes.length &&
-
-                                this.props.count > this.props.skip + 5 &&
-
-                                !this.props.noteData.requesting &&
-
-                                !this.props.requestingmore &&
-
-                                !this.props.noteData.error &&
-
-                                !this.props.individualnote &&
-
-                                !this.props.fetchingIncidentTimelines
-                            }
-                        >
-                            <button
-                                className="more button-as-anchor anchor-centered"
-                                onClick={() => this.more()}
-                            >
-                                <Translate>More</Translate>
-                            </button>
-                        </ShouldRender>
-
-                        <div
-                            style={{
-                                display: 'flex',
-                                justifyContent: 'center',
-                                alignItems: 'center',
-                            }}
-                        >
-                            <ShouldRender
-                                if={
-
-                                    this.props.noteData &&
-
-                                    !this.props.noteData.error &&
-
-                                    !this.props.noteData.requesting &&
-
-                                    this.props.individualnote
-                                }
-                            >
-                                <button
-                                    className="all__btn"
-                                    onClick={() => this.getAll()}
+                                    </ShouldRender>
+                                    <ShouldRender
+                                        if={this.props.individualnote}
+                                    >
+                                        <span
+                                            className="feed-title"
+                                            style={primaryTextColor}
+                                        >
+                                            Incidents for{' '}
+                                            {this.props.individualnote
+                                                ? this.props.individualnote.name
+                                                : ''}{' '}
+                                            on{' '}
+                                            {this.props.individualnote
+                                                ? moment(
+                                                      this.props.individualnote
+                                                          .date
+                                                  ).format('LL')
+                                                : ''}
+                                        </span>
+                                    </ShouldRender>
+                                </div>
+                                <ShouldRender
+                                    if={
+                                        this.props.noteData &&
+                                        this.props.noteData.requesting
+                                    }
                                 >
-                                    <Translate>All Incidents</Translate>
-                                </button>
-                            </ShouldRender>
-                        </div>
-
-                        <ShouldRender
-                            if={
-
-                                this.props.noteData &&
-
-                                this.props.noteData.requesting
-                            }
-                        >
-                            <div className="ball-beat" id="notes-loader">
-                                <div
-                                    style={{ height: '12px', width: '12px' }}
-                                ></div>
-                                <div
-                                    style={{ height: '12px', width: '12px' }}
-                                ></div>
-                                <div
-                                    style={{ height: '12px', width: '12px' }}
-                                ></div>
-                            </div>
-                        </ShouldRender>
-
-                        <ShouldRender
-                            if={
-
-                                this.props.noteData && this.props.requestingmore
-                            }
-                        >
-                            <div className="ball-beat" id="more-loader">
-                                <div
-                                    style={{ height: '8px', width: '8px' }}
-                                ></div>
-                                <div
-                                    style={{ height: '8px', width: '8px' }}
-                                ></div>
-                                <div
-                                    style={{ height: '8px', width: '8px' }}
-                                ></div>
+                                    <div
+                                        className="ball-beat"
+                                        id="notes-loader"
+                                        style={{ marginBottom: 0 }}
+                                    >
+                                        <div
+                                            style={{
+                                                height: '12px',
+                                                width: '12px',
+                                            }}
+                                        ></div>
+                                        <div
+                                            style={{
+                                                height: '12px',
+                                                width: '12px',
+                                            }}
+                                        ></div>
+                                        <div
+                                            style={{
+                                                height: '12px',
+                                                width: '12px',
+                                            }}
+                                        ></div>
+                                    </div>
+                                </ShouldRender>
                             </div>
                         </ShouldRender>
                     </div>
                 </div>
-            ) : null;
+            );
         }
+
+        return this.props.noteData ||
+            this.props.individualnote ||
+            this.props.showIncidentCardState ? (
+            <div
+                className="twitter-feed white box"
+                style={{
+                    overflow: 'visible',
+                    marginBottom: 40,
+                    ...contentBackground,
+                }}
+                id="incidentCard"
+            >
+                <div className="messages" style={{ position: 'relative' }}>
+                    <div
+                        className="box-inner"
+                        style={{
+                            paddingLeft: 0,
+                            paddingRight: 0,
+                            width: '100%',
+                        }}
+                    >
+                        <div className="feed-header">
+                            <ShouldRender if={!this.props.individualnote}>
+                                <span className="feed-title" style={subheading}>
+                                    <Translate>Incidents</Translate>
+                                </span>
+                            </ShouldRender>
+
+                            <ShouldRender if={this.props.individualnote}>
+                                <span
+                                    className="feed-title"
+                                    style={primaryTextColor}
+                                >
+                                    Incidents for{' '}
+                                    {this.props.individualnote
+                                        ? this.props.individualnote.name
+                                        : ''}{' '}
+                                    on{' '}
+                                    {this.props.individualnote
+                                        ? moment(
+                                              this.props.individualnote.date
+                                          ).format('LL')
+                                        : ''}
+                                </span>
+                            </ShouldRender>
+                            <ShouldRender
+                                if={
+                                    this.props.isSubscriberEnabled === true &&
+                                    showSubscriberOption
+                                }
+                            >
+                                <button
+                                    className="bs-Button-subscribe"
+                                    type="submit"
+                                    onClick={() => {
+                                        return this.subscribebutton();
+                                    }}
+                                >
+                                    <span>
+                                        <Translate>Subscribe</Translate>
+                                    </span>
+                                </button>
+                            </ShouldRender>
+                        </div>
+                        <ShouldRender
+                            if={this.props.subscribed && showSubscriberOption}
+                        >
+                            <SubscribeBox />
+                        </ShouldRender>
+                        <ShouldRender
+                            if={
+                                this.props.noteData &&
+                                !this.props.noteData.requesting &&
+                                this.props.noteData.notes &&
+                                this.props.noteData.notes.length
+                            }
+                        >
+                            <ul className="feed-contents plain">{note}</ul>
+                        </ShouldRender>
+
+                        <ShouldRender
+                            if={
+                                (this.props.noteData &&
+                                    !this.props.noteData.requesting &&
+                                    this.props.noteData.notes &&
+                                    !this.props.noteData.notes.length) ||
+                                (this.props.showIncidentCardState &&
+                                    !this.props.noteData.notes.length)
+                            }
+                        >
+                            <ul className="feed-contents plain">
+                                <li
+                                    className="feed-item clearfix"
+                                    style={{
+                                        minHeight: '5px',
+                                        marginBottom: '10px',
+                                        display: 'flex',
+                                        flexDirection: 'row',
+                                        flexWrap: 'nowrap',
+                                        justifyContent: 'center',
+                                    }}
+                                >
+                                    <span
+                                        className="time"
+                                        style={{
+                                            fontSize: '0.8em',
+                                            marginLeft: '0px',
+                                            ...secondaryTextColor,
+                                        }}
+                                    >
+                                        {this.props.notesmessage ? (
+                                            this.props.notesmessage
+                                        ) : (
+                                            <Translate>
+                                                No incidents yet
+                                            </Translate>
+                                        )}
+                                        .
+                                    </span>
+                                </li>
+                            </ul>
+                        </ShouldRender>
+                    </div>
+
+                    <ShouldRender
+                        if={
+                            this.props.noteData &&
+                            this.props.noteData.notes &&
+                            this.props.noteData.notes.length &&
+                            this.props.count > this.props.skip + 5 &&
+                            !this.props.noteData.requesting &&
+                            !this.props.requestingmore &&
+                            !this.props.noteData.error &&
+                            !this.props.individualnote &&
+                            !this.props.fetchingIncidentTimelines
+                        }
+                    >
+                        <button
+                            className="more button-as-anchor anchor-centered"
+                            onClick={() => {
+                                return this.more();
+                            }}
+                        >
+                            <Translate>More</Translate>
+                        </button>
+                    </ShouldRender>
+
+                    <div
+                        style={{
+                            display: 'flex',
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                        }}
+                    >
+                        <ShouldRender
+                            if={
+                                this.props.noteData &&
+                                !this.props.noteData.error &&
+                                !this.props.noteData.requesting &&
+                                this.props.individualnote
+                            }
+                        >
+                            <button
+                                className="all__btn"
+                                onClick={() => {
+                                    return this.getAll();
+                                }}
+                            >
+                                <Translate>All Incidents</Translate>
+                            </button>
+                        </ShouldRender>
+                    </div>
+
+                    <ShouldRender
+                        if={
+                            this.props.noteData &&
+                            this.props.noteData.requesting
+                        }
+                    >
+                        <div className="ball-beat" id="notes-loader">
+                            <div
+                                style={{ height: '12px', width: '12px' }}
+                            ></div>
+                            <div
+                                style={{ height: '12px', width: '12px' }}
+                            ></div>
+                            <div
+                                style={{ height: '12px', width: '12px' }}
+                            ></div>
+                        </div>
+                    </ShouldRender>
+
+                    <ShouldRender
+                        if={this.props.noteData && this.props.requestingmore}
+                    >
+                        <div className="ball-beat" id="more-loader">
+                            <div style={{ height: '8px', width: '8px' }}></div>
+                            <div style={{ height: '8px', width: '8px' }}></div>
+                            <div style={{ height: '8px', width: '8px' }}></div>
+                        </div>
+                    </ShouldRender>
+                </div>
+            </div>
+        ) : null;
     }
 }
 
-
 NotesMain.displayName = 'NotesMain';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -924,18 +831,19 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        getStatusPageNote,
-        getStatusPageIndividualNote,
-        getMoreNote,
-        openSubscribeMenu,
-        fetchLastIncidentTimelines,
-        showIncidentCard,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            getStatusPageNote,
+            getStatusPageIndividualNote,
+            getMoreNote,
+            openSubscribeMenu,
+            fetchLastIncidentTimelines,
+            showIncidentCard,
+        },
+        dispatch
+    );
+};
 
 NotesMain.propTypes = {
     noteData: PropTypes.object,
diff --git a/StatusPage/src/Components/OngoingSchedule.tsx b/StatusPage/src/Components/OngoingSchedule.tsx
index ee966dd9f7..c6b7dcbe45 100644
--- a/StatusPage/src/Components/OngoingSchedule.tsx
+++ b/StatusPage/src/Components/OngoingSchedule.tsx
@@ -14,125 +14,117 @@ interface OngoingScheduleProps {
 
 class OngoingSchedule extends Component<ComponentProps> {
     override render() {
-        return <>
-
-            {
-                this.props.ongoing &&
-
-                this.props.ongoing.length > 0 &&
-
-                this.props.statusData &&
-
-                this.props.statusData._id &&
-
-                this.props.ongoing.map(
-                    (event: $TSFixMe) => !event.cancelled && (
-                        <div
-                            className="content"
-                            style={{
-                                margin: '10px 0px 40px 0px',
-                                cursor: 'pointer',
-                            }}
-                            key={event._id}
-                            onClick={() => {
-
-                                this.props.history.push(
-
-                                    `/StatusPage/${this.props.statusData.slug}/scheduledEvent/${event.slug}`
-                                );
-                            }}
-                        >
-                            <div
-                                className="ongoing__schedulebox"
-                                style={{ padding: 0 }}
-                            >
+        return (
+            <>
+                {this.props.ongoing &&
+                    this.props.ongoing.length > 0 &&
+                    this.props.statusData &&
+                    this.props.statusData._id &&
+                    this.props.ongoing.map((event: $TSFixMe) => {
+                        return (
+                            !event.cancelled && (
                                 <div
-                                    className="content box"
+                                    className="content"
                                     style={{
+                                        margin: '10px 0px 40px 0px',
                                         cursor: 'pointer',
                                     }}
                                     key={event._id}
+                                    onClick={() => {
+                                        this.props.history.push(
+                                            `/StatusPage/${this.props.statusData.slug}/scheduledEvent/${event.slug}`
+                                        );
+                                    }}
                                 >
                                     <div
-                                        className="ongoing__schedulebox content box box__yellow--dark"
-                                        style={{
-                                            padding: '30px',
-                                            boxShadow:
-                                                '0 7px 14px 0 rgb(50 50 93 / 10%)',
-                                        }}
+                                        className="ongoing__schedulebox"
+                                        style={{ padding: 0 }}
                                     >
                                         <div
+                                            className="content box"
                                             style={{
-                                                textTransform:
-                                                    'uppercase',
-                                                fontSize: 11,
-                                                fontWeight: 900,
+                                                cursor: 'pointer',
                                             }}
-                                            id="ongoing-event"
+                                            key={event._id}
                                         >
-                                            <Translate>
-                                                Ongoing Scheduled Event
-                                            </Translate>
-                                        </div>
-                                        <div className="ongoing__scheduleitem">
-                                            <span
-                                                id={`event-name-${event.name}`}
+                                            <div
+                                                className="ongoing__schedulebox content box box__yellow--dark"
+                                                style={{
+                                                    padding: '30px',
+                                                    boxShadow:
+                                                        '0 7px 14px 0 rgb(50 50 93 / 10%)',
+                                                }}
                                             >
-                                                {event.name}
-                                            </span>
-                                            <span
-                                                id={`event-description-${event.description}`}
-                                            >
-                                                {event.description}
-                                            </span>
-                                        </div>
-                                        <div className="ongoing__affectedmonitor">
-                                            <AffectedResources
-                                                event={event}
-                                                monitorState={
-                                                    this.props
+                                                <div
+                                                    style={{
+                                                        textTransform:
+                                                            'uppercase',
+                                                        fontSize: 11,
+                                                        fontWeight: 900,
+                                                    }}
+                                                    id="ongoing-event"
+                                                >
+                                                    <Translate>
+                                                        Ongoing Scheduled Event
+                                                    </Translate>
+                                                </div>
+                                                <div className="ongoing__scheduleitem">
+                                                    <span
+                                                        id={`event-name-${event.name}`}
+                                                    >
+                                                        {event.name}
+                                                    </span>
+                                                    <span
+                                                        id={`event-description-${event.description}`}
+                                                    >
+                                                        {event.description}
+                                                    </span>
+                                                </div>
+                                                <div className="ongoing__affectedmonitor">
+                                                    <AffectedResources
+                                                        event={event}
+                                                        monitorState={
+                                                            this.props
+                                                                .monitorState
+                                                        }
+                                                    />
+                                                </div>
 
-                                                        .monitorState
-                                                }
-                                            />
+                                                <span
+                                                    style={{
+                                                        display: 'inline-block',
+                                                        fontSize: 12,
+                                                        marginTop: 5,
+                                                    }}
+                                                    id="event-date"
+                                                >
+                                                    {moment(
+                                                        event.startDate
+                                                    ).format(
+                                                        'MMMM Do YYYY, h:mm a'
+                                                    )}
+                                                    &nbsp;&nbsp;-&nbsp;&nbsp;
+                                                    {moment(
+                                                        event.endDate
+                                                    ).format(
+                                                        'MMMM Do YYYY, h:mm a'
+                                                    )}
+                                                </span>
+                                                <span className="sp__icon sp__icon--more"></span>
+                                            </div>
                                         </div>
-
-                                        <span
-                                            style={{
-                                                display: 'inline-block',
-                                                fontSize: 12,
-                                                marginTop: 5,
-                                            }}
-                                            id="event-date"
-                                        >
-                                            {moment(
-                                                event.startDate
-                                            ).format(
-                                                'MMMM Do YYYY, h:mm a'
-                                            )}
-                                            &nbsp;&nbsp;-&nbsp;&nbsp;
-                                            {moment(
-                                                event.endDate
-                                            ).format(
-                                                'MMMM Do YYYY, h:mm a'
-                                            )}
-                                        </span>
-                                        <span className="sp__icon sp__icon--more"></span>
                                     </div>
                                 </div>
-                            </div>
-                        </div>
-                    )
-                )
-            }
-        </>;
+                            )
+                        );
+                    })}
+            </>
+        );
     }
 }
 
-
 OngoingSchedule.displayName = 'OngoingSchedule';
 
-
 OngoingSchedule.propTypes = {
     monitorState: PropTypes.array,
     statusData: PropTypes.object,
diff --git a/StatusPage/src/Components/PastEvent.tsx b/StatusPage/src/Components/PastEvent.tsx
index e4a3fa76cd..5b14ae0b9e 100644
--- a/StatusPage/src/Components/PastEvent.tsx
+++ b/StatusPage/src/Components/PastEvent.tsx
@@ -39,11 +39,9 @@ class PastEvent extends Component<ComponentProps> {
     }
 
     getAll = () => {
-
         this.props.showEventCard(true);
 
         this.props.fetchPastEvents(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -52,9 +50,7 @@ class PastEvent extends Component<ComponentProps> {
     };
 
     more = () => {
-
         this.props.fetchMorePastEvents(
-
             this.props.projectId,
 
             this.props.statusPageSlug,
@@ -72,7 +68,6 @@ class PastEvent extends Component<ComponentProps> {
         const subheading: $TSFixMe = {};
 
         if (this.props.statusPage) {
-
             const colors: $TSFixMe = this.props.statusPage.colors;
             contentBackground = {
                 background: `rgba(${colors.statusPageBackground.r}, ${colors.statusPageBackground.g}, ${colors.statusPageBackground.b}, ${colors.statusPageBackground.a})`,
@@ -91,55 +86,39 @@ class PastEvent extends Component<ComponentProps> {
         }
 
         if (this.props.pastEvents && this.props.pastEvents.events) {
-
             event = (
                 <Events
-
                     events={this.props.pastEvents.events}
                     secondaryTextColor={secondaryTextColor}
                     primaryTextColor={primaryTextColor}
                     noteBackgroundColor={noteBackgroundColor}
-
                     statusPageId={this.props.statusPageId}
-
                     statusPageSlug={this.props.statusPageSlug}
-
                     monitorState={this.props.monitorState}
                 />
             );
         }
 
         if (
-
             this.props.individualEvents.show &&
-
             this.props.individualEvents.events
         ) {
-
             event = (
                 <Events
-
                     events={this.props.individualEvents.events}
                     secondaryTextColor={secondaryTextColor}
                     primaryTextColor={primaryTextColor}
                     noteBackgroundColor={noteBackgroundColor}
-
                     statusPageId={this.props.statusPageId}
-
                     statusPageSlug={this.props.statusPageSlug}
-
                     monitorState={this.props.monitorState}
                 />
             );
         }
 
-
         return (!this.props.individualEvents.show &&
-
             this.props.pastEvents.events.length > 0) ||
-
             this.props.individualEvents.show ||
-
             this.props.showEventCardState ? (
             <div
                 id="scheduledEvents"
@@ -149,9 +128,7 @@ class PastEvent extends Component<ComponentProps> {
                 <div className="messages" style={{ position: 'relative' }}>
                     <ShouldRender
                         if={
-
                             this.props.pastEvents &&
-
                             !this.props.pastEvents.error
                         }
                     >
@@ -165,7 +142,6 @@ class PastEvent extends Component<ComponentProps> {
                         >
                             <div className="feed-header">
                                 <ShouldRender
-
                                     if={!this.props.individualEvents.show}
                                 >
                                     <span
@@ -178,7 +154,6 @@ class PastEvent extends Component<ComponentProps> {
                                     </span>
                                 </ShouldRender>
                                 <ShouldRender
-
                                     if={this.props.individualEvents.show}
                                 >
                                     <span
@@ -187,21 +162,17 @@ class PastEvent extends Component<ComponentProps> {
                                     >
                                         <Translate>
                                             Scheduled Events for{' '}
-
                                             {this.props.individualEvents
                                                 .monitorName
-
                                                 ? this.props.individualEvents
-                                                    .monitorName
+                                                      .monitorName
                                                 : ''}{' '}
                                             on{' '}
-
                                             {this.props.individualEvents.date
                                                 ? moment(
-                                                    this.props
-
-                                                        .individualEvents.date
-                                                ).format('LL')
+                                                      this.props
+                                                          .individualEvents.date
+                                                  ).format('LL')
                                                 : ''}
                                         </Translate>
                                     </span>
@@ -209,14 +180,10 @@ class PastEvent extends Component<ComponentProps> {
                             </div>
                             <ShouldRender
                                 if={
-
                                     (!this.props.individualEvents.show &&
-
                                         this.props.pastEvents.events.length >
-                                        0) ||
-
+                                            0) ||
                                     (this.props.individualEvents.show &&
-
                                         this.props.individualEvents.events
                                             .length > 0)
                                 }
@@ -225,9 +192,7 @@ class PastEvent extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     this.props.individualEvents.show &&
-
                                     this.props.individualEvents.events
                                         .length === 0
                                 }
@@ -261,11 +226,8 @@ class PastEvent extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     this.props.showEventCardState &&
-
                                     this.props.pastEvents.events.length === 0 &&
-
                                     this.props.individualEvents.events
                                         .length === 0
                                 }
@@ -301,29 +263,22 @@ class PastEvent extends Component<ComponentProps> {
 
                         <ShouldRender
                             if={
-
                                 this.props.pastEvents &&
-
                                 this.props.pastEvents.events &&
-
                                 this.props.pastEvents.events.length &&
-
                                 this.props.count >
-
-                                this.props.pastEvents.events.length &&
-
+                                    this.props.pastEvents.events.length &&
                                 !this.props.pastEvents.requesting &&
-
                                 !this.props.requestingmoreevents &&
-
                                 !this.props.pastEvents.error &&
-
                                 !this.props.individualEvents.show
                             }
                         >
                             <button
                                 className="more button-as-anchor anchor-centered"
-                                onClick={() => this.more()}
+                                onClick={() => {
+                                    return this.more();
+                                }}
                             >
                                 <Translate>More</Translate>
                             </button>
@@ -338,19 +293,17 @@ class PastEvent extends Component<ComponentProps> {
                         >
                             <ShouldRender
                                 if={
-
                                     this.props.pastEvents &&
-
                                     !this.props.pastEvents.error &&
-
                                     !this.props.pastEvents.requesting &&
-
                                     this.props.individualEvents.show
                                 }
                             >
                                 <button
                                     className="all__btn"
-                                    onClick={() => this.getAll()}
+                                    onClick={() => {
+                                        return this.getAll();
+                                    }}
                                 >
                                     <Translate>All Scheduled Events</Translate>
                                 </button>
@@ -359,9 +312,7 @@ class PastEvent extends Component<ComponentProps> {
 
                         <ShouldRender
                             if={
-
                                 this.props.pastEvents.requesting ||
-
                                 this.props.requestingmoreevents
                             }
                         >
@@ -384,7 +335,6 @@ class PastEvent extends Component<ComponentProps> {
     }
 }
 
-
 PastEvent.displayName = 'PastEvent';
 
 const mapStateToProps: Function = (state: RootState) => {
@@ -415,15 +365,16 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        fetchMorePastEvents,
-        fetchPastEvents,
-        showEventCard,
-    },
-    dispatch
-);
-
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            fetchMorePastEvents,
+            fetchPastEvents,
+            showEventCard,
+        },
+        dispatch
+    );
+};
 
 PastEvent.propTypes = {
     fetchMorePastEvents: PropTypes.func,
diff --git a/StatusPage/src/Components/SelectLanguage.tsx b/StatusPage/src/Components/SelectLanguage.tsx
index c2cefe5fac..1fa5a15215 100644
--- a/StatusPage/src/Components/SelectLanguage.tsx
+++ b/StatusPage/src/Components/SelectLanguage.tsx
@@ -15,24 +15,22 @@ interface SelectLanguageProps {
 const SelectLanguage: Function = ({
     isShown,
     setIsShown,
-    theme
+    theme,
 }: SelectLanguageProps) => {
     const popupReff: $TSFixMe = useRef();
     const documentClickHandler: $TSFixMe = useRef();
 
     useEffect(() => {
-
         documentClickHandler.current = (e: $TSFixMe) => {
-
-            if (popupReff.current && popupReff.current.contains(e.target))
+            if (popupReff.current && popupReff.current.contains(e.target)) {
                 return;
+            }
             setIsShown(false);
             removeDocumentClickHandler();
         };
     }, []);
 
     const removeDocumentClickHandler: Function = () => {
-
         document.removeEventListener('click', documentClickHandler.current);
     };
 
@@ -49,7 +47,6 @@ const SelectLanguage: Function = ({
         >
             <ShouldRender if={isShown}>
                 <LanguageBox
-
                     theme={theme}
                     handleCloseButtonClick={handleCloseButtonClick}
                 />
@@ -65,5 +62,7 @@ SelectLanguage.propTypes = {
     theme: PropTypes.bool,
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ openLanguageMenu }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ openLanguageMenu }, dispatch);
+};
 export default connect(null, mapDispatchToProps)(SelectLanguage);
diff --git a/StatusPage/src/Components/SingleAnnouncement.tsx b/StatusPage/src/Components/SingleAnnouncement.tsx
index 86ac690dcd..135d6f74a4 100644
--- a/StatusPage/src/Components/SingleAnnouncement.tsx
+++ b/StatusPage/src/Components/SingleAnnouncement.tsx
@@ -19,9 +19,8 @@ interface SingleAnnouncementProps {
 }
 
 class SingleAnnouncement extends Component<ComponentProps> {
-    async override componentDidMount() {
+    override async componentDidMount() {
         const {
-
             match: {
                 params: { announcementSlug, statusPageSlug },
             },
@@ -30,14 +29,12 @@ class SingleAnnouncement extends Component<ComponentProps> {
         await this.props.getStatusPage(statusPageSlug, 'null');
 
         await this.props.getSingleAnnouncement(
-
             this.props.statusPage.projectId._id,
             statusPageSlug,
             announcementSlug
         );
     }
     override render() {
-
         const { announcement, monitorState }: $TSFixMe = this.props;
 
         return (
@@ -89,8 +86,7 @@ class SingleAnnouncement extends Component<ComponentProps> {
                                             <span
                                                 className="feed-title"
                                                 style={{
-                                                    color:
-                                                        'rgba(76, 76, 76, 0.8)',
+                                                    color: 'rgba(76, 76, 76, 0.8)',
                                                     fontWeight: 'bold',
                                                     marginBottom: 25,
                                                     textTransform: 'unset',
@@ -107,16 +103,24 @@ class SingleAnnouncement extends Component<ComponentProps> {
                                                 {announcement.description &&
                                                     announcement.description
                                                         .split('\n')
-                                                        .map((elem: $TSFixMe, index: $TSFixMe) => (
-                                                            <Markdown
-                                                                key={`${elem}-${index}`}
-                                                                options={{
-                                                                    forceBlock: true,
-                                                                }}
-                                                            >
-                                                                {elem}
-                                                            </Markdown>
-                                                        ))}
+                                                        .map(
+                                                            (
+                                                                elem: $TSFixMe,
+                                                                index: $TSFixMe
+                                                            ) => {
+                                                                return (
+                                                                    <Markdown
+                                                                        key={`${elem}-${index}`}
+                                                                        options={{
+                                                                            forceBlock:
+                                                                                true,
+                                                                        }}
+                                                                    >
+                                                                        {elem}
+                                                                    </Markdown>
+                                                                );
+                                                            }
+                                                        )}
                                             </span>
                                         </div>
                                         <ShouldRender
@@ -131,8 +135,7 @@ class SingleAnnouncement extends Component<ComponentProps> {
                                                 <span
                                                     className="ongoing__affectedmonitor--title"
                                                     style={{
-                                                        color:
-                                                            'rgba(76, 76, 76, 0.8)',
+                                                        color: 'rgba(76, 76, 76, 0.8)',
                                                     }}
                                                 >
                                                     <Translate>
@@ -142,8 +145,7 @@ class SingleAnnouncement extends Component<ComponentProps> {
                                                 <span
                                                     className="ongoing__affectedmonitor--content"
                                                     style={{
-                                                        color:
-                                                            'rgba(0, 0, 0, 0.5)',
+                                                        color: 'rgba(0, 0, 0, 0.5)',
                                                     }}
                                                 >
                                                     {handleResources(
@@ -164,10 +166,8 @@ class SingleAnnouncement extends Component<ComponentProps> {
     }
 }
 
-
 SingleAnnouncement.displayName = 'SingleAnnouncement';
 
-
 SingleAnnouncement.propTypes = {
     statusPage: PropTypes.object,
     getSingleAnnouncement: PropTypes.func,
@@ -185,6 +185,11 @@ const mapStateToProps: Function = (state: RootState) => {
     };
 };
 
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ getSingleAnnouncement, getStatusPage }, dispatch);
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { getSingleAnnouncement, getStatusPage },
+        dispatch
+    );
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(SingleAnnouncement);
diff --git a/StatusPage/src/Components/Subscribe/Call.tsx b/StatusPage/src/Components/Subscribe/Call.tsx
index 7392dcf04a..3c15276ae0 100755
--- a/StatusPage/src/Components/Subscribe/Call.tsx
+++ b/StatusPage/src/Components/Subscribe/Call.tsx
@@ -44,22 +44,19 @@ class Call extends Component<ComponentProps> {
         event.preventDefault();
 
         const projectId: $TSFixMe =
-
             this.props.statuspage &&
-
             this.props.statuspage.projectId &&
-
             this.props.statuspage.projectId._id;
 
         const statusPageId: $TSFixMe = this.props.statuspage._id;
 
-        const selectIndividualMonitors: $TSFixMe = this.props.statuspage
-            .selectIndividualMonitors;
-
+        const selectIndividualMonitors: $TSFixMe =
+            this.props.statuspage.selectIndividualMonitors;
 
         if (this.state.phone_number && this.state.phone_number.length) {
-
-            const validnumber: $TSFixMe = this.validation(this.state.phone_number);
+            const validnumber: $TSFixMe = this.validation(
+                this.state.phone_number
+            );
             if (validnumber) {
                 const values: $TSFixMe = this.state;
 
@@ -76,16 +73,13 @@ class Call extends Component<ComponentProps> {
                     );
                 }
 
-
                 this.props.userData(values);
             } else {
-
                 this.props.validationError(
                     'Please enter a valid phone number.'
                 );
             }
         } else {
-
             this.props.validationError('Please enter your phone number.');
         }
     };
@@ -93,9 +87,8 @@ class Call extends Component<ComponentProps> {
         const numbers: $TSFixMe = /^[0-9]+$/;
         if (phone.match(numbers)) {
             return true;
-        } else {
-            return false;
         }
+        return false;
     };
 
     handleClose = (e: $TSFixMe) => {
@@ -110,313 +103,301 @@ class Call extends Component<ComponentProps> {
     override render() {
         return (
             <div>
-
-                {
-                    this.props.subscribed &&
-
-                        this.props.subscribed.success ? null : (
-                        <div className="directions">
-                            <Translate>
-                                {' '}
-                                Get sms notifications when an incident is{' '}
-                                <b>created</b>.{' '}
-                            </Translate>
-                        </div>
-                    )
-                }
-                < form
+                {this.props.subscribed &&
+                this.props.subscribed.success ? null : (
+                    <div className="directions">
+                        <Translate>
+                            {' '}
+                            Get sms notifications when an incident is{' '}
+                            <b>created</b>.{' '}
+                        </Translate>
+                    </div>
+                )}
+                <form
                     id="subscribe-form-sms"
                     onSubmit={
-
                         this.props.subscribed && this.props.subscribed.success
                             ? this.handleClose
                             : this.handleSubmit
                     }
                 >
+                    {this.props.subscribed && this.props.subscribed.success ? (
+                        <div style={{ textAlign: 'center', margin: '15px 0' }}>
+                            <span
+                                className="subscriber-success"
+                                id="monitor-subscribe-success-message"
+                            >
+                                <Translate>
+                                    {' '}
+                                    You have subscribed to this status page
+                                    successfully{' '}
+                                </Translate>
+                            </span>
+                        </div>
+                    ) : (
+                        <>
+                            <select
+                                value={this.state.country}
+                                onChange={this.handleChange}
+                                name="country"
+                                className="select-full"
+                            >
+                                <option value="af">Afghanistan (+93)</option>
+                                <option value="al">Albania (+355)</option>
+                                <option value="dz">Algeria (+213)</option>
+                                <option value="as">American Samoa (+1)</option>
+                                <option value="ad">Andorra (+376)</option>
+                                <option value="ao">Angola (+244)</option>
+                                <option value="ai">Anguilla (+1)</option>
+                                <option value="ag">
+                                    Antigua and Barbuda (+1)
+                                </option>
+                                <option value="ar">Argentina (+54)</option>
+                                <option value="am">Armenia (+374)</option>
+                                <option value="aw">Aruba (+297)</option>
+                                <option value="au">
+                                    Australia/Cocos/Christmas Island (+61)
+                                </option>
+                                <option value="at">Austria (+43)</option>
+                                <option value="az">Azerbaijan (+994)</option>
+                                <option value="bs">Bahamas (+1)</option>
+                                <option value="bh">Bahrain (+973)</option>
+                                <option value="bd">Bangladesh (+880)</option>
+                                <option value="bb">Barbados (+1)</option>
+                                <option value="by">Belarus (+375)</option>
+                                <option value="be">Belgium (+32)</option>
+                                <option value="bz">Belize (+501)</option>
+                                <option value="bj">Benin (+229)</option>
+                                <option value="bm">Bermuda (+1)</option>
+                                <option value="bo">Bolivia (+591)</option>
+                                <option value="ba">
+                                    Bosnia and Herzegovina (+387)
+                                </option>
+                                <option value="bw">Botswana (+267)</option>
+                                <option value="br">Brazil (+55)</option>
+                                <option value="bn">Brunei (+673)</option>
+                                <option value="bg">Bulgaria (+359)</option>
+                                <option value="bf">Burkina Faso (+226)</option>
+                                <option value="bi">Burundi (+257)</option>
+                                <option value="kh">Cambodia (+855)</option>
+                                <option value="cm">Cameroon (+237)</option>
+                                <option value="ca">Canada (+1)</option>
+                                <option value="cv">Cape Verde (+238)</option>
+                                <option value="ky">Cayman Islands (+1)</option>
+                                <option value="cf">
+                                    Central Africa (+236)
+                                </option>
+                                <option value="td">Chad (+235)</option>
+                                <option value="cl">Chile (+56)</option>
+                                <option value="cn">China (+86)</option>
+                                <option value="co">Colombia (+57)</option>
+                                <option value="km">Comoros (+269)</option>
+                                <option value="cg">Congo (+242)</option>
+                                <option value="cd">
+                                    Congo, Dem Rep (+243)
+                                </option>
+                                <option value="cr">Costa Rica (+506)</option>
+                                <option value="hr">Croatia (+385)</option>
+                                <option value="cy">Cyprus (+357)</option>
+                                <option value="cz">
+                                    Czech Republic (+420)
+                                </option>
+                                <option value="dk">Denmark (+45)</option>
+                                <option value="dj">Djibouti (+253)</option>
+                                <option value="dm">Dominica (+1)</option>
+                                <option value="do">
+                                    Dominican Republic (+1)
+                                </option>
+                                <option value="eg">Egypt (+20)</option>
+                                <option value="sv">El Salvador (+503)</option>
+                                <option value="gq">
+                                    Equatorial Guinea (+240)
+                                </option>
+                                <option value="ee">Estonia (+372)</option>
+                                <option value="et">Ethiopia (+251)</option>
+                                <option value="fo">Faroe Islands (+298)</option>
+                                <option value="fj">Fiji (+679)</option>
+                                <option value="fi">
+                                    Finland/Aland Islands (+358)
+                                </option>
+                                <option value="fr">France (+33)</option>
+                                <option value="gf">French Guiana (+594)</option>
+                                <option value="pf">
+                                    French Polynesia (+689)
+                                </option>
+                                <option value="ga">Gabon (+241)</option>
+                                <option value="gm">Gambia (+220)</option>
+                                <option value="ge">Georgia (+995)</option>
+                                <option value="de">Germany (+49)</option>
+                                <option value="gh">Ghana (+233)</option>
+                                <option value="gi">Gibraltar (+350)</option>
+                                <option value="gr">Greece (+30)</option>
+                                <option value="gl">Greenland (+299)</option>
+                                <option value="gd">Grenada (+1)</option>
+                                <option value="gp">Guadeloupe (+590)</option>
+                                <option value="gu">Guam (+1)</option>
+                                <option value="gt">Guatemala (+502)</option>
+                                <option value="gn">Guinea (+224)</option>
+                                <option value="gy">Guyana (+592)</option>
+                                <option value="ht">Haiti (+509)</option>
+                                <option value="hn">Honduras (+504)</option>
+                                <option value="hk">Hong Kong (+852)</option>
+                                <option value="hu">Hungary (+36)</option>
+                                <option value="is">Iceland (+354)</option>
+                                <option value="in">India (+91)</option>
+                                <option value="id">Indonesia (+62)</option>
+                                <option value="ir">Iran (+98)</option>
+                                <option value="iq">Iraq (+964)</option>
+                                <option value="ie">Ireland (+353)</option>
+                                <option value="il">Israel (+972)</option>
+                                <option value="it">Italy (+39)</option>
+                                <option value="jm">Jamaica (+1)</option>
+                                <option value="jp">Japan (+81)</option>
+                                <option value="jo">Jordan (+962)</option>
+                                <option value="ke">Kenya (+254)</option>
+                                <option value="kr">
+                                    Korea, Republic of (+82)
+                                </option>
+                                <option value="kw">Kuwait (+965)</option>
+                                <option value="kg">Kyrgyzstan (+996)</option>
+                                <option value="la">Laos (+856)</option>
+                                <option value="lv">Latvia (+371)</option>
+                                <option value="lb">Lebanon (+961)</option>
+                                <option value="ls">Lesotho (+266)</option>
+                                <option value="lr">Liberia (+231)</option>
+                                <option value="ly">Libya (+218)</option>
+                                <option value="li">Liechtenstein (+423)</option>
+                                <option value="lt">Lithuania (+370)</option>
+                                <option value="lu">Luxembourg (+352)</option>
+                                <option value="mo">Macao (+853)</option>
+                                <option value="mk">Macedonia (+389)</option>
+                                <option value="mg">Madagascar (+261)</option>
+                                <option value="mw">Malawi (+265)</option>
+                                <option value="my">Malaysia (+60)</option>
+                                <option value="mv">Maldives (+960)</option>
+                                <option value="ml">Mali (+223)</option>
+                                <option value="mt">Malta (+356)</option>
+                                <option value="mq">Martinique (+596)</option>
+                                <option value="mr">Mauritania (+222)</option>
+                                <option value="mu">Mauritius (+230)</option>
+                                <option value="mx">Mexico (+52)</option>
+                                <option value="mc">Monaco (+377)</option>
+                                <option value="mn">Mongolia (+976)</option>
+                                <option value="me">Montenegro (+382)</option>
+                                <option value="ms">Montserrat (+1)</option>
+                                <option value="ma">
+                                    Morocco/Western Sahara (+212)
+                                </option>
+                                <option value="mz">Mozambique (+258)</option>
+                                <option value="na">Namibia (+264)</option>
+                                <option value="np">Nepal (+977)</option>
+                                <option value="nl">Netherlands (+31)</option>
+                                <option value="nz">New Zealand (+64)</option>
+                                <option value="ni">Nicaragua (+505)</option>
+                                <option value="ne">Niger (+227)</option>
+                                <option value="ng">Nigeria (+234)</option>
+                                <option value="no">Norway (+47)</option>
+                                <option value="om">Oman (+968)</option>
+                                <option value="pk">Pakistan (+92)</option>
+                                <option value="ps">
+                                    Palestinian Territory (+970)
+                                </option>
+                                <option value="pa">Panama (+507)</option>
+                                <option value="py">Paraguay (+595)</option>
+                                <option value="pe">Peru (+51)</option>
+                                <option value="ph">Philippines (+63)</option>
+                                <option value="pl">Poland (+48)</option>
+                                <option value="pt">Portugal (+351)</option>
+                                <option value="pr">Puerto Rico (+1)</option>
+                                <option value="qa">Qatar (+974)</option>
+                                <option value="re">
+                                    Reunion/Mayotte (+262)
+                                </option>
+                                <option value="ro">Romania (+40)</option>
+                                <option value="ru">
+                                    Russia/Kazakhstan (+7)
+                                </option>
+                                <option value="rw">Rwanda (+250)</option>
+                                <option value="ws">Samoa (+685)</option>
+                                <option value="sm">San Marino (+378)</option>
+                                <option value="sa">Saudi Arabia (+966)</option>
+                                <option value="sn">Senegal (+221)</option>
+                                <option value="rs">Serbia (+381)</option>
+                                <option value="sc">Seychelles (+248)</option>
+                                <option value="sl">Sierra Leone (+232)</option>
+                                <option value="sg">Singapore (+65)</option>
+                                <option value="sk">Slovakia (+421)</option>
+                                <option value="si">Slovenia (+386)</option>
+                                <option value="za">South Africa (+27)</option>
+                                <option value="es">Spain (+34)</option>
+                                <option value="lk">Sri Lanka (+94)</option>
+                                <option value="kn">
+                                    St Kitts and Nevis (+1)
+                                </option>
+                                <option value="lc">St Lucia (+1)</option>
+                                <option value="vc">
+                                    St Vincent Grenadines (+1)
+                                </option>
+                                <option value="sd">Sudan (+249)</option>
+                                <option value="sr">Suriname (+597)</option>
+                                <option value="sz">Swaziland (+268)</option>
+                                <option value="se">Sweden (+46)</option>
+                                <option value="ch">Switzerland (+41)</option>
+                                <option value="sy">Syria (+963)</option>
+                                <option value="tw">Taiwan (+886)</option>
+                                <option value="tj">Tajikistan (+992)</option>
+                                <option value="tz">Tanzania (+255)</option>
+                                <option value="th">Thailand (+66)</option>
+                                <option value="tg">Togo (+228)</option>
+                                <option value="to">Tonga (+676)</option>
+                                <option value="tt">
+                                    Trinidad and Tobago (+1)
+                                </option>
+                                <option value="tn">Tunisia (+216)</option>
+                                <option value="tr">Turkey (+90)</option>
+                                <option value="tc">
+                                    Turks and Caicos Islands (+1)
+                                </option>
+                                <option value="ug">Uganda (+256)</option>
+                                <option value="ua">Ukraine (+380)</option>
+                                <option value="ae">
+                                    United Arab Emirates (+971)
+                                </option>
+                                <option value="gb">United Kingdom (+44)</option>
+                                <option value="us">United States (+1)</option>
+                                <option value="uy">Uruguay (+598)</option>
+                                <option value="uz">Uzbekistan (+998)</option>
+                                <option value="ve">Venezuela (+58)</option>
+                                <option value="vn">Vietnam (+84)</option>
+                                <option value="vg">
+                                    Virgin Islands, British (+1)
+                                </option>
+                                <option value="vi">
+                                    Virgin Islands, U.S. (+1)
+                                </option>
+                                <option value="ye">Yemen (+967)</option>
+                                <option value="zm">Zambia (+260)</option>
+                                <option value="zw">Zimbabwe (+263)</option>
+                            </select>
+                            <input
+                                name="phone_number"
+                                onChange={this.handleChange}
+                                type="text"
+                                placeholder="ex. 6505551234"
+                                className="input-full"
+                            />
+                        </>
+                    )}
 
-                    {
-                        this.props.subscribed && this.props.subscribed.success ? (
-                            <div style={{ textAlign: 'center', margin: '15px 0' }}>
-                                <span
-                                    className="subscriber-success"
-                                    id="monitor-subscribe-success-message"
-                                >
-                                    <Translate>
-                                        {' '}
-                                        You have subscribed to this status page
-                                        successfully{' '}
-                                    </Translate>
-                                </span>
-                            </div>
-                        ) : (
-                            <>
-                                <select
-
-                                    value={this.state.country}
-                                    onChange={this.handleChange}
-                                    name="country"
-                                    className="select-full"
-                                >
-                                    <option value="af">Afghanistan (+93)</option>
-                                    <option value="al">Albania (+355)</option>
-                                    <option value="dz">Algeria (+213)</option>
-                                    <option value="as">American Samoa (+1)</option>
-                                    <option value="ad">Andorra (+376)</option>
-                                    <option value="ao">Angola (+244)</option>
-                                    <option value="ai">Anguilla (+1)</option>
-                                    <option value="ag">
-                                        Antigua and Barbuda (+1)
-                                    </option>
-                                    <option value="ar">Argentina (+54)</option>
-                                    <option value="am">Armenia (+374)</option>
-                                    <option value="aw">Aruba (+297)</option>
-                                    <option value="au">
-                                        Australia/Cocos/Christmas Island (+61)
-                                    </option>
-                                    <option value="at">Austria (+43)</option>
-                                    <option value="az">Azerbaijan (+994)</option>
-                                    <option value="bs">Bahamas (+1)</option>
-                                    <option value="bh">Bahrain (+973)</option>
-                                    <option value="bd">Bangladesh (+880)</option>
-                                    <option value="bb">Barbados (+1)</option>
-                                    <option value="by">Belarus (+375)</option>
-                                    <option value="be">Belgium (+32)</option>
-                                    <option value="bz">Belize (+501)</option>
-                                    <option value="bj">Benin (+229)</option>
-                                    <option value="bm">Bermuda (+1)</option>
-                                    <option value="bo">Bolivia (+591)</option>
-                                    <option value="ba">
-                                        Bosnia and Herzegovina (+387)
-                                    </option>
-                                    <option value="bw">Botswana (+267)</option>
-                                    <option value="br">Brazil (+55)</option>
-                                    <option value="bn">Brunei (+673)</option>
-                                    <option value="bg">Bulgaria (+359)</option>
-                                    <option value="bf">Burkina Faso (+226)</option>
-                                    <option value="bi">Burundi (+257)</option>
-                                    <option value="kh">Cambodia (+855)</option>
-                                    <option value="cm">Cameroon (+237)</option>
-                                    <option value="ca">Canada (+1)</option>
-                                    <option value="cv">Cape Verde (+238)</option>
-                                    <option value="ky">Cayman Islands (+1)</option>
-                                    <option value="cf">
-                                        Central Africa (+236)
-                                    </option>
-                                    <option value="td">Chad (+235)</option>
-                                    <option value="cl">Chile (+56)</option>
-                                    <option value="cn">China (+86)</option>
-                                    <option value="co">Colombia (+57)</option>
-                                    <option value="km">Comoros (+269)</option>
-                                    <option value="cg">Congo (+242)</option>
-                                    <option value="cd">
-                                        Congo, Dem Rep (+243)
-                                    </option>
-                                    <option value="cr">Costa Rica (+506)</option>
-                                    <option value="hr">Croatia (+385)</option>
-                                    <option value="cy">Cyprus (+357)</option>
-                                    <option value="cz">
-                                        Czech Republic (+420)
-                                    </option>
-                                    <option value="dk">Denmark (+45)</option>
-                                    <option value="dj">Djibouti (+253)</option>
-                                    <option value="dm">Dominica (+1)</option>
-                                    <option value="do">
-                                        Dominican Republic (+1)
-                                    </option>
-                                    <option value="eg">Egypt (+20)</option>
-                                    <option value="sv">El Salvador (+503)</option>
-                                    <option value="gq">
-                                        Equatorial Guinea (+240)
-                                    </option>
-                                    <option value="ee">Estonia (+372)</option>
-                                    <option value="et">Ethiopia (+251)</option>
-                                    <option value="fo">Faroe Islands (+298)</option>
-                                    <option value="fj">Fiji (+679)</option>
-                                    <option value="fi">
-                                        Finland/Aland Islands (+358)
-                                    </option>
-                                    <option value="fr">France (+33)</option>
-                                    <option value="gf">French Guiana (+594)</option>
-                                    <option value="pf">
-                                        French Polynesia (+689)
-                                    </option>
-                                    <option value="ga">Gabon (+241)</option>
-                                    <option value="gm">Gambia (+220)</option>
-                                    <option value="ge">Georgia (+995)</option>
-                                    <option value="de">Germany (+49)</option>
-                                    <option value="gh">Ghana (+233)</option>
-                                    <option value="gi">Gibraltar (+350)</option>
-                                    <option value="gr">Greece (+30)</option>
-                                    <option value="gl">Greenland (+299)</option>
-                                    <option value="gd">Grenada (+1)</option>
-                                    <option value="gp">Guadeloupe (+590)</option>
-                                    <option value="gu">Guam (+1)</option>
-                                    <option value="gt">Guatemala (+502)</option>
-                                    <option value="gn">Guinea (+224)</option>
-                                    <option value="gy">Guyana (+592)</option>
-                                    <option value="ht">Haiti (+509)</option>
-                                    <option value="hn">Honduras (+504)</option>
-                                    <option value="hk">Hong Kong (+852)</option>
-                                    <option value="hu">Hungary (+36)</option>
-                                    <option value="is">Iceland (+354)</option>
-                                    <option value="in">India (+91)</option>
-                                    <option value="id">Indonesia (+62)</option>
-                                    <option value="ir">Iran (+98)</option>
-                                    <option value="iq">Iraq (+964)</option>
-                                    <option value="ie">Ireland (+353)</option>
-                                    <option value="il">Israel (+972)</option>
-                                    <option value="it">Italy (+39)</option>
-                                    <option value="jm">Jamaica (+1)</option>
-                                    <option value="jp">Japan (+81)</option>
-                                    <option value="jo">Jordan (+962)</option>
-                                    <option value="ke">Kenya (+254)</option>
-                                    <option value="kr">
-                                        Korea, Republic of (+82)
-                                    </option>
-                                    <option value="kw">Kuwait (+965)</option>
-                                    <option value="kg">Kyrgyzstan (+996)</option>
-                                    <option value="la">Laos (+856)</option>
-                                    <option value="lv">Latvia (+371)</option>
-                                    <option value="lb">Lebanon (+961)</option>
-                                    <option value="ls">Lesotho (+266)</option>
-                                    <option value="lr">Liberia (+231)</option>
-                                    <option value="ly">Libya (+218)</option>
-                                    <option value="li">Liechtenstein (+423)</option>
-                                    <option value="lt">Lithuania (+370)</option>
-                                    <option value="lu">Luxembourg (+352)</option>
-                                    <option value="mo">Macao (+853)</option>
-                                    <option value="mk">Macedonia (+389)</option>
-                                    <option value="mg">Madagascar (+261)</option>
-                                    <option value="mw">Malawi (+265)</option>
-                                    <option value="my">Malaysia (+60)</option>
-                                    <option value="mv">Maldives (+960)</option>
-                                    <option value="ml">Mali (+223)</option>
-                                    <option value="mt">Malta (+356)</option>
-                                    <option value="mq">Martinique (+596)</option>
-                                    <option value="mr">Mauritania (+222)</option>
-                                    <option value="mu">Mauritius (+230)</option>
-                                    <option value="mx">Mexico (+52)</option>
-                                    <option value="mc">Monaco (+377)</option>
-                                    <option value="mn">Mongolia (+976)</option>
-                                    <option value="me">Montenegro (+382)</option>
-                                    <option value="ms">Montserrat (+1)</option>
-                                    <option value="ma">
-                                        Morocco/Western Sahara (+212)
-                                    </option>
-                                    <option value="mz">Mozambique (+258)</option>
-                                    <option value="na">Namibia (+264)</option>
-                                    <option value="np">Nepal (+977)</option>
-                                    <option value="nl">Netherlands (+31)</option>
-                                    <option value="nz">New Zealand (+64)</option>
-                                    <option value="ni">Nicaragua (+505)</option>
-                                    <option value="ne">Niger (+227)</option>
-                                    <option value="ng">Nigeria (+234)</option>
-                                    <option value="no">Norway (+47)</option>
-                                    <option value="om">Oman (+968)</option>
-                                    <option value="pk">Pakistan (+92)</option>
-                                    <option value="ps">
-                                        Palestinian Territory (+970)
-                                    </option>
-                                    <option value="pa">Panama (+507)</option>
-                                    <option value="py">Paraguay (+595)</option>
-                                    <option value="pe">Peru (+51)</option>
-                                    <option value="ph">Philippines (+63)</option>
-                                    <option value="pl">Poland (+48)</option>
-                                    <option value="pt">Portugal (+351)</option>
-                                    <option value="pr">Puerto Rico (+1)</option>
-                                    <option value="qa">Qatar (+974)</option>
-                                    <option value="re">
-                                        Reunion/Mayotte (+262)
-                                    </option>
-                                    <option value="ro">Romania (+40)</option>
-                                    <option value="ru">
-                                        Russia/Kazakhstan (+7)
-                                    </option>
-                                    <option value="rw">Rwanda (+250)</option>
-                                    <option value="ws">Samoa (+685)</option>
-                                    <option value="sm">San Marino (+378)</option>
-                                    <option value="sa">Saudi Arabia (+966)</option>
-                                    <option value="sn">Senegal (+221)</option>
-                                    <option value="rs">Serbia (+381)</option>
-                                    <option value="sc">Seychelles (+248)</option>
-                                    <option value="sl">Sierra Leone (+232)</option>
-                                    <option value="sg">Singapore (+65)</option>
-                                    <option value="sk">Slovakia (+421)</option>
-                                    <option value="si">Slovenia (+386)</option>
-                                    <option value="za">South Africa (+27)</option>
-                                    <option value="es">Spain (+34)</option>
-                                    <option value="lk">Sri Lanka (+94)</option>
-                                    <option value="kn">
-                                        St Kitts and Nevis (+1)
-                                    </option>
-                                    <option value="lc">St Lucia (+1)</option>
-                                    <option value="vc">
-                                        St Vincent Grenadines (+1)
-                                    </option>
-                                    <option value="sd">Sudan (+249)</option>
-                                    <option value="sr">Suriname (+597)</option>
-                                    <option value="sz">Swaziland (+268)</option>
-                                    <option value="se">Sweden (+46)</option>
-                                    <option value="ch">Switzerland (+41)</option>
-                                    <option value="sy">Syria (+963)</option>
-                                    <option value="tw">Taiwan (+886)</option>
-                                    <option value="tj">Tajikistan (+992)</option>
-                                    <option value="tz">Tanzania (+255)</option>
-                                    <option value="th">Thailand (+66)</option>
-                                    <option value="tg">Togo (+228)</option>
-                                    <option value="to">Tonga (+676)</option>
-                                    <option value="tt">
-                                        Trinidad and Tobago (+1)
-                                    </option>
-                                    <option value="tn">Tunisia (+216)</option>
-                                    <option value="tr">Turkey (+90)</option>
-                                    <option value="tc">
-                                        Turks and Caicos Islands (+1)
-                                    </option>
-                                    <option value="ug">Uganda (+256)</option>
-                                    <option value="ua">Ukraine (+380)</option>
-                                    <option value="ae">
-                                        United Arab Emirates (+971)
-                                    </option>
-                                    <option value="gb">United Kingdom (+44)</option>
-                                    <option value="us">United States (+1)</option>
-                                    <option value="uy">Uruguay (+598)</option>
-                                    <option value="uz">Uzbekistan (+998)</option>
-                                    <option value="ve">Venezuela (+58)</option>
-                                    <option value="vn">Vietnam (+84)</option>
-                                    <option value="vg">
-                                        Virgin Islands, British (+1)
-                                    </option>
-                                    <option value="vi">
-                                        Virgin Islands, U.S. (+1)
-                                    </option>
-                                    <option value="ye">Yemen (+967)</option>
-                                    <option value="zm">Zambia (+260)</option>
-                                    <option value="zw">Zimbabwe (+263)</option>
-                                </select>
-                                <input
-                                    name="phone_number"
-                                    onChange={this.handleChange}
-                                    type="text"
-                                    placeholder="ex. 6505551234"
-                                    className="input-full"
-                                />
-                            </>
-                        )
-                    }
-
-                    < input
+                    <input
                         type="submit"
                         value={
-
                             this.props.subscribed &&
-
-                                this.props.subscribed.success
+                            this.props.subscribed.success
                                 ? 'Close'
                                 : 'Subscribe'
                         }
                         className={
-
                             this.props.theme
                                 ? 'subscribe-btn-full bs-theme-btn'
                                 : 'subscribe-btn-full'
@@ -424,75 +405,70 @@ class Call extends Component<ComponentProps> {
                         id="subscribe-btn-sms"
                     />
 
-                    {
-                        this.props.subscribed &&
-
-                            this.props.subscribed.success ? null : (
-                            <div
-                                className="terms_and_privacy_information small"
-                                style={{ marginTop: '10px' }}
+                    {this.props.subscribed &&
+                    this.props.subscribed.success ? null : (
+                        <div
+                            className="terms_and_privacy_information small"
+                            style={{ marginTop: '10px' }}
+                        >
+                            <Translate>
+                                {' '}
+                                Message and data rates may apply. By subscribing
+                                you agree to the
+                            </Translate>{' '}
+                            OneUptime{' '}
+                            <a
+                                target="_blank"
+                                href="https://www.atlassian.com/legal/cloud-terms-of-service"
+                                rel="noopener noreferrer"
+                                style={{ fontSize: this.props.theme && '12px' }}
                             >
-                                <Translate>
-                                    {' '}
-                                    Message and data rates may apply. By subscribing
-                                    you agree to the
-                                </Translate>{' '}
-                                OneUptime{' '}
-                                <a
-                                    target="_blank"
-                                    href="https://www.atlassian.com/legal/cloud-terms-of-service"
-                                    rel="noopener noreferrer"
-
-                                    style={{ fontSize: this.props.theme && '12px' }}
-                                >
-                                    Cloud Terms of Service
-                                </a>
-                                .
-                            </div>
-                        )
-                    }
-                </form >
+                                Cloud Terms of Service
+                            </a>
+                            .
+                        </div>
+                    )}
+                </form>
                 <ShouldRender
-
                     if={this.props.subscribed && this.props.subscribed.error}
                 >
                     <div className="validation-error">
                         <span className="validation-error-icon"></span>
                         <span className="error-text">
                             <Translate>
-
                                 {this.props.subscribed &&
-
                                     this.props.subscribed.error}
                             </Translate>
                         </span>
                     </div>
                 </ShouldRender>
-            </div >
+            </div>
         );
     }
 }
 
-
 Call.displayName = 'Call';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    userDetails: state.subscribe.userDetails,
-    subscribed: state.subscribe.subscribed,
-    statuspage: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        userData,
-        validationError,
-        subscribeUser,
-        openSubscribeMenu,
-        userDataReset,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        userDetails: state.subscribe.userDetails,
+        subscribed: state.subscribe.subscribed,
+        statuspage: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            userData,
+            validationError,
+            subscribeUser,
+            openSubscribeMenu,
+            userDataReset,
+        },
+        dispatch
+    );
+};
 
 Call.propTypes = {
     userData: PropTypes.func,
diff --git a/StatusPage/src/Components/Subscribe/Message.tsx b/StatusPage/src/Components/Subscribe/Message.tsx
index e015bf8ff4..e2ce98be70 100755
--- a/StatusPage/src/Components/Subscribe/Message.tsx
+++ b/StatusPage/src/Components/Subscribe/Message.tsx
@@ -42,21 +42,16 @@ class Message extends Component<ComponentProps> {
         event.preventDefault();
 
         const projectId: $TSFixMe =
-
             this.props.statuspage &&
-
             this.props.statuspage.projectId &&
-
             this.props.statuspage.projectId._id;
 
         const statusPageId: $TSFixMe = this.props.statuspage._id;
 
-        const selectIndividualMonitors: $TSFixMe = this.props.statuspage
-            .selectIndividualMonitors;
-
+        const selectIndividualMonitors: $TSFixMe =
+            this.props.statuspage.selectIndividualMonitors;
 
         if (this.state.email && this.state.email.length) {
-
             const validemail: $TSFixMe = this.validation(this.state.email);
             if (validemail) {
                 const values: $TSFixMe = this.state;
@@ -74,16 +69,13 @@ class Message extends Component<ComponentProps> {
                     );
                 }
 
-
                 this.props.userData(values);
             } else {
-
                 this.props.validationError(
                     'Please enter a valid email address.'
                 );
             }
         } else {
-
             this.props.validationError('Please enter your email address.');
         }
     };
@@ -95,9 +87,8 @@ class Message extends Component<ComponentProps> {
             )
         ) {
             return true;
-        } else {
-            return false;
         }
+        return false;
     };
 
     handleClose = (e: $TSFixMe) => {
@@ -112,122 +103,110 @@ class Message extends Component<ComponentProps> {
     override render() {
         return (
             <div>
-
-                {
-                    this.props.subscribed &&
-
-                        this.props.subscribed.success ? null : (
-                        <div className="directions">
-                            <Translate>
-                                {' '}
-                                Get email notifications when an incident is
-                            </Translate>{' '}
-                            <b>
-                                <Translate>created</Translate>
-                            </b>
-                            .
-                        </div>
-                    )
-                }
-                < form
+                {this.props.subscribed &&
+                this.props.subscribed.success ? null : (
+                    <div className="directions">
+                        <Translate>
+                            {' '}
+                            Get email notifications when an incident is
+                        </Translate>{' '}
+                        <b>
+                            <Translate>created</Translate>
+                        </b>
+                        .
+                    </div>
+                )}
+                <form
                     id="subscribe-form-email"
                     onSubmit={
-
                         this.props.subscribed && this.props.subscribed.success
                             ? this.handleClose
                             : this.handleSubmit
                     }
                 >
-
-                    {
-                        this.props.subscribed && this.props.subscribed.success ? (
-                            <div
-                                style={{
-                                    textAlign: 'center',
-                                    margin: '15px 0',
-                                    color: '#000',
-                                }}
+                    {this.props.subscribed && this.props.subscribed.success ? (
+                        <div
+                            style={{
+                                textAlign: 'center',
+                                margin: '15px 0',
+                                color: '#000',
+                            }}
+                        >
+                            <span
+                                className="subscriber-success"
+                                id="monitor-subscribe-success-message"
                             >
-                                <span
-                                    className="subscriber-success"
-                                    id="monitor-subscribe-success-message"
-                                >
-                                    <Translate>
-                                        You have subscribed to this status page
-                                        successfully
-                                    </Translate>
-                                </span>
-                            </div>
-                        ) : (
-                            <input
-                                name="email"
-                                onChange={this.handleChange}
-                                type="text"
-                                placeholder="Email Address"
-                                className="input-full"
-                            />
-                        )
-                    }
-                    < input
+                                <Translate>
+                                    You have subscribed to this status page
+                                    successfully
+                                </Translate>
+                            </span>
+                        </div>
+                    ) : (
+                        <input
+                            name="email"
+                            onChange={this.handleChange}
+                            type="text"
+                            placeholder="Email Address"
+                            className="input-full"
+                        />
+                    )}
+                    <input
                         type="submit"
                         value={
-
                             this.props.subscribed &&
-
-                                this.props.subscribed.success
+                            this.props.subscribed.success
                                 ? 'Close'
                                 : 'Subscribe'
                         }
                         className={
-
                             this.props.theme
                                 ? 'subscribe-btn-full bs-theme-btn'
                                 : 'subscribe-btn-full'
                         }
                         id="subscribe-btn-email"
-                    ></input >
-                </form >
+                    ></input>
+                </form>
                 <ShouldRender
-
                     if={this.props.subscribed && this.props.subscribed.error}
                 >
                     <div className="validation-error">
                         <span className="validation-error-icon"></span>
                         <span className="error-text">
                             <Translate>
-
                                 {this.props.subscribed &&
-
                                     this.props.subscribed.error}
                             </Translate>
                         </span>
                     </div>
                 </ShouldRender>
-            </div >
+            </div>
         );
     }
 }
 
-
 Message.displayName = 'Message';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    userDetails: state.subscribe.userDetails,
-    subscribed: state.subscribe.subscribed,
-    statuspage: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        userData,
-        validationError,
-        subscribeUser,
-        openSubscribeMenu,
-        userDataReset,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        userDetails: state.subscribe.userDetails,
+        subscribed: state.subscribe.subscribed,
+        statuspage: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            userData,
+            validationError,
+            subscribeUser,
+            openSubscribeMenu,
+            userDataReset,
+        },
+        dispatch
+    );
+};
 
 Message.propTypes = {
     userData: PropTypes.func,
diff --git a/StatusPage/src/Components/Subscribe/Monitors.tsx b/StatusPage/src/Components/Subscribe/Monitors.tsx
index fd9ac67b25..3f8cc8c85b 100755
--- a/StatusPage/src/Components/Subscribe/Monitors.tsx
+++ b/StatusPage/src/Components/Subscribe/Monitors.tsx
@@ -54,10 +54,8 @@ class Monitors extends Component<ComponentProps> {
         const monitors: $TSFixMe = {};
 
         this.props.monitors &&
-
             this.props.monitors.map((m: $TSFixMe) => {
                 if (m && m.name && m._id) {
-
                     monitors[m.name] = true;
                 }
                 return m;
@@ -72,9 +70,7 @@ class Monitors extends Component<ComponentProps> {
 
         // if multiple notificaiton types is not selected then set everything to true.
         if (
-
             this.props.statuspage &&
-
             !this.props.statuspage.multipleNotificationTypes
         ) {
             notificationType = {
@@ -85,31 +81,30 @@ class Monitors extends Component<ComponentProps> {
         }
 
         const projectId: $TSFixMe =
-
             this.props.statuspage &&
-
             this.props.statuspage.projectId &&
-
             this.props.statuspage.projectId._id;
 
         const statusPageId: $TSFixMe = this.props.statuspage._id;
         if (this.state) {
-            let monitors = Object.keys(this.state).filter(
-
-                key => this.state[key]
-            );
-            monitors = monitors.map(monitor =>
-
-                this.props.monitors.find((el: $TSFixMe) => el.name === monitor)
-            );
+            let monitors = Object.keys(this.state).filter(key => {
+                return this.state[key];
+            });
+            monitors = monitors.map(monitor => {
+                return this.props.monitors.find((el: $TSFixMe) => {
+                    return el.name === monitor;
+                });
+            });
             monitors = monitors
 
-                .map(monitor => monitor && monitor._id)
-                .filter(monitor => monitor);
+                .map(monitor => {
+                    return monitor && monitor._id;
+                })
+                .filter(monitor => {
+                    return monitor;
+                });
             if (monitors && monitors.length) {
-
                 this.props.subscribeUser(
-
                     this.props.userDetails,
                     monitors,
                     projectId,
@@ -117,7 +112,6 @@ class Monitors extends Component<ComponentProps> {
                     notificationType
                 );
             } else {
-
                 this.props.validationError('please select a monitor');
             }
         }
@@ -134,116 +128,105 @@ class Monitors extends Component<ComponentProps> {
     };
     override render() {
         const multipleNotificationTypes: $TSFixMe =
-
             this.props.statuspage &&
-
             this.props.statuspage.multipleNotificationTypes;
         return (
             <div>
-
-                {
-                    this.props.subscribed.success ? (
-                        <div style={{ textAlign: 'center', margin: '15px 0' }}>
-                            <span
-                                className="subscriber-success"
-                                id="monitor-subscribe-success-message"
-                            >
-                                <Translate>
-                                    {' '}
-                                    You have subscribed to this status page
-                                    successfully
-                                </Translate>
-                            </span>
-                        </div>
-                    ) : (
-                        <div className="directions">
+                {this.props.subscribed.success ? (
+                    <div style={{ textAlign: 'center', margin: '15px 0' }}>
+                        <span
+                            className="subscriber-success"
+                            id="monitor-subscribe-success-message"
+                        >
                             <Translate>
-                                Select the monitors to get updates.
+                                {' '}
+                                You have subscribed to this status page
+                                successfully
                             </Translate>
-                        </div>
-                    )
-                }
-                < form
+                        </span>
+                    </div>
+                ) : (
+                    <div className="directions">
+                        <Translate>
+                            Select the monitors to get updates.
+                        </Translate>
+                    </div>
+                )}
+                <form
                     id="subscribe-form-webhook"
                     onSubmit={
-
                         this.props.subscribed && this.props.subscribed.success
                             ? this.handleClose
                             : this.handleSubmit
                     }
                 >
+                    {this.props.subscribed.success
+                        ? null
+                        : this.state &&
+                          Object.keys(this.state).map((monitor, i) => {
+                              return (
+                                  <>
+                                      <ShouldRender
+                                          if={
+                                              monitor !== 'announcement' &&
+                                              monitor !== 'scheduledEvent' &&
+                                              monitor !== 'incident'
+                                          }
+                                      >
+                                          <label
+                                              className="container-checkbox"
+                                              key={i}
+                                          >
+                                              <span className="check-label">
+                                                  {monitor}
+                                              </span>
+                                              <input
+                                                  type="checkbox"
+                                                  name={monitor}
+                                                  onChange={this.handleChange}
+                                                  checked={this.state[monitor]}
+                                              />
+                                              <span className="checkmark"></span>
+                                          </label>
+                                      </ShouldRender>
+                                  </>
+                              );
+                          })}
 
-                    {
-                        this.props.subscribed.success
-                            ? null
-                            : this.state &&
-                            Object.keys(this.state).map((monitor, i) => {
-                                return (
-                                    <>
-                                        <ShouldRender
-                                            if={
-                                                monitor !== 'announcement' &&
-                                                monitor !== 'scheduledEvent' &&
-                                                monitor !== 'incident'
-                                            }
-                                        >
-                                            <label
-                                                className="container-checkbox"
-                                                key={i}
-                                            >
-                                                <span className="check-label">
-                                                    {monitor}
-                                                </span>
-                                                <input
-                                                    type="checkbox"
-                                                    name={monitor}
-                                                    onChange={this.handleChange}
-
-                                                    checked={this.state[monitor]}
-                                                />
-                                                <span className="checkmark"></span>
-                                            </label>
-                                        </ShouldRender>
-                                    </>
-                                );
-                            })
-                    }
-
-                    {
-                        this.props.subscribed.success
-                            ? null
-                            : multipleNotificationTypes &&
-                            this.state && (
-                                <>
-                                    <div className="bs-notificationType">
-                                        <div style={{ marginBottom: '10px' }}>
-                                            <Translate>
-                                                Select notification type.
-                                            </Translate>
-                                        </div>
-                                        {Object.keys(this.state).map(
-                                            (value, i) => {
-                                                return (
-                                                    <>
-                                                        <ShouldRender
-                                                            if={
-                                                                value ===
-                                                                'announcement' ||
-                                                                value ===
-                                                                'scheduledEvent' ||
-                                                                value ===
-                                                                'incident'
-                                                            }
-                                                        >
-                                                            <label
-                                                                className="container-checkbox"
-                                                                key={i}
-                                                            >
-                                                                <span className="check-label">
-                                                                    {value ===
-                                                                        'scheduledEvent'
-                                                                        ? 'Schedule Event'
-                                                                        : value
+                    {this.props.subscribed.success
+                        ? null
+                        : multipleNotificationTypes &&
+                          this.state && (
+                              <>
+                                  <div className="bs-notificationType">
+                                      <div style={{ marginBottom: '10px' }}>
+                                          <Translate>
+                                              Select notification type.
+                                          </Translate>
+                                      </div>
+                                      {Object.keys(this.state).map(
+                                          (value, i) => {
+                                              return (
+                                                  <>
+                                                      <ShouldRender
+                                                          if={
+                                                              value ===
+                                                                  'announcement' ||
+                                                              value ===
+                                                                  'scheduledEvent' ||
+                                                              value ===
+                                                                  'incident'
+                                                          }
+                                                      >
+                                                          <label
+                                                              className="container-checkbox"
+                                                              key={i}
+                                                          >
+                                                              <span className="check-label">
+                                                                  {value ===
+                                                                  'scheduledEvent'
+                                                                      ? 'Schedule Event'
+                                                                      : value
                                                                             .charAt(
                                                                                 0
                                                                             )
@@ -251,49 +234,43 @@ class Monitors extends Component<ComponentProps> {
                                                                         value.slice(
                                                                             1
                                                                         )}
-                                                                </span>
-                                                                <input
-                                                                    type="checkbox"
-                                                                    name={value}
-                                                                    onChange={
-                                                                        this
-                                                                            .handleChange
-                                                                    }
-                                                                    checked={
-
-                                                                        this
-                                                                            .state[
-                                                                        value
-                                                                        ]
-                                                                    }
-                                                                />
-                                                                <span className="checkmark"></span>
-                                                            </label>
-                                                        </ShouldRender>
-                                                    </>
-                                                );
-                                            }
-                                        )}
-                                    </div>
-                                </>
-                            )
-                    }
+                                                              </span>
+                                                              <input
+                                                                  type="checkbox"
+                                                                  name={value}
+                                                                  onChange={
+                                                                      this
+                                                                          .handleChange
+                                                                  }
+                                                                  checked={
+                                                                      this
+                                                                          .state[
+                                                                          value
+                                                                      ]
+                                                                  }
+                                                              />
+                                                              <span className="checkmark"></span>
+                                                          </label>
+                                                      </ShouldRender>
+                                                  </>
+                                              );
+                                          }
+                                      )}
+                                  </div>
+                              </>
+                          )}
                     <button
                         type="submit"
                         className={
-
                             this.props.theme
                                 ? 'subscribe-btn-full bs-theme-btn'
                                 : 'subscribe-btn-full'
                         }
-
                         disabled={this.props.subscribed.requesting}
                     >
-
                         <ShouldRender if={!this.props.subscribed.requesting}>
                             <span>
                                 <Translate>
-
                                     {this.props.subscribed.success
                                         ? 'Close'
                                         : 'Subscribe'}
@@ -302,9 +279,7 @@ class Monitors extends Component<ComponentProps> {
                         </ShouldRender>
                         <ShouldRender
                             if={
-
                                 !this.props.subscribed.error &&
-
                                 this.props.subscribed.requesting
                             }
                         >
@@ -313,7 +288,6 @@ class Monitors extends Component<ComponentProps> {
                     </button>
                     <ShouldRender
                         if={
-
                             this.props.subscribed && this.props.subscribed.error
                         }
                     >
@@ -321,35 +295,36 @@ class Monitors extends Component<ComponentProps> {
                             <span className="validation-error-icon"></span>
                             <span className="error-text">
                                 <Translate>
-
                                     {this.props.subscribed &&
-
                                         this.props.subscribed.error}
                                 </Translate>
                             </span>
                         </div>
                     </ShouldRender>
-                </form >
-            </div >
+                </form>
+            </div>
         );
     }
 }
 
-
 Monitors.displayName = 'Monitors';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    userDetails: state.subscribe.userDetails,
-    statuspage: state.status.statusPage,
-    subscribed: state.subscribe.subscribed,
-    monitors: state.status.statusPage && state.status.statusPage.monitorsData
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    { subscribeUser, validationError, openSubscribeMenu, userDataReset },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        userDetails: state.subscribe.userDetails,
+        statuspage: state.status.statusPage,
+        subscribed: state.subscribe.subscribed,
+        monitors:
+            state.status.statusPage && state.status.statusPage.monitorsData,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        { subscribeUser, validationError, openSubscribeMenu, userDataReset },
+        dispatch
+    );
+};
 
 Monitors.propTypes = {
     userDetails: PropTypes.object,
diff --git a/StatusPage/src/Components/Subscribe/SubscribeBox.tsx b/StatusPage/src/Components/Subscribe/SubscribeBox.tsx
index 7a7aa73a8b..18ec4350e1 100755
--- a/StatusPage/src/Components/Subscribe/SubscribeBox.tsx
+++ b/StatusPage/src/Components/Subscribe/SubscribeBox.tsx
@@ -31,21 +31,16 @@ class SubscribeBox extends Component<ComponentProps> {
         this.selectbutton = this.selectbutton.bind(this);
     }
     subscribebutton = () => {
-
         if (this.props.theme) {
-
             this.props.handleCloseButtonClick();
         } else {
-
             this.props.openSubscribeMenu();
         }
     };
     selectbutton = (data: $TSFixMe) => {
-
         this.props.selectedMenu(data);
     };
     override render() {
-
         const { statusPage }: $TSFixMe = this.props;
         const {
             enableRSSFeed,
@@ -59,8 +54,9 @@ class SubscribeBox extends Component<ComponentProps> {
         return (
             <div className="subscribe-overlay">
                 <ClickOutHandler
-
-                    onClickOut={() => this.props.openSubscribeMenu()}
+                    onClickOut={() => {
+                        return this.props.openSubscribeMenu();
+                    }}
                 >
                     <div
                         className={
@@ -78,11 +74,11 @@ class SubscribeBox extends Component<ComponentProps> {
                             <ShouldRender if={emailNotification}>
                                 <button
                                     id="updates-dropdown-email-btn"
-
                                     disabled={this.props.subscribed.requesting}
-                                    onClick={() => this.selectbutton(1)}
+                                    onClick={() => {
+                                        return this.selectbutton(1);
+                                    }}
                                     className={
-
                                         this.props.select === 1
                                             ? 'icon-container selected'
                                             : 'icon-container'
@@ -102,11 +98,11 @@ class SubscribeBox extends Component<ComponentProps> {
                             <ShouldRender if={smsNotification}>
                                 <button
                                     id="updates-dropdown-sms-btn"
-
                                     disabled={this.props.subscribed.requesting}
-                                    onClick={() => this.selectbutton(2)}
+                                    onClick={() => {
+                                        return this.selectbutton(2);
+                                    }}
                                     className={
-
                                         this.props.select === 2
                                             ? 'icon-container selected'
                                             : 'icon-container'
@@ -126,11 +122,11 @@ class SubscribeBox extends Component<ComponentProps> {
                             <ShouldRender if={webhookNotification}>
                                 <button
                                     id="updates-dropdown-webhook-btn"
-
                                     disabled={this.props.subscribed.requesting}
-                                    onClick={() => this.selectbutton(3)}
+                                    onClick={() => {
+                                        return this.selectbutton(3);
+                                    }}
                                     className={
-
                                         this.props.select === 3
                                             ? 'icon-container selected'
                                             : 'icon-container'
@@ -150,11 +146,11 @@ class SubscribeBox extends Component<ComponentProps> {
                             <ShouldRender if={enableRSSFeed}>
                                 <button
                                     id="updates-dropdown-atom-btn"
-
                                     disabled={this.props.subscribed.requesting}
-                                    onClick={() => this.selectbutton(4)}
+                                    onClick={() => {
+                                        return this.selectbutton(4);
+                                    }}
                                     className={
-
                                         this.props.select === 4
                                             ? 'icon-container selected'
                                             : 'icon-container'
@@ -173,8 +169,9 @@ class SubscribeBox extends Component<ComponentProps> {
                             </ShouldRender>
                             <button
                                 id="updates-dropdown-close-btn"
-                                onClick={() => this.subscribebutton()}
-
+                                onClick={() => {
+                                    return this.subscribebutton();
+                                }}
                                 disabled={this.props.subscribed.requesting}
                                 className="icon-container"
                             >
@@ -199,17 +196,13 @@ class SubscribeBox extends Component<ComponentProps> {
                         >
                             <ShouldRender
                                 if={
-
                                     !this.props.openSelectedBox &&
-
                                     this.props.select === 1 &&
                                     emailNotification
                                 }
                             >
                                 <Message
-
                                     handleCloseButtonClick={
-
                                         this.props.handleCloseButtonClick
                                     }
                                     theme={theme}
@@ -217,17 +210,13 @@ class SubscribeBox extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     !this.props.openSelectedBox &&
-
                                     this.props.select === 2 &&
                                     smsNotification
                                 }
                             >
                                 <Call
-
                                     handleCloseButtonClick={
-
                                         this.props.handleCloseButtonClick
                                     }
                                     theme={theme}
@@ -235,17 +224,13 @@ class SubscribeBox extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     !this.props.openSelectedBox &&
-
                                     this.props.select === 3 &&
                                     webhookNotification
                                 }
                             >
                                 <Webhook
-
                                     handleCloseButtonClick={
-
                                         this.props.handleCloseButtonClick
                                     }
                                     theme={theme}
@@ -253,9 +238,7 @@ class SubscribeBox extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     !this.props.openSelectedBox &&
-
                                     this.props.select === 4 &&
                                     enableRSSFeed
                                 }
@@ -278,15 +261,12 @@ class SubscribeBox extends Component<ComponentProps> {
                             </ShouldRender>
                             <ShouldRender
                                 if={
-
                                     this.props.openSelectedBox &&
                                     selectIndividualMonitors
                                 }
                             >
                                 <Monitors
-
                                     handleCloseButtonClick={
-
                                         this.props.handleCloseButtonClick
                                     }
                                     theme={theme}
@@ -300,18 +280,20 @@ class SubscribeBox extends Component<ComponentProps> {
     }
 }
 
-
 SubscribeBox.displayName = 'SubscribeBox';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    select: state.subscribe.selectedMenu,
-    subscribed: state.subscribe.subscribed,
-    openSelectedBox: state.subscribe.openSelectedBox,
-    statusPage: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators({ openSubscribeMenu, selectedMenu }, dispatch);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        select: state.subscribe.selectedMenu,
+        subscribed: state.subscribe.subscribed,
+        openSelectedBox: state.subscribe.openSelectedBox,
+        statusPage: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators({ openSubscribeMenu, selectedMenu }, dispatch);
+};
 
 SubscribeBox.propTypes = {
     openSubscribeMenu: PropTypes.func,
diff --git a/StatusPage/src/Components/Subscribe/Webhook.tsx b/StatusPage/src/Components/Subscribe/Webhook.tsx
index 1f28fb33d1..3e5a4e6439 100755
--- a/StatusPage/src/Components/Subscribe/Webhook.tsx
+++ b/StatusPage/src/Components/Subscribe/Webhook.tsx
@@ -44,23 +44,17 @@ class Webhook extends Component<ComponentProps> {
         event.preventDefault();
 
         const projectId: $TSFixMe =
-
             this.props.statuspage &&
-
             this.props.statuspage.projectId &&
-
             this.props.statuspage.projectId._id;
 
         const statusPageId: $TSFixMe = this.props.statuspage._id;
 
-        const selectIndividualMonitors: $TSFixMe = this.props.statuspage
-            .selectIndividualMonitors;
-
+        const selectIndividualMonitors: $TSFixMe =
+            this.props.statuspage.selectIndividualMonitors;
 
         if (this.state.endpoint && this.state.endpoint.length) {
-
             if (this.state.email && this.state.email.length) {
-
                 const validemail: $TSFixMe = this.validation(this.state.email);
                 if (validemail) {
                     const values: $TSFixMe = this.state;
@@ -78,20 +72,16 @@ class Webhook extends Component<ComponentProps> {
                         );
                     }
 
-
                     this.props.userData(values);
                 } else {
-
                     this.props.validationError(
                         'Please enter a valid email address.'
                     );
                 }
             } else {
-
                 this.props.validationError('Please enter your email address.');
             }
         } else {
-
             this.props.validationError('Please enter your endpoint.');
         }
     };
@@ -103,9 +93,8 @@ class Webhook extends Component<ComponentProps> {
             )
         ) {
             return true;
-        } else {
-            return false;
         }
+        return false;
     };
     handleClose = (event: $TSFixMe) => {
         event.preventDefault();
@@ -119,143 +108,131 @@ class Webhook extends Component<ComponentProps> {
     override render() {
         return (
             <div>
-
-                {
-                    this.props.subscribed &&
-
-                        this.props.subscribed.success ? null : (
-                        <div className="directions">
-                            <Translate>
-                                Get webhook notifications when an incident is
-                            </Translate>{' '}
-                            <b>
-                                <Translate>created</Translate>
-                            </b>
-                            .
-                        </div>
-                    )
-                }
-                < form
+                {this.props.subscribed &&
+                this.props.subscribed.success ? null : (
+                    <div className="directions">
+                        <Translate>
+                            Get webhook notifications when an incident is
+                        </Translate>{' '}
+                        <b>
+                            <Translate>created</Translate>
+                        </b>
+                        .
+                    </div>
+                )}
+                <form
                     id="subscribe-form-webhook"
                     onSubmit={
-
                         this.props.subscribed && this.props.subscribed.success
                             ? this.handleClose
                             : this.handleSubmit
                     }
                 >
-
-                    {
-                        this.props.subscribed && this.props.subscribed.success ? (
-                            <div style={{ textAlign: 'center', margin: '15px 0' }}>
-                                <span
-                                    className="subscriber-success"
-                                    id="monitor-subscribe-success-message"
-                                >
-                                    <Translate>
-                                        You have subscribed to this status page
-                                        successfully
-                                    </Translate>
-                                </span>
-                            </div>
-                        ) : (
-                            <>
-                                <input
-                                    type="text"
-                                    name="endpoint"
-                                    onChange={this.handleChange}
-                                    id="endpoint-webhooks"
-                                    placeholder="http://www.yourdomain.com/endpoint/here"
-                                    className="input-full"
-                                />
-                                <p
-                                    className="small"
-                                    style={{ margin: '-5px 0px 5px 4px' }}
-                                >
-                                    <Translate>
-                                        The URL we should send the updates to.
-                                    </Translate>
-                                </p>
-                                <input
-                                    type="text"
-                                    name="email"
-                                    onChange={this.handleChange}
-                                    id="email-webhooks"
-                                    placeholder="Email Address"
-                                    className="input-full"
-                                />
-                                <p
-                                    className="small"
-                                    style={{ margin: '-5px 0px 10px 4px' }}
-                                >
-                                    <Translate>
-                                        We will send you email if your endpoint
-                                        fails.
-                                    </Translate>
-                                </p>
-                            </>
-                        )
-                    }
-                    < input
+                    {this.props.subscribed && this.props.subscribed.success ? (
+                        <div style={{ textAlign: 'center', margin: '15px 0' }}>
+                            <span
+                                className="subscriber-success"
+                                id="monitor-subscribe-success-message"
+                            >
+                                <Translate>
+                                    You have subscribed to this status page
+                                    successfully
+                                </Translate>
+                            </span>
+                        </div>
+                    ) : (
+                        <>
+                            <input
+                                type="text"
+                                name="endpoint"
+                                onChange={this.handleChange}
+                                id="endpoint-webhooks"
+                                placeholder="http://www.yourdomain.com/endpoint/here"
+                                className="input-full"
+                            />
+                            <p
+                                className="small"
+                                style={{ margin: '-5px 0px 5px 4px' }}
+                            >
+                                <Translate>
+                                    The URL we should send the updates to.
+                                </Translate>
+                            </p>
+                            <input
+                                type="text"
+                                name="email"
+                                onChange={this.handleChange}
+                                id="email-webhooks"
+                                placeholder="Email Address"
+                                className="input-full"
+                            />
+                            <p
+                                className="small"
+                                style={{ margin: '-5px 0px 10px 4px' }}
+                            >
+                                <Translate>
+                                    We will send you email if your endpoint
+                                    fails.
+                                </Translate>
+                            </p>
+                        </>
+                    )}
+                    <input
                         type="submit"
                         value={
-
                             this.props.subscribed &&
-
-                                this.props.subscribed.success
+                            this.props.subscribed.success
                                 ? 'Close'
                                 : 'Subscribe'
                         }
                         className={
-
                             this.props.theme
                                 ? 'subscribe-btn-full bs-theme-btn'
                                 : 'subscribe-btn-full'
                         }
                         id="subscribe-btn-webhook"
                     />
-                </form >
+                </form>
                 <ShouldRender
-
                     if={this.props.subscribed && this.props.subscribed.error}
                 >
                     <div className="validation-error">
                         <span className="validation-error-icon"></span>
                         <span className="error-text">
                             <Translate>
-
                                 {this.props.subscribed &&
-
                                     this.props.subscribed.error}
                             </Translate>
                         </span>
                     </div>
                 </ShouldRender>
-            </div >
+            </div>
         );
     }
 }
 
-
 Webhook.displayName = 'Webhook';
 
-const mapStateToProps: Function = (state: RootState) => ({
-    userDetails: state.subscribe.userDetails,
-    subscribed: state.subscribe.subscribed,
-    statuspage: state.status.statusPage
-});
-
-const mapDispatchToProps: Function = (dispatch: Dispatch) => bindActionCreators(
-    {
-        userData,
-        validationError,
-        subscribeUser,
-        openSubscribeMenu,
-        userDataReset,
-    },
-    dispatch
-);
+const mapStateToProps: Function = (state: RootState) => {
+    return {
+        userDetails: state.subscribe.userDetails,
+        subscribed: state.subscribe.subscribed,
+        statuspage: state.status.statusPage,
+    };
+};
 
+const mapDispatchToProps: Function = (dispatch: Dispatch) => {
+    return bindActionCreators(
+        {
+            userData,
+            validationError,
+            subscribeUser,
+            openSubscribeMenu,
+            userDataReset,
+        },
+        dispatch
+    );
+};
 
 Webhook.propTypes = {
     userData: PropTypes.func,
diff --git a/StatusPage/src/Components/Twitter.tsx b/StatusPage/src/Components/Twitter.tsx
index 87d5f27242..8b57a436ae 100644
--- a/StatusPage/src/Components/Twitter.tsx
+++ b/StatusPage/src/Components/Twitter.tsx
@@ -1,12 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import moment from 'moment';
-const Twitter: Function = ({
-    tweets,
-    theme,
-    loading,
-    error
-}: $TSFixMe) => {
+const Twitter: Function = ({ tweets, theme, loading, error }: $TSFixMe) => {
     const TweetLayout: $TSFixMe =
         theme && theme === 'Classic Theme' ? (
             <div
@@ -42,8 +37,10 @@ const Twitter: Function = ({
                                     style={{ marginTop: '35px' }}
                                 >
                                     {tweets?.length &&
-                                        tweets.map((tweet: $TSFixMe, i: $TSFixMe) =>
-                                            TweetList(tweet, i)
+                                        tweets.map(
+                                            (tweet: $TSFixMe, i: $TSFixMe) => {
+                                                return TweetList(tweet, i);
+                                            }
                                         )}
                                 </ul>
                             )}
@@ -86,8 +83,10 @@ const Twitter: Function = ({
                         ) : (
                             <ul className="feed-contents plain">
                                 {tweets?.length &&
-                                    tweets.map((tweet: $TSFixMe, i: $TSFixMe) =>
-                                        TweetList(tweet, i)
+                                    tweets.map(
+                                        (tweet: $TSFixMe, i: $TSFixMe) => {
+                                            return TweetList(tweet, i);
+                                        }
                                     )}
                             </ul>
                         )}
diff --git a/StatusPage/src/Components/UptimeLegend.tsx b/StatusPage/src/Components/UptimeLegend.tsx
index 02c3758829..bfc409dcfc 100755
--- a/StatusPage/src/Components/UptimeLegend.tsx
+++ b/StatusPage/src/Components/UptimeLegend.tsx
@@ -20,48 +20,53 @@ const UptimeLegend: Function = ({
     uptimeColor,
     degradedColor,
     disabledColor,
-    disabled
-}: UptimeLegendProps) => (
-    <div className="uptime-legend box-inner clearfix" style={background}>
-        <span className="legend-item">
-            <span className="legend-color graph-up" style={uptimeColor}></span>
-            <label style={secondaryTextColor}>
-                100% <Translate>uptime</Translate>
-            </label>
-        </span>
-        <span className="legend-item">
-            <span
-                className="legend-color graph-mid"
-                style={degradedColor}
-            ></span>
-            <label style={secondaryTextColor}>
-                <Translate>Partial degradation</Translate>
-            </label>
-        </span>
-        <span className="legend-item">
-            <span
-                className="legend-color graph-down"
-                style={downtimeColor}
-            ></span>
-            <label style={secondaryTextColor}>
-                <Translate>Downtime</Translate>
-            </label>
-        </span>
-        {disabled ? (
+    disabled,
+}: UptimeLegendProps) => {
+    return (
+        <div className="uptime-legend box-inner clearfix" style={background}>
             <span className="legend-item">
                 <span
-                    className="legend-color graph-disabled"
-                    style={disabledColor}
+                    className="legend-color graph-up"
+                    style={uptimeColor}
                 ></span>
                 <label style={secondaryTextColor}>
-                    <Translate>Disabled</Translate>
+                    100% <Translate>uptime</Translate>
                 </label>
             </span>
-        ) : (
-            ''
-        )}
-    </div>
-);
+            <span className="legend-item">
+                <span
+                    className="legend-color graph-mid"
+                    style={degradedColor}
+                ></span>
+                <label style={secondaryTextColor}>
+                    <Translate>Partial degradation</Translate>
+                </label>
+            </span>
+            <span className="legend-item">
+                <span
+                    className="legend-color graph-down"
+                    style={downtimeColor}
+                ></span>
+                <label style={secondaryTextColor}>
+                    <Translate>Downtime</Translate>
+                </label>
+            </span>
+            {disabled ? (
+                <span className="legend-item">
+                    <span
+                        className="legend-color graph-disabled"
+                        style={disabledColor}
+                    ></span>
+                    <label style={secondaryTextColor}>
+                        <Translate>Disabled</Translate>
+                    </label>
+                </span>
+            ) : (
+                ''
+            )}
+        </div>
+    );
+};
 
 UptimeLegend.displayName = 'UptimeLegend';
 
diff --git a/StatusPage/src/Components/basic/AffectedResources.tsx b/StatusPage/src/Components/basic/AffectedResources.tsx
index 7be867204f..7204bee21c 100644
--- a/StatusPage/src/Components/basic/AffectedResources.tsx
+++ b/StatusPage/src/Components/basic/AffectedResources.tsx
@@ -7,14 +7,14 @@ import { Translate } from 'react-auto-translate';
 interface AffectedResourcesProps {
     event?: object;
     monitorState?: unknown[];
-    colorStyle?: "white" | "grey";
+    colorStyle?: 'white' | 'grey';
 }
 
 const AffectedResources: Function = ({
     event,
     monitorState,
     colorStyle,
-    cleanTheme = false
+    cleanTheme = false,
 }: AffectedResourcesProps) => {
     const affectedMonitors: $TSFixMe = [];
     let monitorCount = 0;
@@ -35,8 +35,10 @@ const AffectedResources: Function = ({
         }
         return monitor;
     });
-    // check if the length of monitors on status page equals the monitor count
-    // if they are equal then all the monitors in status page is in a particular scheduled event
+    /*
+     * check if the length of monitors on status page equals the monitor count
+     * if they are equal then all the monitors in status page is in a particular scheduled event
+     */
     if (monitorCount === monitorState.length) {
         if (cleanTheme) {
             return (
@@ -86,9 +88,10 @@ const AffectedResources: Function = ({
                 </span>
             </>
         );
-    } else {
-        if (cleanTheme) {
-            return <>
+    }
+    if (cleanTheme) {
+        return (
+            <>
                 <span
                     className="ongoing__affectedmonitor--title"
                     style={{
@@ -107,14 +110,18 @@ const AffectedResources: Function = ({
                 >
                     {affectedMonitors
 
-                        .map(monitor => capitalize(monitor.name))
+                        .map((monitor) => {
+                            return capitalize(monitor.name);
+                        })
                         .join(', ')
                         .replace(/, ([^,]*)$/, ' and $1')}
                 </span>
-            </>;
-        }
+            </>
+        );
+    }
 
-        return <>
+    return (
+        <>
             <span
                 className="ongoing__affectedmonitor--title"
                 style={
@@ -135,12 +142,14 @@ const AffectedResources: Function = ({
             >
                 {affectedMonitors
 
-                    .map(monitor => capitalize(monitor.name))
+                    .map((monitor) => {
+                        return capitalize(monitor.name);
+                    })
                     .join(', ')
                     .replace(/, ([^,]*)$/, ' and $1')}
             </span>
-        </>;
-    }
+        </>
+    );
 };
 
 AffectedResources.displayName = 'AffectedResources';
diff --git a/StatusPage/src/Components/basic/Badge.tsx b/StatusPage/src/Components/basic/Badge.tsx
index 5046d69c78..13ef00789e 100644
--- a/StatusPage/src/Components/basic/Badge.tsx
+++ b/StatusPage/src/Components/basic/Badge.tsx
@@ -33,10 +33,10 @@ function Badge({
                     style={
                         fontColor
                             ? {
-                                color: fontColor,
-                                display: 'inline-block',
-                                paddingTop: 2,
-                            }
+                                  color: fontColor,
+                                  display: 'inline-block',
+                                  paddingTop: 2,
+                              }
                             : { display: 'inline-block', paddingTop: 2 }
                     }
                 >
diff --git a/StatusPage/src/Components/basic/ErrorBoundary.tsx b/StatusPage/src/Components/basic/ErrorBoundary.tsx
index 4b5982efb2..f3f4ba7e91 100644
--- a/StatusPage/src/Components/basic/ErrorBoundary.tsx
+++ b/StatusPage/src/Components/basic/ErrorBoundary.tsx
@@ -17,7 +17,6 @@ class ErrorBoundary extends Component<ComponentProps> {
     }
 
     override render() {
-
         if (this.state.hasError || this.state.error) {
             return (
                 <div
@@ -47,10 +46,8 @@ class ErrorBoundary extends Component<ComponentProps> {
     }
 }
 
-
 ErrorBoundary.displayName = 'ErrorBoundary';
 
-
 ErrorBoundary.propTypes = {
     children: PropTypes.any,
 };
diff --git a/StatusPage/src/Components/basic/Loader.tsx b/StatusPage/src/Components/basic/Loader.tsx
index 3cb63f397c..4c279d1e8e 100755
--- a/StatusPage/src/Components/basic/Loader.tsx
+++ b/StatusPage/src/Components/basic/Loader.tsx
@@ -4,96 +4,118 @@ const loaderStyle: $TSFixMe = {
     backgroundColor: '#96d8ff',
 };
 
-export const FlatLoader: Function = () => (
-    <div className="ball-pulse">
-        <div style={loaderStyle}></div>
-        <div style={loaderStyle}></div>
-        <div style={loaderStyle}></div>
-    </div>
-);
+export const FlatLoader: Function = () => {
+    return (
+        <div className="ball-pulse">
+            <div style={loaderStyle}></div>
+            <div style={loaderStyle}></div>
+            <div style={loaderStyle}></div>
+        </div>
+    );
+};
 
 FlatLoader.displayName = 'FlatLoader';
 
-export const FormLoader: Function = () => (
-    <div className="ball-beat">
-        <div style={{ height: '8px', width: '8px' }}></div>
-        <div style={{ height: '8px', width: '8px' }}></div>
-        <div style={{ height: '8px', width: '8px' }}></div>
-    </div>
-);
+export const FormLoader: Function = () => {
+    return (
+        <div className="ball-beat">
+            <div style={{ height: '8px', width: '8px' }}></div>
+            <div style={{ height: '8px', width: '8px' }}></div>
+            <div style={{ height: '8px', width: '8px' }}></div>
+        </div>
+    );
+};
 
 FormLoader.displayName = 'FormLoader';
 
-export const ListLoader: Function = () => (
-    <div
-        className="ball-beat"
-        style={{ textAlign: 'center', marginTop: '20px' }}
-    >
+export const ListLoader: Function = () => {
+    return (
         <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-        <div
-            style={{ height: '8px', width: '8px', backgroundColor: '#4c4c4c' }}
-        ></div>
-    </div>
-);
+            className="ball-beat"
+            style={{ textAlign: 'center', marginTop: '20px' }}
+        >
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+            <div
+                style={{
+                    height: '8px',
+                    width: '8px',
+                    backgroundColor: '#4c4c4c',
+                }}
+            ></div>
+        </div>
+    );
+};
 
 ListLoader.displayName = 'ListLoader';
 
-export const Spinner: Function = () => (
-    <div className="Spinner bs-SpinnerLegacy Spinner--color--white Box-root Flex-inlineFlex Flex-alignItems--center Flex-justifyContent--center">
-        <svg
-            viewBox="0 0 24 24"
-            xmlns="http://www.w3.org/2000/svg"
-            className="Spinner-svg"
-        >
-            <ellipse
-                cx={12}
-                cy={12}
-                rx={10}
-                ry={10}
-                className="Spinner-ellipse"
-            />
-        </svg>
-    </div>
-);
+export const Spinner: Function = () => {
+    return (
+        <div className="Spinner bs-SpinnerLegacy Spinner--color--white Box-root Flex-inlineFlex Flex-alignItems--center Flex-justifyContent--center">
+            <svg
+                viewBox="0 0 24 24"
+                xmlns="http://www.w3.org/2000/svg"
+                className="Spinner-svg"
+            >
+                <ellipse
+                    cx={12}
+                    cy={12}
+                    rx={10}
+                    ry={10}
+                    className="Spinner-ellipse"
+                />
+            </svg>
+        </div>
+    );
+};
 
 Spinner.displayName = 'Spinner';
 
-export const LoadingState: Function = () => (
-    <div className="Box-root Margin-bottom--12">
-        <div className="bs-ContentSection Card-root Card-shadow--medium">
-            <div className="Box-root">
-                <div className="ContentState Box-root">
-                    <div className="Box-root Padding-horizontal--20 Padding-vertical--48">
-                        <div className="Box-root Flex-flex Flex-alignItems--center Flex-direction--column Flex-justifyContent--flexStart">
-                            <div className="Box-root Margin-bottom--12">
-                                <div className="Box-root">
-                                    <div className="Spinner bs-SpinnerLegacy Spinner--size--large Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center">
-                                        <svg
-                                            viewBox="0 0 24 24"
-                                            xmlns="http://www.w3.org/2000/svg"
-                                            className="Spinner-svg"
-                                        >
-                                            <ellipse
-                                                cx={12}
-                                                cy={12}
-                                                rx={10}
-                                                ry={10}
-                                                className="Spinner-ellipse"
-                                            />
-                                        </svg>
+export const LoadingState: Function = () => {
+    return (
+        <div className="Box-root Margin-bottom--12">
+            <div className="bs-ContentSection Card-root Card-shadow--medium">
+                <div className="Box-root">
+                    <div className="ContentState Box-root">
+                        <div className="Box-root Padding-horizontal--20 Padding-vertical--48">
+                            <div className="Box-root Flex-flex Flex-alignItems--center Flex-direction--column Flex-justifyContent--flexStart">
+                                <div className="Box-root Margin-bottom--12">
+                                    <div className="Box-root">
+                                        <div className="Spinner bs-SpinnerLegacy Spinner--size--large Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--center">
+                                            <svg
+                                                viewBox="0 0 24 24"
+                                                xmlns="http://www.w3.org/2000/svg"
+                                                className="Spinner-svg"
+                                            >
+                                                <ellipse
+                                                    cx={12}
+                                                    cy={12}
+                                                    rx={10}
+                                                    ry={10}
+                                                    className="Spinner-ellipse"
+                                                />
+                                            </svg>
+                                        </div>
                                     </div>
                                 </div>
-                            </div>
-                            <div className="Box-root">
                                 <div className="Box-root">
-                                    <span className="ContentState-title Text-align--center Text-color--secondary Text-display--block Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
-                                        <span>Loading</span>
-                                    </span>
+                                    <div className="Box-root">
+                                        <span className="ContentState-title Text-align--center Text-color--secondary Text-display--block Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap">
+                                            <span>Loading</span>
+                                        </span>
+                                    </div>
                                 </div>
                             </div>
                         </div>
@@ -101,6 +123,6 @@ export const LoadingState: Function = () => (
                 </div>
             </div>
         </div>
-    </div>
-);
+    );
+};
 LoadingState.displayName = 'LoadingState';
diff --git a/StatusPage/src/Components/basic/RenderField.tsx b/StatusPage/src/Components/basic/RenderField.tsx
index 9cdb64c7d4..c3af5384b1 100755
--- a/StatusPage/src/Components/basic/RenderField.tsx
+++ b/StatusPage/src/Components/basic/RenderField.tsx
@@ -31,27 +31,29 @@ const RenderField: Function = ({
     id,
     disabled,
     initialValue,
-    style
-}: RenderFieldProps) => (
-    <span>
+    style,
+}: RenderFieldProps) => {
+    return (
         <span>
-            <input
-                {...input}
-                type={type}
-                placeholder={placeholder}
-                className={className}
-                id={id}
-                disabled={disabled || false}
-                defaultValue={initialValue}
-                style={style || {}}
-            />
+            <span>
+                <input
+                    {...input}
+                    type={type}
+                    placeholder={placeholder}
+                    className={className}
+                    id={id}
+                    disabled={disabled || false}
+                    defaultValue={initialValue}
+                    style={style || {}}
+                />
+            </span>
+            <br />
+            {meta.error && meta.touched && (
+                <span style={errorStyle}>{meta.error}</span>
+            )}
         </span>
-        <br />
-        {meta.error && meta.touched && (
-            <span style={errorStyle}>{meta.error}</span>
-        )}
-    </span>
-);
+    );
+};
 
 RenderField.displayName = 'RenderField';
 
diff --git a/package.json b/package.json
index 3192d09a5c..efa396fe49 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
         "count-total-lines-of-code": "git grep ^ | wc -l",
         "uninstall": "docker stop $(docker ps -a -q) && docker rm $(docker ps -a -q)",
         "delete-all-local-branches": "git branch | grep -v 'master' | xargs git branch -D",
-        "lint": "ejslint home/views/*.ejs && eslint '**/*.ts,**/*.tsx' -c .eslintrc.json --ignore-path .eslintignore ",
+        "lint": "ejslint home/views/*.ejs && eslint '**/*.ts*' -c .eslintrc.json --ignore-path .eslintignore ",
         "fix-lint": "eslint '**/*.ts*' -c .eslintrc.json --ignore-path .eslintignore --fix ",
         "fix": "npm run fix-lint",
         "build": "docker-compose --env-file ./docker-enterprise.env build",