Update app.py

app.py

@@ -76,9 +76,6 @@ st.markdown("""
     font-size: 13px;
 }
 .github-card a:hover { text-decoration: underline; }
-
-/* Bouncing element style to target the end of tables */
-.scroll-target { height: 1px; }
 </style>
 """, unsafe_allow_html=True)
 
@@ -170,7 +167,6 @@ with metric_col:
 with watchlist_col:
     st.markdown("<p style='font-size:12px; font-weight:600; color:#475569; margin:0 0 6px 0;'>🎯 Account Audit Matrix</p>", unsafe_allow_html=True)
     if st.session_state.accounts:
-        # ตารางรายชื่อบัญชีแบบกะทัดรัด
         acc_table = """<table class="bank-table">
             <tr><th>Account ID</th><th>Baseline Risk</th><th>Operational Status</th></tr>"""
         for acc in st.session_state.accounts:
@@ -210,7 +206,7 @@ with alert_col:
 def build_feed_table(feed_list) -> str:
     html_table = """<table class="bank-table">
         <tr><th>Time</th><th>Tx ID</th><th>Routing Sequence</th><th>Amount</th><th>Score</th><th>Action</th></tr>"""
-    for f_tx in feed_list[-40:]: # ดึง 40 รายการล่าสุดมาแสดงในแนวระนาบดิ่งลงมา
+    for f_tx in feed_list[-40:]: 
         style_cls = "text-block" if "Block" in f_tx["decision"] else "text-alert" if "Alert" in f_tx["decision"] else "text-pass"
         html_table += f"""<tr>
             <td style='color:#64748b; font-family:monospace;'>{f_tx.get('tx_time', '00:00:00')}</td>
@@ -225,13 +221,21 @@ def build_feed_table(feed_list) -> str:
 
 # ─── Simulation Core Loop & Rendering Logic ──────────────────────────────────
 if st.session_state.running and st.session_state.accounts:
+    
+    # 📌 สร้าง Placeholder ไว้ "นอกลูป" แค่ครั้งเดียว เพื่อล็อคหัวตารางให้ไม่วาดซ้ำซาก
+    with feed_box:
+        feed_placeholder = st.empty()
+        
+    with alert_box:
+        alert_placeholder = st.empty()
+
     while st.session_state.running:
         # Pick account & process transaction
         account = random.choice(st.session_state.accounts)
         raw_tx = generate_transaction(account, step=st.session_state.step, tx_counter=st.session_state.tx_counter)
         tx = score_transaction(raw_tx)
         
-        # 📌 ฝังเวลาปัจจุบันของระบบธนาคารลงในธุรกรรม (ระดับวินาที)
+        # ฝังเวลาปัจจุบันของระบบธนาคารระดับวินาที
         tx['tx_time'] = datetime.now().strftime("%H:%M:%S")
 
         # Handle status state mutations
@@ -239,18 +243,18 @@ if st.session_state.running and st.session_state.accounts:
         if "Block" in d:   account["status"] = "blocked"
         elif "Alert" in d: account["status"] = "alert"
 
-        # 📌 เปลี่ยนสไตล์การต่อแถว: จากเดิม [tx] + feed เป็น feed + [tx] (ต่อท้ายด้านล่าง)
+        # สะสมข้อมูลธุรกรรมต่อท้ายลิสต์เดิมลงไปข้างล่าง
         st.session_state.feed = st.session_state.feed + [tx]
         st.session_state.total_tx += 1
         st.session_state.tx_counter += 1
 
         if "Block" in d:
             st.session_state.total_block += 1
-            st.session_state.alerts = st.session_state.alerts + [tx] # ต่อท้ายลงล่างเช่นกัน
+            st.session_state.alerts = st.session_state.alerts + [tx]
             st.session_state.amount_risk += tx["amount"]
         elif "Alert" in d:
             st.session_state.total_alert += 1
-            st.session_state.alerts = st.session_state.alerts + [tx] # ต่อท้ายลงล่างเช่นกัน
+            st.session_state.alerts = st.session_state.alerts + [tx]
             st.session_state.amount_risk += tx["amount"] * 0.5
         else:
             st.session_state.total_pass += 1
@@ -258,14 +262,13 @@ if st.session_state.running and st.session_state.accounts:
         if st.session_state.tx_counter % 6 == 0:
             st.session_state.step += 1
 
-        # Render Left Column: Main Excel Table (ไล่จากบนลงล่าง)
-        with feed_box:
-            st.markdown(build_feed_table(st.session_state.feed), unsafe_allow_html=True)
+        # 📌 เขียนทับกล่องเดิมเพื่อเพิ่มแถวใหม่ (+1 แถวต่อท้ายในตารางเดี่ยว) หัวตารางจะไม่ซ้ำแล้ว
+        feed_placeholder.markdown(build_feed_table(st.session_state.feed), unsafe_allow_html=True)
 
-        # Render Right Column: Alerts Queue with Expander Detail Lookup
-        with alert_box:
+        # อัปเดตฝั่ง Alerts Queue ในกล่องเดิมเช่นกันแบบเรียบเนียน
+        with alert_placeholder.container():
             if st.session_state.alerts:
-                for a_tx in st.session_state.alerts[-20:]: # ดึงเคสอันตรายล่าสุดไล่ลงมาด้านล่าง
+                for a_tx in st.session_state.alerts[-20:]:
                     title_text = f"🚨 [{a_tx['tx_time']}] {a_tx['tx_id']} | ฿{a_tx['amount']:,.0f} ➔ {a_tx['decision'].upper()}"
                     with st.expander(title_text):
                         st.markdown(f"""
@@ -284,27 +287,26 @@ if st.session_state.running and st.session_state.accounts:
 
         time.sleep(speed)
 else:
-    # Static render loop when user presses PAUSE (ตารางคงสภาพล่าสุดไว้ให้ตรวจสอบ)
+    # Static render loop เมื่อกด PAUSE (ตารางคงสภาพล่าสุดนิ่งๆ ไว้ให้ตรวจสอบ)
     with feed_box:
         if st.session_state.feed:
             st.markdown(build_feed_table(st.session_state.feed), unsafe_allow_html=True)
         else:
             st.info("System Ready. Click **▶ Start / Resume** to map ledger feeds.")
 
-    with alert_col:
-        with alert_box:
-            if st.session_state.alerts:
-                for a_tx in st.session_state.alerts[-20:]:
-                    title_text = f"🚨 [{a_tx['tx_time']}] {a_tx['tx_id']} | ฿{a_tx['amount']:,.0f} ➔ {a_tx['decision'].upper()}"
-                    with st.expander(title_text):
-                        st.markdown(f"""
-                        **Incident Deep-Dive Metrics:**
-                        * **Timestamp:** `{a_tx['tx_time']}`
-                        * **Source Account:** `{a_tx['account_id']}`
-                        * **Destination Target:** `{a_tx['dest_id']}`
-                        * **Model A Probability:** `{a_tx['prob_a']:.3f}`
-                        * **Model B Probability:** `{a_tx['prob_b']:.3f}`
-                        * **Weighted Ensemble Score:** `{a_tx['final_score']:.3f}`
-                        """)
-            else:
-                st.success("🟢 OPERATIONAL STATUS: SECURED — No anomalies flagged by models currently.")
+    with alert_box:
+        if st.session_state.alerts:
+            for a_tx in st.session_state.alerts[-20:]:
+                title_text = f"🚨 [{a_tx['tx_time']}] {a_tx['tx_id']} | ฿{a_tx['amount']:,.0f} ➔ {a_tx['decision'].upper()}"
+                with st.expander(title_text):
+                    st.markdown(f"""
+                    **Incident Deep-Dive Metrics:**
+                    * **Timestamp:** `{a_tx['tx_time']}`
+                    * **Source Account:** `{a_tx['account_id']}`
+                    * **Destination Target:** `{a_tx['dest_id']}`
+                    * **Model A Probability:** `{a_tx['prob_a']:.3f}`
+                    * **Model B Probability:** `{a_tx['prob_b']:.3f}`
+                    * **Weighted Ensemble Score:** `{a_tx['final_score']:.3f}`
+                    """)
+        else:
+            st.success("🟢 OPERATIONAL STATUS: SECURED — No anomalies flagged by models currently.")