From 7b92d1eb700f7bf0af173930c7ee267a82cb397e Mon Sep 17 00:00:00 2001
From: shats <admin@shts.su>
Date: Tue, 17 Feb 2026 15:24:11 +0700
Subject: [PATCH] refactor(SettingsPage): replace SectionCard with
 SectionHeading for simplified section layout

---
 frontend/src/SettingsPage.jsx | 70 +++++++++++++----------------------
 1 file changed, 25 insertions(+), 45 deletions(-)

diff --git a/frontend/src/SettingsPage.jsx b/frontend/src/SettingsPage.jsx
index 7b0cb41..4f1c2c5 100644
--- a/frontend/src/SettingsPage.jsx
+++ b/frontend/src/SettingsPage.jsx
@@ -230,22 +230,17 @@ export default function SettingsPage() {
     }
   };
 
-  // Карточка секции (контент без коллапса — разделы переключаются через боковое меню)
-  function SectionCard({ id, title, icon: Icon, children }) {
+  // Заголовок секции без вложенной карточки (контент в общем card-body)
+  function SectionHeading({ title, icon: Icon }) {
     return (
-      <div className="card mb-0" data-section-id={id}>
-        <div className="card-header py-3">
-          <h3 className="card-title m-0 d-flex align-items-center">
-            {Icon && (
-              <span className="me-2 d-flex align-items-center text-muted">
-                <Icon size={20} />
-              </span>
-            )}
-            {title}
-          </h3>
-        </div>
-        <div className="card-body">{children}</div>
-      </div>
+      <h2 className="h3 mb-4 d-flex align-items-center">
+        {Icon && (
+          <span className="me-2 d-flex align-items-center text-muted">
+            <Icon size={22} />
+          </span>
+        )}
+        {title}
+      </h2>
     );
   }
 
@@ -374,11 +369,8 @@ export default function SettingsPage() {
               <div className="col-12 col-md-9 d-flex flex-column">
                 <div className="card-body">
               {activeSection === 'live-doh' && (
-              <SectionCard
-                id="live-doh"
-                title="BGP Live и DNS (DoH)"
-                icon={IconPlugConnected}
-              >
+              <>
+                <SectionHeading title="BGP Live и DNS (DoH)" icon={IconPlugConnected} />
                 <div className="row g-3">
                   <div className="col-12">
                     <FormField
@@ -407,15 +399,12 @@ export default function SettingsPage() {
                     />
                   </div>
                 </div>
-              </SectionCard>
+              </>
               )}
 
               {activeSection === 'network-as' && (
-              <SectionCard
-                id="network-as"
-                title="Сеть и AS"
-                icon={IconNetwork}
-              >
+              <>
+                <SectionHeading title="Сеть и AS" icon={IconNetwork} />
                 <div className="row g-3">
                   <div className="col-md-6">
                     <FormField
@@ -430,15 +419,12 @@ export default function SettingsPage() {
                     />
                   </div>
                 </div>
-              </SectionCard>
+              </>
               )}
 
               {activeSection === 'ping' && (
-              <SectionCard
-                id="ping"
-                title="Пинг через MikroTik"
-                icon={IconCloud}
-              >
+              <>
+                <SectionHeading title="Пинг через MikroTik" icon={IconCloud} />
                 <div className="row g-3">
                   <div className="col-md-6">
                     <FormField
@@ -466,15 +452,12 @@ export default function SettingsPage() {
                     />
                   </div>
                 </div>
-              </SectionCard>
+              </>
               )}
 
               {activeSection === 'ping-services' && (
-              <SectionCard
-                id="ping-services"
-                title="Пинг сервисов на главной"
-                icon={IconChartPie}
-              >
+              <>
+                <SectionHeading title="Пинг сервисов на главной" icon={IconChartPie} />
                 <div className="mb-3">
                   <label className="form-label">Источник пинга</label>
                   <select
@@ -541,15 +524,12 @@ export default function SettingsPage() {
                     </div>
                   </div>
                 )}
-              </SectionCard>
+              </>
               )}
 
               {activeSection === 'ptr-zone' && (
-              <SectionCard
-                id="ptr-zone"
-                title="Настройка PTR зоны"
-                icon={IconWorld}
-              >
+              <>
+                <SectionHeading title="Настройка PTR зоны" icon={IconWorld} />
                 <div className="row g-3">
                   <div className="col-md-6">
                     <FormField
@@ -576,7 +556,7 @@ export default function SettingsPage() {
                     />
                   </div>
                 </div>
-              </SectionCard>
+              </>
               )}
                 </div>
               </div>