diff --git a/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.js b/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.js
index e54d5a3b6..8e05f558e 100644
--- a/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.js
+++ b/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.js
@@ -14,15 +14,16 @@ import styles from './ExtensionInviteCodeModal.module.scss'
const CAN_CLOSE_AFTER_MS = 5400
const ExtensionInviteCodeModal = ({ inviteCode, waitForClose = true }) => {
- const { onHideModal } = useModals()
+ const { hideModal } = useModals()
const { addToast } = useToasts()
const [remainingTime, setRemainingTime] = useState(CAN_CLOSE_AFTER_MS)
const [canClose, setCanClose] = useState(!waitForClose)
const handleCloseModal = useCallback(() => {
if (!canClose) return
- onHideModal()
- }, [canClose, onHideModal])
+
+ hideModal()
+ }, [canClose, hideModal])
useEffect(() => {
const startingTime = Date.now()
diff --git a/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.module.scss b/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.module.scss
index 2a1feedce..d4e1fc44a 100644
--- a/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.module.scss
+++ b/src/components/Modals/ExtensionInviteCodeModal/ExtensionInviteCodeModal.module.scss
@@ -69,6 +69,7 @@ $min-modal-height: 34.375rem;
color: #fff;
font-size: 0.875rem;
opacity: 0.6;
+ user-select: none;
}
.closeIcon {
cursor: pointer;
diff --git a/src/components/Wallet/Wallet.js b/src/components/Wallet/Wallet.js
index 1026b0450..77526defc 100644
--- a/src/components/Wallet/Wallet.js
+++ b/src/components/Wallet/Wallet.js
@@ -43,6 +43,10 @@ export default function Wallet(props) {
key: 'dAppsAdvancedMode',
defaultValue: []
})
+ const [extensionInviteCodeModalSeenBy, setExtensionInviteCodeModalSeenBy] = useLocalStorage({
+ key: 'extensionInviteCodeModalSeenBy',
+ defaultValue: []
+ })
const routes = [
{
@@ -257,7 +261,16 @@ export default function Wallet(props) {
if (!key || used || rewardsAccountAddr !== account.id) return
- showModal(, { disableClose: true })
+ const isSeen = extensionInviteCodeModalSeenBy.includes(account.id)
+
+ if (!isSeen) {
+ setExtensionInviteCodeModalSeenBy((prev) => [...prev, account.id])
+ }
+
+ showModal(, {
+ disableClose: !isSeen
+ })
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [
props.accounts,
props.relayerURL,
@@ -271,7 +284,8 @@ export default function Wallet(props) {
isClipboardGranted,
isNoticationsGranted,
modalHidden,
- showModal
+ showModal,
+ setExtensionInviteCodeModalSeenBy
])
useEffect(() => handleDisplayInitialModal(), [handleDisplayInitialModal])