fix lint

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>

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>
                 }

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>

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

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;

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>

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,

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,

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,

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,

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,

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,
 };

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>
             )}

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,
 };

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';

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';
 

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 && (

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';
 

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,

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 = {

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,

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,

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,

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,

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,
 };

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`}

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');
+    };
 }

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 = {};
 

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,

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,

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,

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,

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,

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,

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,

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);

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';
 

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}

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}
         />

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,

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,

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,

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} />;
+                            }}
                         />
                     );
                 })}

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,

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);

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);

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);

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;

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,

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([

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,

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(() => {

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);

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);

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(

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);

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);

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,

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);

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,

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);

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);

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,

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,

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);

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);

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);

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,

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,

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,

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,

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,

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"

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';
 

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() {

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 = () => {

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

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,

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,

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,

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,

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,

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;

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,

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,

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

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);

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 = {

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';
 

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';
 

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);

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,

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';
 

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';
 

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';
 

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';
 

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);

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,

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,

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,