Merge pull request #53 from NaturalSelectionLabs/hotfix-right-use/pen…

…ding-in-setup Hotfix right use/pending in setup
NaturalSelectionLabs · Sep 20, 2021 · 6c577a1 · 6c577a1
2 parents 12a5f9e + fc67269
commit 6c577a1
Show file tree

Hide file tree

Showing 4 changed files with 87 additions and 23 deletions.
diff --git a/src/common/rss3.ts b/src/common/rss3.ts
@@ -16,6 +16,7 @@ export type IRSS3 = RSS3;
 
 export interface IAssetProfile {
     assets: GeneralAsset[];
+    status?: boolean;
 }
 
 export interface Theme {

diff --git a/src/views/Home.vue b/src/views/Home.vue
@@ -309,6 +309,28 @@
                     </Button>
                 </div>
             </div>
+
+            <Modal v-if="isShowingNotice">
+                <template #header>
+                    <h1>Oops!</h1>
+                </template>
+                <template #body>
+                    <p class="mt-1 p-4">
+                        {{ notice }}
+                    </p>
+                </template>
+                <template #footer>
+                    <div class="flex flex-row gap-5">
+                        <Button
+                            size="sm"
+                            class="w-72 bg-primary-btn text-primary-btn-text shadow-primary-btn"
+                            @click="isShowingNotice = false"
+                        >
+                            OK
+                        </Button>
+                    </div>
+                </template>
+            </Modal>
         </div>
         <div
             v-else
@@ -419,6 +441,8 @@ export default class Home extends Vue {
     scrollGitcoinsLeft: number = 0;
     lastRoute: string = '';
     defaultAvatar = config.defaultAvatar;
+    notice: string = '';
+    isShowingNotice: boolean = false;
 
     async mounted() {
         this.mountScrollEvent();
@@ -529,15 +553,17 @@ export default class Home extends Vue {
 
             await this.loadAccounts(await (<IRSS3>this.rss3).accounts.get(this.ethAddress));
 
-            const data = await RSS3.getAssetProfile(this.ethAddress);
-
-            if (data) {
-                await this.loadAssets(
-                    await (<IRSS3>this.rss3).assets.get(this.ethAddress),
-                    <GeneralAsset[]>data.assets,
-                );
-                this.isLoadingAssets = false;
-            }
+            const iv = setInterval(async () => {
+                const data = await RSS3.getAssetProfile((<IRSS3>this.rss3).account.address, true);
+                if (data && data.status !== false) {
+                    await this.loadAssets(
+                        await (<IRSS3>this.rss3).assets.get(this.ethAddress),
+                        <GeneralAsset[]>data.assets,
+                    );
+                    this.isLoadingAssets = false;
+                    clearInterval(iv);
+                }
+            }, 300);
         }, 0);
 
         setTimeout(async () => {
@@ -686,10 +712,21 @@ export default class Home extends Vue {
         this.$router.push('/setup/accounts');
     }
     toManageNFTs() {
-        this.$router.push('/setup/nfts');
+        // this.saveEdited();
+        if (this.isLoadingAssets) {
+            this.notice = 'NFTs still loading... Maybe check back later?';
+            this.isShowingNotice = true;
+        } else {
+            this.$router.push('/setup/nfts');
+        }
     }
     toManageGitcoins() {
-        this.$router.push('/setup/gitcoins');
+        if (this.isLoadingAssets) {
+            this.notice = 'Gitcoins still loading... Maybe check back later?';
+            this.isShowingNotice = true;
+        } else {
+            this.$router.push('/setup/gitcoins');
+        }
     }
 
     public toAccountsPage() {

diff --git a/src/views/Setup/RNSPending.vue b/src/views/Setup/RNSPending.vue
@@ -2,8 +2,8 @@
     <div class="h-screen bg-pending-bg flex justify-center items-center">
         <div class="max-w-md px-4 py-9 flex flex-col justify-center items-center h-full gap-20">
             <Loading :size="200" class="mb-50" />
-            <div class="w-full text-left font-medium text-primary">
-                <p class="text-2xl">Preparing your RNS ...</p>
+            <div class="w-full text-left font-medium text-primary-text">
+                <p class="text-2xl">Preparing your Pass ...</p>
                 <p class="text-base">Hold on a little bit or come back later!</p>
             </div>
         </div>

diff --git a/src/views/Setup/Setup.vue b/src/views/Setup/Setup.vue
@@ -44,7 +44,13 @@
                 class="mb-4 w-full"
                 :is-having-content="nfts.length !== 0"
                 :is-single-line="nfts.length !== 0"
-                :tips="isLoadingAssets ? 'Loading...' : nfts.length === 0 ? 'Haven\'t found anything yet...' : ''"
+                :tips="
+                    isLoadingAssets
+                        ? 'Loading... Hold on a little bit or manage them later 🙌'
+                        : nfts.length === 0
+                        ? 'Haven\'t found anything yet...'
+                        : ''
+                "
             >
                 <template #title-icon><NFTIcon /></template>
                 <template #header-button>
@@ -75,7 +81,13 @@
                 class="mb-4 w-full"
                 :is-having-content="gitcoins.length !== 0"
                 :is-single-line="gitcoins.length !== 0"
-                :tips="isLoadingAssets ? 'Loading...' : gitcoins.length === 0 ? 'Haven\'t found anything yet...' : ''"
+                :tips="
+                    isLoadingAssets
+                        ? 'Loading... Hold on a little bit or manage them later 🙌'
+                        : gitcoins.length === 0
+                        ? 'Haven\'t found anything yet...'
+                        : ''
+                "
             >
                 <template #title-icon
                     ><GitcoinIcon :iconColor="currentTheme === 'loot' ? 'white' : 'black'"
@@ -294,11 +306,15 @@ export default class Setup extends Vue {
 
         await this.loadAccounts(await (<IRSS3>this.rss3).accounts.get());
 
-        const data = await RSS3.getAssetProfile((<IRSS3>this.rss3).account.address);
-        if (data) {
-            await this.loadAssets(await (<IRSS3>this.rss3).assets.get(), <GeneralAsset[]>data.assets);
-            this.isLoadingAssets = false;
-        }
+        const iv = setInterval(async () => {
+            const data = await RSS3.getAssetProfile((<IRSS3>this.rss3).account.address, true);
+            if (data && data.status !== false) {
+                await this.loadAssets(await (<IRSS3>this.rss3).assets.get(), <GeneralAsset[]>data.assets);
+                this.isLoadingAssets = false;
+                clearInterval(iv);
+            }
+        }, 300);
+
         this.isLoading = false;
     }
 
@@ -403,10 +419,20 @@ export default class Setup extends Vue {
     }
     toManageNFTs() {
         // this.saveEdited();
-        this.$router.push('/setup/nfts');
+        if (this.isLoadingAssets) {
+            this.notice = 'NFTs still loading... Maybe check back later?';
+            this.isShowingNotice = true;
+        } else {
+            this.$router.push('/setup/nfts');
+        }
     }
     toManageGitcoins() {
-        this.$router.push('/setup/gitcoins');
+        if (this.isLoadingAssets) {
+            this.notice = 'Gitcoins still loading... Maybe check back later?';
+            this.isShowingNotice = true;
+        } else {
+            this.$router.push('/setup/gitcoins');
+        }
     }
     async back() {
         // this.clearEdited();
@@ -451,7 +477,7 @@ export default class Setup extends Vue {
         this.isLoading = false;
         const redirectFrom = sessionStorage.getItem('redirectFrom');
         sessionStorage.removeItem('redirectFrom');
-        await this.$router.push(redirectFrom || '/home');
+        await this.$router.push(redirectFrom || '/pending');
     }
 }
 </script>