chore: Fix additional ESLint warnings in BlogWriter components
This commit is contained in:
@@ -205,10 +205,6 @@ export const useSuggestions = ({
|
|||||||
outlinePolling,
|
outlinePolling,
|
||||||
mediumPolling,
|
mediumPolling,
|
||||||
hasContent,
|
hasContent,
|
||||||
flowAnalysisCompleted,
|
|
||||||
contentConfirmed,
|
|
||||||
seoAnalysis,
|
|
||||||
seoMetadata,
|
|
||||||
seoRecommendationsApplied
|
seoRecommendationsApplied
|
||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -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);
|
||||||
|
|||||||
@@ -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) && (
|
||||||
|
|||||||
@@ -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>;
|
||||||
|
|||||||
Reference in New Issue
Block a user