setAppStatus() — astro Function Reference

Architecture documentation for the setAppStatus() function in toolbar.ts from the astro codebase.

Function typescript DevToolbar AuditRules calls 2 called by 2

Entity Profile

DevToolbar→ AuditRules→ setAppStatus() — astro Function Reference

Dependency Diagram

graph TD
  2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0["setAppStatus()"]
  716d930c_83f4_2fe3_b978_ab934b111ba5["AstroDevToolbar"]
  2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0 -->|defined in| 716d930c_83f4_2fe3_b978_ab934b111ba5
  9cad4f31_267c_3f02_6542_010bf1ca5340["connectedCallback()"]
  9cad4f31_267c_3f02_6542_010bf1ca5340 -->|calls| 2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0
  89606477_486c_116f_77f7_0ee5cdc89c28["toggleAppStatus()"]
  89606477_486c_116f_77f7_0ee5cdc89c28 -->|calls| 2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0
  0410701e_ac81_1936_c2a5_3748172efb7a["getAppCanvasById()"]
  2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0 -->|calls| 0410701e_ac81_1936_c2a5_3748172efb7a
  8d43495e_d130_5d10_b187_6e32510ee75a["getAppButtonById()"]
  2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0 -->|calls| 8d43495e_d130_5d10_b187_6e32510ee75a
  style 2dc3eb9e_97bf_5b90_ed5f_fa9b21dd71c0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/runtime/client/dev-toolbar/toolbar.ts lines 466–511

	async setAppStatus(app: DevToolbarApp, newStatus: boolean) {
		const appCanvas = this.getAppCanvasById(app.id);
		if (!appCanvas) return false;

		if (app.active && !newStatus && app.beforeTogglingOff) {
			const shouldToggleOff = await app.beforeTogglingOff(appCanvas.shadowRoot!);

			// If the app returned false, don't toggle it off, maybe the app showed a confirmation dialog or similar
			if (!shouldToggleOff) return false;
		}

		app.active = newStatus ?? !app.active;
		const mainBarButton = this.getAppButtonById(app.id);
		const moreBarButton = this.getAppCanvasById('astro:more')?.shadowRoot?.querySelector(
			`[data-app-id="${app.id}"]`,
		);

		if (mainBarButton) {
			mainBarButton.classList.toggle('active', app.active);
		}

		if (moreBarButton) {
			moreBarButton.classList.toggle('active', app.active);
		}

		if (app.active) {
			appCanvas.style.display = 'block';
			appCanvas.setAttribute('data-active', '');
		} else {
			appCanvas.style.display = 'none';
			appCanvas.removeAttribute('data-active');
		}

		app.eventTarget.dispatchEvent(
			new CustomEvent('app-toggled', {
				detail: {
					state: app.active,
					app,
				},
			}),
		);

		import.meta.hot?.send(`${WS_EVENT_NAME}:${app.id}:toggled`, { state: app.active });

		return true;
	}