site-builder: lock landing page to index.html regardless of name

The first page is now treated as the landing page: it always publishes to
index.html no matter what the user names it, and its slug is forced to
'index' in state so .htaccess clean-URL rewrites stay consistent.

- useWhpApi.ts: force pages[0].filename='index.html' at save time
- PageContext.tsx: heal pages[0].slug to 'index' on load and on rename
- PagesPanel.tsx: "LANDING" badge on first page, slug shown as '/',
  rename hides slug input (locked), delete button hidden

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

craft/src/hooks/useWhpApi.ts

@@ -51,8 +51,11 @@ export function useWhpApi() {
     // Build the pages array with HTML for each page
     // For the active page, use the freshly exported HTML from the canvas;
     // for others, export from their stored craft state
-    const pagesPayload = pages.map((page) => {
-      const filename = (page.slug === 'index' ? 'index' : page.slug) + '.html';
+    const pagesPayload = pages.map((page, i) => {
+      // The first page is ALWAYS the landing page → publishes to index.html
+      // regardless of the page name/slug. Apache serves '/' from index.html,
+      // and renaming the first page should not break the root URL.
+      const filename = i === 0 ? 'index.html' : page.slug + '.html';
       let pageHtml = '';
 
       if (page.id === activePageId) {
@@ -77,10 +80,13 @@ export function useWhpApi() {
     // Build pages_craft_state array: for each page, store its craft state
     // For the currently active page, always use the fresh canvas state (currentCraftState)
     // since page.craftState may be stale (not updated until page switch)
-    const pagesGrapesjs = pages.map((page) => ({
+    const pagesGrapesjs = pages.map((page, i) => ({
       id: page.id,
       name: page.name,
-      slug: page.slug,
+      // Pin the landing page's slug to 'index' on the wire too, so that on
+      // reload the editor's clean-URL routing (.htaccess rewrite of /name →
+      // name.html) lines up with the file we just wrote (index.html).
+      slug: i === 0 ? 'index' : page.slug,
       craftState: page.id === activePageId ? currentCraftState : (page.craftState || null),
     }));