Store all mode results (OCR, Describe, Freeform) in a single job record
- DB: add describe_text and freeform_text columns (ALTER TABLE IF NOT EXISTS) - Backend: commit and review endpoints accept/persist all three text fields - App: accumulate results per mode in state; tabs appear when >1 mode run; all results sent on Commit Job - JobDetail: tabbed text panel shows whichever fields are populated, all editable Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -45,6 +45,15 @@ def init_db():
|
||||
cur.execute("""
|
||||
CREATE INDEX IF NOT EXISTS ocr_jobs_submitted_at_idx ON ocr_jobs(submitted_at DESC)
|
||||
""")
|
||||
# Add columns introduced after initial schema (safe to run repeatedly)
|
||||
cur.execute("""
|
||||
ALTER TABLE ocr_jobs
|
||||
ADD COLUMN IF NOT EXISTS describe_text TEXT
|
||||
""")
|
||||
cur.execute("""
|
||||
ALTER TABLE ocr_jobs
|
||||
ADD COLUMN IF NOT EXISTS freeform_text TEXT
|
||||
""")
|
||||
# Unique constraint: prevent duplicate (author, chapter, page) submissions.
|
||||
# Applies only when all three fields are non-null.
|
||||
cur.execute("""
|
||||
|
||||
@@ -607,6 +607,8 @@ class ReviewRequest(BaseModel):
|
||||
book: Optional[str] = None
|
||||
chapter: Optional[str] = None
|
||||
page: Optional[str] = None
|
||||
describe_text: Optional[str] = None
|
||||
freeform_text: Optional[str] = None
|
||||
|
||||
|
||||
def _job_row_to_dict(row) -> Dict[str, Any]:
|
||||
@@ -628,6 +630,8 @@ async def commit_job(
|
||||
chapter: str = Form(""),
|
||||
page: str = Form(""),
|
||||
ocr_text: str = Form(""),
|
||||
describe_text: str = Form(""),
|
||||
freeform_text: str = Form(""),
|
||||
mode: str = Form("plain_ocr"),
|
||||
):
|
||||
"""Commit an OCR job: save the image and insert a DB record."""
|
||||
@@ -660,13 +664,13 @@ async def commit_job(
|
||||
"""
|
||||
INSERT INTO ocr_jobs
|
||||
(id, author, book, chapter, page, image_path, original_filename,
|
||||
ocr_text, mode, status)
|
||||
VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, 'unreviewed')
|
||||
ocr_text, describe_text, freeform_text, mode, status)
|
||||
VALUES (%s, %s, %s, %s, %s, %s, %s, %s, %s, %s, %s, 'unreviewed')
|
||||
RETURNING *
|
||||
""",
|
||||
(job_id, author or None, book or None, chapter or None,
|
||||
page or None, image_path, original_filename,
|
||||
ocr_text or None, mode),
|
||||
ocr_text or None, describe_text or None, freeform_text or None, mode),
|
||||
)
|
||||
row = cur.fetchone()
|
||||
except Exception as exc:
|
||||
@@ -852,7 +856,9 @@ async def review_job(job_id: str, body: ReviewRequest):
|
||||
author = %s,
|
||||
book = %s,
|
||||
chapter = %s,
|
||||
page = %s
|
||||
page = %s,
|
||||
describe_text = %s,
|
||||
freeform_text = %s
|
||||
WHERE id = %s
|
||||
RETURNING *
|
||||
""",
|
||||
@@ -863,6 +869,8 @@ async def review_job(job_id: str, body: ReviewRequest):
|
||||
body.book or None,
|
||||
body.chapter or None,
|
||||
body.page or None,
|
||||
body.describe_text,
|
||||
body.freeform_text,
|
||||
job_id,
|
||||
),
|
||||
)
|
||||
|
||||
@@ -43,15 +43,21 @@ function App() {
|
||||
const suggestions = useSuggestions()
|
||||
|
||||
const [metadata, setMetadata] = useState({ author: '', book: '', chapter: '', page: '' })
|
||||
const [editedOcrText, setEditedOcrText] = useState('')
|
||||
// Results accumulated per mode: { plain_ocr: 'text', describe: 'text', freeform: 'text' }
|
||||
const [modeResults, setModeResults] = useState({})
|
||||
const [editedResults, setEditedResults] = useState({})
|
||||
const [activeResultMode, setActiveResultMode] = useState(null)
|
||||
const [commitLoading, setCommitLoading] = useState(false)
|
||||
const [commitResult, setCommitResult] = useState(null)
|
||||
|
||||
// Modes that produce editable text output and can be committed to the DB
|
||||
const COMMITTABLE_MODES = new Set(['plain_ocr', 'describe', 'freeform'])
|
||||
const MODE_LABELS = { plain_ocr: 'OCR Text', describe: 'Description', freeform: 'Freeform' }
|
||||
|
||||
// Whether to show the full-screen result view
|
||||
const showResultView = view === 'new_job' && COMMITTABLE_MODES.has(mode) && !!result
|
||||
// Show the full-screen result view when any committable mode has a result (or is loading)
|
||||
const showResultView = view === 'new_job' && (
|
||||
Object.keys(modeResults).length > 0 || (loading && COMMITTABLE_MODES.has(mode))
|
||||
)
|
||||
|
||||
const handleFileTypeChange = useCallback((newType) => {
|
||||
setImage(null)
|
||||
@@ -69,14 +75,18 @@ function App() {
|
||||
setImagePreview(null)
|
||||
setError(null)
|
||||
setResult(null)
|
||||
setEditedOcrText('')
|
||||
setModeResults({})
|
||||
setEditedResults({})
|
||||
setActiveResultMode(null)
|
||||
setCommitResult(null)
|
||||
} else {
|
||||
setImage(file)
|
||||
setImagePreview(fileType === 'image' ? URL.createObjectURL(file) : file)
|
||||
setError(null)
|
||||
setResult(null)
|
||||
setEditedOcrText('')
|
||||
setModeResults({})
|
||||
setEditedResults({})
|
||||
setActiveResultMode(null)
|
||||
setCommitResult(null)
|
||||
}
|
||||
}, [imagePreview, fileType])
|
||||
@@ -104,7 +114,12 @@ function App() {
|
||||
headers: { 'Content-Type': 'multipart/form-data' },
|
||||
})
|
||||
setResult(response.data)
|
||||
setEditedOcrText(response.data.text || '')
|
||||
if (COMMITTABLE_MODES.has(mode)) {
|
||||
const text = response.data.text || ''
|
||||
setModeResults(prev => ({ ...prev, [mode]: text }))
|
||||
setEditedResults(prev => ({ ...prev, [mode]: text }))
|
||||
setActiveResultMode(mode)
|
||||
}
|
||||
setCommitResult(null)
|
||||
} catch (err) {
|
||||
setError(err.response?.data?.detail || err.message || 'An error occurred')
|
||||
@@ -115,7 +130,9 @@ function App() {
|
||||
|
||||
const handleNewAnalysis = () => {
|
||||
setResult(null)
|
||||
setEditedOcrText('')
|
||||
setModeResults({})
|
||||
setEditedResults({})
|
||||
setActiveResultMode(null)
|
||||
setCommitResult(null)
|
||||
}
|
||||
|
||||
@@ -130,7 +147,9 @@ function App() {
|
||||
formData.append('book', metadata.book)
|
||||
formData.append('chapter', metadata.chapter)
|
||||
formData.append('page', metadata.page)
|
||||
formData.append('ocr_text', editedOcrText)
|
||||
formData.append('ocr_text', editedResults.plain_ocr || '')
|
||||
formData.append('describe_text', editedResults.describe || '')
|
||||
formData.append('freeform_text', editedResults.freeform || '')
|
||||
formData.append('mode', mode)
|
||||
|
||||
const response = await axios.post(`${API_BASE}/jobs`, formData, {
|
||||
@@ -142,15 +161,15 @@ function App() {
|
||||
} finally {
|
||||
setCommitLoading(false)
|
||||
}
|
||||
}, [image, editedOcrText, metadata, mode])
|
||||
}, [image, editedResults, metadata, mode])
|
||||
|
||||
const handleCopy = useCallback(() => {
|
||||
const text = editedOcrText || result?.text
|
||||
const text = (activeResultMode && editedResults[activeResultMode]) || result?.text
|
||||
if (text) navigator.clipboard.writeText(text)
|
||||
}, [editedOcrText, result])
|
||||
}, [activeResultMode, editedResults, result])
|
||||
|
||||
const handleDownload = useCallback(() => {
|
||||
const text = editedOcrText || result?.text
|
||||
const text = (activeResultMode && editedResults[activeResultMode]) || result?.text
|
||||
if (!text) return
|
||||
const ext = { plain_ocr: 'txt', describe: 'txt', find_ref: 'txt', freeform: 'txt' }[mode] || 'txt'
|
||||
const blob = new Blob([text], { type: 'text/plain' })
|
||||
@@ -260,16 +279,40 @@ function App() {
|
||||
</div>
|
||||
)}
|
||||
<div className="glass rounded-2xl p-4 flex flex-col h-full">
|
||||
{/* Mode tabs — only shown when multiple modes have results */}
|
||||
{Object.keys(modeResults).length > 1 && (
|
||||
<div className="flex gap-1 mb-3 flex-shrink-0">
|
||||
{Object.keys(modeResults).map(m => (
|
||||
<button
|
||||
key={m}
|
||||
onClick={() => setActiveResultMode(m)}
|
||||
className={`px-3 py-1 rounded-lg text-xs font-medium transition-colors ${
|
||||
activeResultMode === m
|
||||
? 'bg-purple-600 text-white'
|
||||
: 'bg-white/5 text-gray-400 hover:bg-white/10'
|
||||
}`}
|
||||
>
|
||||
{MODE_LABELS[m] || m}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<p className="text-xs text-gray-400 mb-2 flex-shrink-0">
|
||||
{{ plain_ocr: 'OCR Text', describe: 'Description', freeform: 'Result' }[mode] || 'Result'}
|
||||
{MODE_LABELS[activeResultMode] || 'Result'}
|
||||
<span className="text-purple-400 ml-1">(edit before committing)</span>
|
||||
</p>
|
||||
{loading && COMMITTABLE_MODES.has(mode) ? (
|
||||
<div className="flex-1 flex items-center justify-center">
|
||||
<Loader2 className="w-8 h-8 animate-spin text-purple-400" />
|
||||
</div>
|
||||
) : (
|
||||
<textarea
|
||||
value={editedOcrText}
|
||||
onChange={e => setEditedOcrText(e.target.value)}
|
||||
value={activeResultMode ? (editedResults[activeResultMode] ?? '') : ''}
|
||||
onChange={e => setEditedResults(prev => ({ ...prev, [activeResultMode]: e.target.value }))}
|
||||
className="flex-1 w-full bg-transparent text-sm text-gray-200 font-mono resize-none focus:outline-none min-h-0"
|
||||
placeholder="OCR text appears here..."
|
||||
placeholder="Run a mode to see results here..."
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -37,6 +37,9 @@ function JobDetail({ jobId, onClose, onReviewed, onDeleted, suggestions = {} })
|
||||
const [error, setError] = useState(null)
|
||||
|
||||
const [editedText, setEditedText] = useState('')
|
||||
const [editDescribeText, setEditDescribeText] = useState('')
|
||||
const [editFreeformText, setEditFreeformText] = useState('')
|
||||
const [activeTab, setActiveTab] = useState('ocr')
|
||||
const [editAuthor, setEditAuthor] = useState('')
|
||||
const [editBook, setEditBook] = useState('')
|
||||
const [editChapter, setEditChapter] = useState('')
|
||||
@@ -60,11 +63,17 @@ function JobDetail({ jobId, onClose, onReviewed, onDeleted, suggestions = {} })
|
||||
const d = res.data
|
||||
setJob(d)
|
||||
setEditedText(d.reviewed_text ?? d.ocr_text ?? '')
|
||||
setEditDescribeText(d.describe_text ?? '')
|
||||
setEditFreeformText(d.freeform_text ?? '')
|
||||
setEditAuthor(d.author || '')
|
||||
setEditBook(d.book || '')
|
||||
setEditChapter(d.chapter || '')
|
||||
setEditPage(d.page || '')
|
||||
setReviewerName(d.reviewer_name || '')
|
||||
// Default to first tab that has content
|
||||
if (d.reviewed_text || d.ocr_text) setActiveTab('ocr')
|
||||
else if (d.describe_text) setActiveTab('describe')
|
||||
else if (d.freeform_text) setActiveTab('freeform')
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
@@ -90,6 +99,8 @@ function JobDetail({ jobId, onClose, onReviewed, onDeleted, suggestions = {} })
|
||||
book: editBook,
|
||||
chapter: editChapter,
|
||||
page: editPage,
|
||||
describe_text: editDescribeText || null,
|
||||
freeform_text: editFreeformText || null,
|
||||
})
|
||||
setJob(res.data)
|
||||
setSaveResult({ success: true })
|
||||
@@ -199,17 +210,45 @@ function JobDetail({ jobId, onClose, onReviewed, onDeleted, suggestions = {} })
|
||||
/>
|
||||
</div>
|
||||
<div className="glass rounded-2xl p-4 flex flex-col h-full">
|
||||
{/* Tabs — only show tabs that have content */}
|
||||
{(() => {
|
||||
const tabs = [
|
||||
job.ocr_text || job.reviewed_text ? { id: 'ocr', label: 'OCR Text' } : null,
|
||||
job.describe_text != null ? { id: 'describe', label: 'Description' } : null,
|
||||
job.freeform_text != null ? { id: 'freeform', label: 'Freeform' } : null,
|
||||
].filter(Boolean)
|
||||
return tabs.length > 1 ? (
|
||||
<div className="flex gap-1 mb-3 flex-shrink-0">
|
||||
{tabs.map(t => (
|
||||
<button
|
||||
key={t.id}
|
||||
onClick={() => setActiveTab(t.id)}
|
||||
className={`px-3 py-1 rounded-lg text-xs font-medium transition-colors ${
|
||||
activeTab === t.id
|
||||
? 'bg-purple-600 text-white'
|
||||
: 'bg-white/5 text-gray-400 hover:bg-white/10'
|
||||
}`}
|
||||
>
|
||||
{t.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
) : null
|
||||
})()}
|
||||
|
||||
<p className="text-xs text-gray-400 mb-2 flex-shrink-0">
|
||||
{isReviewed ? 'Reviewed Text' : 'OCR Text'}
|
||||
{{ ocr: isReviewed ? 'Reviewed Text' : 'OCR Text', describe: 'Description', freeform: 'Freeform' }[activeTab]}
|
||||
<span className="text-purple-400 ml-1">(editable)</span>
|
||||
</p>
|
||||
|
||||
{activeTab === 'ocr' && (
|
||||
<>
|
||||
<textarea
|
||||
value={editedText}
|
||||
onChange={e => setEditedText(e.target.value)}
|
||||
className="flex-1 w-full bg-transparent text-sm text-gray-200 font-mono resize-none focus:outline-none min-h-0"
|
||||
placeholder="Text content..."
|
||||
placeholder="OCR text..."
|
||||
/>
|
||||
{/* Original OCR text collapsed for reviewed jobs */}
|
||||
{isReviewed && job.ocr_text && (
|
||||
<details className="flex-shrink-0 mt-2 border-t border-white/10 pt-2">
|
||||
<summary className="cursor-pointer text-xs text-gray-500 hover:text-gray-400 transition-colors">
|
||||
@@ -220,6 +259,24 @@ function JobDetail({ jobId, onClose, onReviewed, onDeleted, suggestions = {} })
|
||||
</pre>
|
||||
</details>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{activeTab === 'describe' && (
|
||||
<textarea
|
||||
value={editDescribeText}
|
||||
onChange={e => setEditDescribeText(e.target.value)}
|
||||
className="flex-1 w-full bg-transparent text-sm text-gray-200 font-mono resize-none focus:outline-none min-h-0"
|
||||
placeholder="Description text..."
|
||||
/>
|
||||
)}
|
||||
{activeTab === 'freeform' && (
|
||||
<textarea
|
||||
value={editFreeformText}
|
||||
onChange={e => setEditFreeformText(e.target.value)}
|
||||
className="flex-1 w-full bg-transparent text-sm text-gray-200 font-mono resize-none focus:outline-none min-h-0"
|
||||
placeholder="Freeform result..."
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user