first commit of v.02 application

2026-05-07 23:20:30 -04:00
commit a6b0a95dfc
98 changed files with 21028 additions and 0 deletions
--- a/client/src/components/DocumentModal.jsx
+++ b/client/src/components/DocumentModal.jsx
@@ -0,0 +1,112 @@
+import Modal from './Modal.jsx';
+
+function StudyGuideContent({ doc }) {
+  return (
+    <div className="doc-content">
+      <h2 className="doc-title">{doc.title}</h2>
+      {doc.sections?.map((section, i) => (
+        <section key={i} className="doc-section">
+          <h3 className="doc-section-heading">{section.heading}</h3>
+          {section.bullets?.length > 0 && (
+            <ul className="doc-bullets">
+              {section.bullets.map((b, j) => <li key={j}>{b}</li>)}
+            </ul>
+          )}
+          {section.keyTerms?.length > 0 && (
+            <div className="doc-key-terms">
+              <h4 className="doc-subsection-label">Key Terms</h4>
+              <dl>
+                {section.keyTerms.map((kt, j) => (
+                  <div key={j} className="doc-term-pair">
+                    <dt>{kt.term}</dt>
+                    <dd>{kt.definition}</dd>
+                  </div>
+                ))}
+              </dl>
+            </div>
+          )}
+          {section.reviewQuestions?.length > 0 && (
+            <div className="doc-review">
+              <h4 className="doc-subsection-label">Self-Review</h4>
+              <ol>
+                {section.reviewQuestions.map((q, j) => <li key={j}>{q}</li>)}
+              </ol>
+            </div>
+          )}
+        </section>
+      ))}
+      {doc.mnemonics?.length > 0 && (
+        <section className="doc-section">
+          <h3 className="doc-section-heading">Memory Aids</h3>
+          <ul className="doc-bullets">
+            {doc.mnemonics.map((m, i) => <li key={i}>{m}</li>)}
+          </ul>
+        </section>
+      )}
+    </div>
+  );
+}
+
+function FaqContent({ doc }) {
+  return (
+    <div className="doc-content">
+      <h2 className="doc-title">FAQ: {doc.subject}</h2>
+      {doc.faqPairs?.map((pair, i) => (
+        <div key={i} className="doc-faq-pair">
+          <h4 className="doc-faq-question">Q: {pair.question}</h4>
+          <p className="doc-faq-answer">{pair.answer}</p>
+        </div>
+      ))}
+    </div>
+  );
+}
+
+function ExecBriefContent({ doc }) {
+  return (
+    <div className="doc-content">
+      <h2 className="doc-title">{doc.title}</h2>
+      {doc.sections?.map((section, i) => (
+        <section key={i} className="doc-section">
+          <h3 className="doc-section-heading">{section.subhead}</h3>
+          <p className="doc-prose">{section.prose}</p>
+        </section>
+      ))}
+    </div>
+  );
+}
+
+const LABELS = {
+  'study-guide': 'Study Guide',
+  'faq': 'F.A.Q.',
+  'executive-brief': 'Executive Brief',
+};
+
+const RENDERERS = {
+  'study-guide': StudyGuideContent,
+  'faq': FaqContent,
+  'executive-brief': ExecBriefContent,
+};
+
+function DocumentModal({ open, onClose, type, document: doc, loading }) {
+  const Renderer = type ? RENDERERS[type] : null;
+  const label = type ? LABELS[type] : '';
+
+  return (
+    <Modal open={open} onClose={onClose} title={label} width="720px">
+      {loading ? (
+        <p className="citation-detail-loading">Generating {label}<span className="loading-dots" /></p>
+      ) : (
+        <>
+          {Renderer && doc && <Renderer doc={doc} />}
+          <div className="modal-actions">
+            <button className="modal-btn modal-btn-cancel" onClick={onClose}>
+              Close
+            </button>
+          </div>
+        </>
+      )}
+    </Modal>
+  );
+}
+
+export default DocumentModal;