refactor: simplify ProvidersPage by removing unused API connection logic
Docker / build (push) Failing after 18s
Docker / build (push) Failing after 18s
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.
This commit is contained in:
+13
-98
@@ -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)}>
|
||||
|
||||
Reference in New Issue
Block a user