Make onboarding tour install-wide instead of per-browser

Persist onboardingCompleted flag server-side via /api/v1/config so the
tour only auto-starts once per DashCaddy installation, not on every
new browser that connects.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-11 21:58:10 -07:00
parent 2d1944fd55
commit 063bf948b1
5 changed files with 56 additions and 8 deletions

View File

@@ -58,7 +58,12 @@
if (d.success) window._updateAuthCard(d.config.enabled && d.config.isSetUp, d.config.sessionDuration);
} catch (e) { /* ignore */ }
}
// Lazy-load onboarding for first-time users, otherwise just add the tour button
if (window.__dashcaddySiteConfigLoaded) {
try {
await window.__dashcaddySiteConfigLoaded;
} catch (_) { /* ignore */ }
}
// Lazy-load onboarding only once per install, otherwise just add the tour button
addTourButton();
if (shouldLoadOnboarding()) {
loadOnboarding();
@@ -89,6 +94,9 @@
// Check if onboarding should auto-start (first-time user)
function shouldLoadOnboarding() {
if (typeof SITE !== 'undefined' && SITE.onboardingCompleted) {
return false;
}
try {
const data = JSON.parse(localStorage.getItem('dashcaddy_onboarding'));
return !data || (!data.tourCompleted && data.currentStep === 0);
@@ -140,11 +148,10 @@
function addTourButton() {
if (document.getElementById('restart-tour-btn')) return;
// Check if tour has been completed before
let tourDone = false;
let tourDone = typeof SITE !== 'undefined' && SITE.onboardingCompleted;
try {
const data = JSON.parse(localStorage.getItem('dashcaddy_onboarding'));
tourDone = data && data.tourCompleted;
tourDone = tourDone || !!(data && data.tourCompleted);
} catch (_) {}
// Before first completion: show in primary toolbar. After: tuck into Admin section.

View File

@@ -35,9 +35,10 @@ const SITE = {
configurationType: (_cachedCfg && _cachedCfg.configurationType) || 'homelab',
domain: (_cachedCfg && _cachedCfg.domain) || '',
defaults: (_cachedCfg && _cachedCfg.defaults) || {},
routingMode: (_cachedCfg && _cachedCfg.routingMode) || 'subdomain'
routingMode: (_cachedCfg && _cachedCfg.routingMode) || 'subdomain',
onboardingCompleted: false
};
(async function loadSiteConfig() {
window.__dashcaddySiteConfigLoaded = (async function loadSiteConfig() {
try {
const r = await fetch('/api/v1/config');
if (r.ok) {
@@ -56,6 +57,7 @@ const SITE = {
if (c.domain) SITE.domain = c.domain;
if (c.defaults) SITE.defaults = c.defaults;
if (c.routingMode) SITE.routingMode = c.routingMode;
SITE.onboardingCompleted = c.onboardingCompleted === true;
// Cache only non-sensitive display config (TLD, domain, routing mode)
// DNS IPs and server topology are NOT cached — fetched from API each load
localStorage.setItem('dashcaddy_site_config', JSON.stringify({

View File

@@ -22,6 +22,12 @@
try {
console.log('[Onboarding] Initializing system...');
if (window.__dashcaddySiteConfigLoaded) {
try {
await window.__dashcaddySiteConfigLoaded;
} catch (_) { /* ignore */ }
}
// Initialize Error Handler first
errorHandler = new ErrorHandler();
console.log('[Onboarding] Error Handler initialized');
@@ -44,7 +50,8 @@
// Check if tour should auto-start
if (tourManager.shouldAutoStart()) {
console.log('[Onboarding] Auto-starting tour for first-time user');
console.log('[Onboarding] Auto-starting tour for first-time install');
await progressTracker.markInstallOnboardingCompleted();
// Wait a bit for page to fully load
setTimeout(() => {
tourManager.startTour();

View File

@@ -29,6 +29,7 @@
constructor(storageKey = 'dashcaddy_onboarding') {
this.storageKey = storageKey;
this.storageVersion = '1.0';
this.installOnboardingCompleted = typeof SITE !== 'undefined' && SITE.onboardingCompleted === true;
// Initialize storage if it doesn't exist
this._initializeStorage();
@@ -159,6 +160,36 @@
return state.tourCompleted === true;
}
/**
* Check if onboarding has already been consumed for this install.
* @returns {boolean} True if auto-onboarding should stay suppressed
*/
isInstallOnboardingCompleted() {
return this.installOnboardingCompleted === true;
}
/**
* Persist install-wide onboarding completion so it only auto-starts once.
* Manual Help Tour restarts are still allowed via local state reset.
* @returns {Promise<void>}
*/
async markInstallOnboardingCompleted() {
if (this.installOnboardingCompleted) return;
this.installOnboardingCompleted = true;
if (typeof SITE !== 'undefined') SITE.onboardingCompleted = true;
try {
await secureFetch('/api/v1/config', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ onboardingCompleted: true })
});
} catch (error) {
console.error('[ProgressTracker] Failed to persist install onboarding state:', error);
}
}
/**
* Mark the entire tour as completed
*/

View File

@@ -70,7 +70,8 @@
* Check if tour should auto-start
*/
shouldAutoStart() {
return !this.progressTracker.isTourCompleted() &&
return !this.progressTracker.isInstallOnboardingCompleted() &&
!this.progressTracker.isTourCompleted() &&
this.progressTracker.getCurrentStep() === 0;
}