From d88ae6dcc344642109716d49807af8a0c99ef870 Mon Sep 17 00:00:00 2001 From: Michael Mainguy Date: Wed, 20 Aug 2025 17:50:23 -0500 Subject: [PATCH] Fix all ESLint errors and improve code quality MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Fix unused variable errors by removing unused parameters or using proper destructuring - Fix 'prefer-const' violations by replacing 'let' with 'const' where appropriate - Fix lexical declaration errors in switch cases by adding proper block scoping - Replace explicit 'any' type with proper TypeScript interface for DOMPurify config - Fix React hooks dependency warnings in useDialog hook - Remove unused imports and variables throughout codebase Specific fixes: - Replace '_' parameters with proper destructuring syntax ([, value]) - Add block scopes to switch case statements in templateRenderer.ts - Improve type safety in htmlSanitizer.ts with explicit DOMPurify interface - Fix useCallback dependencies in useDialog hook - Remove unused 'placeholder' parameter in generateSampleDataForSlot All 15 ESLint errors have been resolved, improving code maintainability and consistency. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- .../presentations/PresentationEditor.tsx | 1 - src/components/presentations/SlideEditor.tsx | 2 +- src/components/presentations/ThemeSelector.tsx | 4 ++-- src/components/themes/LayoutPreviewPage.tsx | 2 +- src/components/themes/ThemeBrowser.tsx | 2 +- src/components/themes/ThemeDetailPage.tsx | 2 +- src/hooks/useDialog.ts | 2 +- src/utils/htmlSanitizer.ts | 9 ++++++++- src/utils/templateRenderer.ts | 17 +++++++++++------ 9 files changed, 26 insertions(+), 15 deletions(-) diff --git a/src/components/presentations/PresentationEditor.tsx b/src/components/presentations/PresentationEditor.tsx index d6fe1a5..71b5c11 100644 --- a/src/components/presentations/PresentationEditor.tsx +++ b/src/components/presentations/PresentationEditor.tsx @@ -29,7 +29,6 @@ export const PresentationEditor: React.FC = () => { alertOptions, confirmOptions, showAlert, - showConfirm, closeAlert, closeConfirm, handleConfirm, diff --git a/src/components/presentations/SlideEditor.tsx b/src/components/presentations/SlideEditor.tsx index a8a7b30..309d834 100644 --- a/src/components/presentations/SlideEditor.tsx +++ b/src/components/presentations/SlideEditor.tsx @@ -92,7 +92,7 @@ export const SlideEditor: React.FC = () => { useEffect(() => { if (theme) { const themeStyleId = 'slide-editor-theme-style'; - let existingStyle = document.getElementById(themeStyleId); + const existingStyle = document.getElementById(themeStyleId); if (existingStyle) { existingStyle.remove(); diff --git a/src/components/presentations/ThemeSelector.tsx b/src/components/presentations/ThemeSelector.tsx index 5664287..6085b5c 100644 --- a/src/components/presentations/ThemeSelector.tsx +++ b/src/components/presentations/ThemeSelector.tsx @@ -27,7 +27,7 @@ export const ThemeSelector: React.FC = ({ {/* Color palette preview */}
{theme.variables && Object.entries(theme.variables) - .filter(([_, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) + .filter(([, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) .slice(0, 4) .map(([key, value]) => (
= ({ /> )) } - {(!theme.variables || Object.entries(theme.variables).filter(([_, value]) => + {(!theme.variables || Object.entries(theme.variables).filter(([, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl') ).length === 0) && (
No colors defined
diff --git a/src/components/themes/LayoutPreviewPage.tsx b/src/components/themes/LayoutPreviewPage.tsx index a009684..810d941 100644 --- a/src/components/themes/LayoutPreviewPage.tsx +++ b/src/components/themes/LayoutPreviewPage.tsx @@ -56,7 +56,7 @@ export const LayoutPreviewPage: React.FC = () => { if (theme) { // Dynamically load theme CSS const themeStyleId = 'theme-preview-style'; - let existingStyle = document.getElementById(themeStyleId); + const existingStyle = document.getElementById(themeStyleId); if (existingStyle) { existingStyle.remove(); diff --git a/src/components/themes/ThemeBrowser.tsx b/src/components/themes/ThemeBrowser.tsx index 2df7e76..1478f2a 100644 --- a/src/components/themes/ThemeBrowser.tsx +++ b/src/components/themes/ThemeBrowser.tsx @@ -118,7 +118,7 @@ export const ThemeBrowser: React.FC = () => {
{Object.entries(theme.variables) - .filter(([_, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) + .filter(([, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) .slice(0, 6) // Show max 6 color swatches to avoid overcrowding .map(([key, value]) => (
{

Color Palette

{Object.entries(theme.variables) - .filter(([_, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) + .filter(([, value]) => value.startsWith('#') || value.includes('rgb') || value.includes('hsl')) .map(([key, value]) => (
{ closeConfirm(); diff --git a/src/utils/htmlSanitizer.ts b/src/utils/htmlSanitizer.ts index 1bea39b..bdf4880 100644 --- a/src/utils/htmlSanitizer.ts +++ b/src/utils/htmlSanitizer.ts @@ -69,7 +69,14 @@ export function sanitizeHtml(html: string, config: SanitizeConfig = {}): string const finalConfig = { ...DEFAULT_SLIDE_CONFIG, ...config }; // Build DOMPurify configuration - const purifyConfig: any = { + const purifyConfig: { + ALLOWED_TAGS: string[]; + ALLOWED_ATTR: string[]; + FORBID_TAGS: string[]; + FORBID_ATTR: string[]; + KEEP_CONTENT: boolean; + ALLOW_DATA_ATTR: boolean; + } = { ALLOWED_TAGS: finalConfig.allowedTags, ALLOWED_ATTR: finalConfig.allowedAttributes, // Remove any scripts or dangerous content diff --git a/src/utils/templateRenderer.ts b/src/utils/templateRenderer.ts index 301c4ea..d1619a8 100644 --- a/src/utils/templateRenderer.ts +++ b/src/utils/templateRenderer.ts @@ -66,7 +66,7 @@ const SAMPLE_CONTENT = { * Generates sample data for a slot based on its configuration */ export const generateSampleDataForSlot = (slot: SlotConfig): string => { - const { id, type, placeholder, defaultContent } = slot; + const { id, type, defaultContent } = slot; // Use default content if available if (defaultContent && defaultContent.trim()) { @@ -81,21 +81,25 @@ export const generateSampleDataForSlot = (slot: SlotConfig): string => { case 'image': return createImageSVG(slotDisplayName); - case 'title': + case 'title': { const titleSamples = SAMPLE_CONTENT.title; return titleSamples[Math.floor(Math.random() * titleSamples.length)]; + } - case 'subtitle': + case 'subtitle': { const subtitleSamples = SAMPLE_CONTENT.subtitle; return subtitleSamples[Math.floor(Math.random() * subtitleSamples.length)]; + } - case 'heading': + case 'heading': { const headingSamples = SAMPLE_CONTENT.heading; return headingSamples[Math.floor(Math.random() * headingSamples.length)]; + } - case 'text': + case 'text': { const textSamples = SAMPLE_CONTENT.text; return textSamples[Math.floor(Math.random() * textSamples.length)]; + } case 'video': return createImageSVG(`${slotDisplayName} (Video)`, 640, 360); @@ -103,9 +107,10 @@ export const generateSampleDataForSlot = (slot: SlotConfig): string => { case 'audio': return `[${slotDisplayName} Audio]`; - case 'list': + case 'list': { const listSamples = SAMPLE_CONTENT.list; return listSamples[Math.floor(Math.random() * listSamples.length)]; + } case 'code': return `// ${slotDisplayName}\nfunction ${id.replace(/-/g, '')}() {\n return "${slotDisplayName}";\n}`;