Added enhanced linguistic analyzer and persona quality improver

2025-09-14 09:53:27 +05:30
parent c63148e1ce
commit 1460ce3cb6
35 changed files with 4446 additions and 118 deletions
--- a/frontend/src/components/BlogWriter/ContinuityBadge.tsx
+++ b/frontend/src/components/BlogWriter/ContinuityBadge.tsx
@@ -0,0 +1,80 @@
+import React, { useEffect, useState } from 'react';
+import { blogWriterApi } from '../../services/blogWriterApi';
+
+interface Props { sectionId: string; refreshToken?: number }
+
+export const ContinuityBadge: React.FC<Props> = ({ sectionId, refreshToken }) => {
+  const [metrics, setMetrics] = useState<Record<string, number> | null>(null);
+  const [hover, setHover] = useState(false);
+
+  useEffect(() => {
+    let mounted = true;
+    blogWriterApi.getContinuity(sectionId)
+      .then(res => { if (mounted) setMetrics(res.continuity_metrics || null); })
+      .catch(() => { /* ignore */ });
+    return () => { mounted = false; };
+  }, [sectionId, refreshToken]);
+
+  if (!metrics) return null;
+  const flow = Math.round(((metrics.flow || 0) * 100));
+  const color = flow >= 80 ? '#2e7d32' : flow >= 60 ? '#f9a825' : '#c62828';
+
+  const consistency = Math.round(((metrics.consistency || 0) * 100));
+  const progression = Math.round(((metrics.progression || 0) * 100));
+
+  return (
+    <span
+      onMouseEnter={() => setHover(true)}
+      onMouseLeave={() => setHover(false)}
+      style={{ position: 'relative', display: 'inline-block' }}
+    >
+      <span
+        title={`Flow ${flow}%`}
+        style={{
+          display: 'inline-block',
+          fontSize: 12,
+          color: color,
+          border: `1px solid ${color}`,
+          padding: '2px 6px',
+          borderRadius: 10,
+          background: 'transparent'
+        }}
+      >
+        Flow {flow}%
+      </span>
+
+      {hover && (
+        <div
+          style={{
+            position: 'absolute',
+            top: '150%',
+            left: 0,
+            zIndex: 10,
+            background: '#fff',
+            color: '#333',
+            border: '1px solid #e0e0e0',
+            borderRadius: 8,
+            padding: '8px 10px',
+            minWidth: 180,
+            boxShadow: '0 4px 12px rgba(0,0,0,0.08)'
+          }}
+        >
+          <div style={{ fontWeight: 600, fontSize: 12, marginBottom: 6 }}>Continuity</div>
+          <div style={{ fontSize: 12, display: 'flex', justifyContent: 'space-between' }}>
+            <span>Flow</span><span>{flow}%</span>
+          </div>
+          <div style={{ fontSize: 12, display: 'flex', justifyContent: 'space-between' }}>
+            <span>Consistency</span><span>{consistency}%</span>
+          </div>
+          <div style={{ fontSize: 12, display: 'flex', justifyContent: 'space-between' }}>
+            <span>Progression</span><span>{progression}%</span>
+          </div>
+        </div>
+      )}
+    </span>
+  );
+};
+
+export default ContinuityBadge;
+
+