fix: nft detail view fav

Author: kvhnuke

packages/extension/src/providers/polkadot/ui/dot-update-metadata.vue

@@ -6,34 +6,14 @@
         class="common-popup__logo"
       ></sign-logo>
       <div class="common-popup__network">
-        <img src="@action/icons/raw/polkadot.png" />
-        <p>Polkadot</p>
+        <img :src="networks.polkadot.icon" />
+        <p>{{ metadata ? metadata.chain : networks.polkadot.name_long }}</p>
       </div>
     </template>
 
     <template #content>
       <h2>Update metadata</h2>
 
-      <div class="provider-verify-transaction__block">
-        <div class="provider-verify-transaction__account">
-          <img src="@action/icons/raw/account.png" />
-          <div class="provider-verify-transaction__account-info">
-            <h4>My account nickname</h4>
-            <div>
-              <p>
-                {{
-                  $filters.replaceWithEllipsis(
-                    "123NUNCjWVtxQjkukJ9dCn4awhACmmjXGtA9zZt1EJm37VGf",
-                    4,
-                    4
-                  )
-                }}
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-
       <div class="update-metadata__block">
         <div class="update-metadata__block-row">
           <div class="update-metadata__block-row-left">From</div>
@@ -98,6 +78,7 @@ import { onBeforeMount, ref, watch } from "vue";
 import { MetadataDef } from "@polkadot/extension-inject/types";
 import MetadataStorage from "@/providers/polkadot/libs/metadata-storage";
 import { ProviderRequestOptions } from "@/types/provider";
+import networks from "../networks";
 
 const windowPromise = WindowPromiseHandler(0);
 

packages/extension/src/ui/action/views/import-account/views/import-account-private-key.vue

@@ -67,24 +67,22 @@ const onInput = () => {
 };
 
 const importAction = async () => {
-  if (isValidKey.value) {
-    const buffer = hexToBuffer(formattedPrivateKey.value);
-    const wallet = new Wallet(buffer);
-    const newAddress = `0x${wallet.getAddress().toString("hex")}`;
-
-    if (await keyring.accountAlreadyAdded(newAddress)) {
-      accountAlreadyExists.value = true;
-      return;
-    }
+  const buffer = hexToBuffer(formattedPrivateKey.value);
+  const wallet = new Wallet(buffer);
+  const newAddress = `0x${wallet.getAddress().toString("hex")}`;
 
-    emit("update:wallet", {
-      privateKey: wallet.getPrivateKeyString(),
-      publicKey: wallet.getPublicKeyString(),
-      address: wallet.getAddressString(),
-      name: "",
-      signerType: SignerType.secp256k1,
-    });
+  if (await keyring.accountAlreadyAdded(newAddress)) {
+    accountAlreadyExists.value = true;
+    return;
   }
+
+  emit("update:wallet", {
+    privateKey: wallet.getPrivateKeyString(),
+    publicKey: wallet.getPublicKeyString(),
+    address: wallet.getAddressString(),
+    name: "",
+    signerType: SignerType.secp256k1,
+  });
 };
 </script>
 

packages/extension/src/ui/action/views/network-nfts/components/network-nfts-item.vue

@@ -22,7 +22,9 @@
     <nft-detail-view
       v-if="isDetail"
       :item="item"
+      :is-favorite="isFavorite"
       :link-action="openLink"
+      v-bind="$attrs"
       @close:popup="toggleDetail"
     />
   </div>

packages/extension/src/ui/action/views/nft-detail-view/index.vue

@@ -6,15 +6,20 @@
         <close-icon />
       </a>
 
-      <a class="nft-detail-view__favorite" @click="favClicked(!isFavorite)">
-        <nft-more-add-to-favorite v-if="!isFavorite" />
+      <a
+        class="nft-detail-view__favorite"
+        @click="favClicked(!localIsFavorite)"
+      >
+        <nft-more-add-to-favorite v-if="!localIsFavorite" />
         <nft-more-delete-from-favorite v-else />
       </a>
 
       <notification
         v-if="isFavoriteAction"
         :hide="toggleNotification"
-        :text="isFavorite ? 'Added to favorites' : 'Removed from favorites'"
+        :text="
+          localIsFavorite ? 'Added to favorites' : 'Removed from favorites'
+        "
         class="nft-detail-view__notification"
       />
 
@@ -29,7 +34,7 @@
 </template>
 
 <script setup lang="ts">
-import { PropType, ref, onUpdated, onMounted } from "vue";
+import { onMounted, PropType, ref } from "vue";
 import CloseIcon from "@action/icons/common/close-icon.vue";
 import ActionMenu from "@action/components/action-menu/index.vue";
 import NftMoreAddToFavorite from "@action/icons/nft/nft-more-add-to-favorite.vue";
@@ -43,8 +48,7 @@ const imageLoadError = (img: any) => {
 };
 
 const isFavoriteAction = ref(false);
-const isFavorite = ref(false);
-
+const localIsFavorite = ref(false);
 const props = defineProps({
   item: {
     type: Object as PropType<NFTItem>,
@@ -63,22 +67,20 @@ const props = defineProps({
     },
   },
 });
-
 onMounted(() => {
-  isFavorite.value = props.isFavorite;
+  localIsFavorite.value = props.isFavorite;
 });
-
 const emit = defineEmits<{
   (e: "close:popup"): void;
   (e: "update:favClicked", isFav: boolean, item: NFTItem): void;
 }>();
 const close = () => {
+  if (localIsFavorite.value !== props.isFavorite)
+    emit("update:favClicked", localIsFavorite.value, props.item);
   emit("close:popup");
 };
 const favClicked = (isFav: boolean) => {
-  emit("update:favClicked", isFav, props.item);
-  isFavorite.value = isFav;
-
+  localIsFavorite.value = isFav;
   setTimeout(() => {
     toggleNotification();
   }, 100);