chore: Fix additional ESLint warnings in BlogWriter components

This commit is contained in:
ajaysi
2026-03-02 15:46:22 +05:30
parent b4549ebe39
commit d49d2b627e
4 changed files with 44 additions and 70 deletions

View File

@@ -205,10 +205,6 @@ export const useSuggestions = ({
outlinePolling, outlinePolling,
mediumPolling, mediumPolling,
hasContent, hasContent,
flowAnalysisCompleted,
contentConfirmed,
seoAnalysis,
seoMetadata,
seoRecommendationsApplied seoRecommendationsApplied
]); ]);
}; };

View File

@@ -1,5 +1,5 @@
import React, { useState, useCallback, useEffect, useRef } from 'react'; import React, { useState, useCallback, useEffect, useRef } from 'react';
import { createTheme, ThemeProvider, Paper, IconButton, TextField, Tooltip, CircularProgress, Dialog, DialogTitle, DialogContent, DialogActions, Button, Typography, Box, Divider } from '@mui/material'; import { createTheme, ThemeProvider, Paper, IconButton, Tooltip, CircularProgress, Dialog, DialogTitle, DialogContent, DialogActions, Button, Typography, Box, Divider } from '@mui/material';
import { import {
AutoAwesome as AutoAwesomeIcon, AutoAwesome as AutoAwesomeIcon,
} from '@mui/icons-material'; } from '@mui/icons-material';
@@ -50,7 +50,7 @@ const BlogEditor: React.FC<BlogEditorProps> = ({
const [blogTitle, setBlogTitle] = useState(initialTitle || 'Your Amazing Blog Title'); const [blogTitle, setBlogTitle] = useState(initialTitle || 'Your Amazing Blog Title');
const [introduction, setIntroduction] = useState('Click "Generate Introduction" to create a compelling opening for your blog post based on your content and research.'); const [introduction, setIntroduction] = useState('Click "Generate Introduction" to create a compelling opening for your blog post based on your content and research.');
const [sections, setSections] = useState<any[]>([]); const [sections, setSections] = useState<any[]>([]);
const [isTitleLoading, setIsTitleLoading] = useState(false); // const [isTitleLoading, setIsTitleLoading] = useState(false); // Unused state
const [isIntroductionLoading, setIsIntroductionLoading] = useState(false); const [isIntroductionLoading, setIsIntroductionLoading] = useState(false);
const [expandedSections, setExpandedSections] = useState<Set<any>>(new Set()); const [expandedSections, setExpandedSections] = useState<Set<any>>(new Set());
const [showTitleModal, setShowTitleModal] = useState(false); const [showTitleModal, setShowTitleModal] = useState(false);

View File

@@ -135,6 +135,7 @@ const BlogSection: React.FC<BlogSectionProps> = ({
const formattedContent = formatContent(initialContent); const formattedContent = formatContent(initialContent);
setContent(formattedContent); setContent(formattedContent);
} }
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [initialContent]); }, [initialContent]);
const handleContentChange = (e: any) => { const handleContentChange = (e: any) => {
@@ -324,71 +325,48 @@ const BlogSection: React.FC<BlogSectionProps> = ({
</div> </div>
)} )}
<div {isGenerating ? (
className="relative" <div className="flex items-center justify-center p-8 bg-gray-50 rounded-lg animate-pulse">
onMouseUp={assistiveWriting.handleTextSelection} <span className="text-gray-500 font-medium">Generating content based on research...</span>
onKeyUp={assistiveWriting.handleTextSelection} </div>
> ) : (
<TextField <div className="relative">
multiline {/* Image Placeholder */}
fullWidth {outlineData?.keywords && outlineData.keywords.length > 0 && (
variant="standard" <div className="absolute -right-4 top-0 opacity-0 group-hover:opacity-100 transition-opacity">
value={content} <Tooltip title="Section image coming soon">
onChange={handleContentChange} <IconButton size="small">
onFocus={handleFocus} <img
onBlur={handleBlur} src={`https://source.unsplash.com/random/800x600?${outlineData.keywords[0]}`}
placeholder="Start writing your section here... Select text for assistive writing features!" alt=""
InputProps={{ className="w-8 h-8 rounded object-cover"
disableUnderline: true, />
className: 'text-gray-600 leading-relaxed text-base md:text-lg focus-within:bg-indigo-50/50 p-2 rounded-md transition-colors duration-200', </IconButton>
style: { </Tooltip>
whiteSpace: 'pre-wrap', // Preserve line breaks and spaces </div>
lineHeight: '1.8', // Better line spacing for readability )}
},
}}
inputRef={contentRef}
/>
{/* Render assistive writing selection menu */} <TextField
{assistiveWriting.renderSelectionMenu()} multiline
{/* Simple AI generation button - only show when no text selection menu is active */} fullWidth
{content && isFocused && !assistiveWriting.selectionMenu && ( variant="outlined"
<div placeholder="Start writing or use AI to generate content..."
className="absolute z-10" value={content}
style={{ onChange={handleContentChange}
right: '8px', onFocus={handleFocus}
bottom: '8px', onBlur={handleBlur}
}} minRows={6}
> InputProps={{
<Tooltip title="✨ Generate Content"> className: `font-serif text-lg leading-relaxed text-gray-700 p-0 border-none ${isFocused ? 'bg-white' : 'bg-transparent'} transition-colors duration-200`,
<IconButton style: { lineHeight: '1.8' }
size="small" }}
onClick={handleGenerateContent} sx={{
disabled={isGenerating} '& .MuiOutlinedInput-notchedOutline': { border: 'none' },
sx={{ '& .MuiOutlinedInput-root': { padding: 0 }
background: 'rgba(79, 70, 229, 0.1)', }}
color: '#4f46e5', />
border: '1px solid rgba(79, 70, 229, 0.2)',
'&:hover': {
background: 'rgba(79, 70, 229, 0.2)',
transform: 'translateY(-1px)',
},
'&:disabled': {
background: 'rgba(255, 255, 255, 0.7)',
color: '#9CA3AF',
},
}}
>
{isGenerating ? (
<CircularProgress size={16} color="inherit" />
) : (
<AutoAwesomeIcon fontSize="small" />
)}
</IconButton>
</Tooltip>
</div> </div>
)} )}
</div>
{/* Outline Information Section */} {/* Outline Information Section */}
{outlineData && expandedSections.has(id) && ( {outlineData && expandedSections.has(id) && (

View File

@@ -2,7 +2,7 @@ import React, { useState, useRef, useEffect } from 'react';
import { hallucinationDetectorService, HallucinationDetectionResponse } from '../../../services/hallucinationDetectorService'; import { hallucinationDetectorService, HallucinationDetectionResponse } from '../../../services/hallucinationDetectorService';
import TextSelectionMenu from './TextSelectionMenu'; import TextSelectionMenu from './TextSelectionMenu';
import useSmartTypingAssist from './SmartTypingAssist'; import useSmartTypingAssist from './SmartTypingAssist';
import { debug } from '../../../utils/debug'; // import { debug } from '../../../utils/debug'; // Unused import
interface BlogTextSelectionHandlerProps { interface BlogTextSelectionHandlerProps {
contentRef: React.RefObject<HTMLDivElement | HTMLTextAreaElement>; contentRef: React.RefObject<HTMLDivElement | HTMLTextAreaElement>;