roxxie-proxy-u-prod 0.1.0

package/source/packages/chrome/src/services/ProfileService.ts

@@ -0,0 +1,94 @@
+import { Service } from "./Service";
+import { HistoryState } from "../Tab/History";
+import { CookieJar } from "@mercuryworkshop/scramjet/bundled";
+import { StatefulClass } from "../util/StatefulClass";
+import type { SerializedHistoryState } from "../Tab/History";
+
+export type ProfileServiceState = {
+	globalhistory: SerializedHistoryState[];
+	bookmarks: SerializedBookmarkEntry[];
+	cookies: string;
+};
+
+export type SerializedBookmarkEntry = {
+	url: string;
+	title: string;
+	favicon: string | null;
+};
+
+export class BookmarkEntry extends StatefulClass {
+	url!: URL;
+	title!: string;
+	favicon!: string | null;
+
+	constructor(partial?: Partial<BookmarkEntry>) {
+		super();
+		Object.assign(this, partial);
+	}
+
+	serialize(): SerializedBookmarkEntry {
+		return {
+			url: this.url.href,
+			title: this.title,
+			favicon: this.favicon,
+		};
+	}
+	static deserialize(data: SerializedBookmarkEntry): BookmarkEntry {
+		return new BookmarkEntry({
+			url: new URL(data.url),
+			title: data.title,
+			favicon: data.favicon,
+		});
+	}
+}
+
+export class ProfileService extends Service {
+	globalhistory: HistoryState[];
+	bookmarks: BookmarkEntry[];
+	cookieJar: CookieJar;
+
+	constructor(data: ProfileServiceState | null) {
+		super();
+		this.cookieJar = new CookieJar();
+		if (data) {
+			this.cookieJar.load(data.cookies);
+			this.globalhistory = data.globalhistory.map((state) =>
+				HistoryState.deserialize(state)
+			);
+			this.bookmarks = data.bookmarks.map((bookmark) =>
+				BookmarkEntry.deserialize(bookmark)
+			);
+		} else {
+			this.globalhistory = [];
+			this.bookmarks = [
+				new BookmarkEntry({
+					url: new URL("https://www.google.com"),
+					title: "Google",
+					favicon: "https://www.google.com/favicon.ico",
+				}),
+				new BookmarkEntry({
+					url: new URL("https://www.youtube.com"),
+					title: "YouTube",
+					favicon: "https://www.youtube.com/favicon.ico",
+				}),
+				new BookmarkEntry({
+					url: new URL("https://developer.puter.com"),
+					title: "Puter Developers",
+					favicon: "https://developer.puter.com/favicons/favicon-16x16.png",
+				}),
+			];
+		}
+	}
+
+	serialize(): ProfileServiceState {
+		return {
+			globalhistory: this.globalhistory.map((state) => state.serialize()),
+			bookmarks: this.bookmarks.map((bookmark) => bookmark.serialize()),
+			cookies: this.cookieJar.dump(),
+		};
+	}
+
+	save(): ProfileServiceState {
+		return this.serialize();
+	}
+}

package/source/packages/chrome/src/services/Service.ts

@@ -0,0 +1,10 @@
+import { StatefulClass } from "../util/StatefulClass";
+
+export class Service extends StatefulClass {
+	public dirty = false;
+
+	override markDirty() {
+		super.markDirty();
+		this.dirty = true;
+	}
+}

package/source/packages/chrome/src/services/SettingsService.ts

@@ -0,0 +1,108 @@
+import { createState, stateListen } from "dreamland/core";
+import type { Stateful } from "dreamland/core";
+import {
+	type AppearancePreference,
+	type ThemeId,
+	DEFAULT_THEME_ID,
+} from "../themes";
+import type { AVAILABLE_SEARCH_ENGINES } from "@components/Omnibar/suggestions";
+import { Service } from "./Service";
+
+export type Settings = {
+	appearance: AppearancePreference;
+	tabLayout: "horizontal" | "bottom" | "hybrid" | "vertical" | "compact";
+	verticalTabJustify: "left" | "right";
+	sidebarWidth: number | null;
+	uiProfile: "default" | "compact" | "touch";
+	themeId: ThemeId;
+	startupPage: "new-tab" | "continue";
+	defaultZoom: number;
+	showBookmarksBar: boolean;
+	defaultSearchEngine: keyof typeof AVAILABLE_SEARCH_ENGINES;
+	searchSuggestionsEnabled: boolean;
+	blockTrackers: boolean;
+	clearHistoryOnExit: boolean;
+	doNotTrack: boolean;
+	extensionsDevMode: boolean;
+};
+
+export type TabLayoutMode = Settings["tabLayout"];
+
+const DEFAULT_SETTINGS: Settings = {
+	appearance: "system",
+	tabLayout: "horizontal",
+	verticalTabJustify: "left",
+	sidebarWidth: null,
+	uiProfile: "default",
+	themeId: DEFAULT_THEME_ID,
+	startupPage: "continue",
+	defaultZoom: 100,
+	showBookmarksBar: false,
+	defaultSearchEngine: "duckduckgo",
+	searchSuggestionsEnabled: true,
+	blockTrackers: true,
+	clearHistoryOnExit: false,
+	doNotTrack: true,
+	extensionsDevMode: false,
+};
+
+export type SettingsServiceState = {
+	settings: {
+		appearance: AppearancePreference;
+		tabLayout: "horizontal" | "bottom" | "hybrid" | "vertical" | "compact";
+		verticalTabJustify: "left" | "right";
+		sidebarWidth: number | null;
+		themeId: ThemeId;
+		uiProfile: "default" | "compact" | "touch";
+		startupPage: "new-tab" | "continue";
+		defaultZoom: number;
+		showBookmarksBar: boolean;
+		defaultSearchEngine: keyof typeof AVAILABLE_SEARCH_ENGINES;
+		searchSuggestionsEnabled: boolean;
+		blockTrackers: boolean;
+		clearHistoryOnExit: boolean;
+		doNotTrack: boolean;
+		extensionsDevMode: boolean;
+	};
+};
+
+export class SettingsService extends Service {
+	public settings: Stateful<Settings>;
+
+	constructor(data: SettingsServiceState | null) {
+		super();
+		if (data) {
+			this.settings = createState(data.settings);
+		} else {
+			this.settings = createState(DEFAULT_SETTINGS);
+		}
+		let oldvalues: Map<any, any> = new Map();
+		stateListen(this.settings, (newvalue, prop) => {
+			if (oldvalues.get(prop) === newvalue) return;
+			this.markDirty();
+			oldvalues.set(prop, newvalue);
+		});
+	}
+
+	save(): SettingsServiceState {
+		return {
+			settings: {
+				appearance: this.settings.appearance,
+				tabLayout: this.settings.tabLayout,
+				verticalTabJustify: this.settings.verticalTabJustify,
+				sidebarWidth: this.settings.sidebarWidth,
+				themeId: this.settings.themeId,
+				uiProfile: this.settings.uiProfile,
+				startupPage: this.settings.startupPage,
+				defaultZoom: this.settings.defaultZoom,
+				showBookmarksBar: this.settings.showBookmarksBar,
+				defaultSearchEngine: this.settings.defaultSearchEngine,
+				searchSuggestionsEnabled: this.settings.searchSuggestionsEnabled,
+				blockTrackers: this.settings.blockTrackers,
+				clearHistoryOnExit: this.settings.clearHistoryOnExit,
+				doNotTrack: this.settings.doNotTrack,
+				extensionsDevMode: this.settings.extensionsDevMode,
+			},
+		};
+	}
+}

package/source/packages/chrome/src/services/TabsService.ts

@@ -0,0 +1,161 @@
+import { createDelegate } from "dreamland/core";
+import { Tab, type SerializedTab } from "../Tab/Tab.tsx";
+import { Service } from "./Service.ts";
+import { INTERNAL_URL_PROTOCOL } from "../consts.ts";
+// TODO: centralize this to one place somehow
+import * as tldts from "tldts";
+import { isPuter, settingsService } from "../index.ts";
+import { focusOmnibox } from "@components/Omnibar/Omnibox.tsx";
+import { AVAILABLE_SEARCH_ENGINES } from "@components/Omnibar/suggestions.ts";
+import { mountedPromise } from "../App.tsx";
+
+export const pushTab = createDelegate<Tab>();
+export const popTab = createDelegate<Tab>();
+
+export type TabServiceState = {
+	tabs: SerializedTab[];
+	activetab: string;
+};
+
+export class TabsService extends Service {
+	tabs: Tab[] = [];
+	activetab: Tab;
+
+	constructor(data: TabServiceState | null) {
+		super();
+		if (data) {
+			for (const dt of data.tabs) {
+				let tab = Tab.deserialize(dt);
+				this.own(tab);
+				this.tabs.push(tab);
+				mountedPromise.then(() => {
+					pushTab(tab);
+				});
+			}
+			this.activetab =
+				this.tabs.find((tab) => tab.id === data.activetab) || this.tabs[0];
+		} else {
+			let tab = new Tab({});
+			this.own(tab);
+			this.tabs.push(tab);
+			this.activetab = tab;
+			mountedPromise.then(() => {
+				pushTab(tab);
+			});
+		}
+	}
+
+	save(): TabServiceState {
+		return {
+			tabs: this.tabs.map((tab) => tab.serialize()),
+			activetab: this.activetab.id,
+		};
+	}
+	static deserialize(data: TabServiceState): TabsService {
+		return new TabsService(data);
+	}
+
+	newTab(url?: URL, focusomnibox: boolean = false) {
+		let tab = new Tab({ url });
+		this.own(tab);
+		pushTab(tab);
+		this.tabs = [...this.tabs, tab];
+		this.activetab = tab;
+		if (focusomnibox) focusOmnibox();
+		this.markDirty();
+		return tab;
+	}
+
+	newTabRight(ref: Tab, url?: URL) {
+		let tab = new Tab({ url });
+		this.own(tab);
+		pushTab(tab);
+		let index = this.tabs.indexOf(ref);
+		this.tabs.splice(index + 1, 0, tab);
+		this.tabs = this.tabs;
+		this.activetab = tab;
+		this.markDirty();
+		return tab;
+	}
+
+	closeTabsToRight(ref: Tab) {
+		let index = this.tabs.indexOf(ref);
+		let toClose = this.tabs.slice(index + 1);
+		toClose.forEach((tab) => {
+			this.destroyTab(tab);
+		});
+	}
+
+	closeOtherTabs(ref: Tab) {
+		let toClose = this.tabs.filter((tab) => tab !== ref);
+		toClose.forEach((tab) => {
+			this.destroyTab(tab);
+		});
+	}
+
+	destroyTab(tab: Tab) {
+		this.disown(tab);
+		this.tabs = this.tabs.filter((t) => t !== tab);
+		if (this.tabs.length === 0 && isPuter) {
+			puter.exit();
+		}
+
+		if (this.activetab === tab) {
+			this.activetab =
+				this.tabs[0] ||
+				this.newTab(new URL(`${INTERNAL_URL_PROTOCOL}//newtab`), true);
+		}
+		popTab(tab);
+		this.markDirty();
+	}
+
+	pinTab(tab: Tab) {
+		let index = this.tabs.indexOf(tab);
+		tab.pinned = true;
+		this.tabs.splice(index, 1);
+		// @ts-ignore
+		const lastPinnedIdx = this.tabs.findLastIndex((t: Tab) => t.pinned);
+		const newidx = lastPinnedIdx === -1 ? 0 : lastPinnedIdx + 1;
+		this.tabs.splice(newidx, 0, tab);
+		this.tabs = this.tabs;
+		this.markDirty();
+	}
+
+	unpinTab(tab: Tab) {
+		let index = this.tabs.indexOf(tab);
+		tab.pinned = false;
+		this.tabs.splice(index, 1);
+		// @ts-ignore
+		const lastPinnedIdx = this.tabs.findLastIndex((t: Tab) => t.pinned);
+		const newidx = lastPinnedIdx === -1 ? 0 : lastPinnedIdx + 1;
+		this.tabs.splice(newidx, 0, tab);
+		this.tabs = this.tabs;
+		this.markDirty();
+	}
+
+	searchNavigate(url: string) {
+		function validTld(hostname: string) {
+			const res = tldts.parse(url);
+			if (!res.domain) return false;
+			if (res.isIp || res.isIcann) return true;
+			return false;
+		}
+
+		// TODO: dejank
+		if (URL.canParse(url)) {
+			this.activetab.pushNavigate(new URL(url));
+		} else if (
+			URL.canParse("https://" + url) &&
+			validTld(new URL("https://" + url).hostname)
+		) {
+			let fullurl = new URL("https://" + url);
+			this.activetab.pushNavigate(fullurl);
+		} else {
+			const search =
+				AVAILABLE_SEARCH_ENGINES[
+					settingsService.settings.defaultSearchEngine
+				].searchUrlBuilder(url);
+			this.activetab.pushNavigate(new URL(search));
+		}
+	}
+}

package/source/packages/chrome/src/startup.test.ts

@@ -0,0 +1,129 @@
+/* SPDX-License-Identifier: AGPL-3.0-only */
+
+import { describe, expect, it, vi } from "vitest";
+
+import {
+	BrowserStartupController,
+	createRetryableTask,
+	startupErrorDetails,
+	startupErrorSummary,
+	type BrowserStartupState,
+} from "./startup";
+
+describe("createRetryableTask", () => {
+	it("shares pending work, retries failures, and caches success", async () => {
+		const task = vi
+			.fn<() => Promise<void>>()
+			.mockRejectedValueOnce(new Error("storage temporarily unavailable"))
+			.mockResolvedValueOnce(undefined);
+		const prepare = createRetryableTask(task);
+
+		const failed = prepare();
+		expect(prepare()).toBe(failed);
+		await expect(failed).rejects.toThrow("storage temporarily unavailable");
+
+		const successful = prepare();
+		await expect(successful).resolves.toBeUndefined();
+		expect(prepare()).toBe(successful);
+		expect(task).toHaveBeenCalledTimes(2);
+	});
+});
+
+function deferred(): {
+	promise: Promise<void>;
+	resolve: () => void;
+} {
+	let resolve!: () => void;
+	const promise = new Promise<void>((done) => {
+		resolve = done;
+	});
+	return { promise, resolve };
+}
+
+describe("BrowserStartupController", () => {
+	it("does not launch the browser until the verified connection resolves", async () => {
+		const connection = deferred();
+		const connect = vi.fn(() => connection.promise);
+		const launch = vi.fn(async () => undefined);
+		const states: BrowserStartupState[] = [];
+		const controller = new BrowserStartupController(connect, launch, (state) =>
+			states.push(state)
+		);
+
+		const first = controller.start();
+		const duplicate = controller.start();
+		expect(duplicate).toBe(first);
+		expect(connect).toHaveBeenCalledTimes(1);
+		expect(launch).not.toHaveBeenCalled();
+
+		connection.resolve();
+		expect(await first).toBe(true);
+		expect(launch).toHaveBeenCalledTimes(1);
+		expect(states.map((state) => state.phase)).toEqual([
+			"idle",
+			"connecting",
+			"launching",
+		]);
+	});
+
+	it("keeps the gate closed after failure and permits a clean retry", async () => {
+		const connect = vi
+			.fn<() => Promise<void>>()
+			.mockRejectedValueOnce(new Error("first connection failed"))
+			.mockResolvedValueOnce(undefined);
+		const launch = vi.fn(async () => undefined);
+		const states: BrowserStartupState[] = [];
+		const controller = new BrowserStartupController(connect, launch, (state) =>
+			states.push(state)
+		);
+
+		expect(await controller.start()).toBe(false);
+		expect(controller.state.phase).toBe("failed");
+		expect(launch).not.toHaveBeenCalled();
+
+		expect(await controller.start()).toBe(true);
+		expect(connect).toHaveBeenCalledTimes(2);
+		expect(launch).toHaveBeenCalledTimes(1);
+		expect(states.some((state) => state.phase === "failed")).toBe(true);
+	});
+
+	it("reports launch failures without marking the browser as open", async () => {
+		const controller = new BrowserStartupController(
+			async () => undefined,
+			async () => {
+				throw new Error("profile storage unavailable");
+			},
+			() => undefined
+		);
+
+		expect(await controller.start()).toBe(false);
+		expect(controller.state).toMatchObject({
+			phase: "failed",
+			message: "profile storage unavailable",
+		});
+	});
+});
+
+describe("startup connection errors", () => {
+	it("keeps the useful nested per-node failures", () => {
+		const iceFailure = new Error("WebRTC connection timed out after 18000 ms");
+		const nodeFailure = new Error(
+			"Node A: Unable to establish WebRTC transport",
+			{ cause: iceFailure }
+		);
+		const aggregate = new AggregateError(
+			[nodeFailure, new Error("Node B: Node is at session capacity")],
+			"Unable to establish WebRTC with any tracker candidate"
+		);
+
+		expect(startupErrorSummary(aggregate)).toBe(
+			"The tracker responded, but none of its available nodes completed a WebRTC connection."
+		);
+		expect(startupErrorDetails(aggregate)).toEqual([
+			"Unable to establish WebRTC with any tracker candidate",
+			"Node A: Unable to establish WebRTC transport",
+			"WebRTC connection timed out after 18000 ms",
+			"Node B: Node is at session capacity",
+		]);
+	});
+});

package/source/packages/chrome/src/startup.ts

@@ -0,0 +1,161 @@
+/* SPDX-License-Identifier: AGPL-3.0-only */
+
+export type BrowserStartupPhase =
+	| "idle"
+	| "connecting"
+	| "launching"
+	| "failed";
+
+export interface BrowserStartupState {
+	phase: BrowserStartupPhase;
+	message: string;
+	details: string[];
+}
+
+export type BrowserStartupStateListener = (state: BrowserStartupState) => void;
+
+/**
+ * Shares preparation while it is pending and after it succeeds, but clears a
+ * failed attempt so the Start screen can perform a real retry.
+ */
+export function createRetryableTask(
+	task: () => Promise<void>
+): () => Promise<void> {
+	let current: Promise<void> | undefined;
+
+	return () => {
+		if (current !== undefined) return current;
+		const attempt = Promise.resolve().then(task);
+		current = attempt;
+		void attempt.catch(() => {
+			if (current === attempt) current = undefined;
+		});
+		return attempt;
+	};
+}
+
+function errorMessage(error: unknown): string {
+	return error instanceof Error ? error.message : String(error);
+}
+
+/**
+ * Produces a bounded, de-duplicated list without exposing stacks. AggregateError
+ * contains the useful per-node failures emitted by the Roxxie transport.
+ */
+export function startupErrorDetails(error: unknown): string[] {
+	const details: string[] = [];
+	const seenObjects = new Set<object>();
+	const seenMessages = new Set<string>();
+
+	const visit = (value: unknown, depth: number): void => {
+		if (details.length >= 12 || depth > 8) return;
+		if (value !== null && typeof value === "object") {
+			if (seenObjects.has(value)) return;
+			seenObjects.add(value);
+		}
+
+		if (value instanceof Error) {
+			const message = value.message.trim();
+			if (message.length > 0 && !seenMessages.has(message)) {
+				seenMessages.add(message);
+				details.push(message);
+			}
+			if (value instanceof AggregateError) {
+				for (const nested of value.errors) visit(nested, depth + 1);
+			}
+			visit(value.cause, depth + 1);
+			return;
+		}
+
+		if (value !== undefined) {
+			const message = String(value).trim();
+			if (message.length > 0 && !seenMessages.has(message)) {
+				seenMessages.add(message);
+				details.push(message);
+			}
+		}
+	};
+
+	visit(error, 0);
+	return details;
+}
+
+export function startupErrorSummary(error: unknown): string {
+	if (
+		error instanceof AggregateError &&
+		error.message === "Unable to establish WebRTC with any tracker candidate"
+	) {
+		return "The tracker responded, but none of its available nodes completed a WebRTC connection.";
+	}
+	return errorMessage(error);
+}
+
+/**
+ * Owns the one permitted startup attempt. Concurrent calls share the same
+ * promise, and launch is never called unless connect has resolved.
+ */
+export class BrowserStartupController {
+	#attempt: Promise<boolean> | undefined;
+	#state: BrowserStartupState = {
+		phase: "idle",
+		message: "Ready to connect.",
+		details: [],
+	};
+
+	constructor(
+		private readonly connect: () => Promise<void>,
+		private readonly launch: () => Promise<void>,
+		private readonly onState: BrowserStartupStateListener
+	) {
+		onState(this.#state);
+	}
+
+	get state(): BrowserStartupState {
+		return this.#state;
+	}
+
+	updateProgress(message: string): void {
+		if (this.#state.phase !== "connecting") return;
+		this.#publish({ phase: "connecting", message, details: [] });
+	}
+
+	start(): Promise<boolean> {
+		if (this.#attempt !== undefined) return this.#attempt;
+		const attempt = this.#run();
+		this.#attempt = attempt;
+		void attempt.finally(() => {
+			if (this.#attempt === attempt) this.#attempt = undefined;
+		});
+		return attempt;
+	}
+
+	async #run(): Promise<boolean> {
+		this.#publish({
+			phase: "connecting",
+			message: "Contacting the tracker and requesting available nodes…",
+			details: [],
+		});
+		try {
+			await this.connect();
+			this.#publish({
+				phase: "launching",
+				message: "Connection verified. Opening the browser…",
+				details: [],
+			});
+			await this.launch();
+			return true;
+		} catch (error) {
+			this.#publish({
+				phase: "failed",
+				message: startupErrorSummary(error),
+				details: startupErrorDetails(error),
+			});
+			return false;
+		}
+	}
+
+	#publish(state: BrowserStartupState): void {
+		this.#state = state;
+		this.onState(state);
+	}
+}