From 18de957c61876064ba1d2993959edef727a41fed Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Sat, 21 Mar 2026 01:07:36 +0700
Subject: [PATCH] refactor: simplify ProvidersPage by removing unused API
 connection logic

Removed unnecessary state variables and connection testing logic from ProvidersPage. Updated the UI to clarify API login and password handling, directing users to the appropriate section for account credentials. This streamlines the component and enhances user experience.
---
 src/pages/ProvidersPage.jsx | 111 +++++-------------------------------
 1 file changed, 13 insertions(+), 98 deletions(-)

diff --git a/src/pages/ProvidersPage.jsx b/src/pages/ProvidersPage.jsx
index a76fd02..cd63dd1 100644
--- a/src/pages/ProvidersPage.jsx
+++ b/src/pages/ProvidersPage.jsx
@@ -3,9 +3,7 @@ import { UiModal } from '../components/UiModal'
 import { EmptyState } from '../components/EmptyState'
 import { PageHeader } from '../components/PageHeader'
 import { faviconUrlFromWebsite } from '../lib/utils'
-import { noBrowserSuggestProps, passwordCredentialInputProps } from '../lib/noBrowserSuggestProps'
-import { testApiConnection } from '../lib/api'
-import { IconPlugConnected } from '@tabler/icons-react'
+import { noBrowserSuggestProps } from '../lib/noBrowserSuggestProps'
 
 const emptyForm = {
   name: '',
@@ -23,10 +21,6 @@ export function ProvidersPage({ db, actions }) {
   const [form, setForm] = useState(emptyForm)
   const [editingId, setEditingId] = useState(null)
   const [isModalOpen, setIsModalOpen] = useState(false)
-  const [apiProbeLogin, setApiProbeLogin] = useState('')
-  const [apiProbePassword, setApiProbePassword] = useState('')
-  const [testConnectionLoading, setTestConnectionLoading] = useState(false)
-  const [testConnectionResult, setTestConnectionResult] = useState(null)
 
   const onSubmit = (event) => {
     event.preventDefault()
@@ -40,9 +34,6 @@ export function ProvidersPage({ db, actions }) {
     }
     setForm(emptyForm)
     setEditingId(null)
-    setApiProbeLogin('')
-    setApiProbePassword('')
-    setTestConnectionResult(null)
     setIsModalOpen(false)
   }
 
@@ -59,35 +50,9 @@ export function ProvidersPage({ db, actions }) {
       apiBaseUrl: provider.apiBaseUrl || '',
     })
     setEditingId(provider.id)
-    setApiProbeLogin('')
-    setApiProbePassword('')
-    setTestConnectionResult(null)
     setIsModalOpen(true)
   }
 
-  const canTestApi =
-    form.apiType === 'billmanager' &&
-    form.apiBaseUrl?.trim() &&
-    apiProbeLogin?.trim() &&
-    apiProbePassword?.trim()
-
-  const onTestConnection = async () => {
-    if (!canTestApi) {
-      setTestConnectionResult({ ok: false, error: 'Заполните URL API и тестовый логин/пароль аккаунта' })
-      return
-    }
-    setTestConnectionLoading(true)
-    setTestConnectionResult(null)
-    try {
-      const result = await testApiConnection(form.apiBaseUrl, `${apiProbeLogin}:${apiProbePassword}`)
-      setTestConnectionResult(result)
-    } catch (err) {
-      setTestConnectionResult({ ok: false, error: err.message || 'Ошибка проверки' })
-    } finally {
-      setTestConnectionLoading(false)
-    }
-  }
-
   return (
     <>
       <PageHeader pretitle="Справочники" title="Хостеры" />
@@ -103,9 +68,6 @@ export function ProvidersPage({ db, actions }) {
                 onClick={() => {
                   setForm(emptyForm)
                   setEditingId(null)
-                  setApiProbeLogin('')
-                  setApiProbePassword('')
-                  setTestConnectionResult(null)
                   setIsModalOpen(true)
                 }}
               >
@@ -194,9 +156,6 @@ export function ProvidersPage({ db, actions }) {
           setIsModalOpen(false)
           setEditingId(null)
           setForm(emptyForm)
-          setApiProbeLogin('')
-          setApiProbePassword('')
-          setTestConnectionResult(null)
         }}
         size="modal-md"
       >
@@ -275,7 +234,8 @@ export function ProvidersPage({ db, actions }) {
             <hr className="my-2" />
             <h6 className="text-secondary mb-2">Интеграция API (один URL на хостера)</h6>
             <div className="text-secondary small mb-2">
-              Логин и пароль задаются в карточке каждого аккаунта этого хостера.
+              Логин и пароль API — в разделе «Аккаунты хостеров»; проверка соединения доступна там при вводе
+              учётных данных.
             </div>
           </div>
           <div className="col-12">
@@ -297,61 +257,16 @@ export function ProvidersPage({ db, actions }) {
             </select>
           </div>
           {form.apiType === 'billmanager' ? (
-            <>
-              <div className="col-12">
-                <label className="form-label">URL API BILLmanager</label>
-                <input
-                  {...noBrowserSuggestProps}
-                  className="form-control"
-                  placeholder="https://bill.example.com:1500/billmgr"
-                  value={form.apiBaseUrl}
-                  onChange={(e) => setForm((prev) => ({ ...prev, apiBaseUrl: e.target.value }))}
-                />
-              </div>
-              <div className="col-12 col-sm-6">
-                <label className="form-label">Тест: логин аккаунта</label>
-                <input
-                  {...noBrowserSuggestProps}
-                  className="form-control"
-                  placeholder="не сохраняется"
-                  value={apiProbeLogin}
-                  onChange={(e) => setApiProbeLogin(e.target.value)}
-                />
-              </div>
-              <div className="col-12 col-sm-6">
-                <label className="form-label">Тест: пароль</label>
-                <input
-                  {...passwordCredentialInputProps}
-                  type="password"
-                  className="form-control"
-                  placeholder="не сохраняется"
-                  value={apiProbePassword}
-                  onChange={(e) => setApiProbePassword(e.target.value)}
-                />
-              </div>
-              <div className="col-12 d-flex align-items-center gap-2 flex-wrap">
-                <button
-                  type="button"
-                  className="btn btn-outline-secondary btn-sm"
-                  onClick={onTestConnection}
-                  disabled={!canTestApi || testConnectionLoading}
-                >
-                  {testConnectionLoading ? (
-                    <span className="spinner-border spinner-border-sm me-1" role="status" />
-                  ) : (
-                    <IconPlugConnected size={14} className="me-1" />
-                  )}
-                  Проверить соединение
-                </button>
-                {testConnectionResult ? (
-                  <span className={testConnectionResult.ok ? 'text-success small' : 'text-danger small'}>
-                    {testConnectionResult.ok
-                      ? `Соединение успешно${testConnectionResult.vdsCount != null ? `, VDS: ${testConnectionResult.vdsCount}` : ''}`
-                      : testConnectionResult.error}
-                  </span>
-                ) : null}
-              </div>
-            </>
+            <div className="col-12">
+              <label className="form-label">URL API BILLmanager</label>
+              <input
+                {...noBrowserSuggestProps}
+                className="form-control"
+                placeholder="https://bill.example.com:1500/billmgr"
+                value={form.apiBaseUrl}
+                onChange={(e) => setForm((prev) => ({ ...prev, apiBaseUrl: e.target.value }))}
+              />
+            </div>
           ) : null}
           <div className="col-12 d-flex gap-2 justify-content-end">
             <button type="button" className="btn btn-outline-secondary" onClick={() => setIsModalOpen(false)}>