From 78bb30e42f313f1a0dd2f3e56567a68e80e4666d Mon Sep 17 00:00:00 2001
From: ifedan-ed <ifedan-ed@users.noreply.github.com>
Date: Wed, 1 Apr 2026 18:16:00 +0000
Subject: [PATCH] v2.2: Remove milestone admin UI, add CMS content refresh
 button

REMOVED:
- Milestone editing UI from Admin Panel (per user request)
- Milestones will be managed via hardcoded static data only
- Kept backend routes and database support for future use

ADDED:
- Refresh button in Learning Hub CMS content list
- Manual refresh for AI-generated content updates
- Better discoverability of content refresh functionality

FIXES:
- AI learning content now has visible refresh button
- Users can manually refresh content list after AI generation
- Cleaner admin panel without milestone management clutter

NOTE:
- Developmental milestones still work via static fallback
- Edit milestones by modifying public/js/milestonesData.js
- Backend API still supports milestone management if needed later
---
 public/components/admin.html | 66 ------------------------------------
 public/components/cms.html   |  9 +++--
 public/js/learningHub.js     |  1 +
 3 files changed, 7 insertions(+), 69 deletions(-)

diff --git a/public/components/admin.html b/public/components/admin.html
index 4d6e3e5..9edf3e8 100644
--- a/public/components/admin.html
+++ b/public/components/admin.html
@@ -263,72 +263,6 @@
           </div>
         </div>
 
-        <!-- ── CMS: Developmental Milestones ──────────────────────────── -->
-        <div class="card">
-          <div class="card-header">
-            <h3><i class="fas fa-baby"></i> Developmental Milestones</h3>
-            <button id="btn-refresh-milestones" class="btn-sm btn-ghost"><i class="fas fa-rotate"></i> Refresh</button>
-          </div>
-          <div style="padding:16px;display:flex;flex-direction:column;gap:16px;">
-            <!-- Bulk Import Notice -->
-            <div id="ms-empty-notice" style="display:none;background:var(--blue-bg);border-left:3px solid var(--blue);padding:12px;border-radius:6px;">
-              <p style="margin:0 0 8px;font-weight:600;color:var(--blue);"><i class="fas fa-info-circle"></i> No milestones in database</p>
-              <p style="margin:0 0 12px;font-size:13px;color:var(--g600);">Import the default developmental milestones data (birth to 11 years) to enable admin editing.</p>
-              <button id="btn-bulk-import-milestones" class="btn-sm btn-primary"><i class="fas fa-download"></i> Import Default Milestones Data</button>
-            </div>
-
-            <!-- Filters -->
-            <div style="display:flex;align-items:center;gap:12px;flex-wrap:wrap;">
-              <label style="font-size:13px;font-weight:600;">Age Group:</label>
-              <select id="ms-filter-age" style="font-size:13px;padding:4px 8px;border:1px solid var(--g300);border-radius:6px;min-width:200px;">
-                <option value="">All Age Groups</option>
-              </select>
-              <button id="btn-add-milestone" class="btn-sm btn-primary"><i class="fas fa-plus"></i> Add Milestone</button>
-              <button id="btn-reimport-milestones" class="btn-sm btn-ghost" title="Re-import all static data (clears existing)"><i class="fas fa-sync"></i> Re-import All</button>
-            </div>
-
-            <!-- Milestones List -->
-            <div id="milestones-list" style="display:flex;flex-direction:column;gap:8px;max-height:600px;overflow-y:auto;"></div>
-
-            <!-- Add/Edit Modal -->
-            <div id="milestone-modal" class="modal-overlay" style="display:none;">
-              <div class="modal-content" style="max-width:600px;">
-                <div class="modal-header">
-                  <h3 id="milestone-modal-title"><i class="fas fa-edit"></i> Edit Milestone</h3>
-                  <button class="modal-close" id="btn-close-milestone-modal">&times;</button>
-                </div>
-                <div class="modal-body">
-                  <input type="hidden" id="ms-edit-id">
-                  <div style="display:flex;flex-direction:column;gap:12px;">
-                    <div>
-                      <label style="font-size:12px;font-weight:600;color:var(--g600);display:block;margin-bottom:4px;">Age Group</label>
-                      <input type="text" id="ms-edit-age" list="ms-age-list" style="width:100%;font-size:13px;padding:7px;border:1px solid var(--g300);border-radius:6px;box-sizing:border-box;" placeholder="e.g., 2 months">
-                      <datalist id="ms-age-list"></datalist>
-                    </div>
-                    <div>
-                      <label style="font-size:12px;font-weight:600;color:var(--g600);display:block;margin-bottom:4px;">Domain</label>
-                      <input type="text" id="ms-edit-domain" list="ms-domain-list" style="width:100%;font-size:13px;padding:7px;border:1px solid var(--g300);border-radius:6px;box-sizing:border-box;" placeholder="e.g., Gross Motor">
-                      <datalist id="ms-domain-list"></datalist>
-                    </div>
-                    <div>
-                      <label style="font-size:12px;font-weight:600;color:var(--g600);display:block;margin-bottom:4px;">Milestone Description</label>
-                      <textarea id="ms-edit-text" rows="3" style="width:100%;font-size:13px;padding:8px;border:1px solid var(--g300);border-radius:6px;resize:vertical;box-sizing:border-box;" placeholder="e.g., Lifts head when prone (45 degrees)"></textarea>
-                    </div>
-                    <div>
-                      <label style="font-size:12px;font-weight:600;color:var(--g600);display:block;margin-bottom:4px;">Sort Order</label>
-                      <input type="number" id="ms-edit-sort" value="0" style="width:100%;font-size:13px;padding:7px;border:1px solid var(--g300);border-radius:6px;box-sizing:border-box;" placeholder="0">
-                    </div>
-                  </div>
-                </div>
-                <div class="modal-footer">
-                  <button id="btn-save-milestone" class="btn-sm btn-primary">Save</button>
-                  <button id="btn-cancel-milestone-modal" class="btn-sm btn-ghost">Cancel</button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-
         <!-- ── CMS: Reset to Defaults ─────────────────────────────────── -->
         <div class="card" style="border:1px solid var(--red-light);">
           <div class="card-header"><h3 style="color:var(--red);"><i class="fas fa-triangle-exclamation"></i> Reset Settings</h3></div>
diff --git a/public/components/cms.html b/public/components/cms.html
index 18c89a0..17f969d 100644
--- a/public/components/cms.html
+++ b/public/components/cms.html
@@ -51,9 +51,12 @@
                   <button type="button" id="btn-lh-new-pearl" class="btn-sm" style="background:var(--purple-light);color:var(--purple);border:1px solid var(--purple);border-radius:6px;padding:6px 12px;font-size:13px;cursor:pointer;"><i class="fas fa-gem"></i> New Pearl</button>
                   <button type="button" id="btn-lh-new-presentation" class="btn-sm" style="background:#ecfdf5;color:#065f46;border:1px solid #6ee7b7;border-radius:6px;padding:6px 12px;font-size:13px;cursor:pointer;"><i class="fas fa-presentation-screen"></i> New Presentation</button>
                 </div>
-                <div class="cms-search">
-                  <i class="fas fa-search"></i>
-                  <input type="text" id="cms-search" placeholder="Search content..." class="cms-input-sm">
+                <div style="display:flex;gap:8px;align-items:center;">
+                  <button type="button" id="btn-lh-refresh-content" class="btn-sm btn-ghost" title="Refresh content list"><i class="fas fa-rotate"></i></button>
+                  <div class="cms-search">
+                    <i class="fas fa-search"></i>
+                    <input type="text" id="cms-search" placeholder="Search content..." class="cms-input-sm">
+                  </div>
                 </div>
               </div>
 
diff --git a/public/js/learningHub.js b/public/js/learningHub.js
index 8ffd891..793ebb8 100644
--- a/public/js/learningHub.js
+++ b/public/js/learningHub.js
@@ -64,6 +64,7 @@
     }
 
     // ── CMS events ─────────────────────────────
+    if (e.target.closest('#btn-lh-refresh-content')) { loadCmsContent(); loadCmsStats(); return; }
     if (e.target.closest('#btn-lh-add-cat')) { addCategory(); return; }
     if (e.target.closest('#btn-lh-new-content')) { openEditor(null, 'article'); return; }
     if (e.target.closest('#btn-lh-new-quiz')) { openEditor(null, 'quiz'); return; }