Team Ai
Apppublic

Natxus/android-code-qa-system

sourceHugging Faceupdated 1y agoView on Hugging Face
0likes
analyzer.html404 linesDownload Raw Back to root
1<!DOCTYPE html>2<html lang="en">3<head>4    <meta charset="UTF-8">5    <meta name="viewport" content="width=device-width, initial-scale=1.0">6    <title>Code Analyzer - Android Code QA System</title>7    <script src="https://cdn.tailwindcss.com"></script>8    <script src="https://unpkg.com/feather-icons"></script>9    <style>10        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');11        body {12            font-family: 'Inter', sans-serif;13            background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);14        }15        .analyzer-container {16            background: #0f172a;17            border-radius: 1rem;18            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);19        }20        .file-tree {21            background: #1e293b;22            border-radius: 0.75rem;23            height: 500px;24            overflow-y: auto;25        }26        .code-editor {27            background: #1e293b;28            border-radius: 0.75rem;29            height: 500px;30            overflow: hidden;31        }32        .terminal-output {33            background: #0f172a;34            border-radius: 0.75rem;35            height: 300px;36            overflow-y: auto;37        }38        .issue-highlight {39            background: rgba(239, 68, 68, 0.2);40            border-left: 3px solid #ef4444;41        }42    </style>43</head>44<body class="min-h-screen text-gray-100">45    <!-- Header -->46    <header class="container mx-auto px-4 py-6">47        <div class="flex justify-between items-center">48            <div class="flex items-center space-x-3">49                <a href="index.html" class="flex items-center space-x-3">50                    <div class="bg-indigo-600 p-2 rounded-lg">51                        <i data-feather="code" class="w-6 h-6"></i>52                    </div>53                    <h1 class="text-2xl font-bold">Android Code QA</h1>54                </a>55            </div>56            <div class="flex items-center space-x-4">57                <button class="bg-slate-800 hover:bg-slate-700 text-gray-300 px-4 py-2 rounded-lg transition flex items-center">58                    <i data-feather="save" class="w-4 h-4 mr-2"></i>59                    Save Project60                </button>61                <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-4 py-2 rounded-lg transition flex items-center">62                    <i data-feather="play" class="w-4 h-4 mr-2"></i>63                    Run Analysis64                </button>65            </div>66        </div>67    </header>68 69    <!-- Main Content -->70    <div class="container mx-auto px-4 pb-8">71        <div class="mb-6">72            <h1 class="text-3xl font-bold mb-2">Code Analyzer</h1>73            <p class="text-gray-400">Analyze your Android project for memory leaks, performance issues, and bugs</p>74        </div>75        76        <!-- Project Info -->77        <div class="analyzer-container p-6 mb-6">78            <div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-4">79                <div>80                    <h2 class="text-xl font-semibold">E-commerce Android App</h2>81                    <p class="text-gray-400">com.example.ecommerceapp</p>82                </div>83                <div class="flex flex-wrap gap-2">84                    <span class="bg-indigo-500/10 text-indigo-400 px-3 py-1 rounded-full text-sm">Android 12</span>85                    <span class="bg-green-500/10 text-green-400 px-3 py-1 rounded-full text-sm">Kotlin</span>86                    <span class="bg-purple-500/10 text-purple-400 px-3 py-1 rounded-full text-sm">Gradle 7.4</span>87                </div>88            </div>89        </div>90        91        <!-- Analyzer Interface -->92        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">93            <!-- File Tree -->94            <div class="lg:col-span-1">95                <div class="analyzer-container p-5">96                    <div class="flex justify-between items-center mb-4">97                        <h3 class="font-semibold">Project Files</h3>98                        <button class="text-gray-400 hover:text-gray-200">99                            <i data-feather="refresh-cw" class="w-4 h-4"></i>100                        </button>101                    </div>102                    <div class="file-tree p-3">103                        <div class="mb-2">104                            <div class="flex items-center text-gray-300 py-1">105                                <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>106                                <span>app</span>107                            </div>108                            <div class="ml-6">109                                <div class="flex items-center text-gray-300 py-1">110                                    <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>111                                    <span>src</span>112                                </div>113                                <div class="ml-6">114                                    <div class="flex items-center text-gray-300 py-1">115                                        <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>116                                        <span>main</span>117                                    </div>118                                    <div class="ml-6">119                                        <div class="flex items-center text-gray-300 py-1">120                                            <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>121                                            <span>java</span>122                                        </div>123                                        <div class="ml-6">124                                            <div class="flex items-center text-gray-300 py-1">125                                                <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>126                                                <span>com</span>127                                            </div>128                                            <div class="ml-6">129                                                <div class="flex items-center text-gray-300 py-1">130                                                    <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>131                                                    <span>example</span>132                                                </div>133                                                <div class="ml-6">134                                                    <div class="flex items-center text-gray-300 py-1">135                                                        <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>136                                                        <span>ecommerceapp</span>137                                                    </div>138                                                    <div class="ml-6 space-y-1">139                                                        <div class="flex items-center text-indigo-400 py-1 cursor-pointer">140                                                            <i data-feather="file-text" class="w-4 h-4 mr-2"></i>141                                                            <span>MainActivity.kt</span>142                                                        </div>143                                                        <div class="flex items-center text-gray-300 py-1 cursor-pointer">144                                                            <i data-feather="file-text" class="w-4 h-4 mr-2"></i>145                                                            <span>LoginActivity.kt</span>146                                                        </div>147                                                        <div class="flex items-center text-gray-300 py-1 cursor-pointer">148                                                            <i data-feather="file-text" class="w-4 h-4 mr-2"></i>149                                                            <span>ProductListActivity.kt</span>150                                                        </div>151                                                        <div class="flex items-center text-gray-300 py-1 cursor-pointer">152                                                            <i data-feather="file-text" class="w-4 h-4 mr-2"></i>153                                                            <span>CartActivity.kt</span>154                                                        </div>155                                                        <div class="flex items-center text-gray-300 py-1 cursor-pointer">156                                                            <i data-feather="file-text" class="w-4 h-4 mr-2"></i>157                                                            <span>ProductDetailActivity.kt</span>158                                                        </div>159                                                    </div>160                                                </div>161                                            </div>162                                        </div>163                                        <div class="flex items-center text-gray-300 py-1 mt-2">164                                            <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>165                                            <span>res</span>166                                        </div>167                                        <div class="flex items-center text-gray-300 py-1">168                                            <i data-feather="folder" class="w-4 h-4 mr-2 text-yellow-500"></i>169                                            <span>AndroidManifest.xml</span>170                                        </div>171                                    </div>172                                </div>173                            </div>174                        </div>175                    </div>176                </div>177            </div>178            179            <!-- Code Editor -->180            <div class="lg:col-span-2">181                <div class="analyzer-container p-5">182                    <div class="flex justify-between items-center mb-4">183                        <h3 class="font-semibold">MainActivity.kt</h3>184                        <div class="flex space-x-2">185                            <button class="text-gray-400 hover:text-gray-200">186                                <i data-feather="chevron-left" class="w-4 h-4"></i>187                            </button>188                            <button class="text-gray-400 hover:text-gray-200">189                                <i data-feather="chevron-right" class="w-4 h-4"></i>190                            </button>191                        </div>192                    </div>193                    <div class="code-editor">194                        <div class="font-mono text-sm p-4 overflow-auto h-full">195                            <div class="text-gray-500">// MainActivity.kt</div>196                            <div class="text-blue-400">package</div> <div class="text-gray-300">com.example.ecommerceapp</div>197                            <br>198                            <div class="text-blue-400">import</div> <div class="text-gray-300">android.os.Bundle</div>199                            <div class="text-blue-400">import</div> <div class="text-gray-300">android.widget.Button</div>200                            <div class="text-blue-400">import</div> <div class="text-gray-300">android.widget.ImageView</div>201                            <div class="text-blue-400">import</div> <div class="text-gray-300">androidx.appcompat.app.AppCompatActivity</div>202                            <br>203                            <div class="text-blue-400">class</div> <div class="text-yellow-400">MainActivity</div> : <div class="text-yellow-400">AppCompatActivity</div>() {<br>204                            &nbsp;&nbsp;<div class="text-blue-400">companion object</div> {<br>205                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="text-blue-400">var</div> <div class="text-red-400">context</div>: <div class="text-yellow-400">MainActivity</div>? = <div class="text-purple-400">null</div><br>206                            &nbsp;&nbsp;}<br>207                            <br>208                            &nbsp;&nbsp;<div class="text-blue-400">private lateinit var</div> <div class="text-gray-300">productImage</div>: <div class="text-yellow-400">ImageView</div><br>209                            &nbsp;&nbsp;<div class="text-blue-400">private lateinit var</div> <div class="text-gray-300">addToCartButton</div>: <div class="text-yellow-400">Button</div><br>210                            <br>211                            &nbsp;&nbsp;<div class="text-blue-400">override fun</div> <div class="text-yellow-400">onCreate</div>(savedInstanceState: Bundle?) {<br>212                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="text-blue-400">super</div>.onCreate(savedInstanceState)<br>213                            &nbsp;&nbsp;&nbsp;&nbsp;setContentView(R.layout.activity_main)<br>214                            <br>215                            &nbsp;&nbsp;&nbsp;&nbsp;context = <div class="text-blue-400">this</div><br>216                            <br>217                            &nbsp;&nbsp;&nbsp;&nbsp;productImage = findViewById(R.id.product_image)<br>218                            &nbsp;&nbsp;&nbsp;&nbsp;addToCartButton = findViewById(R.id.add_to_cart_button)<br>219                            <br>220                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="issue-highlight p-2 rounded">221                            &nbsp;&nbsp;&nbsp;&nbsp;// ISSUE: Static context reference causing memory leak<br>222                            &nbsp;&nbsp;&nbsp;&nbsp;// SOLUTION: Remove static reference or use WeakReference223                            &nbsp;&nbsp;&nbsp;&nbsp;</div>224                            <br>225                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="issue-highlight p-2 rounded">226                            &nbsp;&nbsp;&nbsp;&nbsp;// ISSUE: Bitmap not recycled properly<br>227                            &nbsp;&nbsp;&nbsp;&nbsp;// SOLUTION: Recycle bitmap in onDestroy()228                            &nbsp;&nbsp;&nbsp;&nbsp;</div>229                            <br>230                            &nbsp;&nbsp;&nbsp;&nbsp;loadProductImage()<br>231                            &nbsp;&nbsp;}<br>232                            <br>233                            &nbsp;&nbsp;<div class="text-blue-400">private fun</div> <div class="text-yellow-400">loadProductImage</div>() {<br>234                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="text-blue-400">val</div> <div class="text-gray-300">bitmap</div> = <div class="text-yellow-400">ImageLoader</div>.loadImage(<div class="text-green-400">"product_image_url"</div>)<br>235                            &nbsp;&nbsp;&nbsp;&nbsp;productImage.setImageBitmap(bitmap)<br>236                            &nbsp;&nbsp;}<br>237                            <br>238                            &nbsp;&nbsp;<div class="text-blue-400">override fun</div> <div class="text-yellow-400">onDestroy</div>() {<br>239                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="text-blue-400">super</div>.onDestroy()<br>240                            &nbsp;&nbsp;&nbsp;&nbsp;<div class="issue-highlight p-2 rounded">241                            &nbsp;&nbsp;&nbsp;&nbsp;// ISSUE: Context not cleared, bitmap not recycled<br>242                            &nbsp;&nbsp;&nbsp;&nbsp;// SOLUTION: Clear static reference and recycle bitmap243                            &nbsp;&nbsp;&nbsp;&nbsp;</div>244                            &nbsp;&nbsp;}<br>245                            }<br>246                        </div>247                    </div>248                </div>249            </div>250        </div>251        252        <!-- Analysis Results -->253        <div class="analyzer-container p-6 mb-6">254            <div class="flex justify-between items-center mb-6">255                <h2 class="text-2xl font-bold">Analysis Results</h2>256                <div class="flex space-x-2">257                    <button class="bg-slate-800 hover:bg-slate-700 text-gray-300 px-3 py-1 rounded text-sm">Export Report</button>258                    <button class="bg-indigo-600 hover:bg-indigo-700 text-white px-3 py-1 rounded text-sm">Fix All Issues</button>259                </div>260            </div>261            262            <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-6">263                <div class="bg-red-500/10 border border-red-500/30 rounded-lg p-5">264                    <div class="flex items-center mb-3">265                        <div class="bg-red-500/20 p-2 rounded-lg mr-3">266                            <i data-feather="alert-triangle" class="w-5 h-5 text-red-400"></i>267                        </div>268                        <h3 class="text-lg font-semibold">Critical Issues</h3>269                    </div>270                    <p class="text-3xl font-bold">3</p>271                    <p class="text-red-400 text-sm mt-1">+1 from last analysis</p>272                </div>273                274                <div class="bg-yellow-500/10 border border-yellow-500/30 rounded-lg p-5">275                    <div class="flex items-center mb-3">276                        <div class="bg-yellow-500/20 p-2 rounded-lg mr-3">277                            <i data-feather="alert-circle" class="w-5 h-5 text-yellow-400"></i>278                        </div>279                        <h3 class="text-lg font-semibold">High Priority</h3>280                    </div>281                    <p class="text-3xl font-bold">7</p>282                    <p class="text-yellow-400 text-sm mt-1">-2 from last analysis</p>283                </div>284                285                <div class="bg-blue-500/10 border border-blue-500/30 rounded-lg p-5">286                    <div class="flex items-center mb-3">287                        <div class="bg-blue-500/20 p-2 rounded-lg mr-3">288                            <i data-feather="info" class="w-5 h-5 text-blue-400"></i>289                        </div>290                        <h3 class="text-lg font-semibold">Suggestions</h3>291                    </div>292                    <p class="text-3xl font-bold">12</p>293                    <p class="text-blue-400 text-sm mt-1">+3 from last analysis</p>294                </div>295            </div>296            297            <div class="border-t border-slate-800 pt-6">298                <h3 class="text-lg font-semibold mb-4">Detected Issues</h3>299                300                <div class="space-y-4">301                    <div class="bg-slate-800/50 border border-slate-700 rounded-lg p-4">302                        <div class="flex justify-between">303                            <h4 class="font-medium">Static Context Reference</h4>304                            <span class="bg-red-500/10 text-red-400 text-xs px-2 py-1 rounded">Critical</span>305                        </div>306                        <p class="text-gray-400 text-sm mt-2">Storing a static reference to context in MainActivity can cause memory leaks.</p>307                        <div class="flex items-center mt-3 text-sm">308                            <span class="bg-slate-700 px-2 py-1 rounded mr-2">Memory Leak</span>309                            <span class="text-gray-500">MainActivity.kt:12</span>310                        </div>311                        <div class="mt-3 flex space-x-2">312                            <button class="bg-indigo-600 hover:bg-indigo-700 text-white text-sm px-3 py-1 rounded">Fix Issue</button>313                            <button class="bg-slate-800 hover:bg-slate-700 text-gray-300 text-sm px-3 py-1 rounded">View Details</button>314                        </div>315                    </div>316                    317                    <div class="bg-slate-800/50 border border-slate-700 rounded-lg p-4">318                        <div class="flex justify-between">319                            <h4 class="font-medium">Bitmap Not Recycled</h4>320                            <span class="bg-yellow-500/10 text-yellow-400 text-xs px-2 py-1 rounded">High</span>321                        </div>322                        <p class="text-gray-400 text-sm mt-2">Large bitmap in productImage is not recycled in onDestroy(), causing memory leaks.</p>323                        <div class="flex items-center mt-3 text-sm">324                            <span class="bg-slate-700 px-2 py-1 rounded mr-2">Memory Leak</span>325                            <span class="text-gray-500">MainActivity.kt:45</span>326                        </div>327                        <div class="mt-3 flex space-x-2">328                            <button class="bg-indigo-600 hover:bg-indigo-700 text-white text-sm px-3 py-1 rounded">Fix Issue</button>329                            <button class="bg-slate-800 hover:bg-slate-700 text-gray-300 text-sm px-3 py-1 rounded">View Details</button>330                        </div>331                    </div>332                    333                    <div class="bg-slate-800/50 border border-slate-700 rounded-lg p-4">334                        <div class="flex justify-between">335                            <h4 class="font-medium">Handler Leak</h4>336                            <span class="bg-yellow-500/10 text-yellow-400 text-xs px-2 py-1 rounded">High</span>337                        </div>338                        <p class="text-gray-400 text-sm mt-2">Anonymous Handler class in MainActivity has implicit reference to activity.</p>339                        <div class="flex items-center mt-3 text-sm">340                            <span class="bg-slate-700 px-2 py-1 rounded mr-2">Memory Leak</span>341                            <span class="text-gray-500">MainActivity.kt:32</span>342                        </div>343                        <div class="mt-3 flex space-x-2">344                            <button class="bg-indigo-600 hover:bg-indigo-700 text-white text-sm px-3 py-1 rounded">Fix Issue</button>345                            <button class="bg-slate-800 hover:bg-slate-700 text-gray-300 text-sm px-3 py-1 rounded">View Details</button>346                        </div>347                    </div>348                </div>349            </div>350        </div>351        352        <!-- Terminal Output -->353        <div class="analyzer-container p-5">354            <div class="flex justify-between items-center mb-4">355                <h3 class="font-semibold">Analysis Output</h3>356                <button class="text-gray-400 hover:text-gray-200">357                    <i data-feather="copy" class="w-4 h-4"></i>358                </button>359            </div>360            <div class="terminal-output p-4 font-mono text-sm">361                <div class="text-green-400">$ python app.py /projects/ecommerce-app query.txt --graph --rerank</div>362                <div class="text-gray-300 mt-2">Enhanced Android Code QA System</div>363                <div class="text-gray-300">==================================================</div>364                <div class="text-gray-300">Codebase: /projects/ecommerce-app</div>365                <div class="text-gray-300">Query file: query.txt</div>366                <div class="text-gray-300">Reranking: ON</div>367                <div class="text-blue-400 mt-2">ANDROID CODE QA SYSTEM INITIALIZATION</div>368                <div class="text-gray-300">==================================================</div>369                <div class="text-gray-300">Device: cuda</div>370                <div class="text-gray-300">System ready for on-demand model loading</div>371                <div class="text-gray-300">==================================================</div>372                <div class="text-green-400">Initialization complete!</div>373                <div class="text-yellow-400 mt-2">Loading knowledge graph...</div>374                <div class="text-gray-300">Loading knowledge graph from: processed/ecommerce-app/knowledge_graph</div>375                <div class="text-green-400">Knowledge graph loaded successfully</div>376                <div class="text-purple-400 mt-2">ANDROID-AWARE CONTEXT GENERATION</div>377                <div class="text-gray-300">==================================================</div>378                <div class="text-gray-300">Step 1: Generating Android-specific code prediction...</div>379                <div class="text-green-400">✓ Generated 45 words of Android code</div>380                <div class="text-gray-300">Step 2: Searching with Android-aware embeddings...</div>381                <div class="text-green-400">✓ Found 15 Android methods, 10 Android classes</div>382                <div class="text-gray-300">Step 3: Integrating graph context...</div>383                <div class="text-green-400">✓ Retrieved graph context: 8 nodes</div>384                <div class="text-gray-300">Step 4: Formatting Android-optimized context...</div>385                <div class="text-green-400">✓ Context generation complete: 2847 characters</div>386                <div class="text-gray-300">==================================================</div>387                <div class="text-cyan-400 mt-2">Generating final response...</div>388                <div class="text-green-400">Processing complete!</div>389                <div class="text-yellow-400 mt-2">ISSUES DETECTED:</div>390                <div class="text-red-400">1. Static context reference in MainActivity (line 12)</div>391                <div class="text-red-400">2. Bitmap not recycled in onDestroy() (line 45)</div>392                <div class="text-yellow-400">3. Handler leak in anonymous class (line 32)</div>393                <div class="text-blue-400 mt-2">RECOMMENDATIONS GENERATED</div>394            </div>395        </div>396    </div>397 398    <script>399        // Initialize Feather Icons400        feather.replace();401    </script>402</body>403</html>404