feat(school-detail): reorder sections by parent demand (analytics-led)

Reorders the detail-page sections so the most-sought content leads, based on
30-day section_nav_used analytics (nav clicks over-count buried sections, so a
low, high-demand section is a strong "surface me" signal):

Primary:  Ofsted → SATs Results → Admissions → Pupils & Inclusion → History →
          Phonics → What Parents Say → School Life → Location → Local Area → Finances
Secondary: Ofsted → GCSEs → Admissions → History → Parents → Wellbeing →
          Location → Finances

Key moves: Admissions (23%, most-clicked) lifted from #6→#3; Pupils & Inclusion
(18%) from #7→#4; History (13%) off the bottom. Ofsted stays first (its low click
rate is positional — everyone reaches it first). Low-demand context sections
(Local Area, Finances) stay last. Brings the primary page in line with secondary.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Lh7Js5xSetKNzLVr9ArXLF

nextjs-app/components/SecondarySchoolDetailView.tsx

@@ -134,16 +134,19 @@ export function SecondarySchoolDetailView({
   // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [schoolInfo.urn]);
 
-  // Build nav items dynamically based on available data
+  // Build nav items dynamically based on available data.
+  // Engagement-led order (matches the primary page): recognised Ofsted badge,
+  // then the most-sought sections — results, admissions, history — with the
+  // experience and context sections following.
   const navItems: { id: string; label: string }[] = [];
   if (ofsted) navItems.push({ id: 'ofsted', label: 'Ofsted' });
-  if (hasParents) navItems.push({ id: 'parents', label: 'Parents' });
   if (hasResults) navItems.push({ id: 'gcse', label: 'GCSEs' });
   if (admissions) navItems.push({ id: 'admissions', label: 'Admissions' });
+  if (yearlyData.length > 1) navItems.push({ id: 'history', label: 'History' });
+  if (hasParents) navItems.push({ id: 'parents', label: 'Parents' });
   if (hasWellbeing) navItems.push({ id: 'wellbeing', label: 'Wellbeing' });
   if (hasLocation) navItems.push({ id: 'location', label: 'Location' });
   if (hasFinance) navItems.push({ id: 'finances', label: 'Finances' });
-  if (yearlyData.length > 1) navItems.push({ id: 'history', label: 'History' });
 
   // Track active section as user scrolls
   useEffect(() => {
@@ -469,42 +472,6 @@ export function SecondarySchoolDetailView({
         </section>
       )}
 
-      {/* ── Parent View ────────────────────────────────── */}
-      {hasParents && parentView && (
-        <section id="parents" className={styles.card}>
-          <h2 className={styles.sectionTitle}>
-            What Parents Say
-            <span className={styles.responseBadge}>
-              {parentView.total_responses!.toLocaleString()} responses
-            </span>
-          </h2>
-          <p className={styles.sectionSubtitle}>
-            From the Ofsted Parent View survey — parents share their experience of this school.
-          </p>
-          <div className={styles.parentViewGrid}>
-            {[
-              { label: 'Would recommend this school', pct: parentView.q_recommend_pct },
-              { label: 'My child is happy here', pct: parentView.q_happy_pct },
-              { label: 'My child feels safe here', pct: parentView.q_safe_pct },
-              { label: 'Teaching is good', pct: parentView.q_teaching_pct },
-              { label: 'My child makes good progress', pct: parentView.q_progress_pct },
-              { label: 'School looks after pupils\' wellbeing', pct: parentView.q_wellbeing_pct },
-              { label: 'Behaviour is well managed', pct: parentView.q_behaviour_pct },
-              { label: 'School deals well with bullying', pct: parentView.q_bullying_pct },
-              { label: 'Communicates well with parents', pct: parentView.q_communication_pct },
-            ].filter(q => q.pct != null).map(({ label, pct }) => (
-              <div key={label} className={styles.parentViewRow}>
-                <span className={styles.parentViewLabel}>{label}</span>
-                <div className={styles.parentViewBar}>
-                  <div className={styles.parentViewFill} style={{ width: `${pct}%` }} />
-                </div>
-                <span className={styles.parentViewPct}>{Math.round(pct!)}%</span>
-              </div>
-            ))}
-          </div>
-        </section>
-      )}
-
       {/* ── GCSE Results ───────────────────────────────── */}
       {hasResults && latestResults && (
         <section id="gcse" className={styles.card}>
@@ -790,6 +757,89 @@ export function SecondarySchoolDetailView({
         </section>
       )}
 
+      {/* ── History table ──────────────────────────────── */}
+      {yearlyData.length > 1 && (
+        <section id="history" className={styles.card}>
+          <h2 className={styles.sectionTitle}>Historical Results</h2>
+          {yearlyData.length > 0 && (
+            <>
+              <h3 className={styles.subSectionTitle} style={{ marginTop: '1.25rem' }}>Results Over Time</h3>
+              <div className={styles.chartContainer}>
+                <PerformanceChart
+                  data={yearlyData}
+                  schoolName={schoolInfo.school_name}
+                  isSecondary={true}
+                  nationalAtt8Avg={heroAtt8Nat}
+                  nationalByYear={nationalAvg?.by_year}
+                />
+              </div>
+            </>
+          )}
+          <details className={styles.historyDisclosure}>
+            <summary className={styles.historyToggle}>View raw year-by-year data</summary>
+            <div className={styles.tableWrapper}>
+              <table className={styles.dataTable}>
+                <thead>
+                  <tr>
+                    <th>Year</th>
+                    <th>Attainment 8</th>
+                    <th>Progress 8</th>
+                    <th>Eng &amp; Maths 4+</th>
+                    <th>EBacc entry %</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {yearlyData.map((result) => (
+                    <tr key={result.year}>
+                      <td className={styles.yearCell}>{formatAcademicYear(result.year)}</td>
+                      <td>{result.attainment_8_score != null ? result.attainment_8_score.toFixed(1) : '-'}</td>
+                      <td>{result.progress_8_score != null ? formatProgress(result.progress_8_score) : '-'}</td>
+                      <td>{result.english_maths_standard_pass_pct != null ? formatPercentage(result.english_maths_standard_pass_pct) : '-'}</td>
+                      <td>{result.ebacc_entry_pct != null ? formatPercentage(result.ebacc_entry_pct) : '-'}</td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          </details>
+        </section>
+      )}
+      {/* ── Parent View ────────────────────────────────── */}
+      {hasParents && parentView && (
+        <section id="parents" className={styles.card}>
+          <h2 className={styles.sectionTitle}>
+            What Parents Say
+            <span className={styles.responseBadge}>
+              {parentView.total_responses!.toLocaleString()} responses
+            </span>
+          </h2>
+          <p className={styles.sectionSubtitle}>
+            From the Ofsted Parent View survey — parents share their experience of this school.
+          </p>
+          <div className={styles.parentViewGrid}>
+            {[
+              { label: 'Would recommend this school', pct: parentView.q_recommend_pct },
+              { label: 'My child is happy here', pct: parentView.q_happy_pct },
+              { label: 'My child feels safe here', pct: parentView.q_safe_pct },
+              { label: 'Teaching is good', pct: parentView.q_teaching_pct },
+              { label: 'My child makes good progress', pct: parentView.q_progress_pct },
+              { label: 'School looks after pupils\' wellbeing', pct: parentView.q_wellbeing_pct },
+              { label: 'Behaviour is well managed', pct: parentView.q_behaviour_pct },
+              { label: 'School deals well with bullying', pct: parentView.q_bullying_pct },
+              { label: 'Communicates well with parents', pct: parentView.q_communication_pct },
+            ].filter(q => q.pct != null).map(({ label, pct }) => (
+              <div key={label} className={styles.parentViewRow}>
+                <span className={styles.parentViewLabel}>{label}</span>
+                <div className={styles.parentViewBar}>
+                  <div className={styles.parentViewFill} style={{ width: `${pct}%` }} />
+                </div>
+                <span className={styles.parentViewPct}>{Math.round(pct!)}%</span>
+              </div>
+            ))}
+          </div>
+        </section>
+      )}
+
       {/* ── Wellbeing ──────────────────────────────────── */}
       {hasWellbeing && (
         <section id="wellbeing" className={styles.card}>
@@ -936,53 +986,6 @@ export function SecondarySchoolDetailView({
         </section>
       )}
 
-      {/* ── History table ──────────────────────────────── */}
-      {yearlyData.length > 1 && (
-        <section id="history" className={styles.card}>
-          <h2 className={styles.sectionTitle}>Historical Results</h2>
-          {yearlyData.length > 0 && (
-            <>
-              <h3 className={styles.subSectionTitle} style={{ marginTop: '1.25rem' }}>Results Over Time</h3>
-              <div className={styles.chartContainer}>
-                <PerformanceChart
-                  data={yearlyData}
-                  schoolName={schoolInfo.school_name}
-                  isSecondary={true}
-                  nationalAtt8Avg={heroAtt8Nat}
-                  nationalByYear={nationalAvg?.by_year}
-                />
-              </div>
-            </>
-          )}
-          <details className={styles.historyDisclosure}>
-            <summary className={styles.historyToggle}>View raw year-by-year data</summary>
-            <div className={styles.tableWrapper}>
-              <table className={styles.dataTable}>
-                <thead>
-                  <tr>
-                    <th>Year</th>
-                    <th>Attainment 8</th>
-                    <th>Progress 8</th>
-                    <th>Eng &amp; Maths 4+</th>
-                    <th>EBacc entry %</th>
-                  </tr>
-                </thead>
-                <tbody>
-                  {yearlyData.map((result) => (
-                    <tr key={result.year}>
-                      <td className={styles.yearCell}>{formatAcademicYear(result.year)}</td>
-                      <td>{result.attainment_8_score != null ? result.attainment_8_score.toFixed(1) : '-'}</td>
-                      <td>{result.progress_8_score != null ? formatProgress(result.progress_8_score) : '-'}</td>
-                      <td>{result.english_maths_standard_pass_pct != null ? formatPercentage(result.english_maths_standard_pass_pct) : '-'}</td>
-                      <td>{result.ebacc_entry_pct != null ? formatPercentage(result.ebacc_entry_pct) : '-'}</td>
-                    </tr>
-                  ))}
-                </tbody>
-              </table>
-            </div>
-          </details>
-        </section>
-      )}
     </div>
   );
 }