diff --git a/ui/components/app/account-list-item/account-list-item.js b/ui/components/app/account-list-item/account-list-item.js
index 5220dede9..bd9745552 100644
--- a/ui/components/app/account-list-item/account-list-item.js
+++ b/ui/components/app/account-list-item/account-list-item.js
@@ -24,11 +24,8 @@ export default function AccountListItem({
className="account-list-item__identicon"
diameter={18}
/>
-
{name || address}
-
- {icon && {icon}
}
-
+ {icon ? {icon}
: null}
diff --git a/ui/components/app/account-menu/account-menu.component.js b/ui/components/app/account-menu/account-menu.component.js
index c644a2176..19188fbc2 100644
--- a/ui/components/app/account-menu/account-menu.component.js
+++ b/ui/components/app/account-menu/account-menu.component.js
@@ -196,7 +196,9 @@ export default class AccountMenu extends Component {
key={identity.address}
>
- {isSelected &&
}
+ {isSelected ? (
+
+ ) : null}
diff --git a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
index 030cb14f2..509e4ebee 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
+++ b/ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js
@@ -93,7 +93,7 @@ export default class ConfirmPageContainerContent extends Component {
return (
- {warning &&
}
+ {warning ?
: null}
{ethGasPriceWarning && (
)}
@@ -124,7 +124,9 @@ export default class ConfirmPageContainerContent extends Component {
submitText={submitText}
disabled={disabled}
>
- {unapprovedTxCount > 1 &&
{rejectNText}}
+ {unapprovedTxCount > 1 ? (
+
{rejectNText}
+ ) : null}
);
diff --git a/ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js b/ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js
index 9c84a720a..2d1ff99b0 100644
--- a/ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js
+++ b/ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js
@@ -56,7 +56,7 @@ export default function ConfirmPageContainerHeader({
)}
- {!isFullScreen && }
+ {isFullScreen ? null : }
{children}
diff --git a/ui/components/app/contact-list/contact-list.component.js b/ui/components/app/contact-list/contact-list.component.js
index 713edfcfb..636c17513 100644
--- a/ui/components/app/contact-list/contact-list.component.js
+++ b/ui/components/app/contact-list/contact-list.component.js
@@ -106,9 +106,9 @@ export default class ContactList extends PureComponent {
return (
{children || null}
- {searchForRecents && this.renderRecents()}
- {searchForContacts && this.renderAddressBook()}
- {searchForMyAccounts && this.renderMyAccounts()}
+ {searchForRecents ? this.renderRecents() : null}
+ {searchForContacts ? this.renderAddressBook() : null}
+ {searchForMyAccounts ? this.renderMyAccounts() : null}
);
}
diff --git a/ui/components/app/modal/modal-content/modal-content.component.js b/ui/components/app/modal/modal-content/modal-content.component.js
index 99f57bc03..e23812812 100644
--- a/ui/components/app/modal/modal-content/modal-content.component.js
+++ b/ui/components/app/modal/modal-content/modal-content.component.js
@@ -12,7 +12,7 @@ export default class ModalContent extends PureComponent {
return (
- {title &&
{title}
}
+ {title ?
{title}
: null}
{description && (
{description}
)}
diff --git a/ui/components/app/signature-request/signature-request-header/signature-request-header.component.js b/ui/components/app/signature-request/signature-request-header/signature-request-header.component.js
index 684a3abce..e853ea427 100644
--- a/ui/components/app/signature-request/signature-request-header/signature-request-header.component.js
+++ b/ui/components/app/signature-request/signature-request-header/signature-request-header.component.js
@@ -14,7 +14,7 @@ export default class SignatureRequestHeader extends PureComponent {
return (
- {fromAccount &&
}
+ {fromAccount ?
: null}
diff --git a/ui/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js b/ui/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js
index 9e1c91355..7f52daaa8 100644
--- a/ui/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js
+++ b/ui/components/app/transaction-activity-log/transaction-activity-log-icon/transaction-activity-log-icon.component.js
@@ -40,7 +40,7 @@ export default class TransactionActivityLogIcon extends PureComponent {
return (
- {imagePath &&
}
+ {imagePath ?
: null}
);
}
diff --git a/ui/components/ui/actionable-message/actionable-message.js b/ui/components/ui/actionable-message/actionable-message.js
index 5b2af114d..746a9d2a4 100644
--- a/ui/components/ui/actionable-message/actionable-message.js
+++ b/ui/components/ui/actionable-message/actionable-message.js
@@ -35,7 +35,7 @@ export default function ActionableMessage({
return (
- {useIcon &&
}
+ {useIcon ?
: null}
{infoTooltipText && (
- {icon && {icon}}
+ {icon ? {icon} : null}
{children}
);
diff --git a/ui/components/ui/chip/chip.js b/ui/components/ui/chip/chip.js
index 232195f6e..6311ea72e 100644
--- a/ui/components/ui/chip/chip.js
+++ b/ui/components/ui/chip/chip.js
@@ -35,7 +35,7 @@ export default function Chip({
role={isInteractive ? 'button' : undefined}
tabIndex={isInteractive ? 0 : undefined}
>
- {leftIcon && {leftIcon}
}
+ {leftIcon ? {leftIcon}
: null}
{children ?? (
)}
- {rightIcon && {rightIcon}
}
+ {rightIcon ? {rightIcon}
: null}
);
}
diff --git a/ui/components/ui/icon-with-label/icon-with-label.js b/ui/components/ui/icon-with-label/icon-with-label.js
index 3551d10a5..a9f9bb744 100644
--- a/ui/components/ui/icon-with-label/icon-with-label.js
+++ b/ui/components/ui/icon-with-label/icon-with-label.js
@@ -6,7 +6,7 @@ export default function IconWithLabel({ icon, label, className }) {
return (
{icon}
- {label && {label}}
+ {label ? {label} : null}
);
}
diff --git a/ui/components/ui/list-item/list-item.component.js b/ui/components/ui/list-item/list-item.component.js
index 61f4c8a58..699e24da2 100644
--- a/ui/components/ui/list-item/list-item.component.js
+++ b/ui/components/ui/list-item/list-item.component.js
@@ -33,7 +33,7 @@ export default function ListItem({
}
}}
>
- {icon &&
{icon}
}
+ {icon ?
{icon}
: null}
{React.isValidElement(title) ? (
title
@@ -44,12 +44,16 @@ export default function ListItem({
{titleIcon}
)}
- {subtitle &&
{subtitle}
}
- {children &&
{children}
}
- {midContent &&
{midContent}
}
- {rightContent && (
+ {subtitle ? (
+
{subtitle}
+ ) : null}
+ {children ?
{children}
: null}
+ {midContent ? (
+
{midContent}
+ ) : null}
+ {rightContent ? (
{rightContent}
- )}
+ ) : null}
);
}
diff --git a/ui/components/ui/page-container/page-container-header/page-container-header.component.js b/ui/components/ui/page-container/page-container-header/page-container-header.component.js
index 24d1d9e53..78f71b65a 100644
--- a/ui/components/ui/page-container/page-container-header/page-container-header.component.js
+++ b/ui/components/ui/page-container/page-container-header/page-container-header.component.js
@@ -21,7 +21,7 @@ export default class PageContainerHeader extends Component {
renderTabs() {
const { tabs } = this.props;
- return tabs &&
;
+ return tabs ?
: null;
}
renderCloseAction() {
@@ -99,7 +99,9 @@ export default class PageContainerHeader extends Component {
{title}
)}
- {subtitle &&
{subtitle}
}
+ {subtitle ? (
+
{subtitle}
+ ) : null}
{this.renderCloseAction()}
diff --git a/ui/components/ui/qr-code/qr-code.js b/ui/components/ui/qr-code/qr-code.js
index 84f40836b..89ce505ab 100644
--- a/ui/components/ui/qr-code/qr-code.js
+++ b/ui/components/ui/qr-code/qr-code.js
@@ -26,6 +26,10 @@ function QrCodeView(props) {
qrImage.addData(address);
qrImage.make();
+ const header = message ? (
+
{message}
+ ) : null;
+
return (
{Array.isArray(message) ? (
@@ -37,9 +41,9 @@ function QrCodeView(props) {
))}
) : (
- message &&
{message}
+ header
)}
- {warning &&
{warning}}
+ {warning ?
{warning} : null}
- {suffix &&
{suffix}
}
+ {suffix ?
{suffix}
: null}
{children}
diff --git a/ui/pages/create-account/connect-hardware/account-list.js b/ui/pages/create-account/connect-hardware/account-list.js
index 29922fcd2..f0b8d14d9 100644
--- a/ui/pages/create-account/connect-hardware/account-list.js
+++ b/ui/pages/create-account/connect-hardware/account-list.js
@@ -273,7 +273,7 @@ class AccountList extends Component {
{this.renderPagination()}
{this.renderButtons()}
{this.renderForgetDevice()}
- {showPopover && this.renderSelectPathPopover()}
+ {showPopover ? this.renderSelectPathPopover() : null}
);
}
diff --git a/ui/pages/create-account/connect-hardware/select-hardware.js b/ui/pages/create-account/connect-hardware/select-hardware.js
index bd1bba7c4..852857222 100644
--- a/ui/pages/create-account/connect-hardware/select-hardware.js
+++ b/ui/pages/create-account/connect-hardware/select-hardware.js
@@ -235,7 +235,7 @@ export default class SelectHardware extends Component {
{this.renderHeader()}
{this.renderButtons()}
- {this.state.selectedDevice && this.renderTutorialsteps()}
+ {this.state.selectedDevice ? this.renderTutorialsteps() : null}
{this.renderContinueButton()}
);
diff --git a/ui/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js b/ui/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
index 1a4e6115c..62c7769f4 100644
--- a/ui/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
+++ b/ui/pages/first-time-flow/create-password/import-with-seed-phrase/import-with-seed-phrase.component.js
@@ -258,7 +258,9 @@ export default class ImportWithSeedPhrase extends PureComponent {
autoComplete="off"
/>
)}
- {seedPhraseError && {seedPhraseError}}
+ {seedPhraseError ? (
+ {seedPhraseError}
+ ) : null}
- {isLoading && }
- {!isLoading && isNetworkLoading && }
+ {isLoading ? : null}
+ {!isLoading && isNetworkLoading ? : null}
{this.renderRoutes()}
{isUnlocked ? : null}
diff --git a/ui/pages/send/send-content/send-content.component.js b/ui/pages/send/send-content/send-content.component.js
index 0e80abbc0..738e85a85 100644
--- a/ui/pages/send/send-content/send-content.component.js
+++ b/ui/pages/send/send-content/send-content.component.js
@@ -50,17 +50,20 @@ export default class SendContent extends Component {
return (
- {gasError && this.renderError(gasError)}
- {isEthGasPrice && this.renderWarning(ETH_GAS_PRICE_FETCH_WARNING_KEY)}
- {isAssetSendable === false &&
- this.renderError(UNSENDABLE_ASSET_ERROR_KEY)}
- {error && this.renderError(error)}
- {warning && this.renderWarning()}
+ {gasError ? this.renderError(gasError) : null}
+ {isEthGasPrice
+ ? this.renderWarning(ETH_GAS_PRICE_FETCH_WARNING_KEY)
+ : null}
+ {isAssetSendable === false
+ ? this.renderError(UNSENDABLE_ASSET_ERROR_KEY)
+ : null}
+ {error ? this.renderError(error) : null}
+ {warning ? this.renderWarning() : null}
{this.maybeRenderAddContact()}
- {networkOrAccountNotSupports1559 && }
- {this.props.showHexData && }
+ {networkOrAccountNotSupports1559 ? : null}
+ {this.props.showHexData ? : null}
);
diff --git a/ui/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js b/ui/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js
index 949917171..9509d9a5f 100644
--- a/ui/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js
+++ b/ui/pages/send/send-content/send-row-wrapper/send-row-wrapper.component.js
@@ -30,7 +30,7 @@ export default class SendRowWrapper extends Component {
{formField}
- {showError && }
+ {showError ? : null}
@@ -50,7 +50,7 @@ export default class SendRowWrapper extends Component {
{label}
- {showError && }
+ {showError ? : null}
{customLabelContent}
{formField}
diff --git a/ui/pages/settings/advanced-tab/advanced-tab.component.js b/ui/pages/settings/advanced-tab/advanced-tab.component.js
index 09e70a303..110c0fe4c 100644
--- a/ui/pages/settings/advanced-tab/advanced-tab.component.js
+++ b/ui/pages/settings/advanced-tab/advanced-tab.component.js
@@ -533,7 +533,7 @@ export default class AdvancedTab extends PureComponent {
return (
- {warning &&
{warning}
}
+ {warning ?
{warning}
: null}
{this.renderStateLogs()}
{this.renderMobileSync()}
{this.renderResetAccount()}
diff --git a/ui/pages/settings/contact-list-tab/contact-list-tab.component.js b/ui/pages/settings/contact-list-tab/contact-list-tab.component.js
index 0f315517f..707d4605f 100644
--- a/ui/pages/settings/contact-list-tab/contact-list-tab.component.js
+++ b/ui/pages/settings/contact-list-tab/contact-list-tab.component.js
@@ -136,7 +136,9 @@ export default class ContactListTab extends Component {
{this.renderAddressBookContent()}
{this.renderContactContent()}
- {!addingContact && addressBook.length > 0 && this.renderAddButton()}
+ {!addingContact && addressBook.length > 0
+ ? this.renderAddButton()
+ : null}
);
}
diff --git a/ui/pages/settings/networks-tab/networks-tab.component.js b/ui/pages/settings/networks-tab/networks-tab.component.js
index a7ab9e24a..4a943f0e3 100644
--- a/ui/pages/settings/networks-tab/networks-tab.component.js
+++ b/ui/pages/settings/networks-tab/networks-tab.component.js
@@ -244,7 +244,7 @@ export default class NetworksTab extends PureComponent {
return (
- {isFullScreen && this.renderSubHeader()}
+ {isFullScreen ? this.renderSubHeader() : null}
{this.renderNetworksTabContent()}
{!isFullScreen && !shouldRenderNetworkForm ? (
diff --git a/ui/pages/settings/security-tab/security-tab.component.js b/ui/pages/settings/security-tab/security-tab.component.js
index 8eab40ec2..05fcc9e0a 100644
--- a/ui/pages/settings/security-tab/security-tab.component.js
+++ b/ui/pages/settings/security-tab/security-tab.component.js
@@ -146,7 +146,7 @@ export default class SecurityTab extends PureComponent {
return (
- {warning &&
{warning}
}
+ {warning ?
{warning}
: null}
{this.renderSeedWords()}
{this.renderIncomingTransactionsOptIn()}
{this.renderPhishingDetectionToggle()}
diff --git a/ui/pages/settings/settings-tab/settings-tab.component.js b/ui/pages/settings/settings-tab/settings-tab.component.js
index d40b446c2..fc9eb651e 100644
--- a/ui/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/pages/settings/settings-tab/settings-tab.component.js
@@ -212,7 +212,7 @@ export default class SettingsTab extends PureComponent {
return (
- {warning &&
{warning}
}
+ {warning ?
{warning}
: null}
{this.renderCurrentConversion()}
{this.renderUsePrimaryCurrencyOptions()}
{this.renderCurrentLocale()}
diff --git a/ui/pages/swaps/awaiting-swap/awaiting-swap.js b/ui/pages/swaps/awaiting-swap/awaiting-swap.js
index d949c5441..8fbeeab83 100644
--- a/ui/pages/swaps/awaiting-swap/awaiting-swap.js
+++ b/ui/pages/swaps/awaiting-swap/awaiting-swap.js
@@ -272,7 +272,7 @@ export default function AwaitingSwap({
{descriptionText}
{content}
- {!errorKey && swapComplete &&
}
+ {!errorKey && swapComplete ?
: null}
{
if (errorKey === OFFLINE_FOR_MAINTENANCE) {
diff --git a/ui/pages/swaps/searchable-item-list/item-list/item-list.component.js b/ui/pages/swaps/searchable-item-list/item-list/item-list.component.js
index d74b50460..701ae428b 100644
--- a/ui/pages/swaps/searchable-item-list/item-list/item-list.component.js
+++ b/ui/pages/swaps/searchable-item-list/item-list/item-list.component.js
@@ -52,13 +52,16 @@ export default function ItemList({
// If there is a token for import based on a contract address, it's the only one in the list.
const hasTokenForImport = results.length === 1 && results[0].notImported;
+ const placeholder = Placeholder ? (
+
+ ) : null;
return results.length === 0 ? (
- Placeholder &&
+ placeholder
) : (
- {listTitle && (
+ {listTitle ? (
{listTitle}
- )}
+ ) : null}
e.key === 'Enter' && onClick()}
key={`searchable-item-list-item-${i}`}
>
- {(iconUrl || primaryLabel) && (
+ {iconUrl || primaryLabel ? (
- )}
- {!(iconUrl || primaryLabel) && identiconAddress && (
+ ) : null}
+ {!(iconUrl || primaryLabel) && identiconAddress ? (
- )}
- {IconComponent &&
}
+ ) : null}
+ {IconComponent ?
: null}
- {primaryLabel && (
+ {primaryLabel ? (
{primaryLabel}
- )}
- {secondaryLabel && (
+ ) : null}
+ {secondaryLabel ? (
{secondaryLabel}
- )}
+ ) : null}
{!hideRightLabels &&
- (rightPrimaryLabel || rightSecondaryLabel) && (
-
- {rightPrimaryLabel && (
-
- {rightPrimaryLabel}
-
- )}
- {rightSecondaryLabel && (
-
- {rightSecondaryLabel}
-
- )}
-
- )}
+ (rightPrimaryLabel || rightSecondaryLabel) ? (
+
+ {rightPrimaryLabel ? (
+
+ {rightPrimaryLabel}
+
+ ) : null}
+ {rightSecondaryLabel ? (
+
+ {rightSecondaryLabel}
+
+ ) : null}
+
+ ) : null}
{result.notImported && (