mongoku 2.4.4-compat → 2.4.5-compat

package/src/lib/icons/IconCopy.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	interface Props {
+		class?: string;
+	}
+
+	let { class: className = "w-4 h-4" }: Props = $props();
+</script>
+
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke="currentColor"
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}
+>
+	<rect width="14" height="14" x="8" y="8" rx="2" ry="2" />
+	<path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
+</svg>

package/src/lib/icons/IconEdit.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	interface Props {
+		class?: string;
+	}
+
+	let { class: className = "w-4 h-4" }: Props = $props();
+</script>
+
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke="currentColor"
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}
+>
+	<path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"></path>
+	<path d="m15 5 4 4"></path>
+</svg>

package/src/lib/icons/IconPlus.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	interface Props {
+		class?: string;
+	}
+
+	let { class: className = "w-4 h-4" }: Props = $props();
+</script>
+
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke="currentColor"
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}
+>
+	<path d="M12 5v14M5 12h14" />
+</svg>

package/src/lib/icons/IconSortReverse.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	interface Props {
+		class?: string;
+	}
+
+	let { class: className = "w-4 h-4" }: Props = $props();
+</script>
+
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke="currentColor"
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}
+>
+	<path d="M3 6h18" />
+	<path d="M7 12h10" />
+	<path d="M10 18h4" />
+	<path d="m7 16 3 3 3-3" />
+</svg>

package/src/lib/stores/breadcrumbs.svelte.ts

@@ -0,0 +1,17 @@
+import { page } from "$app/state";
+
+export interface BreadcrumbItem {
+	label: string;
+	href?: string;
+}
+
+export const breadcrumbs = {
+	get items(): BreadcrumbItem[] {
+		const list = (page.data.breadcrumbs ?? []) as Array<{ label: string; path: string }>;
+
+		return list.reduce<BreadcrumbItem[]>(
+			(prev, curr) => [...prev, { label: curr.label, href: `${prev.at(-1)?.href ?? ""}${curr.path}` }],
+			[],
+		);
+	},
+};

package/src/lib/types.ts

@@ -12,6 +12,8 @@ export interface SearchParams {
 	project: string;
 	limit: number;
 	skip: number;
+	mode: "query" | "distinct" | "aggregation";
+	field?: string;
 }
 
 /**

package/src/routes/+layout.svelte

@@ -6,13 +6,24 @@
 	import OriginWarning from "$lib/components/OriginWarning.svelte";
 	import PageSwitcher from "$lib/components/PageSwitcher.svelte";
 	import ThemeSwitcher from "$lib/components/ThemeSwitcher.svelte";
+	import { breadcrumbs } from "$lib/stores/breadcrumbs.svelte";
 	import "../app.css";
 
 	let { children, data } = $props();
+
+	const pageTitle = $derived.by(() => {
+		const items = breadcrumbs.items.slice(-2).reverse();
+
+		if (items.length === 0) {
+			return "Mongoku";
+		}
+
+		return items.map((b) => b.label).join(" - ");
+	});
 </script>
 
 <svelte:head>
-	<title>Mongoku</title>
+	<title>{pageTitle}</title>
 </svelte:head>
 
 <div style="min-height: 100vh">

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

@@ -2,7 +2,7 @@ import { validateAggregationPipeline } from "$lib/server/aggregation";
 import JsonEncoder from "$lib/server/JsonEncoder";
 import { logger } from "$lib/server/logger";
 import { getMongo } from "$lib/server/mongo";
-import { type MongoDocument } from "$lib/types";
+import { type MongoDocument, type SearchParams } from "$lib/types";
 import { isEmptyObject } from "$lib/utils/isEmptyObject";
 import { parseJSON } from "$lib/utils/jsonParser";
 import type { Document } from "mongodb";
@@ -14,6 +14,18 @@ export const load: PageServerLoad = async ({ params, url }) => {
 	const project = url.searchParams.get("project") || "{}";
 	const skip = parseInt(url.searchParams.get("skip") || "0", 10);
 	const limit = parseInt(url.searchParams.get("limit") || "20", 10);
+	const mode = url.searchParams.get("mode") || "query";
+	const field = url.searchParams.get("field") || "";
+
+	const computedParams = {
+		query,
+		sort,
+		project,
+		skip,
+		limit,
+		mode: mode as "query" | "distinct" | "aggregation",
+		field,
+	} satisfies SearchParams;
 
 	// Parse JSON strings - return error state if invalid instead of throwing
 	let queryDoc: unknown;
@@ -52,14 +64,7 @@ export const load: PageServerLoad = async ({ params, url }) => {
 				data: 0,
 				error: null,
 			}),
-			params: {
-				query,
-				sort,
-				project,
-				skip,
-				limit,
-			},
-			isAggregation: false,
+			params: computedParams,
 		};
 	}
 
@@ -70,7 +75,55 @@ export const load: PageServerLoad = async ({ params, url }) => {
 	const client = mongo.getClient(params.server);
 	const collection = client.db(params.database).collection(params.collection);
 
-	if (Array.isArray(queryDoc)) {
+	// Handle distinct mode
+	if (mode === "distinct") {
+		// Validate distinct field is provided
+		if (!field) {
+			return {
+				results: Promise.resolve({
+					data: [],
+					error: "Invalid distinct query: field name is required",
+				}),
+				count: Promise.resolve({
+					data: 0,
+					error: null,
+				}),
+				mappings: await client.getMappings(params.database, params.collection),
+				params: computedParams,
+			};
+		}
+
+		const resultsPromise = collection
+			.distinct(field, JsonEncoder.decode(queryDoc), {
+				maxTimeMS: mongo.getQueryTimeout(),
+			})
+			.then((results) => ({
+				data: results.map((value) => JsonEncoder.encode({ value })) as MongoDocument[],
+				error: null as string | null,
+			}))
+			.catch((err) => {
+				logger.error("Error executing distinct:", err);
+				return {
+					data: [] as MongoDocument[],
+					error: `Failed to execute distinct: ${err instanceof Error ? err.message : String(err)}`,
+				};
+			});
+
+		const countPromise = resultsPromise.then((result) => ({
+			data: result.error ? 0 : result.data.length,
+			error: null,
+		}));
+
+		return {
+			results: resultsPromise,
+			count: countPromise,
+			mappings: await client.getMappings(params.database, params.collection),
+			params: computedParams,
+		};
+	}
+
+	// Handle aggregation mode
+	if (mode === "aggregation" && Array.isArray(queryDoc)) {
 		// Validate aggregation pipeline
 		try {
 			validateAggregationPipeline(queryDoc);
@@ -85,14 +138,7 @@ export const load: PageServerLoad = async ({ params, url }) => {
 					data: 0,
 					error: null,
 				}),
-				params: {
-					query,
-					sort,
-					project,
-					skip,
-					limit,
-				},
-				isAggregation: true,
+				params: computedParams,
 			};
 		}
 		// Execute aggregation
@@ -144,14 +190,8 @@ export const load: PageServerLoad = async ({ params, url }) => {
 		return {
 			results: resultsPromise,
 			count: countPromise,
-			params: {
-				query,
-				sort,
-				project,
-				skip,
-				limit,
-			},
-			isAggregation: true,
+			mappings: await client.getMappings(params.database, params.collection),
+			params: computedParams,
 		};
 	}
 
@@ -205,13 +245,6 @@ export const load: PageServerLoad = async ({ params, url }) => {
 		results: resultsPromise,
 		count: countPromise,
 		mappings: await client.getMappings(params.database, params.collection),
-		params: {
-			query,
-			sort,
-			project,
-			skip,
-			limit,
-		},
-		isAggregation: false,
+		params: computedParams,
 	};
 };