Improve how the text is displayed and managed on the reading page

Refactors page navigation and enhances data processing in `NewWorkReading.tsx` to prevent re-renders and ensure type safety.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: cbacfb18-842a-4116-a907-18c0105ad8ec
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/39b5c689-6e8a-4d5a-9792-69cc81a56534/7a2b685c-be08-4ee5-b1e9-5d3d68ea9c89.jpg
This commit is contained in:
mukimovd 2025-05-01 23:09:14 +00:00
parent 1d35cf4e58
commit 7acaa3c393

View File

@ -71,7 +71,8 @@ import {
Eye,
ExternalLink,
Palette,
Columns
Columns,
X
} from "lucide-react";
// Type definitions for linguistic analysis
@ -236,7 +237,7 @@ export default function NewWorkReading() {
});
});
uniqueWords.forEach(word => {
Array.from(uniqueWords).forEach(word => {
const count = Math.ceil(word.length / 3);
const breakdown = [];
for (let i = 0; i < word.length; i += 3) {
@ -271,7 +272,7 @@ export default function NewWorkReading() {
.map(w => w.replace(/[.,;!?]/g, '').toLowerCase())
.filter(w => w.length > 0);
const complexTerms = [...new Set(allWords.filter(w => w.length > 8 || Math.random() > 0.9))];
const complexTerms = Array.from(new Set(allWords.filter(w => w.length > 8 || Math.random() > 0.9)));
// Theme lexicon
const themes = ['love', 'nature', 'time', 'death', 'art'];
@ -321,11 +322,15 @@ export default function NewWorkReading() {
const lines = contentToLines(content);
const totalPages = Math.ceil(lines.length / linesPerPage);
// Make sure active page is in bounds
const safePage = Math.min(Math.max(1, activePage), totalPages);
if (safePage !== activePage) {
setActivePage(safePage);
}
// Make sure active page is in bounds but without causing re-renders
const safePage = Math.min(Math.max(1, activePage), Math.max(1, totalPages));
// Only update active page in a useEffect to avoid infinite re-render
useEffect(() => {
if (safePage !== activePage) {
setActivePage(safePage);
}
}, [safePage, activePage]);
const startIdx = (safePage - 1) * linesPerPage;
const endIdx = startIdx + linesPerPage;