mongoku 2.0.2 → 2.0.3

package/src/routes/servers/[server]/databases/[database]/collections/+page.svelte

@@ -0,0 +1,110 @@
+<script lang="ts">
+	import { resolve } from "$app/paths";
+	import Panel from "$lib/components/Panel.svelte";
+	import TooltipTable from "$lib/components/TooltipTable.svelte";
+	import { formatBytes, formatNumber } from "$lib/utils/filters";
+	import type { PageData } from "./$types";
+
+	let { data }: { data: PageData } = $props();
+</script>
+
+<Panel title="{data.database} collections">
+	<table class="table">
+		<thead>
+			<tr>
+				<th>Name</th>
+				<th>Documents</th>
+				<th>Indexes</th>
+				<th>Size</th>
+			</tr>
+		</thead>
+		<tbody>
+			{#if data.collections && data.collections.length > 0}
+				{#each data.collections as collection (collection.name)}
+					<tr>
+						<td>
+							<a
+								href={resolve(
+									`/servers/${encodeURIComponent(data.server)}/databases/${encodeURIComponent(
+										data.database,
+									)}/collections/${encodeURIComponent(collection.name)}?query=${encodeURIComponent(
+										"{}",
+									)}&sort=&project=&skip=0&limit=20`,
+								)}
+							>
+								{collection.name}
+							</a>
+						</td>
+						<td>
+							{#await collection.details}
+								<span class="text-gray-400">...</span>
+							{:then details}
+								{#if details}
+									{formatNumber(details.count)}
+								{:else}
+									<span title="Failed to load">❌</span>
+								{/if}
+							{/await}
+						</td>
+						<td>
+							{#await collection.details}
+								<span class="text-gray-400">...</span>
+							{:then details}
+								{#if details}
+									<TooltipTable
+										columns={[
+											{ header: "Index", key: "definition", align: "left" },
+											{ header: "Size", key: "size", align: "right" },
+										]}
+										rows={details.indexes.map((index) => ({
+											definition: index.key ? JSON.stringify(index.key, null, 1) : index.name,
+											size: formatBytes(index.size),
+										}))}
+									>
+										{formatNumber(details.nIndexes)}
+									</TooltipTable>
+								{:else}
+									<span title="Failed to load">❌</span>
+								{/if}
+							{/await}
+						</td>
+						<td>
+							{#await collection.details}
+								<span class="text-gray-400">...</span>
+							{:then details}
+								{#if details}
+									<TooltipTable
+										hideHeader
+										columns={[
+											{ header: "Label", key: "label", align: "left" },
+											{ header: "Value", key: "value", align: "right" },
+										]}
+										rows={[
+											{ label: "Average obj. size", value: details.avgObjSize },
+											{ label: "Data size", value: details.dataSize },
+											{ label: "Storage size", value: details.storageSize },
+											{ label: "Index size", value: details.totalIndexSize },
+										].map((row) => ({
+											...row,
+											value: typeof row.value === "number" ? formatBytes(row.value) : row.value,
+										}))}
+									>
+										{formatBytes(details.size)}
+									</TooltipTable>
+								{:else}
+									<span title="Failed to load">❌</span>
+								{/if}
+							{/await}
+						</td>
+					</tr>
+				{/each}
+			{:else}
+				<tr>
+					<td colspan="4">
+						<div class="text-center">No collections...</div>
+					</td>
+				</tr>
+			{/if}
+		</tbody>
+	</table>
+</Panel>

package/src/routes/servers/[server]/databases/[database]/collections/[collection]/+page.server.ts

@@ -0,0 +1,106 @@
+import JsonEncoder from "$lib/server/JsonEncoder";
+import { getMongo } from "$lib/server/mongo";
+import type { MongoDocument } from "$lib/types";
+import { parseJSON } from "$lib/utils/jsonParser";
+import { error } from "@sveltejs/kit";
+import type { Document } from "mongodb";
+import type { PageServerLoad } from "./$types";
+
+export const load: PageServerLoad = async ({ params, url }) => {
+	const query = url.searchParams.get("query") || "{}";
+	const sort = url.searchParams.get("sort") || "{}";
+	const project = url.searchParams.get("project") || "{}";
+	const skip = parseInt(url.searchParams.get("skip") || "0", 10);
+	const limit = parseInt(url.searchParams.get("limit") || "20", 10);
+
+	// Parse JSON strings early for immediate errors
+	let queryDoc: unknown;
+	try {
+		queryDoc = parseJSON(query);
+	} catch (err) {
+		return error(400, `Invalid query: ${query} - ${err}`);
+	}
+
+	let sortDoc: unknown;
+	try {
+		sortDoc = parseJSON(sort);
+	} catch (err) {
+		return error(400, `Invalid sort: ${sort} - ${err}`);
+	}
+
+	let projectDoc: Document;
+	try {
+		projectDoc = parseJSON(project) as Document;
+	} catch (err) {
+		return error(400, `Invalid project: ${project} - ${err}`);
+	}
+
+	const mongo = await getMongo();
+	const collection = mongo.getCollection(params.server, params.database, params.collection);
+
+	if (!collection) {
+		return error(404, `Collection not found: ${params.server}.${params.database}.${params.collection}`);
+	}
+
+	// Stream both promises - return error info instead of throwing
+	const resultsPromise = collection
+		.find(JsonEncoder.decode(queryDoc))
+		.project(projectDoc)
+		.sort(JsonEncoder.decode(sortDoc))
+		.limit(limit)
+		.skip(skip)
+		.map((obj) => JsonEncoder.encode(obj))
+		.toArray()
+		.then((results) => ({
+			data: results as MongoDocument[],
+			error: null as string | null,
+		}))
+		.catch((err) => {
+			console.error("Error fetching query results:", err);
+			return {
+				data: [] as MongoDocument[],
+				error: `Failed to fetch query results: ${err instanceof Error ? err.message : String(err)}`,
+			};
+		});
+
+	const countPromise = (async () => {
+		try {
+			if (queryDoc && Object.keys(queryDoc).length > 0) {
+				return {
+					data: await collection.countDocuments(JsonEncoder.decode(queryDoc), {
+						maxTimeMS: mongo.getCountTimeout(),
+					}),
+					error: null as string | null,
+				};
+			} else {
+				// fast count
+				return {
+					data: await collection.estimatedDocumentCount(),
+					error: null as string | null,
+				};
+			}
+		} catch (err) {
+			console.error("Error counting documents:", err);
+			return {
+				data: 0,
+				error: `Failed to count documents: ${err instanceof Error ? err.message : String(err)}`,
+			};
+		}
+	})();
+
+	return {
+		server: params.server,
+		database: params.database,
+		collection: params.collection,
+		// Stream these promises to the client
+		results: resultsPromise,
+		count: countPromise,
+		params: {
+			query,
+			sort,
+			project,
+			skip,
+			limit,
+		},
+	};
+};

package/src/routes/servers/[server]/databases/[database]/collections/[collection]/+page.svelte

@@ -0,0 +1,174 @@
+<script lang="ts">
+	import {
+		deleteDocument as deleteDocumentCommand,
+		updateDocument as updateDocumentCommand,
+	} from "$api/servers.remote";
+	import { resolve } from "$app/paths";
+	import Panel from "$lib/components/Panel.svelte";
+	import PrettyJson from "$lib/components/PrettyJson.svelte";
+	import SearchBox from "$lib/components/SearchBox.svelte";
+	import { notificationStore } from "$lib/stores/notifications.svelte";
+	import type { MongoDocument, SearchParams } from "$lib/types";
+	import { formatNumber } from "$lib/utils/filters";
+	import { SvelteURLSearchParams } from "svelte/reactivity";
+	import type { PageData } from "./$types";
+
+	let { data }: { data: PageData } = $props();
+
+	let params = $state<SearchParams>({ ...data.params });
+
+	// Handle errors from streamed promises
+	$effect(() => {
+		// @ts-expect-error I just want to trigger the dependency
+		if (data.results) {
+			modifiedItems = null;
+		}
+		data.results.then((result) => {
+			if (result.error) {
+				notificationStore.notifyError(result.error);
+			}
+		});
+	});
+
+	$effect(() => {
+		data.count.then((result) => {
+			if (result.error) {
+				notificationStore.notifyError(result.error);
+			}
+		});
+	});
+
+	let modifiedItems = $state<MongoDocument[] | null>(null);
+	let items = $derived(modifiedItems ? { data: modifiedItems, error: null } : data.results);
+
+	async function editDocument(_id: { $value?: string } | undefined, json: MongoDocument, items: MongoDocument[]) {
+		const partial = Boolean(
+			params.project && params.project !== "{}" && Object.keys(JSON.parse(params.project)).length > 0,
+		);
+		const newId = json?._id?.$value;
+		const oldId = _id?.$value;
+
+		if (newId !== oldId) {
+			notificationStore.notifyError("ObjectId changed. This is not supported, update canceled.");
+			return;
+		}
+
+		if (!oldId) return;
+
+		try {
+			const result = await updateDocumentCommand({
+				server: data.server,
+				database: data.database,
+				collection: data.collection,
+				document: oldId,
+				value: json,
+				partial,
+			});
+
+			if (result.ok) {
+				notificationStore.notifySuccess("Document updated successfully");
+				// Update the document in the list
+				const index = items.findIndex((item) => item._id?.$value === oldId);
+				if (index !== -1) {
+					items[index] = result.update;
+				}
+				modifiedItems = items;
+			}
+		} catch (error) {
+			console.log(error);
+			notificationStore.notifyError(error, "Failed to update document");
+		}
+	}
+
+	async function removeDocument(_id: { $value?: string } | undefined, items: MongoDocument[]) {
+		const documentId = _id?.$value;
+		if (!documentId) return;
+
+		try {
+			await deleteDocumentCommand({
+				server: data.server,
+				database: data.database,
+				collection: data.collection,
+				document: documentId,
+			});
+
+			notificationStore.notifySuccess("Document removed successfully");
+			modifiedItems = items.filter((item) => item._id?.$value !== documentId);
+		} catch (error) {
+			notificationStore.notifyError(error, "Failed to remove document");
+		}
+	}
+
+	function buildUrl(skip: number) {
+		const queryParams = new SvelteURLSearchParams();
+		queryParams.set("query", params.query || "{}");
+		queryParams.set("sort", params.sort || "");
+		queryParams.set("project", params.project || "");
+		queryParams.set("skip", String(skip));
+		queryParams.set("limit", String(params.limit));
+
+		return `/servers/${encodeURIComponent(data.server)}/databases/${encodeURIComponent(data.database)}/collections/${encodeURIComponent(data.collection)}?${queryParams.toString()}`;
+	}
+
+	const nextUrl = $derived(buildUrl(params.skip + params.limit));
+	const previousUrl = $derived(buildUrl(Math.max(0, params.skip - params.limit)));
+</script>
+
+<SearchBox bind:params />
+
+{#await items}
+	<Panel title="Loading documents...">
+		{#snippet actions()}
+			<span class="text-sm text-gray-500">Loading...</span>
+		{/snippet}
+	</Panel>
+{:then resultsData}
+	{@const items = resultsData.data}
+	{#await data.count}
+		<Panel
+			title={items.length > 0
+				? `${formatNumber(data.params.skip + 1)} - ${formatNumber(data.params.skip + items.length)} Documents (counting...)`
+				: "No documents"}
+		>
+			{#snippet actions()}
+				{#if data.params.skip > 0}
+					<!-- eslint-disable-next-line @typescript-eslint/no-explicit-any -->
+					<a href={resolve(previousUrl as any)} class="btn btn-default btn-sm -my-2">Previous</a>
+				{/if}
+			{/snippet}
+		</Panel>
+	{:then countData}
+		{@const count = countData.data}
+		{@const hasNext = data.params.skip + items.length < count}
+		{@const hasPrevious = data.params.skip > 0}
+		<Panel
+			title={count > 0
+				? `${formatNumber(data.params.skip + 1)} - ${formatNumber(data.params.skip + items.length)} of ${formatNumber(count)} Documents`
+				: "No documents"}
+		>
+			{#snippet actions()}
+				{#if hasPrevious}
+					<!-- eslint-disable-next-line @typescript-eslint/no-explicit-any -->
+					<a href={resolve(previousUrl as any)} class="btn btn-default btn-sm -my-2">Previous</a>
+				{/if}
+				{#if hasNext}
+					<!-- eslint-disable-next-line @typescript-eslint/no-explicit-any -->
+					<a href={resolve(nextUrl as any)} class="btn btn-default btn-sm -my-2">Next</a>
+				{/if}
+			{/snippet}
+		</Panel>
+	{/await}
+
+	{#each items as item (item._id?.$value)}
+		<PrettyJson
+			json={item}
+			autoCollapse={true}
+			readOnly={data.readOnly}
+			onedit={(json) => editDocument(item._id, json, items)}
+			onremove={() => removeDocument(item._id, items)}
+			server={data.server}
+			database={data.database}
+			collection={data.collection}
+		/>
+	{/each}
+{/await}

package/src/routes/servers/[server]/databases/[database]/collections/[collection]/documents/[document]/+page.server.ts

@@ -0,0 +1,25 @@
+import JsonEncoder from "$lib/server/JsonEncoder";
+import { getMongo } from "$lib/server/mongo";
+import { ObjectId } from "mongodb";
+import type { PageServerLoad } from "./$types";
+
+export const load: PageServerLoad = async ({ params }) => {
+	const mongo = await getMongo();
+	const collection = mongo.getCollection(params.server, params.database, params.collection);
+
+	let document = null;
+	if (collection) {
+		const obj = await collection.findOne({
+			_id: new ObjectId(params.document),
+		});
+		document = JsonEncoder.encode(obj);
+	}
+
+	return {
+		server: params.server,
+		database: params.database,
+		collection: params.collection,
+		documentId: params.document,
+		document,
+	};
+};

package/src/routes/servers/[server]/databases/[database]/collections/[collection]/documents/[document]/+page.svelte

@@ -0,0 +1,90 @@
+<script lang="ts">
+	import {
+		deleteDocument as deleteDocumentCommand,
+		updateDocument as updateDocumentCommand,
+	} from "$api/servers.remote";
+	import { goto } from "$app/navigation";
+	import { resolve } from "$app/paths";
+	import PrettyJson from "$lib/components/PrettyJson.svelte";
+	import { notificationStore } from "$lib/stores/notifications.svelte";
+	import type { MongoDocument } from "$lib/types";
+	import type { PageData } from "./$types";
+
+	let { data }: { data: PageData } = $props();
+
+	let loading = $state(false);
+	let item = $derived(data.document);
+
+	async function editDocument(json: MongoDocument) {
+		const newId = json?._id?.$value;
+		const oldId = item?._id?.$value;
+
+		if (newId !== oldId) {
+			notificationStore.notifyError("ObjectId changed. This is not supported, update canceled.");
+			return;
+		}
+
+		if (!oldId) return;
+
+		loading = true;
+		try {
+			const result = await updateDocumentCommand({
+				server: data.server,
+				database: data.database,
+				collection: data.collection,
+				document: oldId,
+				value: json,
+				partial: false,
+			});
+
+			if (result.ok) {
+				notificationStore.notifySuccess("Document updated successfully");
+				item = result.update;
+			}
+		} catch (error) {
+			notificationStore.notifyError(error, "Failed to update document");
+		} finally {
+			loading = false;
+		}
+	}
+
+	async function removeDocument() {
+		const documentId = item?._id?.$value;
+		if (!documentId) return;
+
+		try {
+			await deleteDocumentCommand({
+				server: data.server,
+				database: data.database,
+				collection: data.collection,
+				document: documentId,
+			});
+
+			notificationStore.notifySuccess("Document removed successfully");
+			// Navigate back to the collection explore page
+			goto(
+				resolve(
+					`/servers/${encodeURIComponent(data.server)}/databases/${encodeURIComponent(data.database)}/collections/${encodeURIComponent(data.collection)}?query=${encodeURIComponent("{}")}&sort=&project=&skip=0&limit=20`,
+				),
+			);
+		} catch (error) {
+			notificationStore.notifyError(error, "Failed to remove document");
+		}
+	}
+</script>
+
+{#if loading}
+	<div class="loading">Loading...</div>
+{:else if item}
+	<PrettyJson
+		json={item}
+		readOnly={data.readOnly}
+		onedit={editDocument}
+		onremove={removeDocument}
+		server={data.server}
+		database={data.database}
+		collection={data.collection}
+	/>
+{:else}
+	<div class="text-center">Document not found</div>
+{/if}

package/src/tests/api/readonly.test.ts

@@ -0,0 +1,89 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+// Skipping for now, not sure how to handle tests with remote functions that throw errors
+describe.skip("Read-Only Mode Remote Functions Tests", () => {
+	let originalEnv: string | undefined;
+
+	beforeEach(() => {
+		// Store original env value
+		originalEnv = process.env.MONGOKU_READ_ONLY_MODE;
+	});
+
+	afterEach(() => {
+		// Restore original env value
+		if (originalEnv !== undefined) {
+			process.env.MONGOKU_READ_ONLY_MODE = originalEnv;
+		} else {
+			delete process.env.MONGOKU_READ_ONLY_MODE;
+		}
+		vi.clearAllMocks();
+	});
+
+	describe("updateDocument", () => {
+		it("should throw error when trying to update a document in read-only mode", async () => {
+			process.env.MONGOKU_READ_ONLY_MODE = "true";
+
+			const { updateDocument } = await import("../../api/servers.remote");
+
+			try {
+				await updateDocument({
+					server: "test",
+					database: "testdb",
+					collection: "testcol",
+					document: "507f1f77bcf86cd799439011",
+					value: { name: "updated" },
+					partial: false,
+				});
+				expect.fail("Should have thrown an error");
+			} catch (error: any) {
+				expect(error.status).toBe(403);
+				expect(error.body.message).toContain("Read-only mode");
+			}
+		});
+
+		it("should allow updates when not in read-only mode", async () => {
+			delete process.env.MONGOKU_READ_ONLY_MODE;
+
+			const { updateDocument } = await import("../../api/servers.remote");
+
+			// Should work or fail for a different reason
+			try {
+				const response = await updateDocument({
+					server: "test",
+					database: "testdb",
+					collection: "testcol",
+					document: "507f1f77bcf86cd799439011",
+					value: { name: "updated" },
+					partial: false,
+				});
+				// Success case
+				expect(response.ok).toBe(true);
+			} catch (error: any) {
+				// If it fails, it shouldn't be because of read-only mode
+				expect(error.status).not.toBe(403);
+			}
+		});
+	});
+
+	describe("deleteDocument", () => {
+		it("should throw error when trying to delete a document in read-only mode", async () => {
+			process.env.MONGOKU_READ_ONLY_MODE = "true";
+
+			const { deleteDocument } = await import("../../api/servers.remote");
+
+			try {
+				await deleteDocument({
+					server: "test",
+					database: "testdb",
+					collection: "testcol",
+					document: "507f1f77bcf86cd799439011",
+				});
+				expect.fail("Should have thrown an error");
+			} catch (error: any) {
+				expect(error.status).toBe(403);
+				expect(error.body.message).toContain("Read-only mode");
+			}
+		});
+	});
+});

package/src/tests/setup.ts

@@ -0,0 +1,19 @@
+import { vi } from "vitest";
+
+// Mock the mongo module to avoid actual MongoDB connections during tests
+vi.mock("$lib/server/mongo", () => ({
+	getMongo: vi.fn(() =>
+		Promise.resolve({
+			findOne: vi.fn(),
+			find: vi.fn(),
+			count: vi.fn(),
+			updateOne: vi.fn(),
+			removeOne: vi.fn(),
+			getServersJson: vi.fn(() => Promise.resolve([])),
+			getDatabasesJson: vi.fn(() => Promise.resolve([])),
+			getCollectionsJson: vi.fn(() => Promise.resolve([])),
+			addServer: vi.fn(),
+			removeServer: vi.fn(),
+		}),
+	),
+}));

package/svelte.config.js

@@ -0,0 +1,28 @@
+import adapter from "@sveltejs/adapter-node";
+import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	preprocess: vitePreprocess(),
+
+	kit: {
+		adapter: adapter({
+			out: "build",
+			envPrefix: "MONGOKU_SERVER_",
+		}),
+		experimental: {
+			remoteFunctions: true,
+		},
+		alias: {
+			$api: "src/api",
+		},
+	},
+
+	compilerOptions: {
+		experimental: {
+			async: true,
+		},
+	},
+};
+
+export default config;

package/tsconfig.cli.json

@@ -0,0 +1,15 @@
+{
+	"extends": "./tsconfig.json",
+	"compilerOptions": {
+		"module": "esnext",
+		"target": "es2022",
+		"moduleResolution": "bundler",
+		"outDir": "./dist",
+		"rootDir": ".",
+		"declaration": false,
+		"esModuleInterop": true,
+		"skipLibCheck": true
+	},
+	"include": ["cli.ts"],
+	"exclude": ["node_modules", "src", "build", ".svelte-kit"]
+}

package/tsconfig.json

@@ -0,0 +1,19 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"moduleResolution": "bundler"
+	}
+	// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
+	// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
+	//
+	// To make changes to top-level options such as include and exclude, we recommend extending
+	// the generated config; see https://svelte.dev/docs/kit/configuration#typescript
+}

package/vite.config.ts

@@ -0,0 +1,7 @@
+import { sveltekit } from "@sveltejs/kit/vite";
+import tailwindcss from "@tailwindcss/vite";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+	plugins: [tailwindcss(), sveltekit()],
+});