From 3040bd5a57b9d415625164d9dc8946c653c3e5f3 Mon Sep 17 00:00:00 2001
From: NguyenAnhQuan <ngongquan@gmail.com>
Date: Thu, 23 Oct 2025 15:30:00 +0700
Subject: [PATCH] refactor: 231025/delete_unneccesary_element

---
 src/components/WalletInfo.vue                 | 59 +------------------
 src/views/Auth/AuthView.vue                   |  4 --
 src/views/Home/HomeView.vue                   | 15 ++---
 src/views/Home/components/NetworkTab.vue      | 10 ----
 src/views/Home/components/TransactionsTab.vue | 41 -------------
 .../components/{DebugTab.vue => UTXOTab.vue}  | 30 +---------
 src/views/Home/components/WalletTab.vue       |  7 ---
 src/views/Home/components/index.ts            |  3 +-
 8 files changed, 8 insertions(+), 161 deletions(-)
 delete mode 100644 src/views/Home/components/TransactionsTab.vue
 rename src/views/Home/components/{DebugTab.vue => UTXOTab.vue} (64%)

diff --git a/src/components/WalletInfo.vue b/src/components/WalletInfo.vue
index d4a09e2..b3c9a06 100644
--- a/src/components/WalletInfo.vue
+++ b/src/components/WalletInfo.vue
@@ -16,10 +16,6 @@ const copyAddress = () => {
 const handleSend = () => {
     console.log('Send clicked')
 }
-
-const handleScanQR = () => {
-    console.log('Scan QR clicked')
-}
 </script>
 
 <template>
@@ -52,36 +48,11 @@ const handleScanQR = () => {
                 </svg>
             </div>
         </div>
-
-        <!-- QR Code Section -->
-        <div class="qr-section">
-            <div class="qr-placeholder">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
-                    <rect x="0" y="0" width="100" height="100" fill="white" />
-                    <rect x="5" y="5" width="35" height="35" fill="black" />
-                    <rect x="10" y="10" width="25" height="25" fill="white" />
-                    <rect x="15" y="15" width="15" height="15" fill="black" />
-                    <rect x="60" y="5" width="35" height="35" fill="black" />
-                    <rect x="65" y="10" width="25" height="25" fill="white" />
-                    <rect x="70" y="15" width="15" height="15" fill="black" />
-                    <rect x="5" y="60" width="35" height="35" fill="black" />
-                    <rect x="10" y="65" width="25" height="25" fill="white" />
-                    <rect x="15" y="70" width="15" height="15" fill="black" />
-                    <rect x="45" y="45" width="10" height="10" fill="black" />
-                    <rect x="60" y="60" width="10" height="10" fill="black" />
-                    <rect x="70" y="70" width="10" height="10" fill="black" />
-                </svg>
-            </div>
-        </div>
-
         <!-- Action Buttons -->
         <div class="action-buttons">
             <ButtonCommon type="primary" size="large" block @click="handleSend" class="btn-send">
                 SEND
             </ButtonCommon>
-            <ButtonCommon type="primary" size="large" block @click="handleScanQR" class="btn-scan">
-                Scan QR code
-            </ButtonCommon>
         </div>
 
         <!-- Wallet Status -->
@@ -179,40 +150,12 @@ const handleScanQR = () => {
         }
     }
 }
-
-.qr-section {
-    display: flex;
-    justify-content: center;
-    margin-bottom: var(--spacing-2xl);
-
-    .qr-placeholder {
-        width: var(--qr-size);
-        height: var(--qr-size);
-        background: var(--bg-white);
-        border: var(--qr-border);
-        border-radius: var(--qr-radius);
-        padding: var(--spacing-lg);
-        box-shadow: var(--qr-shadow);
-        transition: var(--transition-normal);
-
-        &:hover {
-            transform: scale(1.05);
-        }
-
-        svg {
-            width: 100%;
-            height: 100%;
-        }
-    }
-}
-
 .action-buttons {
     display: flex;
     gap: var(--spacing-lg);
     margin-bottom: var(--spacing-2xl);
 
-    :deep(.btn-send),
-    :deep(.btn-scan) {
+    :deep(.btn-send) {
         letter-spacing: var(--tracking-wide);
     }
 }
diff --git a/src/views/Auth/AuthView.vue b/src/views/Auth/AuthView.vue
index f00bb3b..486e8f5 100644
--- a/src/views/Auth/AuthView.vue
+++ b/src/views/Auth/AuthView.vue
@@ -8,10 +8,6 @@ const authStore = useAuthStore()
 
 const currentState = computed(() => authStore.getCurrentState())
 
-const handleOnboardingComplete = () => {
-    authStore.nextStep()
-}
-
 const handleGoToCreate = () => {
     authStore.goToCreate()
 }
diff --git a/src/views/Home/HomeView.vue b/src/views/Home/HomeView.vue
index 9d0c577..0a014a6 100644
--- a/src/views/Home/HomeView.vue
+++ b/src/views/Home/HomeView.vue
@@ -2,9 +2,9 @@
 import { ref } from 'vue'
 import { Tabs, Row, Col } from 'ant-design-vue'
 import WalletInfo from '@/components/WalletInfo.vue'
-import { TransactionsTab, WalletTab, NetworkTab, DebugTab } from './components'
+import { WalletTab, NetworkTab, UTXOTab } from './components'
 
-const activeTab = ref('WALLET')
+const activeTab = ref('UTXOs')
 const network = ref('kaspa-mainnet')
 </script>
 
@@ -19,9 +19,9 @@ const network = ref('kaspa-mainnet')
             <!-- Right Column - Tabs Content -->
             <Col :xs="24" :lg="12">
                 <Tabs v-model:activeKey="activeTab" size="large" class="main-tabs">
-                    <!-- TRANSACTIONS TAB -->
-                    <Tabs.TabPane key="TRANSACTIONS" tab="TRANSACTIONS">
-                        <TransactionsTab />
+                    <!-- DEBUG TAB -->
+                    <Tabs.TabPane key="UTXOs" tab="UTXOs">
+                        <UTXOTab />
                     </Tabs.TabPane>
 
                     <!-- WALLET TAB -->
@@ -33,11 +33,6 @@ const network = ref('kaspa-mainnet')
                     <Tabs.TabPane key="NETWORK" tab="NETWORK">
                         <NetworkTab />
                     </Tabs.TabPane>
-
-                    <!-- DEBUG TAB -->
-                    <Tabs.TabPane key="DEBUG" tab="DEBUG">
-                        <DebugTab />
-                    </Tabs.TabPane>
                 </Tabs>
             </Col>
         </Row>
diff --git a/src/views/Home/components/NetworkTab.vue b/src/views/Home/components/NetworkTab.vue
index 385b118..39a7917 100644
--- a/src/views/Home/components/NetworkTab.vue
+++ b/src/views/Home/components/NetworkTab.vue
@@ -17,8 +17,6 @@ const loading = ref(true)
 const error = ref('')
 const isConnected = ref(false)
 
-// Kaspa RPC Client instance (placeholder)
-// You'll need to implement this using kaspa-wasm or kaspa RPC library
 let rpcClient: any = null
 let unsubscribe: (() => void) | null = null
 
@@ -41,7 +39,6 @@ const initializeKaspaRPC = async () => {
     }
 }
 
-// Simulate RPC connection (mock for development)
 const simulateRPCConnection = async (): Promise<void> => {
     return new Promise((resolve) => {
         setTimeout(() => {
@@ -56,7 +53,6 @@ const simulateRPCConnection = async (): Promise<void> => {
                 medianTimeUTC: new Date().toISOString().replace('T', ' ').substring(0, 19),
             }
 
-            // Simulate DAA score increment (real Kaspa ~1 block/sec)
             const mockSubscription = setInterval(() => {
                 networkStatus.value.daaScore += 1
                 networkStatus.value.dagHeader += 1
@@ -64,7 +60,6 @@ const simulateRPCConnection = async (): Promise<void> => {
                 updateMedianTime()
             }, 1000)
 
-            // Store cleanup function
             unsubscribe = () => clearInterval(mockSubscription)
 
             resolve()
@@ -72,12 +67,10 @@ const simulateRPCConnection = async (): Promise<void> => {
     })
 }
 
-// Update median time
 const updateMedianTime = () => {
     networkStatus.value.medianTimeUTC = new Date().toISOString().replace('T', ' ').substring(0, 19)
 }
 
-// Use mock data fallback
 const useMockData = () => {
     networkStatus.value = {
         network: 'kaspa-mainnet',
@@ -90,19 +83,16 @@ const useMockData = () => {
     }
 }
 
-// Retry connection
 const retryConnection = () => {
     initializeKaspaRPC()
 }
 
-// Cleanup on unmount
 const cleanup = () => {
     if (unsubscribe) {
         unsubscribe()
         unsubscribe = null
     }
     if (rpcClient) {
-        // TODO: Disconnect RPC client
         rpcClient.disconnect()
         rpcClient = null
     }
diff --git a/src/views/Home/components/TransactionsTab.vue b/src/views/Home/components/TransactionsTab.vue
deleted file mode 100644
index 6f78448..0000000
--- a/src/views/Home/components/TransactionsTab.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<script setup lang="ts">
-// Component for Transactions Tab
-</script>
-
-<template>
-    <div class="content-card">
-        <div class="tab-content-header">
-            <h2>Transaction History</h2>
-        </div>
-        <div class="empty-state">
-            <p>No transactions yet</p>
-        </div>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.content-card {
-    @include card-base;
-}
-
-.tab-content-header {
-    text-align: center;
-    margin-bottom: var(--spacing-2xl);
-    padding-bottom: var(--spacing-lg);
-    border-bottom: 2px solid var(--border-color);
-
-    h2 {
-        font-size: 1.3rem;
-        font-weight: var(--font-bold);
-        color: var(--text-primary);
-        margin: 0;
-    }
-}
-
-.empty-state {
-    text-align: center;
-    padding: var(--spacing-4xl) var(--spacing-lg);
-    color: var(--text-muted);
-    font-size: var(--font-lg);
-}
-</style>
diff --git a/src/views/Home/components/DebugTab.vue b/src/views/Home/components/UTXOTab.vue
similarity index 64%
rename from src/views/Home/components/DebugTab.vue
rename to src/views/Home/components/UTXOTab.vue
index d9e0fcf..6ce4b09 100644
--- a/src/views/Home/components/DebugTab.vue
+++ b/src/views/Home/components/UTXOTab.vue
@@ -1,22 +1,10 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { EditOutlined } from '@ant-design/icons-vue'
-import ButtonCommon from '@/components/common/ButtonCommon.vue'
 
 const inUseUtxosCount = ref(0)
 const inUseUtxosAmount = ref(0)
 
-const handleShowUTXOs = () => {
-    console.log('Show UTXOs')
-}
-
-const handleForceTransactionUpdate = () => {
-    console.log('Force transaction times update')
-}
-
-const handleScanMoreAddresses = () => {
-    console.log('Scan More Addresses')
-}
 </script>
 
 <template>
@@ -32,17 +20,7 @@ const handleScanMoreAddresses = () => {
             </div>
         </div>
 
-        <div class="debug-actions">
-            <ButtonCommon type="primary" size="large" block @click="handleShowUTXOs">
-                Show UTXOs
-            </ButtonCommon>
-            <ButtonCommon type="primary" size="large" block @click="handleForceTransactionUpdate">
-                Force transaction times update
-            </ButtonCommon>
-            <ButtonCommon type="primary" size="large" block @click="handleScanMoreAddresses">
-                Scan More Addresses
-            </ButtonCommon>
-        </div>
+        <div class="list-pagination"></div>
     </div>
 </template>
 
@@ -86,11 +64,5 @@ const handleScanMoreAddresses = () => {
             }
         }
     }
-
-    .debug-actions {
-        display: flex;
-        flex-direction: column;
-        gap: var(--spacing-lg);
-    }
 }
 </style>
diff --git a/src/views/Home/components/WalletTab.vue b/src/views/Home/components/WalletTab.vue
index 06b3656..90057a9 100644
--- a/src/views/Home/components/WalletTab.vue
+++ b/src/views/Home/components/WalletTab.vue
@@ -18,10 +18,6 @@ const handleBackupFile = () => {
 const handleBackupSeed = () => {
     console.log('Backup Seed')
 }
-
-const handleRecoverFromSeed = () => {
-    console.log('Recover From Seed')
-}
 </script>
 
 <template>
@@ -44,9 +40,6 @@ const handleRecoverFromSeed = () => {
             <ButtonCommon type="primary" size="large" block @click="handleBackupSeed">
                 Backup Seed
             </ButtonCommon>
-            <ButtonCommon type="primary" size="large" block @click="handleRecoverFromSeed">
-                Recover From Seed
-            </ButtonCommon>
         </div>
 
         <Divider />
diff --git a/src/views/Home/components/index.ts b/src/views/Home/components/index.ts
index cd0e616..395285a 100644
--- a/src/views/Home/components/index.ts
+++ b/src/views/Home/components/index.ts
@@ -1,4 +1,3 @@
-export { default as TransactionsTab } from './TransactionsTab.vue'
 export { default as WalletTab } from './WalletTab.vue'
 export { default as NetworkTab } from './NetworkTab.vue'
-export { default as DebugTab } from './DebugTab.vue'
+export { default as UTXOTab } from './UTXOTab.vue'