Merge pull request #3433 from superhero-com/feature/hide-private-key-…

…on-page-hidden Do not show sensitive content if not authenticated
superhero-com · Dec 16, 2024 · b4b49ea · b4b49ea
2 parents b14af72 + 4e8ecff
commit b4b49ea
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 1 deletion.
diff --git a/src/composables/modals.ts b/src/composables/modals.ts
@@ -215,8 +215,13 @@ export function useModals() {
     openModal(MODAL_ENABLE_BIOMETRIC_LOGIN);
   }
 
+  function closeAllModals() {
+    modalsOpenRaw.value?.forEach(({ key }) => closeModalByKey(key));
+  }
+
   return {
     modalsOpen,
+    closeAllModals,
     registerModal,
     openModal,
     openDefaultModal,

diff --git a/src/popup/App.vue b/src/popup/App.vue
@@ -365,7 +365,7 @@ export default defineComponent({
 
     .app-unauthenticated-placeholder {
       position: absolute;
-      z-index: 2;
+      z-index: $z-index-placeholder;
       inset: 0;
       visibility: hidden;
       opacity: 0;

diff --git a/src/popup/components/Modals/PasswordLogin.vue b/src/popup/components/Modals/PasswordLogin.vue
@@ -143,9 +143,12 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
+@use '@/styles/variables' as *;
 @use '@/styles/typography';
 
 .password-login {
+  z-index: $z-index-login-modal;
+
   .content-wrapper,
   .password-login-form {
     display: flex;

diff --git a/src/popup/components/Modals/ResetWalletModal.vue b/src/popup/components/Modals/ResetWalletModal.vue
@@ -63,6 +63,7 @@ import { IS_MOBILE_APP } from '@/constants';
 import {
   useAccounts,
   useAeSdk,
+  useModals,
   useNetworks,
   usePermissions,
   useUi,
@@ -95,13 +96,15 @@ export default defineComponent({
     const { resetUiSettings } = useUi();
     const { disconnectDapps } = useAeSdk();
     const { resetPermissions } = usePermissions();
+    const { closeAllModals } = useModals();
 
     async function onReset() {
       resetAccounts();
       resetNetworks();
       resetUiSettings();
       disconnectDapps();
       resetPermissions();
+      closeAllModals();
 
       WalletStorage.clear();
       if (IS_MOBILE_APP) {
@@ -129,6 +132,8 @@ export default defineComponent({
 @use '@/styles/variables' as *;
 
 .reset-wallet {
+  z-index: $z-index-login-modal;
+
   .icon-wrapper {
     margin: 8px auto 18px;
     color: $color-danger;

diff --git a/src/styles/variables.scss b/src/styles/variables.scss
@@ -13,6 +13,8 @@ $font-mono: 'IBM Plex Mono';
 
 $z-index-header: 2;
 $z-index-modal: $z-index-header + 2;
+$z-index-placeholder: $z-index-modal + 1;
+$z-index-login-modal: $z-index-placeholder + 1;
 $z-index-loader: $z-index-modal - 1; // Modals should always be above the loader
 $z-index-back-to-top: $z-index-modal + 1;