From 1154fc1e90e61ed5f940b5b702a28b696c090c67 Mon Sep 17 00:00:00 2001
From: Zouheir Layine <zlayine@enjin.io>
Date: Thu, 3 Oct 2024 20:26:12 +0100
Subject: [PATCH] fix creation flow

---
 .../components/pages/SettingsWalletDaemon.vue | 21 ++++++++-----------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/resources/js/components/pages/SettingsWalletDaemon.vue b/resources/js/components/pages/SettingsWalletDaemon.vue
index a860c7b..d2e6e47 100644
--- a/resources/js/components/pages/SettingsWalletDaemon.vue
+++ b/resources/js/components/pages/SettingsWalletDaemon.vue
@@ -24,21 +24,13 @@
                             <div class="text-sm">
                                 <span> API Token was successfully created. Token: </span>
                                 <CopyTextIcon
-                                    v-if="tokens[0].plainTextToken"
+                                    v-if="creationFlowToken"
                                     ref="copyIconRef"
                                     class="cursor-pointer inline-flex"
-                                    :text="
-                                        tokens[0].plainTextToken.substring(
-                                            tokens[0].plainTextToken?.indexOf('|') + 1 ?? 0
-                                        )
-                                    "
+                                    :text="creationFlowToken.substring(creationFlowToken?.indexOf('|') + 1 ?? 0)"
                                 >
                                     <span class="truncate text-light-content-brand dark:text-dark-content-brand">
-                                        {{
-                                            tokens[0].plainTextToken?.substring(
-                                                tokens[0].plainTextToken?.indexOf('|') + 1 ?? 0
-                                            )
-                                        }}
+                                        {{ creationFlowToken?.substring(creationFlowToken?.indexOf('|') + 1 ?? 0) }}
                                     </span>
                                 </CopyTextIcon>
                             </div>
@@ -111,7 +103,7 @@
                                     To configure a new Daemon wallet, you'll need to create an API token. This token
                                     will be used to authenticate your Daemon wallet with your Platform account.
                                 </p>
-                                <div v-if="tokens.length">
+                                <div v-if="tokens.length" class="flex flex-col">
                                     <span class="text-xl mb-4">My API Tokens</span>
                                     <div class="grid grid-cols-1 gap-4">
                                         <div
@@ -227,6 +219,7 @@ const confirmModal = ref(false);
 const confirmModalName = ref();
 const creationFlow = ref(false);
 const loadingUser = ref(false);
+const creationFlowToken = ref('');
 
 const tokens = computed(() => appStore.user?.apiTokens ?? []);
 
@@ -270,6 +263,10 @@ const createApiToken = async () => {
             enableTokenCreate.value = false;
             tokenName.value = '';
             snackbar.info({ title: 'Token generated', text: `Your token ${tokenName.value} has been generated.` });
+            if (tokens.value.length === 1) {
+                creationFlowToken.value = tokens.value[0].plainTextToken;
+                creationFlow.value = true;
+            }
         } catch (e: any) {
             if (snackbarErrors(e)) return;
             snackbar.error({ title: 'Token generation failed', text: e.message });