69c2bc114b
- Добавлен роутер /api/v1/ с аутентификацией через API-ключ - Endpoints: GET /api/v1/me, PATCH /api/v1/me/api-key, GET /api/v1/collections, POST /api/v1/tickets, POST /api/v1/search - На странице настроек: копирование и сброс API-ключа
75 lines
2.5 KiB
TypeScript
75 lines
2.5 KiB
TypeScript
import { useEffect, useState } from 'react'
|
||
import { Link } from 'react-router-dom'
|
||
import { api, getToken, User } from '../api/client'
|
||
|
||
export default function Settings() {
|
||
const [user, setUser] = useState<User | null>(null)
|
||
const [copied, setCopied] = useState(false)
|
||
const [rotating, setRotating] = useState(false)
|
||
|
||
useEffect(() => {
|
||
if (!getToken()) {
|
||
window.location.href = '/login'
|
||
return
|
||
}
|
||
api.me().then(setUser)
|
||
}, [])
|
||
|
||
async function copyKey() {
|
||
if (!user) return
|
||
await navigator.clipboard.writeText(user.api_key)
|
||
setCopied(true)
|
||
setTimeout(() => setCopied(false), 2000)
|
||
}
|
||
|
||
async function rotateKey() {
|
||
if (!confirm('Сгенерировать новый API-ключ? Старый перестанет работать.')) return
|
||
setRotating(true)
|
||
try {
|
||
const res = await api.rotateApiKey()
|
||
setUser(prev => prev ? { ...prev, api_key: res.api_key } : null)
|
||
} catch (err: any) {
|
||
alert('Ошибка: ' + err.message)
|
||
} finally {
|
||
setRotating(false)
|
||
}
|
||
}
|
||
|
||
return (
|
||
<div style={{ maxWidth: 600, margin: '0 auto', padding: 20 }}>
|
||
<Link to="/dashboard" style={{ marginBottom: 16, display: 'block' }}>
|
||
← Назад
|
||
</Link>
|
||
|
||
<h1>Настройки</h1>
|
||
|
||
{user && (
|
||
<div>
|
||
<p><strong>Email:</strong> {user.email}</p>
|
||
<p>
|
||
<strong>API Key:</strong>{' '}
|
||
<code style={{ fontSize: 13 }}>{user.api_key}</code>
|
||
<button onClick={copyKey} style={{ marginLeft: 8, fontSize: 12 }}>
|
||
{copied ? 'Скопировано' : 'Копировать'}
|
||
</button>
|
||
<button onClick={rotateKey} disabled={rotating} style={{ marginLeft: 8, fontSize: 12 }}>
|
||
{rotating ? 'Обновление...' : 'Сбросить'}
|
||
</button>
|
||
</p>
|
||
<p>
|
||
<strong>REST API:</strong>{' '}
|
||
<code style={{ fontSize: 13 }}>
|
||
POST /api/v1/search
|
||
</code>
|
||
</p>
|
||
<p style={{ fontSize: 13, color: '#666' }}>
|
||
Используйте <code>Authorization: Bearer <API_Key></code> для доступа к API.
|
||
Документация: <Link to="/api/docs">/api/docs</Link>
|
||
</p>
|
||
<p><strong>План:</strong> {user.plan}</p>
|
||
<p><strong>Дата регистрации:</strong> {new Date(user.created_at).toLocaleDateString()}</p>
|
||
</div>
|
||
)}
|
||
</div>
|
||
)
|
||
}
|