diff --git a/app/generator/GeneratorClient.tsx b/app/generator/GeneratorClient.tsx
index a9ddd36e7..50c2e8197 100644
--- a/app/generator/GeneratorClient.tsx
+++ b/app/generator/GeneratorClient.tsx
@@ -6,6 +6,7 @@ import { PreviewPanel } from './components/PreviewPanel';
import { CompletionScorePanel } from './components/CompletionScorePanel';
import { ReadmeInsightsPanel } from './components/ReadmeInsightsPanel';
import { ReadmeHealthBreakdown } from './components/ReadmeHealthBreakdown';
+import { ReadmeInsight } from './components/ReadmeInsight';
import { generateReadme, getEmptyReadme } from './utils/readmeGenerator';
import type { GeneratorState } from './types';
import type { ImportedData } from './utils/githubMapper';
@@ -101,6 +102,7 @@ export function GeneratorClient() {
+
);
diff --git a/app/generator/components/ReadmeInsight.test.tsx b/app/generator/components/ReadmeInsight.test.tsx
new file mode 100644
index 000000000..a8cd97278
--- /dev/null
+++ b/app/generator/components/ReadmeInsight.test.tsx
@@ -0,0 +1,67 @@
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/vitest';
+import { describe, it, expect } from 'vitest';
+import { ReadmeInsight } from './ReadmeInsight';
+import type { GeneratorState } from '../types';
+import React from 'react';
+
+const EMPTY_STATE: GeneratorState = {
+ name: '',
+ description: '',
+ selectedTechs: [],
+ selectedSocials: [],
+ socialLinks: {},
+ githubUsername: '',
+ showCommitPulse: false,
+ commitPulseAccent: '',
+ showSnakeGraph: false,
+ showPacmanGraph: false,
+ graphPlacement: 'bottom',
+};
+
+describe('ReadmeInsight Component Tests', () => {
+ it('renders title and correct default tip when state is completely empty', () => {
+ render();
+
+ expect(screen.getByText('README Insight')).toBeInTheDocument();
+ expect(screen.getByText('💡 Improve description clarity')).toBeInTheDocument();
+ expect(screen.getByText('Health Boost +20%')).toBeInTheDocument();
+ });
+
+ it('suggests adding badges when description is filled but showCommitPulse is false', () => {
+ const state = { ...EMPTY_STATE, description: 'Awesome project' };
+ render();
+
+ expect(screen.getByText('💡 Add badges for credibility')).toBeInTheDocument();
+ expect(screen.getByText('Health Boost +10%')).toBeInTheDocument();
+ });
+
+ it('suggests including social links when description and commitPulse are enabled but socials are empty', () => {
+ const state = {
+ ...EMPTY_STATE,
+ description: 'Awesome project',
+ showCommitPulse: true,
+ githubUsername: 'roshesh',
+ };
+ render();
+
+ expect(screen.getByText('💡 Include social links')).toBeInTheDocument();
+ expect(screen.getByText('Health Boost +20%')).toBeInTheDocument();
+ });
+
+ it('suggests adding installation steps when all key items are filled', () => {
+ const state = {
+ ...EMPTY_STATE,
+ name: 'CommitPulse',
+ description: 'Awesome project',
+ showCommitPulse: true,
+ githubUsername: 'roshesh',
+ selectedSocials: ['github'],
+ socialLinks: { github: 'https://github.com/roshesh' },
+ };
+ render();
+
+ expect(screen.getByText('💡 Add installation steps')).toBeInTheDocument();
+ expect(screen.getByText('Health Boost +15%')).toBeInTheDocument();
+ });
+});
diff --git a/app/generator/components/ReadmeInsight.tsx b/app/generator/components/ReadmeInsight.tsx
new file mode 100644
index 000000000..52ef05d7d
--- /dev/null
+++ b/app/generator/components/ReadmeInsight.tsx
@@ -0,0 +1,69 @@
+'use client';
+
+import { useMemo } from 'react';
+import { Sparkles } from 'lucide-react';
+import type { GeneratorState } from '../types';
+
+interface ReadmeInsightProps {
+ state: GeneratorState;
+}
+
+export function ReadmeInsight({ state }: ReadmeInsightProps) {
+ const activeTip = useMemo(() => {
+ const hasName = (state.name || '').trim().length > 0;
+ const hasDescription = (state.description || '').trim().length > 0;
+ const hasSocials =
+ (state.selectedSocials?.length || 0) > 0 &&
+ state.selectedSocials.some((id) => (state.socialLinks?.[id] || '').trim().length > 0);
+ const hasCommitPulse = !!state.showCommitPulse;
+
+ if (!hasDescription) {
+ return { text: 'Improve description clarity', boost: '+20%' };
+ }
+ if (!hasCommitPulse) {
+ return { text: 'Add badges for credibility', boost: '+10%' };
+ }
+ if (!hasSocials) {
+ return { text: 'Include social links', boost: '+20%' };
+ }
+ if (!hasName) {
+ return { text: 'Add badges for credibility', boost: '+15%' };
+ }
+
+ // Default fallback
+ return { text: 'Add installation steps', boost: '+15%' };
+ }, [
+ state.name,
+ state.description,
+ state.selectedSocials,
+ state.socialLinks,
+ state.showCommitPulse,
+ ]);
+
+ return (
+
+ {/* Header */}
+
+
+
+ README Insight
+
+
+
+ {/* Tip & Badge Content */}
+
+
+ 💡 {activeTip.text}
+
+
+
+ Health Boost {activeTip.boost}
+
+
+
+
+ );
+}