feat: initial full-stack nyaa-crawler implementation
- Node.js + TypeScript + Express backend using built-in node:sqlite - React + Vite frontend with dark-themed UI - Nyaa.si RSS polling via fast-xml-parser - Watch list with show/episode CRUD and status tracking - Auto-download scheduler with node-cron (configurable interval) - .torrent file downloader with batch-release filtering - Settings page for poll interval and quality defaults - Dockerfile and docker-compose for Unraid deployment - SQLite DB with migrations (shows, episodes, settings tables) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
106
src/client/pages/SettingsPage.tsx
Normal file
106
src/client/pages/SettingsPage.tsx
Normal file
@@ -0,0 +1,106 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { api, type Settings } from '../api'
|
||||
|
||||
export default function SettingsPage() {
|
||||
const [settings, setSettings] = useState<Settings | null>(null)
|
||||
const [form, setForm] = useState({ poll_interval_seconds: '', default_quality: '', default_sub_group: '' })
|
||||
const [saving, setSaving] = useState(false)
|
||||
const [saved, setSaved] = useState(false)
|
||||
const [error, setError] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
api.settings.get().then((s) => {
|
||||
setSettings(s)
|
||||
setForm({
|
||||
poll_interval_seconds: s.poll_interval_seconds,
|
||||
default_quality: s.default_quality,
|
||||
default_sub_group: s.default_sub_group,
|
||||
})
|
||||
})
|
||||
}, [])
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
setSaving(true)
|
||||
setError('')
|
||||
setSaved(false)
|
||||
try {
|
||||
const updated = await api.settings.update(form)
|
||||
setSettings(updated)
|
||||
setSaved(true)
|
||||
setTimeout(() => setSaved(false), 3000)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Save failed')
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}
|
||||
|
||||
if (!settings) return <div className="empty-state"><div className="spinner" /></div>
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="page-header">
|
||||
<h1>Settings</h1>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} style={{ maxWidth: 480 }}>
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ marginBottom: 16, fontWeight: 600 }}>Polling</div>
|
||||
|
||||
<div className="form-group" style={{ marginBottom: 16 }}>
|
||||
<label>Poll Interval (seconds)</label>
|
||||
<input
|
||||
type="number"
|
||||
min={60}
|
||||
value={form.poll_interval_seconds}
|
||||
onChange={(e) => setForm((f) => ({ ...f, poll_interval_seconds: e.target.value }))}
|
||||
/>
|
||||
<p className="text-muted text-sm" style={{ marginTop: 4 }}>
|
||||
Minimum 60 seconds. Default is 900 (15 minutes).
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ marginBottom: 16, fontWeight: 600 }}>Defaults (applied to new shows)</div>
|
||||
|
||||
<div className="form-group" style={{ marginBottom: 12 }}>
|
||||
<label>Default Quality</label>
|
||||
<input
|
||||
value={form.default_quality}
|
||||
onChange={(e) => setForm((f) => ({ ...f, default_quality: e.target.value }))}
|
||||
placeholder="1080p"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label>Default Sub Group</label>
|
||||
<input
|
||||
value={form.default_sub_group}
|
||||
onChange={(e) => setForm((f) => ({ ...f, default_sub_group: e.target.value }))}
|
||||
placeholder="SubsPlease"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ marginBottom: 8, fontWeight: 600 }}>Torrent Output Directory</div>
|
||||
<code style={{ fontSize: 12, color: 'var(--text-muted)', wordBreak: 'break-all' }}>
|
||||
{settings.torrent_output_dir}
|
||||
</code>
|
||||
<p className="text-muted text-sm" style={{ marginTop: 6 }}>
|
||||
Configured via the <code>TORRENT_OUTPUT_DIR</code> environment variable.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{error && <p style={{ color: 'var(--red)', marginBottom: 12 }}>{error}</p>}
|
||||
{saved && <p style={{ color: 'var(--green)', marginBottom: 12 }}>Settings saved.</p>}
|
||||
|
||||
<button type="submit" disabled={saving}>
|
||||
{saving ? <span className="spinner" /> : 'Save Settings'}
|
||||
</button>
|
||||
</form>
|
||||
</>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user