feat: add XAMPP compatability mode

[dejely]

No description provided.

[llamapreview]

AI Code Review by LlamaPReview

🎯 TL;DR & Recommendation

Recommendation: Approve with suggestions
This PR adds XAMPP compatibility mode with new settings, setup modal, and server start flow. The changes are generally sound with a few suggestions for robustness and clarity.

📄 Documentation Diagram

This diagram documents the XAMPP compatibility setup and project start flow.

sequenceDiagram
    participant User
    participant App
    participant LocalStorage
    participant Service

    User->>App: Open app (first run)
    App->>App: Check setupComplete
    App->>User: Show setup modal
    User->>App: Configure settings (root, project name, phpMyAdmin URL, XAMPP toggle)
    User->>App: Click "Save Setup" or "Save and Open Project"
    App->>App: saveStackSettings(true)<br/>note over App: PR #35;1: XAMPP mode logic<br/>persists to LocalStorage
    App->>LocalStorage: Save settings
    alt openAfterSave is true
        App->>Service: start_project_server(projectRoot)
        Service-->>App: status with URL
        App->>User: Open URL via openUrl
    end
    note over App: Setup completion flagged in LocalStorage

Loading

🌟 Strengths

• Clean separation of settings and setup modal.
• Good use of localStorage for persistence.

Priority	File	Category	Impact Summary (≤12 words)	Anchors
P2	src/App.css	Maintainability	Command bar layout may wrap unexpectedly on narrow windows.	path:src/App.tsx
P2	src/App.tsx	Maintainability	Unused parameter in completeSetup misleads future logic.	method:saveStackSettings
P2	src/App.tsx	Architecture	Forces XAMPP mode on first run, may surprise users.	method:getInitialSetupComplete
P2	src/App.tsx	Documentation	phpMyAdmin button may open non-existent page without feedback.	method:openPhpMyAdmin
P2	src/App.tsx	Testing	Server start path lacks validation outside settings page.	method:completeSetup

---

💡 Have feedback? We'd love to hear it in our GitHub Discussions.
✨ This review was generated by LlamaPReview Advanced, which is free for all open-source projects. Learn more.

[llamapreview]

P2 | Confidence: High

The completeSetup function declares a parameter openAfterSave but ignores it when calling saveStackSettings. Both the “Save Setup” button (onClick={() => void completeSetup(false)}) and the “Save and Open Project” button (onClick={() => void completeSetup(true)}) pass different values of this parameter, yet saveStackSettings always receives true. While currently both buttons are intended to mark the setup as complete, the unused parameter is misleading and will cause bugs if future logic differentiates between the two actions (e.g., “Save only” should not mark setup as complete). The code should either remove the parameter or use it to control the markSetupComplete argument.

Code Suggestion:

async function completeSetup(openAfterSave = false) {
  const nextRoot = draftProjectRoot.trim();
  const nextProjectName = normalizeProjectName(draftProjectName);
  const nextXamppMode = draftXamppMode;
  const didSave = saveStackSettings(true);  // mark setup as complete always

  if (!didSave) return;
  ...
}

Evidence: method:saveStackSettings

[llamapreview]

P2 | Confidence: High

The new phpMyAdmin button unconditionally opens whatever URL is stored as phpMyAdminUrl. The default value is "http://localhost/phpmyadmin". If the user does not have phpMyAdmin installed or exposes it on a different path, clicking the button may open a non‑existent page or a 404 error. The UI does not communicate any expectation that the user must have phpMyAdmin running. While this is not a code bug, it is a missing documentation/UX cue. Consider adding a tooltip, an error message when the URL cannot be loaded, or an optional hint in the settings.

[llamapreview]

P2 | Confidence: Medium

The change from a fixed 5‑column grid to a flex layout with wrapping alters the visual structure of the command bar. The old grid enforced a specific column order (four max-content columns + a flexible path‑readout). With flex‑wrap, if the bar contains more items than fit on one line (especially after the new “phpMyAdmin” button), they will wrap rather than stay on the same row. This is a deliberate decision to accommodate the new button, but it may degrade the layout on narrow windows or when service-status icons change width. No CI results are available to verify behavior in the production theme. The external absence of a regression is assumed; thus the finding is speculative.

[llamapreview]

P2 | Confidence: Medium

The initial draft value of XAMPP mode defaults to true when setup is incomplete (first run). This forces users who do not want XAMPP compatibility to manually uncheck the box in the setup modal. While this aligns with the PR’s “XAMPP compatibility mode” feature, it introduces a subtle architectural assumption: every new user is assumed to want XAMPP mode. The design could be improved by respecting a previously stored preference even on first run, or by offering a neutral default (e.g., false) and letting explicit action enable the mode. The current behavior may lead to accidental activation for users who skip reading the checkbox.

Suggested change

	function getInitialDraftXamppMode() {
	return getInitialSetupComplete() ? getInitialXamppMode() : true;
	}
	function getInitialDraftXamppMode() {
	return getInitialSetupComplete() ? getInitialXamppMode() : false;
	}

Evidence: method:getInitialSetupComplete

[llamapreview]

P2 | Confidence: Medium

The new settings validation requires a project folder name when XAMPP mode is enabled, but the same validation is not applied in the openProjectSite function when it is called directly from the toolbar (outside the settings page). If a user activates XAMPP mode via the settings page but later clears the project folder name (via localStorage manipulation or a future code path), the “Open Project Site” button will attempt to start a server with an empty project name, leading to a potential error or unexpected behavior. The code relies on the settings page to enforce the safeguard, but the runtime path does not re‑validate. Adding a guard in openProjectSite when xamppMode is true would make the system more robust.

Code Suggestion:

if (xamppMode && !normalizeProjectName(projectName)) {
  setOpenError("Enter a project folder name for XAMPP mode.");
  setPage("settings");
  return;
}

Evidence: method:completeSetup