Archived
- Backend: Django REST Framework API with Bookmark and Note models - ViewSets with user-scoped querysets and select_related for N+1 prevention - Create/List/Detail/Update/Delete endpoints - Batch delete operations - Unique constraint on user+book+page for bookmarks - IsOwner permission class for object-level access control - Full serializer validation (page > 0, non-empty content, duplicate check) - 30+ pytest-django tests covering CRUD, auth, filtering, edge cases - Frontend: React TypeScript components - AnnotationsContext with useReducer for state management - BookmarkList, NoteList, AddAnnotationForm, AnnotationsDashboard - Inline note editing with immediate save - Batch delete support - API client with JWT auto-refresh interceptors - Paginated query hook for infinite scroll support - Responsive CSS with loading/empty states - Infrastructure: Django project with custom User model, JWT auth, CORS - PostgreSQL database models with proper FK and indexes - Django admin configuration for all models
23 lines
587 B
TypeScript
23 lines
587 B
TypeScript
import React from "react";
|
|
import { AnnotationsDashboard } from "@/components/annotations";
|
|
|
|
interface BookmarksNotesPageProps {
|
|
bookId?: string;
|
|
}
|
|
|
|
export function BookmarksNotesPage({
|
|
bookId,
|
|
}: BookmarksNotesPageProps): React.ReactElement {
|
|
return (
|
|
<div className="page">
|
|
<h2>Bookmarks & Notes</h2>
|
|
<AnnotationsDashboard
|
|
bookId={bookId}
|
|
onNavigateToPage={(bookId, page) => {
|
|
// Navigate to the book reader page at the specific page
|
|
window.location.href = `/books/${bookId}?page=${page}`;
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|
|
} |