Merge pull request #11365 from hassnian/issue-11364

ref: Remove Minted NFT Congratulations Notification

components/create/CreateNft.vue

@@ -317,7 +317,7 @@ import type { AutoTeleportAction } from '@/composables/autoTeleport/types'
 import type { AutoTeleportActionButtonConfirmEvent } from '@/components/common/autoTeleport/AutoTeleportActionButton.vue'
 
 // composables
-const { $consola } = useNuxtApp()
+const { $consola, $i18n } = useNuxtApp()
 const { urlPrefix, setUrlPrefix } = usePrefix()
 const { accountId } = useAuth()
 const { transaction, status, isLoading, blockNumber, isError }
@@ -606,18 +606,15 @@ watchEffect(async () => {
     && transactionStatus.value === 'done'
   ) {
     infoMessage(
-      `You will go to the detail in ${DETAIL_TIMEOUT / 1000} seconds`,
+      $i18n.t('mint.nft.redirect', [DETAIL_TIMEOUT / 1000]),
       { duration: DETAIL_TIMEOUT },
     )
 
     await delay(DETAIL_TIMEOUT)
     const nftId = await getNftId()
 
     if (nftId) {
-      router.push({
-        path: `/${urlPrefix.value}/gallery/${nftId}`,
-        query: { congratsNft: form.name },
-      })
+      router.push(`/${urlPrefix.value}/gallery/${nftId}`)
     }
     else {
       retry.value -= 1

components/gallery/GalleryItem.vue

@@ -1,10 +1,5 @@
 <template>
   <section class="py-5 gallery-item">
-    <MessageNotify
-      v-if="congratsNewNft"
-      :title="$t('mint.success')"
-      :subtitle="$t('mint.successCreateNewNft', [congratsNewNft])"
-    />
     <div class="flex flex-col lg:flex-row">
       <div class="w-full lg:w-2/5 lg:pr-7 group">
         <div
@@ -184,7 +179,6 @@ import { useGalleryItem } from './useGalleryItem'
 import { GALLERY_ITEM_TABS } from '@/components/gallery/GalleryItemTabsPanel/types'
 import CollectionDetailsPopover from '@/components/collectionDetailsPopover/CollectionDetailsPopover.vue'
 import { usePreferencesStore } from '@/stores/preferences'
-import { exist } from '@/utils/exist'
 import { formatBalanceEmptyOnZero, formatNumber } from '@/utils/format/balance'
 import { resolveMedia, MediaType } from '@/utils/gallery/media'
 import { sanitizeIpfsUrl, toOriginalContentUrl } from '@/utils/ipfs'
@@ -197,8 +191,6 @@ const NuxtImg = resolveComponent('NuxtImg')
 
 const { urlPrefix } = usePrefix()
 const { isAssetHub } = useIsChain(urlPrefix)
-const route = useRoute()
-const router = useRouter()
 const { placeholder } = useTheme()
 const mediaItemRef = ref<{
   isLewdBlurredLayer: boolean
@@ -251,15 +243,6 @@ watch(triggerOfferSuccess, (value) => {
   }
 })
 
-const congratsNewNft = ref('')
-
-onMounted(() => {
-  exist(route.query.congratsNft as string, (val) => {
-    congratsNewNft.value = val || ''
-    router.replace({ query: {} })
-  })
-})
-
 const { isUnlockable, unlockLink } = useUnlockable(collection)
 
 const title = computed(() =>

composables/transaction/types.ts

@@ -11,15 +11,10 @@ import type { Extrinsic } from '@/utils/transactionExecutor'
 import type { Metadata } from '@/services/nftStorage'
 
 type SuccessFunctionMessage = (blockNumber: string) => string
-export type ObjectMessage = {
-  message: string | SuccessFunctionMessage
-  large: boolean
-  shareLink?: string
-}
+
 export type ExecuteTransactionSuccessMessage =
   | string
   | SuccessFunctionMessage
-  | ObjectMessage
 
 type BaseExecuteTransactionParams = {
   arg: any[]

composables/useTransaction.ts

@@ -38,7 +38,6 @@ import type {
   ExecuteEvmTransactionParams,
   ExecuteSubstrateTransactionParams,
   ExecuteTransactionParams,
-  ObjectMessage,
   ActionCancelSwap,
   ActionAcceptSwap,
 } from './transaction/types'
@@ -57,7 +56,6 @@ import { doAfterCheckCurrentChainVM } from '@/components/common/ConnectWallet/op
 import { hasOperationsDisabled } from '@/utils/prefix'
 import { ShoppingActions } from '@/utils/shoppingActions'
 import {
-  showLargeNotification,
   successMessage as successNotification,
   warningMessage,
 } from '@/utils/notification'
@@ -66,16 +64,6 @@ export type TransactionOptions = {
   disableSuccessNotification?: boolean
 }
 
-const resolveLargeSuccessNotification = (
-  block: string,
-  objectMessage: ObjectMessage,
-) => {
-  const { $i18n } = useNuxtApp()
-  const title = $i18n.t('mint.success')
-  const message = resolveSuccessMessage(block, objectMessage.message)
-  showLargeNotification({ message, title, shareLink: objectMessage.shareLink })
-}
-
 const resolveMessage = (message?: string | (() => string)) => {
   if (!message) {
     return
@@ -132,15 +120,8 @@ const useExecuteTransaction = (options: TransactionOptions) => {
         return
       }
 
-      const isObject = typeof successMessage === 'object'
-      if (isObject && successMessage.large) {
-        return resolveLargeSuccessNotification(block, successMessage)
-      }
+      const message = resolveSuccessMessage(block, successMessage)
 
-      const message = resolveSuccessMessage(
-        block,
-        isObject ? successMessage.message : successMessage,
-      )
       successNotification(message)
     }
 

locales/en.json

@@ -1360,6 +1360,7 @@
         "title": "Preview",
         "uploadArt": "Upload your art to see a preview of your NFT here"
       },
+      "redirect": "You will be redirected to the NFT detail in {0} seconds.",
       "sale": {
         "label": "List For Sale On Marketplace",
         "message": "People will be able to buy your NFT."
@@ -1377,7 +1378,6 @@
     "shareWithFriends": "Share {0} with your friends",
     "submit": "Click to create NFT(s)",
     "success": "Congratulations",
-    "successCreateNewNft": "You have successfully created {0}",
     "successNewNfts": "You have successfully purchased this NFT",
     "successPurchasedNfts": "You have successfully purchased {0}",
     "transform": "Transform commands in NFT",

locales/hi.json

@@ -1048,7 +1048,6 @@
     "shareWithFriends": "अपने दोस्तों के साथ {0} साझा करें",
     "submit": "NFT(s) बनाने के लिए Click करें",
     "success": "बधाई हो",
-    "successCreateNewNft": "आपने {0} को सफलता पूर्वक बनाया है",
     "successNewNfts": "आपने सफलता पूर्वक इस NFT को खरीदा है",
     "successPurchasedNfts": "आपने {0} को सफलता पूर्वक खरीदा है",
     "transform": "NFT में कमांड ट्रांसफ़ॉर्म करें",

utils/notification.ts

@@ -6,7 +6,6 @@ import {
 import consola from 'consola'
 import { h } from 'vue'
 import Notification from '@/components/common/Notification.vue'
-import MessageNotify from '@/components/MessageNotify.vue'
 
 export type NotificationAction = { label: string, url: string, icon?: string }
 
@@ -80,30 +79,6 @@ export const showNotification = ({
   return notification.close as () => void
 }
 
-export const showLargeNotification = ({
-  message,
-  title,
-  duration = 10000,
-  shareLink = undefined,
-}: {
-  message: string
-  title?: string
-  duration?: number
-  shareLink?: string
-}): void => {
-  Notif.open({
-    component: h(MessageNotify, {
-      title: title,
-      subtitle: message,
-      noToast: true,
-      shareLink,
-    }),
-    duration,
-    variant: 'component',
-    closable: true,
-  })
-}
-
 export const infoMessage = (
   message,
   {