Compare commits

...

20 Commits

Author SHA1 Message Date
opencode 4d149fd927 docs: add v0.9.6 release notes
Build & Push Docker Image / build (push) Successful in 1m57s
2026-08-06 23:34:01 +02:00
opencode 5eef9f2467 feat(nav): move help to icon-only in sidebar footer version row 2026-08-06 23:33:17 +02:00
opencode 3fc68adcd2 chore(security): override js-yaml to >=4.3.1 <5 to fix GHSA-5p4m-2wfm-xmqj (orval audit)
Build & Push Docker Image / build (push) Successful in 1m46s
2026-08-06 23:09:44 +02:00
opencode 7018e2eda5 docs: fill v0.9.5 release notes commit hash
Build & Push Docker Image / build (push) Failing after 21s
2026-08-06 23:03:27 +02:00
opencode 54364d7a88 feat(design): cyan accent, dialog overflow fixes, unified delete buttons, nav polish 2026-08-06 23:03:14 +02:00
opencode e65daea8dd docs: fill v0.9.4 release notes commit hash
Build & Push Docker Image / build (push) Successful in 1m59s
2026-08-06 07:53:22 +02:00
opencode 23e8ac702e feat(design): neon polish — rating bars, destructive colors, active nav glow 2026-08-06 07:52:58 +02:00
opencode d777ee9211 docs: fill v0.9.3 release notes commit hash
Build & Push Docker Image / build (push) Successful in 3m4s
2026-08-06 07:08:13 +02:00
opencode 01982964bb feat(design): neon/AI look with gradient loading states 2026-08-06 07:08:01 +02:00
opencode f3b4fa553b docs: fill v0.9.2 release notes commit hash
Build & Push Docker Image / build (push) Successful in 1m47s
2026-08-05 07:44:48 +02:00
opencode e164d51574 feat: compare limit 9, format-aware import placeholder, help links
- Raise compare limit from 8 to 9 (server + client, toast on overflow)
- Make import textarea placeholder match selected format (CSV/JSON/YAML/auto)
- Add GuideHelp links to admin create/edit user dialogs and tool import dialog
2026-08-05 07:40:47 +02:00
opencode e66a332270 fix(docs): release file without releases/ prefix to avoid double path
Build & Push Docker Image / build (push) Successful in 3m1s
index.json stored file='releases/vX.Y.Z.de.md' but ReleaseNoteView
prepends 'releases/' again, producing releases/releases/... (404).
Store the bare filename so the view resolves docs/releases/vX.Y.Z.de.md.
2026-08-05 00:32:56 +02:00
opencode 48d25b668d docs: fill release notes commit hash
Build & Push Docker Image / build (push) Failing after 57s
2026-08-05 00:15:00 +02:00
opencode 6eb3dfd8f9 docs: cut to v0.9.0 with unified .de/.en naming
- Remove all prior release notes and version snapshots (v0.6.0-v0.8.6)
- Rename handbook to *.de.md; keep *.en.md
- New release notes v0.9.0.de.md/.en.md with v0.9.0 snapshot
- generate-docs.mjs: .de/.en convention incl. search index and en-fallback
- docs.tsx: release fallback now uses version.de.md
- Wording: neutral tagline, anonymous user, no gender forms
- Add docs/examples/import-tools.yaml and link from administration docs
2026-08-05 00:13:41 +02:00
opencode ca980fce09 docs: add v0.8.6 release notes
Build & Push Docker Image / build (push) Successful in 2m16s
2026-08-04 23:13:09 +02:00
opencode 8f2fd89847 feat(import): bulk tool import (CSV/JSON/YAML) for admins; NetBox-style help button
Build & Push Docker Image / build (push) Successful in 2m49s
- Add POST /admin/tools/import with format auto-detect, CSV delimiters
  (comma/semicolon/tab), per-row validation via CreateToolBody, bulk insert,
  audit log entries per imported tool; gated by new 'tool-import' feature
  flag (premium/enterprise; admins always pass)
- Add tool-import-dialog UI (format tabs, delimiter select, textarea, file
  upload, result/error list) behind hasFeature('tool-import')
- Replace FieldHelp question marks and bare GuideHelp links with a NetBox-style
  'Hilfe/Help' outline button (HelpCircle + text) in form headers only
- Sync locales to 482 keys per language (de/en), update handbook docs
  (administration import section, index/plaene feature tables), regenerate
  API client + zod schemas, add yaml dependency
2026-08-04 23:09:11 +02:00
opencode d47db6d386 docs: add v0.8.5 release notes
Build & Push Docker Image / build (push) Successful in 3m43s
2026-08-04 21:01:58 +02:00
opencode 70e72dac71 fix(i18n): translate submit button, density/view toggles; rename watchlist guide to Merkliste; add guide help buttons
Build & Push Docker Image / build (push) Successful in 2m31s
2026-08-04 20:43:36 +02:00
opencode 63aa14914f docs: add v0.8.4 release notes
Build & Push Docker Image / build (push) Successful in 2m45s
2026-08-04 19:52:36 +02:00
opencode 3de59ccaaf feat(i18n): full app + docs localization (de/en)
Build & Push Docker Image / build (push) Successful in 2m33s
- translate remaining pages/components (admin, analytics, redundancy,
  trash, compare, browse, watchlist, admin tools tab, category combobox,
  theme toggle, tool preview card, tool-new/edit) to t() calls
- locales: 453 keys each, parity verified
- docs: bilingual handbook + release notes via *.en.md variants,
  language-aware docs.tsx (markdown paths, nav titles, search index),
  LanguageSwitcher in docs header
- generate-docs: emit per-locale handbook/release/search output,
  localized index.json fields (fileEn/titleEn), en-aware snapshots
2026-08-04 08:35:05 +02:00
366 changed files with 23599 additions and 1125 deletions
+1
View File
@@ -23,6 +23,7 @@
"openid-client": "6.8.4",
"pino": "10.3.1",
"pino-http": "11.0.0",
"yaml": "catalog:",
"zod": "catalog:"
},
"devDependencies": {
@@ -2,8 +2,8 @@ import { type Request, type Response, type NextFunction } from "express";
const TIER_FEATURES: Record<string, string[]> = {
free: ["browse", "rate", "search"],
premium: ["browse", "rate", "search", "similar-tools", "costs", "redundancy", "analytics-advanced", "trash", "compare", "watchlist"],
enterprise: ["browse", "rate", "search", "similar-tools", "costs", "redundancy", "analytics-advanced", "trash", "compare", "watchlist", "sso", "audit-export", "api-access"],
premium: ["browse", "rate", "search", "similar-tools", "costs", "redundancy", "analytics-advanced", "trash", "compare", "watchlist", "tool-import"],
enterprise: ["browse", "rate", "search", "similar-tools", "costs", "redundancy", "analytics-advanced", "trash", "compare", "watchlist", "tool-import", "sso", "audit-export", "api-access"],
};
export function getEntitlements(tier: string | undefined, role: string | undefined): string[] {
+183
View File
@@ -1,9 +1,12 @@
import { Router, type IRouter } from "express";
import { eq, and, sql } from "drizzle-orm";
import { z } from "zod";
import { parse as parseYaml } from "yaml";
import { db, toolsTable, ratingsTable, toolCostsTable, toolRelationsTable } from "@workspace/db";
import { requireAdmin } from "../middleware/auth";
import { requireFeature } from "../middleware/feature";
import { writeAuditLog } from "../lib/audit";
import { CreateToolBody } from "@workspace/api-zod";
const EvaluateBody = z.object({
toolId: z.coerce.number().int().positive(),
@@ -219,4 +222,184 @@ router.post("/admin/redundancy/evaluate", requireAdmin, async (req, res): Promis
res.json({ ok: true });
});
const ToolImportBody = z.object({
format: z.enum(["auto", "csv", "json", "yaml"]).default("auto"),
delimiter: z.enum(["auto", "comma", "semicolon", "tab"]).default("auto"),
data: z.string().min(1),
});
const TOOL_FIELDS = ["name", "description", "category", "websiteUrl", "iconUrl", "features", "tags"] as const;
function splitList(value: unknown): string[] {
if (Array.isArray(value)) {
return value.map((v) => String(v).trim()).filter(Boolean);
}
if (typeof value === "string") {
return value
.split(/[|;,]/)
.map((v) => v.trim())
.filter(Boolean);
}
return [];
}
function normalizeTool(raw: Record<string, unknown>): Record<string, unknown> {
const out: Record<string, unknown> = {};
for (const key of TOOL_FIELDS) {
if (key in raw) out[key] = raw[key];
}
if ("features" in out) out.features = splitList(out.features);
if ("tags" in out) out.tags = splitList(out.tags);
return out;
}
function parseCsv(data: string, delimiter: string): Record<string, unknown>[] {
let sep = ",";
if (delimiter === "semicolon") sep = ";";
else if (delimiter === "tab") sep = "\t";
else if (delimiter === "auto") {
const firstLine = data.split(/\r?\n/)[0] ?? "";
const candidates = [",", ";", "\t"];
const counts = candidates.map((c) => (firstLine.match(new RegExp(`\\${c === "\t" ? "\\t" : c}`, "g")) ?? []).length);
const max = Math.max(...counts);
if (max > 0) sep = candidates[counts.indexOf(max)];
}
const lines = data.split(/\r?\n/).filter((l) => l.trim().length > 0);
if (lines.length === 0) return [];
const header = parseCsvLine(lines[0], sep);
const rows: Record<string, unknown>[] = [];
for (let i = 1; i < lines.length; i++) {
const cells = parseCsvLine(lines[i], sep);
const row: Record<string, unknown> = {};
header.forEach((h, idx) => {
const key = h.trim();
if (key) row[key] = cells[idx] ?? "";
});
rows.push(row);
}
return rows;
}
function parseCsvLine(line: string, sep: string): string[] {
const cells: string[] = [];
let cur = "";
let inQuotes = false;
for (let i = 0; i < line.length; i++) {
const ch = line[i];
if (inQuotes) {
if (ch === '"') {
if (line[i + 1] === '"') {
cur += '"';
i++;
} else {
inQuotes = false;
}
} else {
cur += ch;
}
} else if (ch === '"') {
inQuotes = true;
} else if (ch === sep) {
cells.push(cur);
cur = "";
} else {
cur += ch;
}
}
cells.push(cur);
return cells;
}
router.post(
"/admin/tools/import",
requireAdmin,
requireFeature("tool-import"),
async (req, res): Promise<void> => {
const parsed = ToolImportBody.safeParse(req.body);
if (!parsed.success) {
res.status(400).json({ error: parsed.error.message });
return;
}
const { format, delimiter, data } = parsed.data;
let rawRows: Record<string, unknown>[] = [];
let effectiveFormat = format;
if (format === "auto") {
const trimmed = data.trimStart();
if (trimmed.startsWith("[") || trimmed.startsWith("{")) {
effectiveFormat = "json";
} else if (trimmed.includes(":") && !trimmed.startsWith("\"")) {
effectiveFormat = "yaml";
} else {
effectiveFormat = "csv";
}
}
try {
if (effectiveFormat === "json") {
const json = JSON.parse(data);
if (Array.isArray(json)) {
rawRows = json.filter((r) => r && typeof r === "object") as Record<string, unknown>[];
} else if (json && typeof json === "object") {
rawRows = [json as Record<string, unknown>];
} else {
res.status(400).json({ error: "JSON data must be an object or an array of objects" });
return;
}
} else if (effectiveFormat === "yaml") {
const yaml = parseYaml(data);
if (Array.isArray(yaml)) {
rawRows = yaml.filter((r) => r && typeof r === "object") as Record<string, unknown>[];
} else if (yaml && typeof yaml === "object") {
rawRows = [yaml as Record<string, unknown>];
} else {
res.status(400).json({ error: "YAML data must be an object or a list of objects" });
return;
}
} else {
rawRows = parseCsv(data, delimiter);
}
} catch (err) {
res.status(400).json({ error: `Failed to parse ${effectiveFormat} data: ${(err as Error).message}` });
return;
}
const errors: { row: number; error: string }[] = [];
const validRows: { name: string; description: string; category: string; websiteUrl?: string; iconUrl?: string; features: string[]; tags: string[]; createdBy: string }[] = [];
const user = req.session.user!;
const createdBy = user.preferred_username || user.name || user.sub;
rawRows.forEach((raw, idx) => {
const normalized = normalizeTool(raw);
const check = CreateToolBody.safeParse(normalized);
if (!check.success) {
errors.push({ row: idx + 1, error: check.error.message });
return;
}
validRows.push({
name: check.data.name,
description: check.data.description,
category: check.data.category,
websiteUrl: check.data.websiteUrl,
iconUrl: check.data.iconUrl,
features: check.data.features ?? [],
tags: check.data.tags ?? [],
createdBy,
});
});
let imported = 0;
if (validRows.length > 0) {
const inserted = await db.insert(toolsTable).values(validRows).returning({ id: toolsTable.id, name: toolsTable.name, category: toolsTable.category });
imported = inserted.length;
for (const tool of inserted) {
await writeAuditLog(req, "tool", tool.id, "create", { name: tool.name, category: tool.category, source: "import" });
}
}
res.json({ imported, total: rawRows.length, errors });
},
);
export default router;
+2 -2
View File
@@ -268,8 +268,8 @@ router.get("/compare", requireFeature("compare"), async (req, res): Promise<void
res.status(400).json({ error: "Provide at least one ids value, e.g. ?ids=1,2,3" });
return;
}
if (ids.length > 8) {
res.status(400).json({ error: "Maximum of 8 tools can be compared" });
if (ids.length > 9) {
res.status(400).json({ error: "Maximum of 9 tools can be compared" });
return;
}
const tools = await db.select().from(toolsTable).where(and(isNull(toolsTable.deletedAt), inArray(toolsTable.id, ids)));
@@ -1,4 +1,5 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { Link } from "wouter";
import {
useListTools,
@@ -10,7 +11,6 @@ import {
getListAllTagsQueryKey,
getGetTopToolsQueryKey,
getGetAnalyticsSummaryQueryKey,
type ToolWithStats,
} from "@workspace/api-client-react";
import { useQueryClient } from "@tanstack/react-query";
import { useAuth } from "@/hooks/use-auth";
@@ -23,11 +23,13 @@ import { Checkbox } from "@/components/ui/checkbox";
import { Skeleton } from "@/components/ui/skeleton";
import { useToast } from "@/hooks/use-toast";
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@/components/ui/alert-dialog";
import { Search, Trash2, ExternalLink, Pencil, Star } from "lucide-react";
import { ToolImportDialog } from "@/components/tool-import-dialog";
import { Search, Trash2, ExternalLink, Pencil, Star, Upload } from "lucide-react";
import { format } from "date-fns";
export function AdminToolsTab() {
const { isAdmin, isLoading: authLoading } = useAuth();
const { t } = useTranslation();
const { isAdmin, hasFeature, isLoading: authLoading } = useAuth();
const { toast } = useToast();
const queryClient = useQueryClient();
@@ -35,6 +37,7 @@ export function AdminToolsTab() {
const [search, setSearch] = useState("");
const [selected, setSelected] = useState<Set<number>>(new Set());
const [confirmTrash, setConfirmTrash] = useState(false);
const [importOpen, setImportOpen] = useState(false);
useEffect(() => {
const t = setTimeout(() => setSearch(searchInput), 300);
@@ -82,20 +85,20 @@ export function AdminToolsTab() {
{ data: { ids } },
{
onSuccess: (res) => {
toast({ title: "Tools moved to trash", description: `${res.trashed ?? ids.length} tool(s) moved to trash.` });
toast({ title: t("adminTools.toastMoved"), description: t("adminTools.toastMovedSub", { count: res.trashed ?? ids.length }) });
setSelected(new Set());
setConfirmTrash(false);
invalidate();
},
onError: (err) => {
toast({ title: "Failed to move to trash", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("adminTools.toastMoveFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
}
if (!authLoading && !isAdmin) {
return <p className="text-sm text-muted-foreground py-8 text-center">Admin access required.</p>;
return <p className="text-sm text-muted-foreground py-8 text-center">{t("adminTools.accessRequired")}</p>;
}
const selectedIds = [...selected];
@@ -104,28 +107,39 @@ export function AdminToolsTab() {
<Card>
<CardHeader className="flex flex-row items-center justify-between gap-4 flex-wrap">
<div className="space-y-1.5">
<CardTitle>All Tools</CardTitle>
<CardTitle>{t("adminTools.allTools")}</CardTitle>
<CardDescription>
{selectedIds.length > 0 ? `${selectedIds.length} selected` : `${allTools.length} tool(s)`}
{selectedIds.length > 0 ? t("adminTools.selected", { count: selectedIds.length }) : t("adminTools.toolCount", { count: allTools.length })}
</CardDescription>
</div>
<div className="flex items-center gap-2 flex-wrap">
{hasFeature("tool-import") && (
<Button
size="sm"
variant="outline"
onClick={() => setImportOpen(true)}
data-testid="button-tool-import"
>
<Upload className="w-4 h-4 mr-2" /> {t("adminTools.importButton")}
</Button>
)}
<div className="relative">
<Search className="w-4 h-4 absolute left-2.5 top-1/2 -translate-y-1/2 text-muted-foreground" />
<Input
className="pl-8 w-56"
placeholder="Search tools…"
placeholder={t("adminTools.searchPlaceholder")}
value={searchInput}
onChange={(e) => setSearchInput(e.target.value)}
/>
</div>
<Button
size="sm"
variant="destructive"
variant="outline"
className="text-destructive hover:bg-destructive hover:text-destructive-foreground"
disabled={selectedIds.length === 0 || trash.isPending}
onClick={() => setConfirmTrash(true)}
>
<Trash2 className="w-4 h-4 mr-2" /> Move to trash ({selectedIds.length})
<Trash2 className="w-4 h-4 mr-2" /> {t("adminTools.moveToTrash", { count: selectedIds.length })}
</Button>
</div>
</CardHeader>
@@ -135,7 +149,7 @@ export function AdminToolsTab() {
{[1, 2, 3].map((i) => <Skeleton key={i} className="h-12 w-full" />)}
</div>
) : allTools.length === 0 ? (
<p className="text-sm text-muted-foreground py-8 text-center">{search ? "No tools match your search." : "No tools yet."}</p>
<p className="text-sm text-muted-foreground py-8 text-center">{search ? t("adminTools.noMatch") : t("adminTools.noToolsYet")}</p>
) : (
<Table>
<TableHeader>
@@ -144,58 +158,58 @@ export function AdminToolsTab() {
<Checkbox
checked={selected.size === allTools.length && allTools.length > 0}
onCheckedChange={toggleAll}
aria-label="Select all"
aria-label={t("adminTools.selectAll")}
/>
</TableHead>
<TableHead>Name</TableHead>
<TableHead>Category</TableHead>
<TableHead>Rating</TableHead>
<TableHead>Created by</TableHead>
<TableHead>Created at</TableHead>
<TableHead className="text-right">Actions</TableHead>
<TableHead>{t("adminTools.name")}</TableHead>
<TableHead>{t("adminTools.category")}</TableHead>
<TableHead>{t("adminTools.rating")}</TableHead>
<TableHead>{t("adminTools.createdBy")}</TableHead>
<TableHead>{t("adminTools.createdAt")}</TableHead>
<TableHead className="text-right">{t("adminTools.actions")}</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{allTools.map((t: ToolWithStats) => (
<TableRow key={t.id} className={selected.has(t.id) ? "bg-muted/40" : undefined}>
{allTools.map((tool) => (
<TableRow key={tool.id} className={selected.has(tool.id) ? "bg-muted/40" : undefined}>
<TableCell>
<Checkbox
checked={selected.has(t.id)}
onCheckedChange={() => toggle(t.id)}
aria-label={`Select ${t.name}`}
checked={selected.has(tool.id)}
onCheckedChange={() => toggle(tool.id)}
aria-label={t("adminTools.selectName", { name: tool.name })}
/>
</TableCell>
<TableCell className="font-medium">{t.name}</TableCell>
<TableCell className="font-medium">{tool.name}</TableCell>
<TableCell>
<Badge variant="outline">{t.category}</Badge>
<Badge variant="outline">{tool.category}</Badge>
</TableCell>
<TableCell className="text-sm text-muted-foreground">
{t.ratingCount > 0 ? (
{tool.ratingCount > 0 ? (
<span className="inline-flex items-center gap-1">
<Star className="w-3 h-3 fill-amber-500 text-amber-500" />
{t.avgCombined != null ? t.avgCombined.toFixed(1) : "—"} ({t.ratingCount})
{tool.avgCombined != null ? tool.avgCombined.toFixed(1) : "—"} ({tool.ratingCount})
</span>
) : (
"—"
)}
</TableCell>
<TableCell className="text-sm text-muted-foreground">{t.createdBy ?? "—"}</TableCell>
<TableCell className="text-sm text-muted-foreground">{tool.createdBy ?? "—"}</TableCell>
<TableCell className="text-sm text-muted-foreground">
{format(new Date(t.createdAt), "dd.MM.yyyy")}
{format(new Date(tool.createdAt), "dd.MM.yyyy")}
</TableCell>
<TableCell className="text-right">
<div className="flex justify-end gap-1">
<Button variant="ghost" size="icon" className="h-8 w-8" asChild>
<Link href={`/tools/${t.id}`}><ExternalLink className="w-3.5 h-3.5" /></Link>
<Link href={`/tools/${tool.id}`}><ExternalLink className="w-3.5 h-3.5" /></Link>
</Button>
<Button variant="ghost" size="icon" className="h-8 w-8" asChild>
<Link href={`/tools/${t.id}/edit`}><Pencil className="w-3.5 h-3.5" /></Link>
<Link href={`/tools/${tool.id}/edit`}><Pencil className="w-3.5 h-3.5" /></Link>
</Button>
<Button
variant="ghost"
size="icon"
className="h-8 w-8 text-muted-foreground hover:text-destructive"
onClick={() => handleTrash([t.id])}
onClick={() => handleTrash([tool.id])}
disabled={trash.isPending}
>
<Trash2 className="w-3.5 h-3.5" />
@@ -212,22 +226,31 @@ export function AdminToolsTab() {
<AlertDialog open={confirmTrash} onOpenChange={setConfirmTrash}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Move {selectedIds.length} tool(s) to trash?</AlertDialogTitle>
<AlertDialogTitle>{t("adminTools.confirmTitle", { count: selectedIds.length })}</AlertDialogTitle>
<AlertDialogDescription>
The selected tools will be hidden from all public views and moved to the trash, where they can be restored or permanently deleted.
{t("adminTools.confirmSub")}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogCancel>{t("common.cancel")}</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
onClick={() => handleTrash(selectedIds)}
>
Move to trash
{t("adminTools.moveToTrashAction")}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
<ToolImportDialog
open={importOpen}
onOpenChange={setImportOpen}
onImported={() => {
toast({ title: t("adminTools.toastImportDone") });
invalidate();
}}
/>
</Card>
);
}
@@ -1,4 +1,5 @@
import { useState, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { Check, ChevronsUpDown } from "lucide-react";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button";
@@ -23,7 +24,8 @@ interface CategoryComboboxProps {
placeholder?: string;
}
export function CategoryCombobox({ value, onChange, placeholder = "Select or type a category..." }: CategoryComboboxProps) {
export function CategoryCombobox({ value, onChange, placeholder }: CategoryComboboxProps) {
const { t } = useTranslation();
const [open, setOpen] = useState(false);
const [inputValue, setInputValue] = useState(value);
@@ -49,6 +51,8 @@ export function CategoryCombobox({ value, onChange, placeholder = "Select or typ
(c) => c.toLowerCase() === inputValue.toLowerCase()
);
const resolvedPlaceholder = placeholder ?? t("category.placeholder");
function select(val: string) {
onChange(val);
setInputValue(val);
@@ -66,7 +70,7 @@ export function CategoryCombobox({ value, onChange, placeholder = "Select or typ
data-testid="button-category-combobox"
>
<span className={cn(!value && "text-muted-foreground")}>
{value || placeholder}
{value || resolvedPlaceholder}
</span>
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button>
@@ -74,7 +78,7 @@ export function CategoryCombobox({ value, onChange, placeholder = "Select or typ
<PopoverContent className="w-full p-0" align="start">
<Command shouldFilter={false}>
<CommandInput
placeholder="Search or enter new category..."
placeholder={t("category.searchPlaceholder")}
value={inputValue}
onValueChange={(v) => {
setInputValue(v);
@@ -84,10 +88,10 @@ export function CategoryCombobox({ value, onChange, placeholder = "Select or typ
/>
<CommandList>
{filtered.length === 0 && !showCreateOption && (
<CommandEmpty>No categories found.</CommandEmpty>
<CommandEmpty>{t("category.noCategories")}</CommandEmpty>
)}
{filtered.length > 0 && (
<CommandGroup heading="Known categories">
<CommandGroup heading={t("category.knownCategories")}>
{filtered.map((cat) => (
<CommandItem
key={cat}
@@ -104,13 +108,13 @@ export function CategoryCombobox({ value, onChange, placeholder = "Select or typ
</CommandGroup>
)}
{showCreateOption && (
<CommandGroup heading="Create new">
<CommandGroup heading={t("category.createNew")}>
<CommandItem
value={inputValue}
onSelect={() => select(inputValue.trim())}
data-testid="item-category-create-new"
>
<span className="text-primary font-medium">+ Create</span>
<span className="text-primary font-medium">{t("category.create")}</span>
<span className="ml-2 text-muted-foreground">&ldquo;{inputValue.trim()}&rdquo;</span>
</CommandItem>
</CommandGroup>
@@ -23,7 +23,7 @@ export function CompareBar({
if (tools.length === 0) return null;
return (
<div className="fixed bottom-4 left-1/2 -translate-x-1/2 z-50 w-[min(96vw,42rem)]">
<div className="rounded-xl border bg-popover/95 backdrop-blur shadow-lg p-3">
<div className="neon-glow rounded-xl border bg-popover/95 backdrop-blur shadow-lg p-3">
<div className="flex items-center gap-2">
<Scale className="w-4 h-4 text-muted-foreground shrink-0" />
<div className="flex items-center gap-1.5 flex-1 min-w-0 overflow-x-auto">
@@ -1,5 +1,6 @@
import { Slider } from "@/components/ui/slider";
import { Maximize2, Minimize2 } from "lucide-react";
import { useTranslation } from "react-i18next";
export type Density = "cozy" | "compact";
@@ -10,8 +11,13 @@ export function DensityToggle({
value: Density;
onValueChange: (d: Density) => void;
}) {
const { t } = useTranslation();
const densityLabel = value === "compact" ? t("common.densityCompact") : t("common.densityComfortable");
return (
<div className="flex items-center gap-2" title={`Density: ${value === "compact" ? "Compact" : "Comfortable"}`}>
<div
className="flex items-center gap-2"
title={t("common.densityTitle", { density: densityLabel })}
>
<Maximize2 className="w-4 h-4 text-muted-foreground" aria-hidden />
<Slider
className="w-16"
@@ -20,7 +26,7 @@ export function DensityToggle({
step={1}
value={[value === "compact" ? 1 : 0]}
onValueChange={([v]) => onValueChange(v === 1 ? "compact" : "cozy")}
aria-label="List density"
aria-label={t("common.listDensity")}
/>
<Minimize2 className="w-4 h-4 text-muted-foreground" aria-hidden />
</div>
@@ -1,32 +0,0 @@
import { HelpCircle } from "lucide-react";
import { Link } from "wouter";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
export function FieldHelp({
schema,
field,
children,
}: {
schema: string;
field: string;
children?: React.ReactNode;
}) {
const label = children ?? field;
return (
<Tooltip>
<TooltipTrigger asChild>
<Link
href={`/docs/reference/schemas/${schema}#${field}`}
target="_blank"
rel="noreferrer"
aria-label={`Help: ${label}`}
data-testid={`help-${schema}-${field}`}
className="inline-flex shrink-0 text-muted-foreground hover:text-foreground transition-colors"
>
<HelpCircle className="h-3.5 w-3.5" />
</Link>
</TooltipTrigger>
<TooltipContent>{label} Details in der Dokumentation</TooltipContent>
</Tooltip>
);
}
@@ -105,7 +105,7 @@ export function FilterPopover({
step={0.5}
value={[minRating ?? 0]}
onValueChange={([v]) => onChange({ minRating: v })}
aria-label="Minimum rating"
aria-label={t("filter.minRating")}
/>
<span className="text-sm tabular-nums w-8 text-right text-muted-foreground">
{minRating != null ? `${minRating.toFixed(1)}+` : t("filter.any")}
@@ -1,5 +1,7 @@
import { BookOpen } from "lucide-react";
import { HelpCircle } from "lucide-react";
import { Link } from "wouter";
import { useTranslation } from "react-i18next";
import { Button } from "@/components/ui/button";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
export function GuideHelp({
@@ -9,21 +11,24 @@ export function GuideHelp({
guide: string;
label: string;
}) {
const { t } = useTranslation();
return (
<Tooltip>
<TooltipTrigger asChild>
<Button asChild variant="outline" size="sm" className="gap-1.5 text-muted-foreground">
<Link
href={`/docs/handbook/${guide}`}
target="_blank"
rel="noreferrer"
aria-label={`Help: ${label}`}
aria-label={`${t("common.help")}: ${label}`}
data-testid={`guide-${guide}`}
className="inline-flex shrink-0 text-muted-foreground hover:text-foreground transition-colors"
>
<BookOpen className="h-3.5 w-3.5" />
<HelpCircle className="h-4 w-4" />
{t("common.help")}
</Link>
</Button>
</TooltipTrigger>
<TooltipContent>{label} Anleitung in der Dokumentation</TooltipContent>
<TooltipContent>{label} {t("common.guideTooltip")}</TooltipContent>
</Tooltip>
);
}
+14 -3
View File
@@ -1,5 +1,5 @@
import { Link, useLocation } from "wouter";
import { LayoutDashboard, Wrench, BarChart3, FileText, LogIn, LogOut, ShieldCheck, AlertTriangle, Search } from "lucide-react";
import { LayoutDashboard, Wrench, BarChart3, LogIn, LogOut, ShieldCheck, AlertTriangle, Search, Trash2, HelpCircle } from "lucide-react";
import { useTranslation } from "react-i18next";
import { useAuth } from "@/hooks/use-auth";
import { useGetVersion, getGetVersionQueryKey } from "@workspace/api-client-react";
@@ -39,12 +39,12 @@ export function Layout({ children }: { children: React.ReactNode }) {
{ href: "/", label: t("nav.home"), icon: LayoutDashboard },
{ href: "/tools", label: t("nav.browseTools"), icon: Wrench },
{ href: "/analytics", label: t("nav.analytics"), icon: BarChart3 },
{ href: "/docs", label: t("nav.docs"), icon: FileText },
];
const adminLinks = [
{ href: "/admin", label: t("nav.admin"), icon: ShieldCheck },
{ href: "/admin/redundancy", label: t("nav.redundancy"), icon: AlertTriangle },
{ href: "/trash", label: t("nav.trash"), icon: Trash2 },
];
function isActive(href: string) {
@@ -109,7 +109,18 @@ export function Layout({ children }: { children: React.ReactNode }) {
<SidebarFooter className="gap-2">
<UserMenu />
<div className="border-t pt-2 flex items-center justify-between text-[11px] text-muted-foreground px-2 group-data-[collapsible=icon]:justify-center">
<span className="font-medium group-data-[collapsible=icon]:hidden">toolr</span>
<div className="flex items-center gap-1.5 font-medium group-data-[collapsible=icon]:hidden">
<span>toolr</span>
<a
href="/docs"
title={t("nav.docs")}
aria-label={t("nav.docs")}
data-testid="button-help"
className="text-muted-foreground hover:text-primary transition-colors"
>
<HelpCircle className="w-3.5 h-3.5" />
</a>
</div>
{version?.commitSha ? (
<a
href={`https://git.kubebase.de/admin/tool-evaluator/commit/${version.commitSha}`}
@@ -38,9 +38,9 @@ export function MiniBars({
<span className="text-[10px] uppercase tracking-wide text-muted-foreground w-[3.5rem] shrink-0">
{label}
</span>
<div className="flex-1 h-1.5 rounded-full bg-muted overflow-hidden">
<div className="flex-1 h-1.5 rounded-full bg-foreground/5 overflow-hidden">
<div
className="h-full rounded-full bg-primary/70"
className="neon-bar h-full rounded-full"
style={{ width: `${pct(value)}%` }}
/>
</div>
@@ -67,17 +67,17 @@ export function MiniBarStack({
const a = num(usability);
return (
<div
className={cn("h-1.5 w-16 rounded-full bg-muted overflow-hidden flex", className)}
className={cn("h-1.5 w-16 rounded-full bg-foreground/5 overflow-hidden flex", className)}
title={`Usefulness ${u != null ? u.toFixed(1) : "N/A"} / Usability ${
a != null ? a.toFixed(1) : "N/A"
} (of 5)`}
>
<div
className="h-full bg-primary/80"
className="neon-bar h-full"
style={{ width: `${pct(usefulness)}%` }}
/>
<div
className="h-full bg-primary/40"
className="neon-bar h-full opacity-60"
style={{ width: `${pct(usability)}%` }}
/>
</div>
@@ -31,7 +31,7 @@ export function RatingStars({ value, max = 5, size = "md", interactive = false,
data-testid={`star-${starValue}`}
>
<Star
className={`${sizeClasses[size]} ${isFilled ? "fill-primary text-primary" : "text-muted-foreground/30"} transition-colors`}
className={`${sizeClasses[size]} ${isFilled ? "fill-primary text-primary [filter:drop-shadow(0_0_4px_hsl(var(--primary)/0.45))]" : "text-muted-foreground/30"} transition-colors group-hover:brightness-110 ${interactive ? "hover:[filter:drop-shadow(0_0_6px_hsl(var(--glow-1)/0.6))]" : ""}`}
/>
</button>
);
@@ -1,4 +1,5 @@
import { ChevronDown, Lightbulb, LightbulbOff, Monitor, Moon, Sun } from "lucide-react";
import { useTranslation } from "react-i18next";
import { Button } from "@/components/ui/button";
import {
DropdownMenu,
@@ -11,6 +12,7 @@ import {
import { useTheme, type Theme } from "@/hooks/use-theme";
export function ThemeToggle() {
const { t } = useTranslation();
const { theme, setTheme, resolvedTheme } = useTheme();
const isDark = resolvedTheme === "dark";
@@ -25,8 +27,8 @@ export function ThemeToggle() {
size="icon"
className="h-9 w-9"
onClick={quickToggle}
title={isDark ? "Switch to light theme" : "Switch to dark theme"}
aria-label={isDark ? "Switch to light theme" : "Switch to dark theme"}
title={isDark ? t("theme.switchLight") : t("theme.switchDark")}
aria-label={isDark ? t("theme.switchLight") : t("theme.switchDark")}
data-testid="button-theme-quick-toggle"
>
{isDark ? <Lightbulb className="w-4 h-4" /> : <LightbulbOff className="w-4 h-4" />}
@@ -37,27 +39,27 @@ export function ThemeToggle() {
variant="ghost"
size="icon"
className="h-9 w-9"
aria-label="Choose theme"
title="Choose theme"
aria-label={t("theme.chooseTitle")}
title={t("theme.chooseTitle")}
data-testid="button-theme-menu"
>
<ChevronDown className="w-4 h-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" sideOffset={6}>
<DropdownMenuLabel>Theme</DropdownMenuLabel>
<DropdownMenuLabel>{t("theme.title")}</DropdownMenuLabel>
<DropdownMenuRadioGroup value={theme} onValueChange={(v) => setTheme(v as Theme)}>
<DropdownMenuRadioItem value="light">
<Sun className="w-4 h-4 mr-2" />
Light
{t("theme.light")}
</DropdownMenuRadioItem>
<DropdownMenuRadioItem value="dark">
<Moon className="w-4 h-4 mr-2" />
Dark
{t("theme.dark")}
</DropdownMenuRadioItem>
<DropdownMenuRadioItem value="system">
<Monitor className="w-4 h-4 mr-2" />
System
{t("theme.system")}
</DropdownMenuRadioItem>
</DropdownMenuRadioGroup>
</DropdownMenuContent>
@@ -16,7 +16,7 @@ export function ToolCard({
watchlist?: { watched: boolean; onToggle: () => void };
}) {
return (
<Card className="hover-elevate transition-all flex flex-col h-full cursor-pointer hover:border-primary/50">
<Card className="hover-elevate transition-all flex flex-col h-full cursor-pointer hover:border-primary/50 hover:neon-glow-primary">
<Link href={`/tools/${tool.id}`} className="flex flex-col h-full p-0 m-0">
<CardHeader className="pb-3">
<div className="flex items-start gap-3 mb-2">
@@ -0,0 +1,196 @@
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { useImportTools, type ToolImportResponse } from "@workspace/api-client-react";
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
import { Textarea } from "@/components/ui/textarea";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Label } from "@/components/ui/label";
import { GuideHelp } from "@/components/guide-help";
import { Upload, FileUp, CheckCircle2, AlertCircle } from "lucide-react";
type Format = "auto" | "csv" | "json" | "yaml";
type Delimiter = "auto" | "comma" | "semicolon" | "tab";
export function ToolImportDialog({
open,
onOpenChange,
onImported,
}: {
open: boolean;
onOpenChange: (open: boolean) => void;
onImported: () => void;
}) {
const { t } = useTranslation();
const importTools = useImportTools();
const [format, setFormat] = useState<Format>("auto");
const [delimiter, setDelimiter] = useState<Delimiter>("auto");
const [data, setData] = useState("");
const [result, setResult] = useState<ToolImportResponse | null>(null);
function handleFile(file: File) {
const reader = new FileReader();
reader.onload = () => {
setData(String(reader.result ?? ""));
};
reader.readAsText(file);
}
function handleImport() {
importTools.mutate(
{ data: { format, delimiter, data } },
{
onSuccess: (res) => {
setResult(res);
if (res.imported > 0) onImported();
},
},
);
}
function handleClose(open: boolean) {
if (!importTools.isPending) {
onOpenChange(open);
if (!open) {
setData("");
setResult(null);
setFormat("auto");
setDelimiter("auto");
}
}
}
const canSubmit = data.trim().length > 0 && !importTools.isPending;
const placeholder =
format === "csv"
? t("adminTools.importTextareaPlaceholderCsv")
: format === "json"
? t("adminTools.importTextareaPlaceholderJson")
: format === "yaml"
? t("adminTools.importTextareaPlaceholderYaml")
: t("adminTools.importTextareaPlaceholderAuto");
return (
<Dialog open={open} onOpenChange={handleClose}>
<DialogContent className="sm:max-w-2xl">
<DialogHeader className="flex flex-row items-center justify-between gap-2">
<DialogTitle className="flex items-center gap-2">
<Upload className="w-4 h-4" />
{t("adminTools.importTitle")}
</DialogTitle>
<GuideHelp guide="administration" label={t("adminTools.importTitle")} />
</DialogHeader>
<div className="space-y-4 py-2">
<p className="text-sm text-muted-foreground">{t("adminTools.importSub")}</p>
<Tabs value={format} onValueChange={(v) => setFormat(v as Format)}>
<TabsList className="w-full grid grid-cols-4">
<TabsTrigger value="auto">{t("adminTools.importFormatAuto")}</TabsTrigger>
<TabsTrigger value="csv">CSV</TabsTrigger>
<TabsTrigger value="json">JSON</TabsTrigger>
<TabsTrigger value="yaml">YAML</TabsTrigger>
</TabsList>
<TabsContent value="auto" className="text-xs text-muted-foreground pt-2">
{t("adminTools.importFormatAutoSub")}
</TabsContent>
<TabsContent value="csv" className="pt-2 space-y-3">
<div className="space-y-2">
<Label>{t("adminTools.importDelimiter")}</Label>
<Select value={delimiter} onValueChange={(v) => setDelimiter(v as Delimiter)}>
<SelectTrigger className="w-52">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="auto">{t("adminTools.importDelimiterAuto")}</SelectItem>
<SelectItem value="comma">{t("adminTools.importDelimiterComma")}</SelectItem>
<SelectItem value="semicolon">{t("adminTools.importDelimiterSemicolon")}</SelectItem>
<SelectItem value="tab">{t("adminTools.importDelimiterTab")}</SelectItem>
</SelectContent>
</Select>
</div>
<p className="text-xs text-muted-foreground">{t("adminTools.importCsvSub")}</p>
</TabsContent>
<TabsContent value="json" className="pt-2 space-y-3">
<p className="text-xs text-muted-foreground">{t("adminTools.importJsonSub")}</p>
</TabsContent>
<TabsContent value="yaml" className="pt-2 space-y-3">
<p className="text-xs text-muted-foreground">{t("adminTools.importYamlSub")}</p>
</TabsContent>
</Tabs>
<div className="flex items-center gap-3">
<Button type="button" variant="outline" size="sm" className="gap-2" onClick={() => document.getElementById("tool-import-file")?.click()}>
<FileUp className="w-4 h-4" />
{t("adminTools.importFile")}
</Button>
<input
id="tool-import-file"
type="file"
accept=".csv,.json,.yaml,.yml,.txt,text/plain,application/json"
className="hidden"
onChange={(e) => {
const f = e.target.files?.[0];
if (f) handleFile(f);
e.target.value = "";
}}
/>
</div>
<Textarea
value={data}
onChange={(e) => setData(e.target.value)}
placeholder={placeholder}
className="min-h-[220px] font-mono text-sm"
data-testid="input-tool-import-data"
/>
{importTools.isError && (
<div className="flex items-start gap-2 rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive">
<AlertCircle className="w-4 h-4 mt-0.5 shrink-0" />
<span>{importTools.error?.data?.error ?? importTools.error?.message}</span>
</div>
)}
{result && (
<div className="space-y-2">
<div className="flex items-center gap-2 rounded-md border border-primary/20 bg-primary/5 px-3 py-2 text-sm">
<CheckCircle2 className="w-4 h-4 text-primary shrink-0" />
<span>{t("adminTools.importDone", { count: result.imported, total: result.total })}</span>
</div>
{result.errors.length > 0 && (
<div className="space-y-1">
<p className="text-sm font-medium flex items-center gap-1.5">
<AlertCircle className="w-4 h-4 text-amber-500" />
{t("adminTools.importErrors", { count: result.errors.length })}
</p>
<div className="max-h-40 overflow-y-auto rounded-md border bg-muted/40 divide-y divide-border">
{result.errors.map((err, i) => (
<div key={i} className="flex items-start gap-2 px-3 py-1.5 text-xs">
<span className="font-mono text-muted-foreground shrink-0">
{t("adminTools.importErrorRow", { row: err.row })}:
</span>
<span className="text-foreground break-words">{err.error}</span>
</div>
))}
</div>
</div>
)}
</div>
)}
</div>
<DialogFooter>
<Button variant="outline" onClick={() => handleClose(false)} disabled={importTools.isPending}>
{t("common.cancel")}
</Button>
<Button onClick={handleImport} disabled={!canSubmit}>
{importTools.isPending ? t("adminTools.importing") : t("adminTools.importButton")}
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
}
@@ -1,4 +1,5 @@
import { Link } from "wouter";
import { useTranslation } from "react-i18next";
import type { ToolWithStats } from "@workspace/api-client-react";
import { Badge } from "@/components/ui/badge";
@@ -6,6 +7,7 @@ import { RatingStars } from "@/components/rating-stars";
import { MiniBars } from "@/components/mini-bars";
export function ToolPreviewCard({ tool }: { tool: ToolWithStats }) {
const { t } = useTranslation();
return (
<div className="space-y-3">
<div>
@@ -22,7 +24,7 @@ export function ToolPreviewCard({ tool }: { tool: ToolWithStats }) {
<div className="space-y-1.5">
<div className="flex items-center justify-between text-xs">
<span className="text-muted-foreground">{tool.ratingCount} review{tool.ratingCount === 1 ? "" : "s"}</span>
<span className="text-muted-foreground">{t("browse.reviewCount", { count: tool.ratingCount })}</span>
<span className="font-semibold tabular-nums">
{tool.avgCombined != null ? tool.avgCombined.toFixed(1) : ""}/5
</span>
@@ -47,8 +49,7 @@ export function ToolPreviewCard({ tool }: { tool: ToolWithStats }) {
href={`/tools/${tool.id}`}
className="block w-full rounded-md border border-primary/40 bg-primary/5 px-3 py-1.5 text-center text-xs font-medium text-primary hover:bg-primary/10"
>
View details
</Link>
</div>
{t("common.viewDetails")}
</Link> </div>
);
}
@@ -12,14 +12,14 @@ const buttonVariants = cva(
variant: {
default:
// @replit: no hover, and add primary border
"bg-primary text-primary-foreground border border-primary-border",
"bg-primary text-primary-foreground border border-primary-border neon-glow-primary hover:brightness-105 focus-visible:brightness-105 transition-[box-shadow,filter]",
destructive:
"bg-destructive text-destructive-foreground shadow-sm border-destructive-border",
"bg-destructive text-destructive-foreground shadow-sm border-destructive-border shadow-[0_0_12px_-2px_hsl(var(--destructive)/0.5)] hover:brightness-105 transition-[box-shadow,filter]",
outline:
// @replit Shows the background color of whatever card / sidebar / accent background it is inside of.
// Inherits the current text color. Uses shadow-xs. no shadow on active
// No hover state
" border [border-color:var(--button-outline)] shadow-xs active:shadow-none ",
" border [border-color:var(--button-outline)] shadow-xs active:shadow-none hover:neon-glow focus-visible:neon-glow transition-shadow",
secondary:
// @replit border, no hover, no shadow, secondary border.
"border bg-secondary text-secondary-foreground border border-secondary-border ",
@@ -8,7 +8,7 @@ const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
<input
type={type}
className={cn(
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:shadow-[0_0_0_1px_hsl(var(--ring)/0.2)] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
className
)}
ref={ref}
@@ -12,13 +12,13 @@ const Progress = React.forwardRef<
<ProgressPrimitive.Root
ref={ref}
className={cn(
"relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
"relative h-2 w-full overflow-hidden rounded-full border border-border/60 bg-foreground/5",
className
)}
{...props}
>
<ProgressPrimitive.Indicator
className="h-full w-full flex-1 bg-primary transition-all"
className="neon-bar h-full w-full flex-1 transition-all"
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
/>
</ProgressPrimitive.Root>
@@ -487,7 +487,7 @@ function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">) {
}
const sidebarMenuButtonVariants = cva(
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:w-8! group-data-[collapsible=icon]:h-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[active=true]:neon-glow-primary data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:w-8! group-data-[collapsible=icon]:h-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
{
variants: {
variant: {
@@ -530,7 +530,7 @@ function SidebarMenuButton({
data-sidebar="menu-button"
data-size={size}
data-active={isActive}
className={cn(sidebarMenuButtonVariants({ variant, size }), className)}
className={cn("neon-sidebar-active", sidebarMenuButtonVariants({ variant, size }), className)}
{...props}
/>
)
@@ -6,7 +6,7 @@ function Skeleton({
}: React.HTMLAttributes<HTMLDivElement>) {
return (
<div
className={cn("animate-pulse rounded-md bg-primary/10", className)}
className={cn("loading-gradient rounded-md border border-border/60", className)}
{...props}
/>
)
@@ -7,7 +7,10 @@ function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
<Loader2Icon
role="status"
aria-label="Loading"
className={cn("size-4 animate-spin", className)}
className={cn(
"size-4 animate-spin text-primary [filter:drop-shadow(0_0_6px_hsl(var(--glow-1)/0.55))]",
className
)}
{...props}
/>
)
@@ -9,7 +9,7 @@ const Textarea = React.forwardRef<
return (
<textarea
className={cn(
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:shadow-[0_0_0_1px_hsl(var(--ring)/0.2)] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
className
)}
ref={ref}
@@ -20,7 +20,7 @@ const TooltipContent = React.forwardRef<
ref={ref}
sideOffset={sideOffset}
className={cn(
"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
"z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-xs text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-tooltip-content-transform-origin]",
className
)}
{...props}
@@ -17,6 +17,7 @@ import {
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog";
import { Label } from "@/components/ui/label";
import { PasswordInput } from "@/components/password-input";
import { GuideHelp } from "@/components/guide-help";
import { useToast } from "@/hooks/use-toast";
import { useChangeMyPassword, useGetPasswordRedirect, getGetPasswordRedirectQueryKey } from "@workspace/api-client-react";
import { useQueryClient } from "@tanstack/react-query";
@@ -163,8 +164,9 @@ export function UserMenu() {
<Dialog open={pwOpen} onOpenChange={setPwOpen}>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogHeader className="flex flex-row items-start justify-between gap-4 space-y-0">
<DialogTitle>{t("auth.changePassword")}</DialogTitle>
<GuideHelp guide="konto" label={t("auth.changePassword")} />
</DialogHeader>
{!user?.isLocal ? (
<div className="space-y-4 py-2">
@@ -193,7 +195,7 @@ export function UserMenu() {
<PasswordInput
value={newPassword}
onChange={(e) => setNewPassword(e.target.value)}
placeholder="min. 6 characters"
placeholder={t("auth.passwordMinLength")}
data-testid="input-new-password"
/>
</div>
@@ -1,12 +1,13 @@
import { LayoutGrid, List, Rows3 } from "lucide-react";
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group";
import { useTranslation } from "react-i18next";
export type ViewMode = "grid" | "table" | "rows";
const OPTIONS: { value: ViewMode; label: string; Icon: typeof LayoutGrid }[] = [
{ value: "grid", label: "Grid", Icon: LayoutGrid },
{ value: "table", label: "Table", Icon: List },
{ value: "rows", label: "Rows", Icon: Rows3 },
const OPTIONS: { value: ViewMode; labelKey: string; Icon: typeof LayoutGrid }[] = [
{ value: "grid", labelKey: "common.viewGrid", Icon: LayoutGrid },
{ value: "table", labelKey: "common.viewTable", Icon: List },
{ value: "rows", labelKey: "common.viewRows", Icon: Rows3 },
];
export function ViewToggle({
@@ -16,6 +17,7 @@ export function ViewToggle({
value: ViewMode;
onValueChange: (v: ViewMode) => void;
}) {
const { t } = useTranslation();
return (
<ToggleGroup
type="single"
@@ -25,10 +27,16 @@ export function ViewToggle({
}}
variant="outline"
size="sm"
aria-label="View mode"
aria-label={t("common.viewMode")}
>
{OPTIONS.map(({ value: v, labelKey, Icon }) => (
<ToggleGroupItem
key={v}
value={v}
aria-label={t(labelKey)}
title={t(labelKey)}
data-testid={`view-${v}`}
>
{OPTIONS.map(({ value: v, label, Icon }) => (
<ToggleGroupItem key={v} value={v} aria-label={label} title={label} data-testid={`view-${v}`}>
<Icon className="w-4 h-4" />
</ToggleGroupItem>
))}
+316 -6
View File
@@ -30,6 +30,7 @@
"currentPassword": "Aktuelles Passwort",
"newPassword": "Neues Passwort",
"confirmPassword": "Passwort bestätigen",
"passwordMinLength": "mind. 6 Zeichen",
"pwMismatch": "Passwörter stimmen nicht überein",
"pwTooShort": "Passwort muss mindestens 8 Zeichen haben",
"pwChanged": "Passwort geändert",
@@ -53,11 +54,22 @@
"loading": "Wird geladen…",
"all": "Alle",
"none": "Keine",
"language": "Sprache"
"language": "Sprache",
"viewDetails": "Details ansehen",
"guideTooltip": "Anleitung in der Dokumentation",
"help": "Hilfe",
"viewMode": "Ansichtsmodus",
"viewGrid": "Raster",
"viewTable": "Tabelle",
"viewRows": "Zeilen",
"listDensity": "Listendichte",
"densityCompact": "Kompakt",
"densityComfortable": "Komfortabel",
"densityTitle": "Dichte: {{density}}"
},
"home": {
"welcome": "Willkommen bei toolr",
"tagline": "Die Community-Plattform, auf der Ingenieure die Tools, die sie täglich nutzen, ehrlich bewerten.",
"tagline": "Bewerte dein Tool.",
"totalTools": "Tools gesamt",
"totalRatings": "Bewertungen gesamt",
"avgRating": "Ø Bewertung",
@@ -80,6 +92,8 @@
"category": "Kategorie",
"rating": "Bewertung",
"reviews": "Bewertungen",
"reviewCount_one": "{{count}} Bewertung",
"reviewCount_other": "{{count}} Bewertungen",
"noToolsFound": "Keine Tools gefunden",
"noToolsMatch": "Wir konnten keine Tools finden, die zu deinen Filtern passen. Versuche, die Suchkriterien anzupassen, oder füge ein neues Tool hinzu.",
"addTool": "Tool hinzufügen",
@@ -87,6 +101,7 @@
"compareCount": "Vergleichen ({{count}})",
"addToCompare": "Zum Vergleich hinzufügen",
"removeFromCompare": "Aus dem Vergleich entfernen",
"compareLimitReached": "Maximal 9 Tools können verglichen werden.",
"comparePremiumTitle": "Vergleichen ist ein Premium-Feature",
"comparePremiumSub": "Das Vergleichen von Tools nebeneinander ist für Premium- und Enterprise-Nutzer verfügbar. Erweitere deinen Plan, um es freizuschalten.",
"notNow": "Später",
@@ -103,7 +118,9 @@
"features": "Funktionen",
"minRating": "Mindestbewertung",
"any": "Beliebig",
"clearFilters": "Filter zurücksetzen"
"clearFilters": "Filter zurücksetzen",
"removeFeature": "Funktion entfernen: {{feature}}",
"removeMinRating": "Mindestbewertung entfernen"
},
"detail": {
"ratingBreakdown": "Bewertungsaufschlüsselung",
@@ -133,7 +150,65 @@
"deleteToTrash": "Dies verschiebt {{name}} in den Papierkorb. Es kann später wiederhergestellt werden.",
"deletePermanent": "Dies entfernt {{name}} dauerhaft inklusive aller Bewertungen. Das kann nicht rückgängig gemacht werden.",
"deleting": "Löschen…",
"deleteAction": "Löschen"
"deleteAction": "Löschen",
"invalidToolId": "Ungültige Tool-ID",
"backToBrowse": "Zurück zur Übersicht",
"keyFeatures": "Wichtige Funktionen",
"toolNotFound": "Tool nicht gefunden.",
"similarTools": "Ähnliche Tools",
"noSimilarTools": "Keine ähnlichen Tools gefunden.",
"linkTool": "Tool verknüpfen",
"linkSimilarTool": "Ähnliches Tool verknüpfen",
"linkSimilarToolSub": "Verknüpfe dieses Tool manuell mit einem anderen Tool.",
"toolId": "Tool-ID",
"toolIdPlaceholder": "Ziel-Tool-ID eingeben",
"relationType": "Beziehungstyp",
"relationSimilar": "Ähnlich",
"relationReplaces": "Ersetzt",
"relationSupersededBy": "Ersetzt durch",
"notesOptional": "Notizen (optional)",
"notesPlaceholder": "Warum sind diese Tools verwandt?",
"createLink": "Verknüpfung erstellen",
"noCostInfo": "Noch keine Kosteninformationen hinzugefügt.",
"costDialogSub": "Verwalte die Lizenzkosteninformationen für dieses Tool.",
"licenseType": "Lizenztyp",
"licenseFree": "Kostenlos",
"licenseSubscription": "Abonnement",
"licenseOneTime": "Einmalig",
"licenseUsageBased": "Nutzungsbasiert",
"billingPeriod": "Abrechnungszeitraum",
"billingMonthly": "Monatlich",
"billingQuarterly": "Quartalsweise",
"billingYearly": "Jährlich",
"costLabel": "Kosten",
"currency": "Währung",
"costNotes": "Notizen",
"costNotesPlaceholder": "Abrechnungsdetails, Vertragsinformationen…",
"commentOptional": "Kommentar (optional)",
"commentLabel": "Kommentar",
"commentPlaceholder": "Was denkst du über dieses Tool?",
"nameOptional": "Name (optional)",
"nameLabel": "Name",
"anonymousPlaceholder": "Anonym",
"anonymousEngineer": "Anonymer Benutzer",
"beFirstToReview": "Sei der Erste, der seine Gedanken zu diesem Tool teilt.",
"shareExperience": "Teile deine Erfahrung mit {{name}}",
"score": "Punktestand",
"toastRelationCreated": "Beziehung erstellt",
"toastRelationFailed": "Beziehung konnte nicht erstellt werden",
"toastRelationDeleted": "Beziehung gelöscht",
"toastRelationDeleteFailed": "Beziehung konnte nicht gelöscht werden",
"toastCostUpdated": "Kosten aktualisiert",
"toastCostAdded": "Kosten hinzugefügt",
"toastCostFailed": "Kosten konnten nicht gespeichert werden",
"toastCostDeleted": "Kosten gelöscht",
"toastCostDeleteFailed": "Kosten konnten nicht gelöscht werden",
"toastRatingSubmitted": "Bewertung abgesendet",
"toastRatingThanks": "Danke für dein Feedback!",
"toastRatingFailed": "Bewertung konnte nicht abgesendet werden",
"toastToolDeleted": "Tool gelöscht",
"toastDeleteFailed": "Löschen fehlgeschlagen",
"unexpectedError": "Ein unerwarteter Fehler ist aufgetreten."
},
"compare": {
"title": "Tools vergleichen",
@@ -176,7 +251,29 @@
"deletePermanently": "Endgültig löschen",
"emptyTrash": "Papierkorb leeren",
"deletedAt": "Gelöscht am",
"deletedBy": "Gelöscht von"
"deletedBy": "Gelöscht von",
"name": "Name",
"category": "Kategorie",
"actions": "Aktionen",
"selectAll": "Alle auswählen",
"selectName": "{{name}} auswählen",
"restoreAction": "Wiederherstellen",
"deleteAction": "Löschen",
"deleteConfirmTitle": "{{count}} Tool(s) endgültig löschen?",
"deleteConfirmSub": "Dies entfernt die ausgewählten Tools dauerhaft inklusive aller Bewertungen, Kosten und Beziehungen. Das kann nicht rückgängig gemacht werden.",
"emptyConfirmTitle": "Papierkorb leeren?",
"emptyConfirmSub": "Dies entfernt alle {{count}} Tool(s) im Papierkorb dauerhaft inklusive ihrer Bewertungen, Kosten und Beziehungen. Das kann nicht rückgängig gemacht werden.",
"toastRestored": "Tools wiederhergestellt",
"toastRestoredSub": "{{count}} Tool(s) wiederhergestellt.",
"toastRestoreFailed": "Wiederherstellen fehlgeschlagen",
"toastDeleted": "Tools gelöscht",
"toastDeletedSub": "{{count}} Tool(s) endgültig entfernt.",
"toastDeleteFailed": "Löschen fehlgeschlagen",
"toastEmptied": "Papierkorb geleert",
"toastEmptiedSub": "{{count}} Tool(s) endgültig entfernt.",
"toastEmptyFailed": "Papierkorb konnte nicht geleert werden",
"searchPlaceholder": "Tools suchen…",
"toolCount": "{{count}} Tool(s)"
},
"notFound": {
"text": "Diese Seite existiert nicht.",
@@ -209,7 +306,9 @@
"parameter": "Parameter",
"noResults": "Keine Treffer",
"fields": "Felder",
"fieldHelpHint": "Hinweis: Formular-Felder verlinken per ?-Icon direkt zu den jeweiligen Zeilen dieser Tabelle."
"name": "Name",
"in": "In",
"requestBody": "Request-Body"
},
"command": {
"navigate": "Navigation",
@@ -217,5 +316,216 @@
"tools": "Tools",
"noResults": "Keine Tools für „{{query}}“ gefunden.",
"startTyping": "Beginne zu tippen, um Tools zu suchen."
},
"admin": {
"accessRequired": "Admin-Zugriff erforderlich",
"accessRequiredSub": "Du benötigst Admin-Rechte, um diese Seite anzusehen.",
"goHome": "Zur Startseite",
"panel": "Admin-Bereich",
"panelSub": "Benutzer verwalten und Systemänderungen einsehen.",
"redundancyDashboard": "Redundanz-Dashboard",
"tabUsers": "Benutzer",
"tabTools": "Tools",
"tabAudit": "Audit-Log",
"tabSystem": "System",
"localUsers": "Lokale Benutzer",
"localUsersSub": "Konten für die lokale Authentifizierung verwalten.",
"addUser": "Benutzer hinzufügen",
"noUsersYet": "Noch keine Benutzer.",
"auditLog": "Audit-Log",
"auditLogSub": "Alle vom System protokollierten Erstellungs-, Aktualisierungs- und Löschvorgänge.",
"by": "von",
"noAuditEntries": "Noch keine Audit-Einträge.",
"system": "System",
"systemSub": "Build-Informationen der aktuell laufenden Bereitstellung.",
"version": "Version",
"commit": "Commit",
"buildDate": "Build-Datum",
"trashRetention": "Papierkorb-Aufbewahrung",
"days": "Tage",
"keepForever": "Für immer behalten",
"createNewUser": "Neuen Benutzer erstellen",
"username": "Benutzername",
"password": "Passwort",
"emailOptional": "E-Mail (optional)",
"role": "Rolle",
"roleUser": "Benutzer",
"roleAdmin": "Admin",
"plan": "Plan",
"planFree": "Kostenlos",
"planPremium": "Premium",
"planEnterprise": "Enterprise",
"creating": "Erstelle…",
"createUser": "Benutzer erstellen",
"editUser": "Benutzer bearbeiten — {{username}}",
"setPassword": "Passwort festlegen",
"resetsPassword": "Setzt das Passwort des Benutzers sofort zurück.",
"idpManaged": "Das Passwort wird vom Identity-Provider (Keycloak) verwaltet. Setze es dort zurück.",
"setting": "Setze…",
"deleteUser": "Benutzer löschen",
"deleteUserConfirm": "Bist du sicher, dass du {{username}} löschen möchtest? Das kann nicht rückgängig gemacht werden.",
"minPasswordPlaceholder": "min. 6 Zeichen",
"usernamePlaceholder": "benutzername",
"emailPlaceholder": "user@example.com",
"toastUserCreated": "Benutzer erstellt",
"toastUserCreatedSub": "{{username}} wurde erstellt.",
"toastUserCreateFailed": "Benutzer konnte nicht erstellt werden",
"toastUserUpdated": "Benutzer aktualisiert",
"toastUserUpdateFailed": "Benutzer konnte nicht aktualisiert werden",
"toastPwTooShort": "Passwort zu kurz",
"toastPwTooShortSub": "Mindestens 6 Zeichen.",
"toastPwUpdated": "Passwort aktualisiert",
"toastPwUpdatedSub": "Passwort für {{username}} wurde festgelegt.",
"toastPwSetFailed": "Passwort konnte nicht festgelegt werden",
"toastUserDeleted": "Benutzer gelöscht",
"toastUserDeletedSub": "{{username}} wurde entfernt.",
"toastUserDeleteFailed": "Benutzer konnte nicht gelöscht werden"
},
"adminTools": {
"accessRequired": "Admin-Zugriff erforderlich.",
"allTools": "Alle Tools",
"toolCount": "{{count}} Tool(s)",
"selected": "{{count}} ausgewählt",
"searchPlaceholder": "Tools suchen…",
"moveToTrash": "In den Papierkorb verschieben ({{count}})",
"noMatch": "Keine Tools entsprechen deiner Suche.",
"noToolsYet": "Noch keine Tools.",
"selectAll": "Alle auswählen",
"selectName": "{{name}} auswählen",
"name": "Name",
"category": "Kategorie",
"rating": "Bewertung",
"createdBy": "Erstellt von",
"createdAt": "Erstellt am",
"actions": "Aktionen",
"confirmTitle": "{{count}} Tool(s) in den Papierkorb verschieben?",
"confirmSub": "Die ausgewählten Tools werden aus allen öffentlichen Ansichten entfernt und in den Papierkorb verschoben, wo sie wiederhergestellt oder endgültig gelöscht werden können.",
"moveToTrashAction": "In den Papierkorb verschieben",
"toastMoved": "Tools in den Papierkorb verschoben",
"toastMovedSub": "{{count}} Tool(s) in den Papierkorb verschoben.",
"toastMoveFailed": "Verschieben in den Papierkorb fehlgeschlagen",
"importTitle": "Tools importieren",
"importSub": "Mehrere Tools auf einmal importieren — als CSV, JSON oder YAML (Premium-Feature).",
"importButton": "Importieren",
"importFormatAuto": "Auto",
"importFormatAutoSub": "Das Format wird automatisch erkannt (CSV, JSON oder YAML).",
"importDelimiter": "CSV-Trenner",
"importDelimiterAuto": "Automatisch",
"importDelimiterComma": "Komma",
"importDelimiterSemicolon": "Semikolon",
"importDelimiterTab": "Tabulator",
"importCsvSub": "Spalten: name, description, category, websiteUrl, iconUrl, features, tags. Features/Tags durch | getrennt. Erste Zeile enthält die Spaltennamen.",
"importJsonSub": "JSON-Objekt oder Array von Objekten mit den Feldern name, description, category, websiteUrl, iconUrl, features, tags.",
"importYamlSub": "YAML-Liste von Objekten (oder ein einzelnes Objekt) mit den Feldern name, description, category, websiteUrl, iconUrl, features, tags.",
"importFile": "Datei laden",
"importTextareaPlaceholder": "name;description;category;features;tags\nMein Tool;Eine tolle Beschreibung;Monitoring;Deployment|Open Source;devops",
"importTextareaPlaceholderCsv": "name;description;category;features;tags\nMein Tool;Eine tolle Beschreibung;Monitoring;Deployment|Open Source;devops",
"importTextareaPlaceholderJson": "[\n {\n \"name\": \"Mein Tool\",\n \"description\": \"Eine tolle Beschreibung\",\n \"category\": \"Monitoring\",\n \"features\": [\"Deployment\", \"Open Source\"],\n \"tags\": [\"devops\"]\n }\n]",
"importTextareaPlaceholderYaml": "- name: Mein Tool\n description: Eine tolle Beschreibung\n category: Monitoring\n features:\n - Deployment\n - Open Source\n tags:\n - devops",
"importTextareaPlaceholderAuto": "name;description;category\nMein Tool;Eine tolle Beschreibung;Monitoring",
"importing": "Wird importiert…",
"importDone": "{{count}} von {{total}} Tools erfolgreich importiert.",
"importErrors": "{{count}} Zeilen mit Fehlern:",
"importErrorRow": "Zeile {{row}}",
"toastImportDone": "Tools erfolgreich importiert"
},
"analytics": {
"title": "Plattform-Analysen",
"subtitle": "Makro-Einblicke in die Leistung der Tools und das Engagement der Community.",
"totalToolsIndexed": "Indexierte Tools gesamt",
"totalRatingsCast": "Abgegebene Bewertungen gesamt",
"activeCategories": "Aktive Kategorien",
"avgGlobalScore": "Ø Globaler Punktestand",
"top8Tools": "Top 8 Tools nach kombiniertem Punktestand",
"top8ToolsSub": "Die bestbewerteten Tools der Plattform",
"toolsByCategory": "Tools nach Kategorie",
"toolsByCategorySub": "Verteilung der Tools auf Kategorien",
"globalRatingDistribution": "Globale Bewertungsverteilung",
"globalRatingDistributionSub": "Wie Benutzer über alle Tools abstimmen",
"radarTools": "Tools"
},
"redundancy": {
"title": "Tool-Analyse & Empfehlungen",
"subtitle": "Automatische Redundanz-Erkennung mit Kosten- und Bewertungsvergleich. Admins können manuell bestätigen, welches Tool die bessere Wahl ist.",
"toolsComparisons": "{{tools}} Tools, {{pairs}} Vergleiche",
"totalMonthly": "/Monat gesamt",
"reviews": "Bewertungen",
"features": "Features",
"comparisonsTitle": "Vergleiche & Empfehlungen",
"vs": "gegen",
"noTools": "Keine Tools gefunden.",
"perMonth": "/Monat",
"toastEvalSaved": "Auswertung gespeichert",
"toastEvalFailed": "Auswertung konnte nicht gespeichert werden"
},
"toolForm": {
"backToBrowse": "Zurück zur Übersicht",
"backToTool": "Zurück zum Tool",
"addTitle": "Neues Tool hinzufügen",
"addSubtitle": "Reiche ein Tool ein, das du nutzt, damit die Community es bewerten kann.",
"editTitle": "Tool bearbeiten",
"editSubtitle": "Aktualisiere Tool-Details und Metadaten.",
"signInRequired": "Anmeldung erforderlich",
"signInRequiredSub": "Du musst angemeldet sein, um ein Tool einzureichen.",
"toolDetails": "Tool-Details",
"toolDetailsNewSub": "Gib die grundlegenden Informationen zum Tool an.",
"toolDetailsEditSub": "Ändere die Tool-Informationen unten.",
"name": "Name",
"nameMin": "Name muss mindestens 2 Zeichen haben",
"category": "Kategorie",
"categoryRequired": "Kategorie ist erforderlich",
"websiteUrl": "Website-URL",
"websiteUrlOptional": "Website-URL (optional)",
"iconUrl": "Icon-/Logo-URL",
"iconUrlOptional": "Icon-/Logo-URL (optional)",
"iconPreview": "Icon-Vorschau",
"description": "Beschreibung",
"descriptionMin": "Beschreibung muss mindestens 10 Zeichen haben",
"invalidUrl": "Muss eine gültige URL sein",
"features": "Features",
"featuresNewSub": "Liste die wichtigsten Funktionen auf. Vorhandene Features anderer Tools sind auswählbar.",
"featuresEditSub": "Wichtige Funktionen dieses Tools. Vorhandene Features anderer Tools sind auswählbar.",
"addFeature": "Feature hinzufügen",
"noFeatures": "Keine Features hinzugefügt.",
"featurePlaceholder": "z. B. Echtzeit-Zusammenarbeit",
"tags": "Tags",
"tagsNewSub": "Schlüsselwörter, um dieses Tool zu finden. Vorhandene Tags anderer Tools sind auswählbar.",
"tagsEditSub": "Schlüsselwörter für dieses Tool. Vorhandene Tags anderer Tools sind auswählbar.",
"addTag": "Tag hinzufügen",
"tag": "Tag",
"namePlaceholder": "z. B. React, Next.js, Postgres",
"urlPlaceholder": "https://…",
"logoPlaceholder": "https://example.com/logo.png",
"descriptionPlaceholderNew": "Was macht dieses Tool? Warum nutzen es Menschen?",
"descriptionPlaceholderEdit": "Was macht dieses Tool?",
"addingTool": "Füge Tool hinzu…",
"submitTool": "Tool einreichen",
"saving": "Speichere…",
"saveChanges": "Änderungen speichern",
"toastAdded": "Tool erfolgreich hinzugefügt",
"toastAddedSub": "Dein Tool ist jetzt zur Bewertung verfügbar.",
"toastAddFailed": "Tool konnte nicht hinzugefügt werden",
"toastUpdated": "Tool aktualisiert",
"toastUpdatedSub": "Änderungen erfolgreich gespeichert.",
"toastUpdateFailed": "Tool konnte nicht aktualisiert werden",
"tagsHelp": "Schlüsselwörter, die helfen, dieses Tool zu finden. Vorhandene Tags anderer Tools sind auswählbar.",
"tagPlaceholder": "Tag"
},
"category": {
"placeholder": "Kategorie auswählen oder eingeben…",
"searchPlaceholder": "Kategorie suchen oder neue eingeben…",
"noCategories": "Keine Kategorien gefunden.",
"knownCategories": "Bekannte Kategorien",
"createNew": "Neu erstellen",
"create": "+ Erstellen"
},
"theme": {
"title": "Design",
"light": "Hell",
"dark": "Dunkel",
"system": "System",
"chooseTitle": "Design auswählen",
"switchLight": "Zum hellen Design wechseln",
"switchDark": "Zum dunklen Design wechseln"
}
}
+317 -7
View File
@@ -30,6 +30,7 @@
"currentPassword": "Current password",
"newPassword": "New password",
"confirmPassword": "Confirm password",
"passwordMinLength": "min. 6 characters",
"pwMismatch": "Passwords do not match",
"pwTooShort": "Password must be at least 8 characters",
"pwChanged": "Password changed",
@@ -53,11 +54,22 @@
"loading": "Loading…",
"all": "All",
"none": "None",
"language": "Language"
"language": "Language",
"viewDetails": "View details",
"guideTooltip": "Guide in the documentation",
"help": "Help",
"viewMode": "View mode",
"viewGrid": "Grid",
"viewTable": "Table",
"viewRows": "Rows",
"listDensity": "List density",
"densityCompact": "Compact",
"densityComfortable": "Comfortable",
"densityTitle": "Density: {{density}}"
},
"home": {
"welcome": "Welcome to toolr",
"tagline": "The community hub where engineers honestly rate the tools they use daily.",
"tagline": "Rate your Tool.",
"totalTools": "Total Tools",
"totalRatings": "Total Ratings",
"avgRating": "Avg Rating",
@@ -80,6 +92,8 @@
"category": "Category",
"rating": "Rating",
"reviews": "Reviews",
"reviewCount_one": "{{count}} review",
"reviewCount_other": "{{count}} reviews",
"noToolsFound": "No tools found",
"noToolsMatch": "We couldn't find any tools matching your current filters. Try adjusting your search criteria or add a new tool.",
"addTool": "Add Tool",
@@ -87,6 +101,7 @@
"compareCount": "Compare ({{count}})",
"addToCompare": "Add to compare",
"removeFromCompare": "Remove from compare",
"compareLimitReached": "A maximum of 9 tools can be compared.",
"comparePremiumTitle": "Compare is a Premium feature",
"comparePremiumSub": "Comparing tools side-by-side is available to Premium and Enterprise users. Upgrade your plan to unlock it.",
"notNow": "Not now",
@@ -103,7 +118,9 @@
"features": "Features",
"minRating": "Min. rating",
"any": "Any",
"clearFilters": "Clear filters"
"clearFilters": "Clear filters",
"removeFeature": "Remove feature: {{feature}}",
"removeMinRating": "Remove min rating"
},
"detail": {
"ratingBreakdown": "Rating Breakdown",
@@ -133,7 +150,65 @@
"deleteToTrash": "This will move {{name}} to the trash. It can be restored later.",
"deletePermanent": "This will permanently remove {{name}} and all its ratings. This cannot be undone.",
"deleting": "Deleting…",
"deleteAction": "Delete"
"deleteAction": "Delete",
"invalidToolId": "Invalid Tool ID",
"backToBrowse": "Back to browse",
"keyFeatures": "Key Features",
"toolNotFound": "Tool not found.",
"similarTools": "Similar Tools",
"noSimilarTools": "No similar tools found.",
"linkTool": "Link Tool",
"linkSimilarTool": "Link Similar Tool",
"linkSimilarToolSub": "Manually link this tool to another tool.",
"toolId": "Tool ID",
"toolIdPlaceholder": "Enter target tool ID",
"relationType": "Relation Type",
"relationSimilar": "Similar",
"relationReplaces": "Replaces",
"relationSupersededBy": "Superseded By",
"notesOptional": "Notes (Optional)",
"notesPlaceholder": "Why are these tools related?",
"createLink": "Create Link",
"noCostInfo": "No cost information added yet.",
"costDialogSub": "Manage license cost information for this tool.",
"licenseType": "License Type",
"licenseFree": "Free",
"licenseSubscription": "Subscription",
"licenseOneTime": "One-Time",
"licenseUsageBased": "Usage-Based",
"billingPeriod": "Billing Period",
"billingMonthly": "Monthly",
"billingQuarterly": "Quarterly",
"billingYearly": "Yearly",
"costLabel": "Cost",
"currency": "Currency",
"costNotes": "Notes",
"costNotesPlaceholder": "Billing details, contract info...",
"commentOptional": "Comment (Optional)",
"commentLabel": "Comment",
"commentPlaceholder": "What do you think about this tool?",
"nameOptional": "Name (Optional)",
"nameLabel": "Name",
"anonymousPlaceholder": "Anonymous",
"anonymousEngineer": "Anonymous User",
"beFirstToReview": "Be the first to share your thoughts on this tool.",
"shareExperience": "Share your experience with {{name}}",
"score": "Score",
"toastRelationCreated": "Relation created",
"toastRelationFailed": "Failed to create relation",
"toastRelationDeleted": "Relation deleted",
"toastRelationDeleteFailed": "Failed to delete relation",
"toastCostUpdated": "Cost updated",
"toastCostAdded": "Cost added",
"toastCostFailed": "Failed to save cost",
"toastCostDeleted": "Cost deleted",
"toastCostDeleteFailed": "Failed to delete cost",
"toastRatingSubmitted": "Rating submitted",
"toastRatingThanks": "Thank you for your feedback!",
"toastRatingFailed": "Failed to submit rating",
"toastToolDeleted": "Tool deleted",
"toastDeleteFailed": "Failed to delete",
"unexpectedError": "An unexpected error occurred."
},
"compare": {
"title": "Compare Tools",
@@ -176,7 +251,29 @@
"deletePermanently": "Delete permanently",
"emptyTrash": "Empty trash",
"deletedAt": "Deleted at",
"deletedBy": "Deleted by"
"deletedBy": "Deleted by",
"name": "Name",
"category": "Category",
"actions": "Actions",
"selectAll": "Select all",
"selectName": "Select {{name}}",
"restoreAction": "Restore",
"deleteAction": "Delete",
"deleteConfirmTitle": "Delete {{count}} tool(s) permanently?",
"deleteConfirmSub": "This permanently removes the selected tools along with all their ratings, costs and relations. This cannot be undone.",
"emptyConfirmTitle": "Empty the trash?",
"emptyConfirmSub": "This permanently removes all {{count}} tool(s) in the trash along with their ratings, costs and relations. This cannot be undone.",
"toastRestored": "Tools restored",
"toastRestoredSub": "{{count}} tool(s) restored.",
"toastRestoreFailed": "Failed to restore",
"toastDeleted": "Tools deleted",
"toastDeletedSub": "{{count}} tool(s) permanently removed.",
"toastDeleteFailed": "Failed to delete",
"toastEmptied": "Trash emptied",
"toastEmptiedSub": "{{count}} tool(s) permanently removed.",
"toastEmptyFailed": "Failed to empty trash",
"searchPlaceholder": "Search tools…",
"toolCount": "{{count}} tool(s)"
},
"notFound": {
"text": "This page doesn't exist.",
@@ -191,7 +288,7 @@
"latest": "Latest",
"repo": "Repository",
"nav": "Documentation",
"guides": "Guide",
"guides": "Guides",
"endpoints": "Endpoints",
"schemas": "Data models",
"releases": "Release notes",
@@ -209,7 +306,9 @@
"parameter": "Parameter",
"noResults": "No results",
"fields": "Fields",
"fieldHelpHint": "Note: form fields link via the ? icon directly to the respective rows of this table."
"name": "Name",
"in": "In",
"requestBody": "Request Body"
},
"command": {
"navigate": "Navigate",
@@ -217,5 +316,216 @@
"tools": "Tools",
"noResults": "No tools found for \"{{query}}\".",
"startTyping": "Start typing to search tools."
},
"admin": {
"accessRequired": "Admin Access Required",
"accessRequiredSub": "You need admin rights to view this page.",
"goHome": "Go Home",
"panel": "Admin Panel",
"panelSub": "Manage users and review system changes.",
"redundancyDashboard": "Redundancy Dashboard",
"tabUsers": "Users",
"tabTools": "Tools",
"tabAudit": "Audit Log",
"tabSystem": "System",
"localUsers": "Local Users",
"localUsersSub": "Manage accounts for local authentication.",
"addUser": "Add User",
"noUsersYet": "No users yet.",
"auditLog": "Audit Log",
"auditLogSub": "All create, update and delete operations tracked by the system.",
"by": "by",
"noAuditEntries": "No audit entries yet.",
"system": "System",
"systemSub": "Build information of the currently live deployment.",
"version": "Version",
"commit": "Commit",
"buildDate": "Build date",
"trashRetention": "Trash retention",
"days": "days",
"keepForever": "Keep forever",
"createNewUser": "Create New User",
"username": "Username",
"password": "Password",
"emailOptional": "Email (Optional)",
"role": "Role",
"roleUser": "User",
"roleAdmin": "Admin",
"plan": "Plan",
"planFree": "Free",
"planPremium": "Premium",
"planEnterprise": "Enterprise",
"creating": "Creating…",
"createUser": "Create User",
"editUser": "Edit User — {{username}}",
"setPassword": "Set Password",
"resetsPassword": "Resets the user's password immediately.",
"idpManaged": "Password is managed by the identity provider (Keycloak). Reset it there.",
"setting": "Setting…",
"deleteUser": "Delete User",
"deleteUserConfirm": "Are you sure you want to delete {{username}}? This cannot be undone.",
"minPasswordPlaceholder": "min. 6 characters",
"usernamePlaceholder": "username",
"emailPlaceholder": "user@example.com",
"toastUserCreated": "User created",
"toastUserCreatedSub": "{{username}} has been created.",
"toastUserCreateFailed": "Failed to create user",
"toastUserUpdated": "User updated",
"toastUserUpdateFailed": "Failed to update user",
"toastPwTooShort": "Password too short",
"toastPwTooShortSub": "Minimum 6 characters.",
"toastPwUpdated": "Password updated",
"toastPwUpdatedSub": "Password for {{username}} has been set.",
"toastPwSetFailed": "Failed to set password",
"toastUserDeleted": "User deleted",
"toastUserDeletedSub": "{{username}} has been removed.",
"toastUserDeleteFailed": "Failed to delete user"
},
"adminTools": {
"accessRequired": "Admin access required.",
"allTools": "All Tools",
"toolCount": "{{count}} tool(s)",
"selected": "{{count}} selected",
"searchPlaceholder": "Search tools…",
"moveToTrash": "Move to trash ({{count}})",
"noMatch": "No tools match your search.",
"noToolsYet": "No tools yet.",
"selectAll": "Select all",
"selectName": "Select {{name}}",
"name": "Name",
"category": "Category",
"rating": "Rating",
"createdBy": "Created by",
"createdAt": "Created at",
"actions": "Actions",
"confirmTitle": "Move {{count}} tool(s) to trash?",
"confirmSub": "The selected tools will be hidden from all public views and moved to the trash, where they can be restored or permanently deleted.",
"moveToTrashAction": "Move to trash",
"toastMoved": "Tools moved to trash",
"toastMovedSub": "{{count}} tool(s) moved to trash.",
"toastMoveFailed": "Failed to move to trash",
"importTitle": "Import tools",
"importSub": "Import multiple tools at once — as CSV, JSON or YAML (premium feature).",
"importButton": "Import",
"importFormatAuto": "Auto",
"importFormatAutoSub": "The format is detected automatically (CSV, JSON or YAML).",
"importDelimiter": "CSV delimiter",
"importDelimiterAuto": "Auto-detect",
"importDelimiterComma": "Comma",
"importDelimiterSemicolon": "Semicolon",
"importDelimiterTab": "Tab",
"importCsvSub": "Columns: name, description, category, websiteUrl, iconUrl, features, tags. Separate features/tags with |. The first line holds the column names.",
"importJsonSub": "A JSON object or array of objects with the fields name, description, category, websiteUrl, iconUrl, features, tags.",
"importYamlSub": "A YAML list of objects (or a single object) with the fields name, description, category, websiteUrl, iconUrl, features, tags.",
"importFile": "Upload file",
"importTextareaPlaceholder": "name;description;category;features;tags\nMy Tool;A great description;Monitoring;Deployment|Open Source;devops",
"importTextareaPlaceholderCsv": "name;description;category;features;tags\nMy Tool;A great description;Monitoring;Deployment|Open Source;devops",
"importTextareaPlaceholderJson": "[\n {\n \"name\": \"My Tool\",\n \"description\": \"A great description\",\n \"category\": \"Monitoring\",\n \"features\": [\"Deployment\", \"Open Source\"],\n \"tags\": [\"devops\"]\n }\n]",
"importTextareaPlaceholderYaml": "- name: My Tool\n description: A great description\n category: Monitoring\n features:\n - Deployment\n - Open Source\n tags:\n - devops",
"importTextareaPlaceholderAuto": "name;description;category\nMy Tool;A great description;Monitoring",
"importing": "Importing…",
"importDone": "{{count}} of {{total}} tools imported successfully.",
"importErrors": "{{count}} rows with errors:",
"importErrorRow": "Row {{row}}",
"toastImportDone": "Tools imported successfully"
},
"analytics": {
"title": "Platform Analytics",
"subtitle": "Macro-level insights into tool performance and community engagement.",
"totalToolsIndexed": "Total Tools Indexed",
"totalRatingsCast": "Total Ratings Cast",
"activeCategories": "Active Categories",
"avgGlobalScore": "Avg Global Score",
"top8Tools": "Top 8 Tools by Combined Score",
"top8ToolsSub": "Highest rated tools across the platform",
"toolsByCategory": "Tools by Category",
"toolsByCategorySub": "Distribution of tools across categories",
"globalRatingDistribution": "Global Rating Distribution",
"globalRatingDistributionSub": "How users are voting across all tools",
"radarTools": "Tools"
},
"redundancy": {
"title": "Tool Analysis & Recommendations",
"subtitle": "Automatic redundancy detection with cost and rating comparison. Admin can manually confirm which tool is the better choice.",
"toolsComparisons": "{{tools}} tools, {{pairs}} comparisons",
"totalMonthly": "/mo total",
"reviews": "reviews",
"features": "features",
"comparisonsTitle": "Comparisons & Recommendations",
"vs": "vs",
"noTools": "No tools found.",
"perMonth": "/mo",
"toastEvalSaved": "Evaluation saved",
"toastEvalFailed": "Failed to save evaluation"
},
"toolForm": {
"backToBrowse": "Back to browse",
"backToTool": "Back to tool",
"addTitle": "Add a New Tool",
"addSubtitle": "Submit a tool you use to let the community rate and review it.",
"editTitle": "Edit Tool",
"editSubtitle": "Update tool details and metadata.",
"signInRequired": "Sign in required",
"signInRequiredSub": "You must be signed in to submit a tool.",
"toolDetails": "Tool Details",
"toolDetailsNewSub": "Provide the basic information about the tool.",
"toolDetailsEditSub": "Modify the tool information below.",
"name": "Name",
"nameMin": "Name must be at least 2 characters",
"category": "Category",
"categoryRequired": "Category is required",
"websiteUrl": "Website URL",
"websiteUrlOptional": "Website URL (Optional)",
"iconUrl": "Icon / Logo URL",
"iconUrlOptional": "Icon / Logo URL (Optional)",
"iconPreview": "icon preview",
"description": "Description",
"descriptionMin": "Description must be at least 10 characters",
"invalidUrl": "Must be a valid URL",
"features": "Features",
"featuresNewSub": "List key capabilities. Existing features from other tools are selectable.",
"featuresEditSub": "Key capabilities of this tool. Existing features from other tools are selectable.",
"addFeature": "Add Feature",
"noFeatures": "No features added.",
"featurePlaceholder": "e.g. Real-time collaboration",
"tags": "Tags",
"tagsNewSub": "Keywords to help find this tool. Existing tags from other tools are selectable.",
"tagsEditSub": "Keywords for this tool. Existing tags from other tools are selectable.",
"addTag": "Add Tag",
"tag": "Tag",
"namePlaceholder": "e.g. React, Next.js, Postgres",
"urlPlaceholder": "https://...",
"logoPlaceholder": "https://example.com/logo.png",
"descriptionPlaceholderNew": "What does this tool do? Why do people use it?",
"descriptionPlaceholderEdit": "What does this tool do?",
"addingTool": "Adding Tool...",
"submitTool": "Submit Tool",
"saving": "Saving…",
"saveChanges": "Save Changes",
"toastAdded": "Tool added successfully",
"toastAddedSub": "Your tool is now available for review.",
"toastAddFailed": "Failed to add tool",
"toastUpdated": "Tool updated",
"toastUpdatedSub": "Changes saved successfully.",
"toastUpdateFailed": "Failed to update tool",
"tagsHelp": "Keywords to help find this tool. Existing tags from other tools are selectable.",
"tagPlaceholder": "Tag"
},
"category": {
"placeholder": "Select or type a category...",
"searchPlaceholder": "Search or enter new category...",
"noCategories": "No categories found.",
"knownCategories": "Known categories",
"createNew": "Create new",
"create": "+ Create"
},
"theme": {
"title": "Theme",
"light": "Light",
"dark": "Dark",
"system": "System",
"chooseTitle": "Choose theme",
"switchLight": "Switch to light theme",
"switchDark": "Switch to dark theme"
}
}
+129 -5
View File
@@ -123,6 +123,10 @@
--chart-4: 43 100% 50%;
--chart-5: 280 80% 50%;
--glow-1: 187 100% 50%; /* cyan */
--glow-2: 265 100% 68%; /* violet */
--glow-3: 14 100% 57%; /* orange (primary) */
--app-font-sans: 'Inter', sans-serif;
--app-font-serif: Georgia, serif;
--app-font-mono: 'JetBrains Mono', Menlo, monospace;
@@ -200,8 +204,8 @@
--popover-foreground: 210 40% 98%;
--popover-border: 217 33% 17%;
--primary: 38 92% 50%;
--primary-foreground: 222 47% 11%;
--primary: 187 95% 55%;
--primary-foreground: 210 40% 5%;
--secondary: 217 33% 17%;
--secondary-foreground: 210 40% 98%;
@@ -212,12 +216,12 @@
--accent: 217 33% 17%;
--accent-foreground: 210 40% 98%;
--destructive: 0 62.8% 30.6%;
--destructive: 0 72% 48%;
--destructive-foreground: 210 40% 98%;
--input: 217 33% 17%;
--ring: 38 92% 50%;
--chart-1: 38 92% 50%;
--ring: 187 95% 55%;
--chart-1: 187 95% 55%;
--chart-2: 210 40% 98%;
--chart-3: 187 100% 42%;
--chart-4: 43 100% 50%;
@@ -372,4 +376,124 @@
.border.hover-elevate:not(.no-hover-interaction-elevate)::after {
inset: -1px;
}
/* ------------------------------------------------------------------ */
/* Neon / AI glow system
* Dezent: funktioniert in Light + Dark. Animationen respektieren
* prefers-reduced-motion.
* ------------------------------------------------------------------ */
.neon-glow {
box-shadow:
0 0 0 1px hsl(var(--glow-1) / 0.35),
0 0 18px -2px hsl(var(--glow-1) / 0.45),
0 0 42px -8px hsl(var(--glow-2) / 0.35);
}
.neon-glow-primary {
box-shadow:
0 0 0 1px hsl(var(--primary) / 0.4),
0 0 16px -2px hsl(var(--primary) / 0.38),
0 0 34px -8px hsl(var(--primary) / 0.3);
}
/* Solid neon fill for progress/rating bars — high contrast, cyan → violet */
.neon-bar {
background-image: linear-gradient(
100deg,
hsl(var(--glow-1) / 0.95) 0%,
hsl(var(--glow-2) / 0.95) 60%,
hsl(var(--glow-1) / 0.95) 100%
);
box-shadow:
0 0 8px 0 hsl(var(--glow-1) / 0.45),
0 0 18px -2px hsl(var(--glow-2) / 0.4);
}
/* Animated gradient background for loading states (Google-AI style flow) */
.loading-gradient {
background-image: linear-gradient(
100deg,
hsl(var(--glow-3) / 0.14) 0%,
hsl(var(--glow-2) / 0.22) 25%,
hsl(var(--glow-1) / 0.24) 50%,
hsl(var(--glow-2) / 0.22) 75%,
hsl(var(--glow-3) / 0.14) 100%
);
background-size: 300% 100%;
animation: neon-loading-sweep 7s ease-in-out infinite;
}
.loading-gradient-text {
background-image: linear-gradient(
100deg,
hsl(var(--glow-3)) 0%,
hsl(var(--glow-1)) 45%,
hsl(var(--glow-2)) 75%,
hsl(var(--glow-3)) 100%
);
background-size: 250% 100%;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
animation: neon-loading-sweep 8s ease-in-out infinite;
}
.neon-pulse {
animation: neon-pulse 3.5s ease-in-out infinite;
}
.neon-spin {
animation: neon-rotate 1.4s linear infinite;
background: linear-gradient(
hsl(var(--glow-3)),
hsl(var(--glow-1)),
hsl(var(--glow-2)),
hsl(var(--glow-3))
);
animation: neon-rotate 1.4s linear infinite;
}
@keyframes neon-loading-sweep {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes neon-pulse {
0%, 100% { opacity: 0.55; box-shadow: 0 0 6px -1px hsl(var(--glow-1) / 0.25); }
50% { opacity: 1; box-shadow: 0 0 16px 0 hsl(var(--glow-1) / 0.5); }
}
@keyframes neon-rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* Left neon indicator for the active sidebar item */
.neon-sidebar-active {
position: relative;
}
.neon-sidebar-active[data-active="true"]::before {
content: "";
position: absolute;
left: 0;
top: 20%;
bottom: 20%;
width: 3px;
border-radius: 9999px;
background-image: linear-gradient(
180deg,
hsl(var(--glow-1)),
hsl(var(--glow-2))
);
box-shadow: 0 0 10px 1px hsl(var(--glow-1) / 0.6);
}
@media (prefers-reduced-motion: reduce) {
.loading-gradient { animation: none; }
.loading-gradient-text { animation: none; }
.neon-pulse { animation: none; }
.neon-spin { animation: none; }
}
}
+81 -77
View File
@@ -29,8 +29,11 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Users, ScrollText, ShieldAlert, Plus, Pencil, Trash2, Clock, AlertTriangle, Wrench, Server } from "lucide-react";
import { format } from "date-fns";
import { AdminToolsTab } from "@/components/admin-tools-tab";
import { GuideHelp } from "@/components/guide-help";
import { useTranslation } from "react-i18next";
export default function Admin() {
const { t } = useTranslation();
const [, setLocation] = useLocation();
const { user, isAdmin, isLoading: authLoading } = useAuth();
const { toast } = useToast();
@@ -68,9 +71,9 @@ export default function Admin() {
<Layout>
<div className="flex flex-col items-center justify-center py-20 gap-4">
<ShieldAlert className="w-12 h-12 text-muted-foreground" />
<h2 className="text-2xl font-bold">Admin Access Required</h2>
<p className="text-muted-foreground">You need admin rights to view this page.</p>
<Button variant="outline" onClick={() => setLocation("/")}>Go Home</Button>
<h2 className="text-2xl font-bold">{t("admin.accessRequired")}</h2>
<p className="text-muted-foreground">{t("admin.accessRequiredSub")}</p>
<Button variant="outline" onClick={() => setLocation("/")}>{t("admin.goHome")}</Button>
</div>
</Layout>
);
@@ -82,7 +85,7 @@ export default function Admin() {
{ data: { username: newUsername, password: newPassword, email: newEmail || undefined, role: newRole, tier: newTier } },
{
onSuccess: () => {
toast({ title: "User created", description: `${newUsername} has been created.` });
toast({ title: t("admin.toastUserCreated"), description: t("admin.toastUserCreatedSub", { username: newUsername }) });
queryClient.invalidateQueries({ queryKey: getListUsersQueryKey() });
setCreateOpen(false);
setNewUsername("");
@@ -91,7 +94,7 @@ export default function Admin() {
setNewRole("user");
},
onError: (err) => {
toast({ title: "Failed to create user", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("admin.toastUserCreateFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -103,12 +106,12 @@ export default function Admin() {
{ id: editUser.id, data: { role: editUser.role as "admin" | "user", tier: editUser.tier as "free" | "premium" | "enterprise" } },
{
onSuccess: () => {
toast({ title: "User updated" });
toast({ title: t("admin.toastUserUpdated") });
queryClient.invalidateQueries({ queryKey: getListUsersQueryKey() });
setEditUser(null);
},
onError: (err) => {
toast({ title: "Failed to update user", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("admin.toastUserUpdateFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -117,18 +120,18 @@ export default function Admin() {
const handleSetUserPassword = () => {
if (!editUser || !editPassword) return;
if (editPassword.length < 6) {
toast({ title: "Password too short", description: "Minimum 6 characters.", variant: "destructive" });
toast({ title: t("admin.toastPwTooShort"), description: t("admin.toastPwTooShortSub"), variant: "destructive" });
return;
}
setUserPassword.mutate(
{ id: editUser.id, data: { password: editPassword } },
{
onSuccess: () => {
toast({ title: "Password updated", description: `Password for ${editUser.username} has been set.` });
toast({ title: t("admin.toastPwUpdated"), description: t("admin.toastPwUpdatedSub", { username: editUser.username }) });
setEditPassword("");
},
onError: (err) => {
toast({ title: "Failed to set password", description: (err.data as { error?: string } | null)?.error ?? err.message, variant: "destructive" });
toast({ title: t("admin.toastPwSetFailed"), description: (err.data as { error?: string } | null)?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -140,12 +143,12 @@ export default function Admin() {
{ id: deleteConfirm.id },
{
onSuccess: () => {
toast({ title: "User deleted", description: `${deleteConfirm.username} has been removed.` });
toast({ title: t("admin.toastUserDeleted"), description: t("admin.toastUserDeletedSub", { username: deleteConfirm.username }) });
queryClient.invalidateQueries({ queryKey: getListUsersQueryKey() });
setDeleteConfirm(null);
},
onError: (err) => {
toast({ title: "Failed to delete user", description: (err.data as { error?: string } | null)?.error ?? err.message, variant: "destructive" });
toast({ title: t("admin.toastUserDeleteFailed"), description: (err.data as { error?: string } | null)?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -163,11 +166,11 @@ export default function Admin() {
<div>
<div className="flex items-start justify-between">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">Admin Panel</h1>
<p className="text-muted-foreground">Manage users and review system changes.</p>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("admin.panel")}</h1>
<p className="text-muted-foreground">{t("admin.panelSub")}</p>
</div>
<Button asChild variant="outline" size="sm" className="gap-2">
<Link href="/admin/redundancy"><AlertTriangle className="w-4 h-4" /> Redundancy Dashboard</Link>
<Link href="/admin/redundancy"><AlertTriangle className="w-4 h-4" /> {t("admin.redundancyDashboard")}</Link>
</Button>
</div>
</div>
@@ -175,16 +178,16 @@ export default function Admin() {
<Tabs defaultValue="users">
<TabsList className="mb-4">
<TabsTrigger value="users" className="gap-2">
<Users className="w-4 h-4" /> Users
<Users className="w-4 h-4" /> {t("admin.tabUsers")}
</TabsTrigger>
<TabsTrigger value="tools" className="gap-2">
<Wrench className="w-4 h-4" /> Tools
<Wrench className="w-4 h-4" /> {t("admin.tabTools")}
</TabsTrigger>
<TabsTrigger value="audit" className="gap-2">
<ScrollText className="w-4 h-4" /> Audit Log
<ScrollText className="w-4 h-4" /> {t("admin.tabAudit")}
</TabsTrigger>
<TabsTrigger value="system" className="gap-2">
<Server className="w-4 h-4" /> System
<Server className="w-4 h-4" /> {t("admin.tabSystem")}
</TabsTrigger>
</TabsList>
@@ -192,11 +195,11 @@ export default function Admin() {
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<div>
<CardTitle>Local Users</CardTitle>
<CardDescription>Manage accounts for local authentication.</CardDescription>
<CardTitle>{t("admin.localUsers")}</CardTitle>
<CardDescription>{t("admin.localUsersSub")}</CardDescription>
</div>
<Button size="sm" onClick={() => setCreateOpen(true)}>
<Plus className="w-4 h-4 mr-2" /> Add User
<Plus className="w-4 h-4 mr-2" /> {t("admin.addUser")}
</Button>
</CardHeader>
<CardContent>
@@ -248,7 +251,7 @@ export default function Admin() {
</div>
))}
{(!users || users.length === 0) && (
<p className="text-sm text-muted-foreground py-4 text-center">No users yet.</p>
<p className="text-sm text-muted-foreground py-4 text-center">{t("admin.noUsersYet")}</p>
)}
</div>
)}
@@ -263,8 +266,8 @@ export default function Admin() {
<TabsContent value="audit">
<Card>
<CardHeader>
<CardTitle>Audit Log</CardTitle>
<CardDescription>All create, update and delete operations tracked by the system.</CardDescription>
<CardTitle>{t("admin.auditLog")}</CardTitle>
<CardDescription>{t("admin.auditLogSub")}</CardDescription>
</CardHeader>
<CardContent>
{loadingLogs ? (
@@ -289,8 +292,7 @@ export default function Admin() {
</span>
</div>
<div className="flex items-center gap-2 text-xs text-muted-foreground">
<span>by <span className="font-medium text-foreground">{log.username}</span></span>
{log.changes && (
<span>{t("admin.by")} <span className="font-medium text-foreground">{log.username}</span></span> {log.changes && (
<span className="truncate max-w-[400px] font-mono bg-muted px-1.5 py-0.5 rounded text-[11px]">
{log.changes.length > 120 ? log.changes.slice(0, 120) + "…" : log.changes}
</span>
@@ -299,7 +301,7 @@ export default function Admin() {
</div>
))}
{(!auditLogs || auditLogs.length === 0) && (
<p className="text-sm text-muted-foreground py-4 text-center">No audit entries yet.</p>
<p className="text-sm text-muted-foreground py-4 text-center">{t("admin.noAuditEntries")}</p>
)}
</div>
)}
@@ -310,17 +312,17 @@ export default function Admin() {
<TabsContent value="system">
<Card>
<CardHeader>
<CardTitle>System</CardTitle>
<CardDescription>Build information of the currently live deployment.</CardDescription>
<CardTitle>{t("admin.system")}</CardTitle>
<CardDescription>{t("admin.systemSub")}</CardDescription>
</CardHeader>
<CardContent>
<div className="divide-y">
<div className="flex items-center justify-between py-3">
<span className="text-sm text-muted-foreground">Version</span>
<span className="text-sm text-muted-foreground">{t("admin.version")}</span>
<span className="text-sm font-medium">{versionInfo?.version || "dev"}</span>
</div>
<div className="flex items-center justify-between py-3">
<span className="text-sm text-muted-foreground">Commit</span>
<span className="text-sm text-muted-foreground">{t("admin.commit")}</span>
{versionInfo?.commitSha ? (
<a
href={`https://git.kubebase.de/admin/tool-evaluator/commit/${versionInfo.commitSha}`}
@@ -336,17 +338,17 @@ export default function Admin() {
)}
</div>
<div className="flex items-center justify-between py-3">
<span className="text-sm text-muted-foreground">Build date</span>
<span className="text-sm text-muted-foreground">{t("admin.buildDate")}</span>
<span className="text-sm">
{versionInfo?.buildDate ? format(new Date(versionInfo.buildDate), "dd.MM.yyyy HH:mm") : "—"}
</span>
</div>
<div className="flex items-center justify-between py-3">
<span className="text-sm text-muted-foreground">Trash retention</span>
<span className="text-sm text-muted-foreground">{t("admin.trashRetention")}</span>
<span className="text-sm">
{(versionInfo?.trashRetentionDays ?? 0) > 0
? `${versionInfo?.trashRetentionDays} days`
: "Keep forever"}
? `${versionInfo?.trashRetentionDays} ${t("admin.days")}`
: t("admin.keepForever")}
</span>
</div>
</div>
@@ -358,65 +360,67 @@ export default function Admin() {
<Dialog open={createOpen} onOpenChange={setCreateOpen}>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>Create New User</DialogTitle>
<DialogHeader className="flex flex-row items-center justify-between gap-2">
<DialogTitle className="min-w-0 truncate">{t("admin.createNewUser")}</DialogTitle>
<GuideHelp guide="administration" label={t("admin.createNewUser")} />
</DialogHeader>
<div className="space-y-4 py-2">
<div className="space-y-2">
<Label>Username</Label>
<Input value={newUsername} onChange={(e) => setNewUsername(e.target.value)} placeholder="username" />
<Label>{t("admin.username")}</Label>
<Input value={newUsername} onChange={(e) => setNewUsername(e.target.value)} placeholder={t("admin.usernamePlaceholder")} />
</div>
<div className="space-y-2">
<Label>Password</Label>
<PasswordInput value={newPassword} onChange={(e) => setNewPassword(e.target.value)} placeholder="min. 6 characters" />
<Label>{t("admin.password")}</Label>
<PasswordInput value={newPassword} onChange={(e) => setNewPassword(e.target.value)} placeholder={t("admin.minPasswordPlaceholder")} />
</div>
<div className="space-y-2">
<Label>Email (Optional)</Label>
<Input type="email" value={newEmail} onChange={(e) => setNewEmail(e.target.value)} placeholder="user@example.com" />
<Label>{t("admin.emailOptional")}</Label>
<Input type="email" value={newEmail} onChange={(e) => setNewEmail(e.target.value)} placeholder={t("admin.emailPlaceholder")} />
</div>
<div className="space-y-2">
<Label>Role</Label>
<Label>{t("admin.role")}</Label>
<Select value={newRole} onValueChange={(v) => setNewRole(v as "admin" | "user")}>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="user">User</SelectItem>
<SelectItem value="admin">Admin</SelectItem>
<SelectItem value="user">{t("admin.roleUser")}</SelectItem>
<SelectItem value="admin">{t("admin.roleAdmin")}</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label>Plan</Label>
<Label>{t("admin.plan")}</Label>
<Select value={newTier} onValueChange={(v) => setNewTier(v as "free" | "premium" | "enterprise")}>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="free">Free</SelectItem>
<SelectItem value="premium">Premium</SelectItem>
<SelectItem value="enterprise">Enterprise</SelectItem>
<SelectItem value="free">{t("admin.planFree")}</SelectItem>
<SelectItem value="premium">{t("admin.planPremium")}</SelectItem>
<SelectItem value="enterprise">{t("admin.planEnterprise")}</SelectItem>
</SelectContent>
</Select>
</div>
</div>
<DialogFooter>
<Button variant="outline" onClick={() => setCreateOpen(false)}>Cancel</Button>
<DialogFooter className="flex-col-reverse sm:flex-row sm:flex-wrap sm:justify-end gap-2">
<Button variant="outline" onClick={() => setCreateOpen(false)}>{t("common.cancel")}</Button>
<Button onClick={handleCreateUser} disabled={createUser.isPending || !newUsername || !newPassword}>
{createUser.isPending ? "Creating" : "Create User"}
{createUser.isPending ? t("admin.creating") : t("admin.createUser")}
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
<Dialog open={!!editUser} onOpenChange={(open) => { if (!open) { setEditUser(null); setEditPassword(""); } }}>
<DialogContent className="sm:max-w-sm">
<DialogHeader>
<DialogTitle>Edit User {editUser?.username}</DialogTitle>
<DialogContent className="sm:max-w-md">
<DialogHeader className="flex flex-row items-center justify-between gap-2">
<DialogTitle className="min-w-0 truncate">{t("admin.editUser", { username: editUser?.username })}</DialogTitle>
<GuideHelp guide="administration" label={t("admin.editUser", { username: editUser?.username })} />
</DialogHeader>
<div className="space-y-4 py-2">
<div className="space-y-2">
<Label>Role</Label>
<Label>{t("admin.role")}</Label>
<Select
value={editUser?.role || "user"}
onValueChange={(v) => setEditUser(editUser ? { ...editUser, role: v } : null)}
@@ -425,13 +429,13 @@ export default function Admin() {
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="user">User</SelectItem>
<SelectItem value="admin">Admin</SelectItem>
<SelectItem value="user">{t("admin.roleUser")}</SelectItem>
<SelectItem value="admin">{t("admin.roleAdmin")}</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label>Plan</Label>
<Label>{t("admin.plan")}</Label>
<Select
value={editUser?.tier || "free"}
onValueChange={(v) => setEditUser(editUser ? { ...editUser, tier: v } : null)}
@@ -440,36 +444,36 @@ export default function Admin() {
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="free">Free</SelectItem>
<SelectItem value="premium">Premium</SelectItem>
<SelectItem value="enterprise">Enterprise</SelectItem>
<SelectItem value="free">{t("admin.planFree")}</SelectItem>
<SelectItem value="premium">{t("admin.planPremium")}</SelectItem>
<SelectItem value="enterprise">{t("admin.planEnterprise")}</SelectItem>
</SelectContent>
</Select>
</div>
{editUser?.authProvider !== "oidc" ? (
<div className="space-y-2 border-t pt-4">
<Label>Set Password</Label>
<Label>{t("admin.setPassword")}</Label>
<PasswordInput
value={editPassword}
onChange={(e) => setEditPassword(e.target.value)}
placeholder="min. 6 characters"
placeholder={t("admin.minPasswordPlaceholder")}
data-testid="input-set-password"
/>
<p className="text-xs text-muted-foreground">Resets the user's password immediately.</p>
<p className="text-xs text-muted-foreground">{t("admin.resetsPassword")}</p>
</div>
) : (
<div className="space-y-2 border-t pt-4 text-sm text-muted-foreground">
Password is managed by the identity provider (Keycloak). Reset it there.
{t("admin.idpManaged")}
</div>
)}
</div>
<DialogFooter className="flex-col sm:flex-row sm:justify-end gap-2">
<Button variant="outline" onClick={() => { setEditUser(null); setEditPassword(""); }}>Cancel</Button>
<DialogFooter className="flex-col-reverse sm:flex-row sm:flex-wrap sm:justify-end gap-2">
<Button variant="outline" onClick={() => { setEditUser(null); setEditPassword(""); }}>{t("common.cancel")}</Button>
<Button
onClick={handleUpdateUser}
disabled={updateUser.isPending}
>
Save
{t("common.save")}
</Button>
{editUser?.authProvider !== "oidc" && (
<Button
@@ -477,7 +481,7 @@ export default function Admin() {
onClick={handleSetUserPassword}
disabled={setUserPassword.isPending || !editPassword}
>
{setUserPassword.isPending ? "Setting" : "Set Password"}
{setUserPassword.isPending ? t("admin.setting") : t("admin.setPassword")}
</Button>
)}
</DialogFooter>
@@ -487,15 +491,15 @@ export default function Admin() {
<Dialog open={!!deleteConfirm} onOpenChange={(open) => !open && setDeleteConfirm(null)}>
<DialogContent className="sm:max-w-sm">
<DialogHeader>
<DialogTitle>Delete User</DialogTitle>
<DialogTitle>{t("admin.deleteUser")}</DialogTitle>
</DialogHeader>
<p className="text-sm text-muted-foreground py-2">
Are you sure you want to delete <span className="font-medium text-foreground">{deleteConfirm?.username}</span>? This cannot be undone.
{t("admin.deleteUserConfirm", { username: deleteConfirm?.username })}
</p>
<DialogFooter>
<Button variant="outline" onClick={() => setDeleteConfirm(null)}>Cancel</Button>
<Button variant="destructive" onClick={handleDeleteUser} disabled={deleteUser.isPending}>
{deleteUser.isPending ? "Deleting" : "Delete"}
<Button variant="outline" onClick={() => setDeleteConfirm(null)}>{t("common.cancel")}</Button>
<Button variant="outline" className="text-destructive hover:bg-destructive hover:text-destructive-foreground" onClick={handleDeleteUser} disabled={deleteUser.isPending}>
{deleteUser.isPending ? t("detail.deleting") : t("common.delete")}
</Button>
</DialogFooter>
</DialogContent>
+43 -25
View File
@@ -5,8 +5,8 @@ import {
useGetRatingDistribution,
GetTopToolsMetric
} from "@workspace/api-client-react";
import { useTranslation } from "react-i18next";
import { Layout } from "@/components/layout";
import { GuideHelp } from "@/components/guide-help";
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
import { Skeleton } from "@/components/ui/skeleton";
import {
@@ -17,6 +17,7 @@ import {
import { BarChart3, TrendingUp, Layers, Activity } from "lucide-react";
export default function Analytics() {
const { t } = useTranslation();
const { data: summary, isLoading: loadingSummary } = useGetAnalyticsSummary();
const { data: topTools, isLoading: loadingTopTools } = useGetTopTools({
@@ -49,11 +50,10 @@ export default function Analytics() {
<Layout>
<div className="space-y-6 pb-10">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2 flex items-center gap-2">
Platform Analytics
<GuideHelp guide="analytics" label="Platform Analytics" />
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("analytics.title")}
</h1>
<p className="text-muted-foreground">Macro-level insights into tool performance and community engagement.</p>
<p className="text-muted-foreground">{t("analytics.subtitle")}</p>
</div>
{/* Top KPI Cards */}
@@ -61,7 +61,7 @@ export default function Analytics() {
<Card>
<CardContent className="p-6">
<div className="flex items-center justify-between mb-4">
<span className="text-sm font-medium text-muted-foreground">Total Tools Indexed</span>
<span className="text-sm font-medium text-muted-foreground">{t("analytics.totalToolsIndexed")}</span>
<Layers className="w-4 h-4 text-muted-foreground" />
</div>
{loadingSummary ? <Skeleton className="h-8 w-16" /> : (
@@ -73,7 +73,7 @@ export default function Analytics() {
<Card>
<CardContent className="p-6">
<div className="flex items-center justify-between mb-4">
<span className="text-sm font-medium text-muted-foreground">Total Ratings Cast</span>
<span className="text-sm font-medium text-muted-foreground">{t("analytics.totalRatingsCast")}</span>
<Activity className="w-4 h-4 text-muted-foreground" />
</div>
{loadingSummary ? <Skeleton className="h-8 w-16" /> : (
@@ -85,7 +85,7 @@ export default function Analytics() {
<Card>
<CardContent className="p-6">
<div className="flex items-center justify-between mb-4">
<span className="text-sm font-medium text-muted-foreground">Active Categories</span>
<span className="text-sm font-medium text-muted-foreground">{t("analytics.activeCategories")}</span>
<BarChart3 className="w-4 h-4 text-muted-foreground" />
</div>
{loadingSummary ? <Skeleton className="h-8 w-16" /> : (
@@ -97,7 +97,7 @@ export default function Analytics() {
<Card>
<CardContent className="p-6">
<div className="flex items-center justify-between mb-4">
<span className="text-sm font-medium text-muted-foreground">Avg Global Score</span>
<span className="text-sm font-medium text-muted-foreground">{t("analytics.avgGlobalScore")}</span>
<TrendingUp className="w-4 h-4 text-muted-foreground" />
</div>
{loadingSummary ? <Skeleton className="h-8 w-16" /> : (
@@ -112,8 +112,8 @@ export default function Analytics() {
{/* Top Tools Chart */}
<Card className="col-span-1 lg:col-span-2">
<CardHeader>
<CardTitle>Top 8 Tools by Combined Score</CardTitle>
<CardDescription>Highest rated tools across the platform</CardDescription>
<CardTitle>{t("analytics.top8Tools")}</CardTitle>
<CardDescription>{t("analytics.top8ToolsSub")}</CardDescription>
</CardHeader>
<CardContent>
{loadingTopTools ? (
@@ -127,9 +127,15 @@ export default function Analytics() {
<YAxis domain={[0, 5]} tickLine={false} axisLine={false} tickFormatter={(v) => `${v}`} tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} />
<RechartsTooltip
cursor={{ fill: 'hsl(var(--muted))' }}
contentStyle={{ borderRadius: '8px', border: '1px solid hsl(var(--border))' }}
contentStyle={{ backgroundColor: 'hsl(var(--popover))', borderRadius: '8px', border: '1px solid hsl(var(--border))', color: 'hsl(var(--foreground))' }}
/>
<Bar dataKey="score" fill="hsl(var(--primary))" radius={[4, 4, 0, 0]} maxBarSize={50} />
<defs>
<linearGradient id="neonBarFillA" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stopColor="hsl(var(--glow-1))" />
<stop offset="100%" stopColor="hsl(var(--glow-2))" />
</linearGradient>
</defs>
<Bar dataKey="score" fill="url(#neonBarFillA)" radius={[4, 4, 0, 0]} maxBarSize={50} />
</BarChart>
</ResponsiveContainer>
</div>
@@ -140,8 +146,8 @@ export default function Analytics() {
{/* Category Breakdown */}
<Card>
<CardHeader>
<CardTitle>Tools by Category</CardTitle>
<CardDescription>Distribution of tools across categories</CardDescription>
<CardTitle>{t("analytics.toolsByCategory")}</CardTitle>
<CardDescription>{t("analytics.toolsByCategorySub")}</CardDescription>
</CardHeader>
<CardContent>
{loadingCategories ? (
@@ -153,8 +159,8 @@ export default function Analytics() {
<PolarGrid stroke="hsl(var(--border))" />
<PolarAngleAxis dataKey="category" tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} />
<PolarRadiusAxis angle={30} domain={[0, 'auto']} tick={false} axisLine={false} />
<Radar name="Tools" dataKey="tools" stroke="hsl(var(--primary))" fill="hsl(var(--primary))" fillOpacity={0.3} />
<RechartsTooltip />
<Radar name={t("analytics.radarTools")} dataKey="tools" stroke="hsl(var(--primary))" fill="hsl(var(--primary))" fillOpacity={0.3} />
<RechartsTooltip contentStyle={{ backgroundColor: 'hsl(var(--popover))', borderRadius: '8px', border: '1px solid hsl(var(--border))', color: 'hsl(var(--foreground))' }} />
</RadarChart>
</ResponsiveContainer>
</div>
@@ -165,8 +171,8 @@ export default function Analytics() {
{/* Rating Distributions */}
<Card>
<CardHeader>
<CardTitle>Global Rating Distribution</CardTitle>
<CardDescription>How users are voting across all tools</CardDescription>
<CardTitle>{t("analytics.globalRatingDistribution")}</CardTitle>
<CardDescription>{t("analytics.globalRatingDistributionSub")}</CardDescription>
</CardHeader>
<CardContent>
{loadingDistribution ? (
@@ -174,29 +180,41 @@ export default function Analytics() {
) : (
<div className="space-y-5">
<div>
<span className="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2 block">Usefulness</span>
<span className="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2 block">{t("detail.usefulness")}</span>
<div className="h-[110px] w-full">
<ResponsiveContainer width="100%" height="100%">
<BarChart data={usefulnessData} margin={{ top: 4, right: 8, left: -20, bottom: 0 }}>
<CartesianGrid strokeDasharray="3 3" vertical={false} stroke="hsl(var(--border))" />
<XAxis dataKey="score" tickLine={false} axisLine={false} tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} />
<YAxis hide />
<RechartsTooltip cursor={{ fill: 'hsl(var(--muted))' }} contentStyle={{ borderRadius: '6px', border: '1px solid hsl(var(--border))' }} />
<Bar dataKey="count" fill="hsl(var(--primary))" radius={[4, 4, 0, 0]} maxBarSize={40} />
<RechartsTooltip cursor={{ fill: 'hsl(var(--muted))' }} contentStyle={{ backgroundColor: 'hsl(var(--popover))', borderRadius: '6px', border: '1px solid hsl(var(--border))', color: 'hsl(var(--foreground))' }} />
<defs>
<linearGradient id="neonBarFillB" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stopColor="hsl(var(--glow-1))" />
<stop offset="100%" stopColor="hsl(var(--glow-2))" />
</linearGradient>
</defs>
<Bar dataKey="count" fill="url(#neonBarFillB)" radius={[4, 4, 0, 0]} maxBarSize={40} />
</BarChart>
</ResponsiveContainer>
</div>
</div>
<div>
<span className="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2 block">Usability</span>
<span className="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2 block">{t("detail.usability")}</span>
<div className="h-[110px] w-full">
<ResponsiveContainer width="100%" height="100%">
<BarChart data={usabilityData} margin={{ top: 4, right: 8, left: -20, bottom: 0 }}>
<CartesianGrid strokeDasharray="3 3" vertical={false} stroke="hsl(var(--border))" />
<XAxis dataKey="score" tickLine={false} axisLine={false} tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} />
<YAxis hide />
<RechartsTooltip cursor={{ fill: 'hsl(var(--muted))' }} contentStyle={{ borderRadius: '6px', border: '1px solid hsl(var(--border))' }} />
<Bar dataKey="count" fill="hsl(var(--chart-3))" radius={[4, 4, 0, 0]} maxBarSize={40} />
<RechartsTooltip cursor={{ fill: 'hsl(var(--muted))' }} contentStyle={{ backgroundColor: 'hsl(var(--popover))', borderRadius: '6px', border: '1px solid hsl(var(--border))', color: 'hsl(var(--foreground))' }} />
<defs>
<linearGradient id="neonBarFillC" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stopColor="hsl(var(--glow-1))" />
<stop offset="100%" stopColor="hsl(var(--glow-2))" />
</linearGradient>
</defs>
<Bar dataKey="count" fill="url(#neonBarFillC)" radius={[4, 4, 0, 0]} maxBarSize={40} />
</BarChart>
</ResponsiveContainer>
</div>
+5 -7
View File
@@ -8,7 +8,6 @@ import { Link, useSearch } from "wouter";
import { Layout } from "@/components/layout";
import { useAuth } from "@/hooks/use-auth";
import { RatingStars } from "@/components/rating-stars";
import { GuideHelp } from "@/components/guide-help";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Skeleton } from "@/components/ui/skeleton";
@@ -102,9 +101,8 @@ export default function Compare() {
<Layout>
<div className="space-y-6 pb-10">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2 flex items-center gap-2">
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("compare.title")}
<GuideHelp guide="vergleichen" label={t("compare.title")} />
</h1>
<p className="text-muted-foreground">{t("compare.subtitle", { count: list.length })}</p>
</div>
@@ -145,7 +143,7 @@ export default function Compare() {
))}
</TableRow>
<TableRow>
<TableCell className="font-medium">Usefulness</TableCell>
<TableCell className="font-medium">{t("detail.usefulness")}</TableCell>
{list.map((t) => (
<TableCell key={t.id} className={cn(isBest(t.avgUsefulness, bestUsefulness) && "bg-primary/5")}>
<span className="tabular-nums">{fmt(t.avgUsefulness)}/5</span>
@@ -153,7 +151,7 @@ export default function Compare() {
))}
</TableRow>
<TableRow>
<TableCell className="font-medium">Usability</TableCell>
<TableCell className="font-medium">{t("detail.usability")}</TableCell>
{list.map((t) => (
<TableCell key={t.id} className={cn(isBest(t.avgUsability, bestUsability) && "bg-primary/5")}>
<span className="tabular-nums">{fmt(t.avgUsability)}/5</span>
@@ -177,7 +175,7 @@ export default function Compare() {
))}
</TableRow>
<TableRow>
<TableCell className="font-medium">Features</TableCell>
<TableCell className="font-medium">{t("filter.features")}</TableCell>
{list.map((t) => (
<TableCell key={t.id} className="align-top">
<div className="flex flex-wrap gap-1">
@@ -190,7 +188,7 @@ export default function Compare() {
))}
</TableRow>
<TableRow>
<TableCell className="font-medium">Tags</TableCell>
<TableCell className="font-medium">{t("filter.tags")}</TableCell>
{list.map((t) => (
<TableCell key={t.id} className="align-top">
<div className="flex flex-wrap gap-1">
+55 -25
View File
@@ -8,6 +8,7 @@ import { Badge } from "@/components/ui/badge";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { ThemeToggle } from "@/components/theme-toggle";
import { LanguageSwitcher } from "@/components/language-switcher";
import {
Select,
SelectContent,
@@ -29,7 +30,6 @@ import {
ExternalLink,
FileText,
GitBranch,
HelpCircle,
Library,
Menu,
Search,
@@ -57,6 +57,20 @@ function docsFile(version: string | null, relPath: string) {
return version === null ? relPath : `versions/${version}/${relPath}`;
}
// Prefer the English file/title variant when the active UI language is English.
function useDocsLocale() {
const { i18n } = useTranslation();
return (i18n.language ?? "en").toLowerCase().startsWith("en") ? "en" : "de";
}
function localizedFile(file: string, fileEn: string | null, locale: "en" | "de"): string {
return locale === "en" && fileEn ? fileEn : file;
}
function localizedTitle(title: string, titleEn: string | null, locale: "en" | "de"): string {
return locale === "en" && titleEn ? titleEn : title;
}
// ---------------------------------------------------------------------------
// Types
// ---------------------------------------------------------------------------
@@ -100,13 +114,22 @@ type Reference = { tags: TagGroup[]; schemas: SchemaModel[] };
type ReleaseDoc = {
version: string;
file: string;
fileEn: string | null;
title: string;
titleEn: string | null;
date: string | null;
hasReference: boolean;
hasHandbook: boolean;
};
type HandbookPage = { slug: string; file: string; title: string; order: number };
type HandbookPage = {
slug: string;
file: string;
fileEn: string | null;
title: string;
titleEn: string | null;
order: number;
};
type SearchEntry = { title: string; href: string; kind: string; text: string };
@@ -339,6 +362,7 @@ function DocsNav({
}) {
const [location] = useLocation();
const { t } = useTranslation();
const locale = useDocsLocale();
const navLink = (href: string) => {
const active = location === href || (href !== "/docs" && location.startsWith(href));
@@ -353,7 +377,7 @@ function DocsNav({
icon: BookOpen,
items: handbook.map((p) => ({
href: docsHref(version, `handbook/${p.slug}`),
label: p.title,
label: localizedTitle(p.title, p.titleEn, locale),
active: navLink(docsHref(version, `handbook/${p.slug}`)),
})),
});
@@ -536,7 +560,7 @@ function FieldTable({ fields }: { fields: Field[] }) {
</td>
<td className="px-3 py-2">
{f.required ? (
<Badge className="bg-primary/10 text-primary border-primary/20">required</Badge>
<Badge className="bg-primary/10 text-primary border-primary/20">{t("docs.required")}</Badge>
) : (
<span className="text-muted-foreground"></span>
)}
@@ -566,10 +590,6 @@ function SchemaView({ schema }: { schema: SchemaModel }) {
{schema.description && <p className="text-muted-foreground">{schema.description}</p>}
</div>
<FieldTable fields={schema.fields} />
<p className="text-xs text-muted-foreground">
<HelpCircle className="h-3.5 w-3.5 inline mr-1" />
{t("docs.fieldHelpHint")}
</p>
</div>
<Toc headings={headings} title={t("docs.fields")} />
</div>
@@ -611,8 +631,8 @@ function EndpointTagView({ tag }: { tag: TagGroup }) {
<table className="w-full text-sm">
<thead>
<tr className="border-b bg-muted/50 text-left text-xs uppercase tracking-wider text-muted-foreground">
<th className="px-3 py-2 font-semibold">Name</th>
<th className="px-3 py-2 font-semibold">In</th>
<th className="px-3 py-2 font-semibold">{t("docs.name")}</th>
<th className="px-3 py-2 font-semibold">{t("docs.in")}</th>
<th className="px-3 py-2 font-semibold">{t("docs.type")}</th>
<th className="px-3 py-2 font-semibold">{t("docs.required")}</th>
<th className="px-3 py-2 font-semibold">{t("docs.description")}</th>
@@ -625,7 +645,7 @@ function EndpointTagView({ tag }: { tag: TagGroup }) {
<td className="px-3 py-1.5 text-muted-foreground">{p.in}</td>
<td className="px-3 py-1.5"><FieldTypeChip type={p.type} /></td>
<td className="px-3 py-1.5">
{p.required ? <Badge className="bg-primary/10 text-primary border-primary/20">req</Badge> : ""}
{p.required ? <Badge className="bg-primary/10 text-primary border-primary/20">{t("docs.required")}</Badge> : ""}
</td>
<td className="px-3 py-1.5 text-muted-foreground">
{p.description}
@@ -642,7 +662,7 @@ function EndpointTagView({ tag }: { tag: TagGroup }) {
{ep.requestBody && (
<div className="mb-3 rounded-lg border bg-muted/30 p-3">
<p className="mb-1 text-xs font-semibold uppercase tracking-wider text-muted-foreground">
Request Body {ep.requestBody.required && <Badge className="ml-1">required</Badge>}
{t("docs.requestBody")} {ep.requestBody.required && <Badge className="ml-1">{t("docs.required")}</Badge>}
</p>
<FieldTypeChip type={ep.requestBody.schema} />
</div>
@@ -679,6 +699,7 @@ function EndpointTagView({ tag }: { tag: TagGroup }) {
function ReleasesView({ versions }: { versions: ReleaseDoc[] }) {
const [, setLocation] = useLocation();
const { t } = useTranslation();
const locale = useDocsLocale();
return (
<div className="flex flex-col lg:flex-row gap-8">
<div className="flex-1 min-w-0 max-w-3xl space-y-4">
@@ -697,7 +718,7 @@ function ReleasesView({ versions }: { versions: ReleaseDoc[] }) {
<FileText className="h-4 w-4 shrink-0 text-primary" />
<div className="min-w-0 flex-1">
<div className="flex items-center gap-2">
<span className="font-semibold">{v.title}</span>
<span className="font-semibold">{localizedTitle(v.title, v.titleEn, locale)}</span>
<Badge variant="secondary">{v.version}</Badge>
</div>
{v.date && (
@@ -707,7 +728,7 @@ function ReleasesView({ versions }: { versions: ReleaseDoc[] }) {
</span>
)}
</div>
{v.hasReference && <Badge className="bg-primary/10 text-primary">API-Referenz</Badge>}
{v.hasReference && <Badge className="bg-primary/10 text-primary">{t("docs.reference")}</Badge>}
</button>
))}
</div>
@@ -717,7 +738,9 @@ function ReleasesView({ versions }: { versions: ReleaseDoc[] }) {
);
}
function ReleaseNoteView({ version }: { version: string }) {
function ReleaseNoteView({ version, doc }: { version: string; doc: ReleaseDoc | null }) {
const locale = useDocsLocale();
const file = doc ? `releases/${localizedFile(doc.file, doc.fileEn, locale)}` : `releases/${version}.de.md`;
return (
<div className="flex flex-col lg:flex-row gap-8">
<div className="flex-1 min-w-0 max-w-3xl">
@@ -733,16 +756,20 @@ function ReleaseNoteView({ version }: { version: string }) {
<ExternalLink className="h-3.5 w-3.5" />
</a>
</div>
<MarkdownView file={`releases/${version}.md`} />
<MarkdownView file={file} />
</div>
</div>
);
}
function HandbookView({ slug }: { slug: string }) {
function HandbookView({ slug, pages }: { slug: string; pages: HandbookPage[] | null }) {
const version = useDocsVersion();
const handbookFile = `${slug}.md`;
return <MarkdownView file={docsFile(version, `handbook/${handbookFile}`)} />;
const locale = useDocsLocale();
const page = pages?.find((p) => p.slug === slug);
const file = page
? docsFile(version, `handbook/${localizedFile(page.file, page.fileEn, locale)}`)
: docsFile(version, `handbook/${slug}.md`);
return <MarkdownView file={file} />;
}
// ---------------------------------------------------------------------------
@@ -750,7 +777,9 @@ function HandbookView({ slug }: { slug: string }) {
// ---------------------------------------------------------------------------
function useDocsSearch(query: string) {
const { data, error } = useJson<SearchEntry[]>(query ? `${DOCS_BASE}/search.json` : null);
const locale = useDocsLocale();
const indexFile = locale === "en" ? "search.en.json" : "search.json";
const { data, error } = useJson<SearchEntry[]>(query ? `${DOCS_BASE}/${indexFile}` : null);
const results = useMemo(() => {
if (!query.trim() || !data) return [];
const q = query.trim().toLowerCase();
@@ -879,21 +908,21 @@ export default function Docs() {
if (version !== null && path.length === 0) {
content =
handbook && handbook.length > 0 ? (
<HandbookView slug={handbook[0].slug} />
<HandbookView slug={handbook[0].slug} pages={handbook} />
) : (
<ReleaseNoteView version={version} />
<ReleaseNoteView version={version} doc={activeRelease} />
);
} else if (section === "home") {
content =
handbook && handbook.length > 0 ? (
<HandbookView slug={handbook[0].slug} />
<HandbookView slug={handbook[0].slug} pages={handbook} />
) : releases && releases.length > 0 ? (
<ReleasesView versions={releases} />
) : (
<p className="text-sm text-muted-foreground">{t("docs.noDocs")}</p>
);
} else if (section === "handbook" && param) {
content = <HandbookView slug={param} />;
content = <HandbookView slug={param} pages={handbook} />;
} else if (section === "reference" && param === "endpoints" && path[2]) {
const tag = reference?.tags.find(
(tg) => tg.name.toLowerCase() === path[2].toLowerCase(),
@@ -963,7 +992,7 @@ export default function Docs() {
</div>
);
} else if (section === "releases" && param) {
content = <ReleaseNoteView version={param} />;
content = <ReleaseNoteView version={param} doc={releases?.find((r) => r.version === param) ?? null} />;
} else if (section === "releases") {
content = releases ? <ReleasesView versions={releases} /> : <Skeleton className="h-64 w-full" />;
} else {
@@ -1014,6 +1043,7 @@ export default function Docs() {
</Link>
</div>
<div className="flex items-center gap-1.5 shrink-0">
<LanguageSwitcher />
<ThemeToggle />
</div>
</div>
+6 -4
View File
@@ -24,7 +24,9 @@ export default function Home() {
<div className="space-y-8 pb-8">
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-end gap-4">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("home.welcome")}</h1>
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("home.welcome")}
</h1>
<p className="text-muted-foreground">{t("home.tagline")}</p>
</div>
<Button asChild>
@@ -37,7 +39,7 @@ export default function Home() {
{/* Stats Banner */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<Card className="bg-primary/5 border-primary/20">
<Card className="neon-glow-primary bg-primary/5 border-primary/20">
<CardContent className="p-6 flex items-center gap-4">
<div className="p-3 bg-primary/10 rounded-lg text-primary">
<Wrench className="w-6 h-6" />
@@ -53,7 +55,7 @@ export default function Home() {
</CardContent>
</Card>
<Card className="bg-primary/5 border-primary/20">
<Card className="neon-glow-primary bg-primary/5 border-primary/20">
<CardContent className="p-6 flex items-center gap-4">
<div className="p-3 bg-primary/10 rounded-lg text-primary">
<MessageSquare className="w-6 h-6" />
@@ -69,7 +71,7 @@ export default function Home() {
</CardContent>
</Card>
<Card className="bg-primary/5 border-primary/20">
<Card className="neon-glow-primary bg-primary/5 border-primary/20">
<CardContent className="p-6 flex items-center gap-4">
<div className="p-3 bg-primary/10 rounded-lg text-primary">
<Star className="w-6 h-6" />
+1 -1
View File
@@ -58,7 +58,7 @@ export default function Login() {
<p className="text-muted-foreground text-sm">{t("auth.loginSubtitle")}</p>
</div>
<Card>
<Card className="neon-glow">
<CardHeader className="pb-4">
<CardTitle className="text-lg">{t("auth.signIn")}</CardTitle>
<CardDescription>{t("auth.loginDescription")}</CardDescription>
+16 -14
View File
@@ -1,4 +1,5 @@
import { useState, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { Layout } from "@/components/layout";
import { Card, CardContent } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
@@ -11,6 +12,7 @@ import { customFetch } from "@workspace/api-client-react";
import { useToast } from "@/hooks/use-toast";
export default function RedundancyPage() {
const { t } = useTranslation();
const [data, setData] = useState<any[] | null>(null);
const [loading, setLoading] = useState(true);
const { toast } = useToast();
@@ -28,10 +30,10 @@ export default function RedundancyPage() {
method: "POST",
body: JSON.stringify({ toolId, relatedToolId, betterToolId }),
});
toast({ title: "Evaluation saved" });
toast({ title: t("redundancy.toastEvalSaved") });
setData(await customFetch<any[]>("/api/admin/redundancy"));
} catch {
toast({ title: "Failed to save evaluation", variant: "destructive" });
toast({ title: t("redundancy.toastEvalFailed"), variant: "destructive" });
}
}
@@ -44,10 +46,10 @@ export default function RedundancyPage() {
<div className="space-y-6">
<div className="flex items-center gap-3">
<AlertTriangle className="w-6 h-6 text-amber-500" />
<h1 className="text-3xl font-bold">Tool Analysis & Recommendations</h1>
<h1 className="text-3xl font-bold">{t("redundancy.title")}</h1>
</div>
<p className="text-muted-foreground">
Automatic redundancy detection with cost and rating comparison. Admin can manually confirm which tool is the better choice.
{t("redundancy.subtitle")}
</p>
{loading ? (
@@ -61,12 +63,12 @@ export default function RedundancyPage() {
<div className="flex items-center justify-between mb-4">
<div>
<h2 className="text-xl font-semibold capitalize">{group.category}</h2>
<p className="text-xs text-muted-foreground mt-0.5">{group.tools.length} tools, {group.pairs.length} comparisons</p>
<p className="text-xs text-muted-foreground mt-0.5">{t("redundancy.toolsComparisons", { tools: group.tools.length, pairs: group.pairs.length })}</p>
</div>
{group.totalMonthlyCost > 0 && (
<span className="text-xs text-muted-foreground flex items-center gap-1">
<DollarSign className="w-3 h-3" />
{group.totalMonthlyCost.toFixed(2)}/mo total
{group.totalMonthlyCost.toFixed(2)}{t("redundancy.totalMonthly")}
</span>
)}
</div>
@@ -82,12 +84,12 @@ export default function RedundancyPage() {
<span className="font-medium">{tool.name}</span>
{tool.costs?.length > 0 && tool.totalMonthly > 0 && (
<Badge variant="outline" className="text-[10px] px-1 py-0 shrink-0">
{tool.totalMonthly.toFixed(2)}/mo
{tool.totalMonthly.toFixed(2)}{t("redundancy.perMonth")}
</Badge>
)}
</div>
<div className="flex items-center gap-2 mt-1 text-xs text-muted-foreground flex-wrap">
<span>{tool.ratingCount} reviews</span>
<span>{tool.ratingCount} {t("redundancy.reviews")}</span>
{tool.avgCombined != null && (
<>
<span>·</span>
@@ -104,7 +106,7 @@ export default function RedundancyPage() {
))}
</div>
</div>
<Badge variant="outline" className="shrink-0">{tool.features.length} features</Badge>
<Badge variant="outline" className="shrink-0">{tool.features.length} {t("redundancy.features")}</Badge>
</div>
</CardContent>
</Card>
@@ -114,7 +116,7 @@ export default function RedundancyPage() {
{group.pairs.length > 0 && (
<div className="space-y-3">
<h3 className="text-sm font-medium text-muted-foreground">Comparisons & Recommendations</h3>
<h3 className="text-sm font-medium text-muted-foreground">{t("redundancy.comparisonsTitle")}</h3>
{group.pairs.map((pair: any, i: number) => (
<Card key={i} className={pair.recommendation.certainty === "high" ? "border-green-300" : pair.recommendation.certainty === "medium" ? "border-amber-200" : ""}>
<CardContent className="p-4">
@@ -126,11 +128,11 @@ export default function RedundancyPage() {
</span>
<span className="text-[10px] text-muted-foreground">
{pair.a.avgCombined != null ? pair.a.avgCombined.toFixed(1) : "N/A"}
{pair.a.totalMonthly > 0 ? ` · ${pair.a.totalMonthly.toFixed(2)}/mo` : ""}
{pair.a.totalMonthly > 0 ? ` · ${pair.a.totalMonthly.toFixed(2)}${t("redundancy.perMonth")}` : ""}
</span>
</div>
<div className="text-center shrink-0">
<div className="text-xs text-muted-foreground font-medium">vs</div>
<div className="text-xs text-muted-foreground font-medium">{t("redundancy.vs")}</div>
<div className="flex items-center gap-1 justify-center mt-0.5">
<Progress value={pair.overlap} className="w-12 h-1.5" />
<span className="text-[10px] text-muted-foreground">{pair.overlap}%</span>
@@ -142,7 +144,7 @@ export default function RedundancyPage() {
</span>
<span className="text-[10px] text-muted-foreground">
{pair.b.avgCombined != null ? pair.b.avgCombined.toFixed(1) : "N/A"}
{pair.b.totalMonthly > 0 ? ` · ${pair.b.totalMonthly.toFixed(2)}/mo` : ""}
{pair.b.totalMonthly > 0 ? ` · ${pair.b.totalMonthly.toFixed(2)}${t("redundancy.perMonth")}` : ""}
</span>
</div>
</div>
@@ -188,7 +190,7 @@ export default function RedundancyPage() {
))}
</div>
) : (
<p className="text-muted-foreground py-8 text-center">No tools found.</p>
<p className="text-muted-foreground py-8 text-center">{t("redundancy.noTools")}</p>
)}
</div>
</Layout>
+78 -78
View File
@@ -60,7 +60,6 @@ import {
} from "@/components/ui/alert-dialog";
import { customFetch } from "@workspace/api-client-react";
import { recordRecentTool } from "@/lib/recent-tools";
import { FieldHelp } from "@/components/field-help";
import { GuideHelp } from "@/components/guide-help";
const ratingSchema = z.object({
@@ -121,24 +120,24 @@ export default function ToolDetail() {
method: "POST",
body: JSON.stringify({ relatedToolId: Number(linkToolId), relationType: linkType, notes: linkNotes || undefined }),
});
toast({ title: "Relation created" });
toast({ title: t("detail.toastRelationCreated") });
setLinkDialogOpen(false);
setLinkToolId("");
setLinkNotes("");
setLinkType("similar");
setSimilarData(await customFetch<any>(`/api/tools/${id}/similar`));
} catch (err: any) {
toast({ title: "Failed to create relation", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("detail.toastRelationFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
}
}
async function handleDeleteRelation(relationId: number) {
try {
await customFetch(`/api/tools/relations/${relationId}`, { method: "DELETE" });
toast({ title: "Relation deleted" });
toast({ title: t("detail.toastRelationDeleted") });
setSimilarData(await customFetch<any>(`/api/tools/${id}/similar`));
} catch {
toast({ title: "Failed to delete relation", variant: "destructive" });
toast({ title: t("detail.toastRelationDeleteFailed"), variant: "destructive" });
}
}
@@ -163,12 +162,12 @@ export default function ToolDetail() {
if (costAmount) body.cost = costAmount;
try {
await customFetch(url, { method, body: JSON.stringify(body) });
toast({ title: editCost ? "Cost updated" : "Cost added" });
toast({ title: editCost ? t("detail.toastCostUpdated") : t("detail.toastCostAdded") });
setCostDialogOpen(false);
resetCostForm();
setCosts(await customFetch<any[]>(`/api/tools/${id}/costs`));
} catch (err: any) {
toast({ title: "Failed to save cost", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("detail.toastCostFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
}
}
@@ -194,10 +193,10 @@ export default function ToolDetail() {
async function handleDeleteCost(costId: number) {
try {
await customFetch(`/api/costs/${costId}`, { method: "DELETE" });
toast({ title: "Cost deleted" });
toast({ title: t("detail.toastCostDeleted") });
setCosts(await customFetch<any[]>(`/api/tools/${id}/costs`));
} catch {
toast({ title: "Failed to delete cost", variant: "destructive" });
toast({ title: t("detail.toastCostDeleteFailed"), variant: "destructive" });
}
}
@@ -237,8 +236,8 @@ export default function ToolDetail() {
createRating.mutate({ id, data }, {
onSuccess: () => {
toast({
title: "Rating submitted",
description: "Thank you for your feedback!",
title: t("detail.toastRatingSubmitted"),
description: t("detail.toastRatingThanks"),
});
setIsReviewFormOpen(false);
form.reset();
@@ -252,8 +251,8 @@ export default function ToolDetail() {
},
onError: (error) => {
toast({
title: "Failed to submit rating",
description: error.data?.error || error.message || "An unexpected error occurred.",
title: t("detail.toastRatingFailed"),
description: error.data?.error || error.message || t("detail.unexpectedError"),
variant: "destructive"
});
}
@@ -264,9 +263,9 @@ export default function ToolDetail() {
return (
<Layout>
<div className="flex flex-col items-center justify-center py-20">
<h2 className="text-2xl font-bold">Invalid Tool ID</h2>
<h2 className="text-2xl font-bold">{t("detail.invalidToolId")}</h2>
<Button variant="link" asChild className="mt-4">
<Link href="/tools"><ArrowLeft className="w-4 h-4 mr-2" /> Back to tools</Link>
<Link href="/tools"><ArrowLeft className="w-4 h-4 mr-2" /> {t("detail.backToBrowse")}</Link>
</Button>
</div>
</Layout>
@@ -288,7 +287,7 @@ export default function ToolDetail() {
{ id },
{
onSuccess: () => {
toast({ title: "Tool deleted" });
toast({ title: t("detail.toastToolDeleted") });
queryClient.invalidateQueries({ queryKey: getListToolsQueryKey() });
queryClient.invalidateQueries({ queryKey: getListCategoriesQueryKey() });
queryClient.invalidateQueries({ queryKey: getListAllFeaturesQueryKey() });
@@ -297,7 +296,7 @@ export default function ToolDetail() {
setLocation("/tools");
},
onError: (err) => {
toast({ title: "Failed to delete", description: err.data?.error || err.message, variant: "destructive" });
toast({ title: t("detail.toastDeleteFailed"), description: err.data?.error || err.message, variant: "destructive" });
setDeleteOpen(false);
},
},
@@ -309,7 +308,7 @@ export default function ToolDetail() {
<Layout>
<div className="space-y-6 max-w-5xl mx-auto pb-10">
<Button variant="ghost" asChild className="mb-2 -ml-4 text-muted-foreground">
<Link href="/tools"><ArrowLeft className="w-4 h-4 mr-2" /> Back to browse</Link>
<Link href="/tools"><ArrowLeft className="w-4 h-4 mr-2" /> {t("detail.backToBrowse")}</Link>
</Button>
{/* Header Section */}
@@ -408,7 +407,7 @@ export default function ToolDetail() {
{tool.features && tool.features.length > 0 && (
<div className="pt-6 border-t">
<h3 className="text-lg font-semibold mb-3">Key Features</h3>
<h3 className="text-lg font-semibold mb-3">{t("detail.keyFeatures")}</h3>
<ul className="grid grid-cols-1 sm:grid-cols-2 gap-2">
{tool.features.map((feature, i) => (
<li key={i} className="flex items-start gap-2">
@@ -423,17 +422,17 @@ export default function ToolDetail() {
)}
</div>
) : (
<div className="text-center py-10">Tool not found.</div>
<div className="text-center py-10">{t("detail.toolNotFound")}</div>
)}
{/* Similar Tools Section */}
{tool && (
<div className="space-y-4 mt-8">
<div className="flex items-center justify-between">
<h3 className="text-xl font-bold">Similar Tools</h3>
<h3 className="text-xl font-bold">{t("detail.similarTools")}</h3>
{isAdmin && (
<Button variant="outline" size="sm" onClick={() => setLinkDialogOpen(true)} className="gap-2">
<LinkIcon className="w-4 h-4" /> Link Tool
<LinkIcon className="w-4 h-4" /> {t("detail.linkTool")}
</Button>
)}
</div>
@@ -501,7 +500,7 @@ export default function ToolDetail() {
</>
)}
<span>·</span>
<span>Score: {item.score}</span>
<span>{t("detail.score")}: {item.score}</span>
</div>
</div>
</CardContent>
@@ -510,7 +509,7 @@ export default function ToolDetail() {
))}
</div>
) : similarData && similarData.manual.length === 0 && similarData.auto.length === 0 ? (
<p className="text-sm text-muted-foreground py-4">No similar tools found.</p>
<p className="text-sm text-muted-foreground py-4">{t("detail.noSimilarTools")}</p>
) : null}
</div>
)}
@@ -519,44 +518,44 @@ export default function ToolDetail() {
<Dialog open={linkDialogOpen} onOpenChange={setLinkDialogOpen}>
<DialogContent>
<DialogHeader>
<DialogTitle>Link Similar Tool</DialogTitle>
<DialogDescription>Manually link this tool to another tool.</DialogDescription>
<DialogTitle>{t("detail.linkSimilarTool")}</DialogTitle>
<DialogDescription>{t("detail.linkSimilarToolSub")}</DialogDescription>
</DialogHeader>
<div className="space-y-4 py-2">
<div className="space-y-2">
<label className="text-sm font-medium">Tool ID</label>
<label className="text-sm font-medium">{t("detail.toolId")}</label>
<Input
type="number"
placeholder="Enter target tool ID"
placeholder={t("detail.toolIdPlaceholder")}
value={linkToolId}
onChange={(e) => setLinkToolId(e.target.value)}
/>
</div>
<div className="space-y-2">
<label className="text-sm font-medium">Relation Type</label>
<label className="text-sm font-medium">{t("detail.relationType")}</label>
<Select value={linkType} onValueChange={setLinkType}>
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="similar">Similar</SelectItem>
<SelectItem value="replaces">Replaces</SelectItem>
<SelectItem value="superseded_by">Superseded By</SelectItem>
<SelectItem value="similar">{t("detail.relationSimilar")}</SelectItem>
<SelectItem value="replaces">{t("detail.relationReplaces")}</SelectItem>
<SelectItem value="superseded_by">{t("detail.relationSupersededBy")}</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<label className="text-sm font-medium">Notes (Optional)</label>
<label className="text-sm font-medium">{t("detail.notesOptional")}</label>
<Textarea
placeholder="Why are these tools related?"
placeholder={t("detail.notesPlaceholder")}
value={linkNotes}
onChange={(e) => setLinkNotes(e.target.value)}
/>
</div>
</div>
<DialogFooter>
<Button variant="outline" onClick={() => setLinkDialogOpen(false)}>Cancel</Button>
<Button onClick={handleCreateRelation} disabled={!linkToolId}>Create Link</Button>
<Button variant="outline" onClick={() => setLinkDialogOpen(false)}>{t("common.cancel")}</Button>
<Button onClick={handleCreateRelation} disabled={!linkToolId}>{t("detail.createLink")}</Button>
</DialogFooter>
</DialogContent>
</Dialog>
@@ -587,7 +586,7 @@ export default function ToolDetail() {
{c.billingPeriod && <span className="text-[10px] text-muted-foreground uppercase">{c.billingPeriod}</span>}
</div>
<div className="text-lg font-bold">
{c.cost != null ? `${c.cost} ${c.currency ?? ""}` : "Free"}
{c.cost != null ? `${c.cost} ${c.currency ?? ""}` : t("detail.licenseFree")}
</div>
{c.notes && <p className="text-xs text-muted-foreground mt-1 italic">{c.notes}</p>}
</div>
@@ -607,7 +606,7 @@ export default function ToolDetail() {
))}
</div>
) : (
<p className="text-sm text-muted-foreground py-4">No cost information added yet.</p>
<p className="text-sm text-muted-foreground py-4">{t("detail.noCostInfo")}</p>
)}
</div>
)}
@@ -616,45 +615,44 @@ export default function ToolDetail() {
<Dialog open={costDialogOpen} onOpenChange={(o) => { if (!o) setCostDialogOpen(false); }}>
<DialogContent>
<DialogHeader>
<DialogTitle className="flex items-center gap-2">
<DialogTitle>
{editCost ? t("detail.edit") + " " + t("detail.costs") : t("detail.addCost")}
<GuideHelp guide="kosten" label={t("detail.costs")} />
</DialogTitle>
<DialogDescription>Manage license cost information for this tool.</DialogDescription>
<DialogDescription>{t("detail.costDialogSub")}</DialogDescription>
</DialogHeader>
<div className="space-y-4 py-2">
<div className="space-y-2">
<label className="text-sm font-medium">License Type</label>
<label className="text-sm font-medium">{t("detail.licenseType")}</label>
<Select value={costLicenseType} onValueChange={setCostLicenseType}>
<SelectTrigger><SelectValue /></SelectTrigger>
<SelectContent>
<SelectItem value="free">Free</SelectItem>
<SelectItem value="subscription">Subscription</SelectItem>
<SelectItem value="one_time">One-Time</SelectItem>
<SelectItem value="usage_based">Usage-Based</SelectItem>
<SelectItem value="free">{t("detail.licenseFree")}</SelectItem>
<SelectItem value="subscription">{t("detail.licenseSubscription")}</SelectItem>
<SelectItem value="one_time">{t("detail.licenseOneTime")}</SelectItem>
<SelectItem value="usage_based">{t("detail.licenseUsageBased")}</SelectItem>
</SelectContent>
</Select>
</div>
{costLicenseType === "subscription" && (
<div className="space-y-2">
<label className="text-sm font-medium">Billing Period</label>
<label className="text-sm font-medium">{t("detail.billingPeriod")}</label>
<Select value={costBillingPeriod} onValueChange={setCostBillingPeriod}>
<SelectTrigger><SelectValue /></SelectTrigger>
<SelectContent>
<SelectItem value="monthly">Monthly</SelectItem>
<SelectItem value="quarterly">Quarterly</SelectItem>
<SelectItem value="yearly">Yearly</SelectItem>
<SelectItem value="monthly">{t("detail.billingMonthly")}</SelectItem>
<SelectItem value="quarterly">{t("detail.billingQuarterly")}</SelectItem>
<SelectItem value="yearly">{t("detail.billingYearly")}</SelectItem>
</SelectContent>
</Select>
</div>
)}
<div className="grid grid-cols-2 gap-4">
<div className="space-y-2">
<label className="text-sm font-medium">Cost</label>
<label className="text-sm font-medium">{t("detail.costLabel")}</label>
<Input type="number" step="0.01" placeholder="0.00" value={costAmount} onChange={(e) => setCostAmount(e.target.value)} />
</div>
<div className="space-y-2">
<label className="text-sm font-medium">Currency</label>
<label className="text-sm font-medium">{t("detail.currency")}</label>
<Select value={costCurrency} onValueChange={setCostCurrency}>
<SelectTrigger><SelectValue /></SelectTrigger>
<SelectContent>
@@ -667,13 +665,13 @@ export default function ToolDetail() {
</div>
</div>
<div className="space-y-2">
<label className="text-sm font-medium">Notes</label>
<Textarea placeholder="Billing details, contract info..." value={costNotes} onChange={(e) => setCostNotes(e.target.value)} />
<label className="text-sm font-medium">{t("detail.costNotes")}</label>
<Textarea placeholder={t("detail.costNotesPlaceholder")} value={costNotes} onChange={(e) => setCostNotes(e.target.value)} />
</div>
</div>
<DialogFooter>
<Button variant="outline" onClick={() => setCostDialogOpen(false)}>Cancel</Button>
<Button onClick={handleSaveCost}>Save</Button>
<Button variant="outline" onClick={() => setCostDialogOpen(false)}>{t("common.cancel")}</Button>
<Button onClick={handleSaveCost}>{t("common.save")}</Button>
</DialogFooter>
</DialogContent>
</Dialog>
@@ -719,8 +717,14 @@ export default function ToolDetail() {
<BarChart data={usefulnessData} layout="vertical" margin={{ top: 0, right: 0, bottom: 0, left: -20 }}>
<XAxis type="number" hide />
<YAxis dataKey="score" type="category" axisLine={false} tickLine={false} tickFormatter={(val) => `${val}`} tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} />
<Tooltip cursor={{ fill: 'transparent' }} />
<Bar dataKey="count" fill="hsl(var(--primary))" radius={[0, 4, 4, 0]} barSize={12} />
<Tooltip cursor={{ fill: 'transparent' }} contentStyle={{ backgroundColor: 'hsl(var(--popover))', border: '1px solid hsl(var(--border))', borderRadius: '8px', color: 'hsl(var(--foreground))' }} />
<defs>
<linearGradient id="neonBarFill" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stopColor="hsl(var(--glow-1))" />
<stop offset="100%" stopColor="hsl(var(--glow-2))" />
</linearGradient>
</defs>
<Bar dataKey="count" fill="url(#neonBarFill)" radius={[0, 4, 4, 0]} barSize={12} />
</BarChart>
</ResponsiveContainer>
</div>
@@ -742,11 +746,11 @@ export default function ToolDetail() {
<CartesianGrid strokeDasharray="3 3" opacity={0.2} />
<XAxis dataKey="date" hide />
<YAxis domain={[0, 5]} tick={{ fill: 'hsl(var(--foreground))', fontSize: 12 }} axisLine={false} tickLine={false} />
<Tooltip labelFormatter={(_, payload) => (payload?.[0] ? format(new Date(payload[0].payload.date), "dd.MM.yyyy HH:mm") : "")} />
<Tooltip labelFormatter={(_, payload) => (payload?.[0] ? format(new Date(payload[0].payload.date), "dd.MM.yyyy HH:mm") : "")} contentStyle={{ backgroundColor: 'hsl(var(--popover))', border: '1px solid hsl(var(--border))', borderRadius: '8px', color: 'hsl(var(--foreground))' }} />
<Legend wrapperStyle={{ fontSize: 12 }} />
<Line type="monotone" dataKey="combined" name="Combined" stroke="hsl(var(--primary))" strokeWidth={2} dot={false} />
<Line type="monotone" dataKey="usefulness" name="Usefulness" stroke="hsl(var(--success))" strokeWidth={1.5} dot={false} strokeDasharray="4 3" />
<Line type="monotone" dataKey="usability" name="Usability" stroke="hsl(var(--warning))" strokeWidth={1.5} dot={false} strokeDasharray="4 3" />
<Line type="monotone" dataKey="combined" name={t("detail.score")} stroke="hsl(var(--primary))" strokeWidth={2} dot={false} />
<Line type="monotone" dataKey="usefulness" name={t("detail.usefulness")} stroke="hsl(var(--success))" strokeWidth={1.5} dot={false} strokeDasharray="4 3" />
<Line type="monotone" dataKey="usability" name={t("detail.usability")} stroke="hsl(var(--warning))" strokeWidth={1.5} dot={false} strokeDasharray="4 3" />
</LineChart>
</ResponsiveContainer>
</div>
@@ -768,12 +772,12 @@ export default function ToolDetail() {
{isReviewFormOpen && (
<Card className="border-primary shadow-sm">
<CardHeader>
<CardTitle className="flex items-center gap-2">
{t("detail.addReview")}
<CardHeader className="flex flex-row items-start justify-between gap-4">
<div className="space-y-1.5">
<CardTitle>{t("detail.addReview")}</CardTitle>
<CardDescription>{t("detail.shareExperience", { name: tool.name })}</CardDescription>
</div>
<GuideHelp guide="bewerten" label={t("detail.addReview")} />
</CardTitle>
<CardDescription>Share your experience with {tool.name}</CardDescription>
</CardHeader>
<CardContent>
<Form {...form}>
@@ -786,7 +790,6 @@ export default function ToolDetail() {
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
{t("detail.usefulness")}
<FieldHelp schema="RatingInput" field="usefulness">{t("detail.usefulness")}</FieldHelp>
</FormLabel>
<div className="py-2">
<RatingStars
@@ -807,7 +810,6 @@ export default function ToolDetail() {
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
{t("detail.usability")}
<FieldHelp schema="RatingInput" field="usability">{t("detail.usability")}</FieldHelp>
</FormLabel>
<div className="py-2">
<RatingStars
@@ -829,12 +831,11 @@ export default function ToolDetail() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Comment (Optional)
<FieldHelp schema="RatingInput" field="comment">Comment</FieldHelp>
{t("detail.commentOptional")}
</FormLabel>
<FormControl>
<Textarea
placeholder="What do you think about this tool?"
placeholder={t("detail.commentPlaceholder")}
className="resize-none min-h-[100px]"
{...field}
/>
@@ -850,11 +851,10 @@ export default function ToolDetail() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Name (Optional)
<FieldHelp schema="RatingInput" field="reviewerName">Name</FieldHelp>
{t("detail.nameOptional")}
</FormLabel>
<FormControl>
<Input placeholder="Anonymous" {...field} />
<Input placeholder={t("detail.anonymousPlaceholder")} {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -868,7 +868,7 @@ export default function ToolDetail() {
onClick={() => setIsReviewFormOpen(false)}
disabled={createRating.isPending}
>
Cancel
{t("common.cancel")}
</Button>
<Button type="submit" disabled={createRating.isPending}>
{createRating.isPending ? t("common.loading") : t("detail.submit")}
@@ -891,7 +891,7 @@ export default function ToolDetail() {
<CardContent className="p-6">
<div className="flex justify-between items-start mb-4">
<div>
<span className="font-semibold">{rating.reviewerName || "Anonymous Engineer"}</span>
<span className="font-semibold">{rating.reviewerName || t("detail.anonymousEngineer")}</span>
<span className="text-muted-foreground text-sm ml-2">
{format(new Date(rating.createdAt), "MMM d, yyyy")}
</span>
@@ -921,7 +921,7 @@ export default function ToolDetail() {
<div className="text-center py-12 bg-muted/30 border border-dashed rounded-xl">
<Star className="w-12 h-12 text-muted-foreground/30 mx-auto mb-3" />
<h4 className="text-lg font-medium">{t("detail.noReviews")}</h4>
<p className="text-muted-foreground mt-1">Be the first to share your thoughts on this tool.</p>
<p className="text-muted-foreground mt-1">{t("detail.beFirstToReview")}</p>
</div>
)}
</div>
+48 -48
View File
@@ -30,30 +30,35 @@ import { CategoryCombobox } from "@/components/category-combobox";
import { FeatureInput } from "@/components/feature-input";
import { TagInput } from "@/components/tag-input";
import { useAuth } from "@/hooks/use-auth";
import { FieldHelp } from "@/components/field-help";
import { GuideHelp } from "@/components/guide-help";
import { useTranslation } from "react-i18next";
const toolSchema = z.object({
name: z.string().min(2, "Name must be at least 2 characters"),
description: z.string().min(10, "Description must be at least 10 characters"),
category: z.string().min(2, "Category is required"),
websiteUrl: z.string().url("Must be a valid URL").optional().or(z.literal("")),
iconUrl: z.string().url("Must be a valid URL").optional().or(z.literal("")),
type ToolFormValues = z.infer<ReturnType<typeof buildToolSchema>>;
function buildToolSchema(t: (key: string) => string) {
return z.object({
name: z.string().min(2, t("toolForm.nameMin")),
description: z.string().min(10, t("toolForm.descriptionMin")),
category: z.string().min(2, t("toolForm.categoryRequired")),
websiteUrl: z.string().url(t("toolForm.invalidUrl")).optional().or(z.literal("")),
iconUrl: z.string().url(t("toolForm.invalidUrl")).optional().or(z.literal("")),
features: z.array(z.object({ value: z.string() })).optional(),
tags: z.array(z.object({ value: z.string() })).optional(),
});
type ToolFormValues = z.infer<typeof toolSchema>;
}
export default function ToolEdit() {
const [match, params] = useRoute("/tools/:id/edit");
const [, setLocation] = useLocation();
const id = parseInt(params?.id || "0", 10);
const { t } = useTranslation();
const { toast } = useToast();
const queryClient = useQueryClient();
const updateTool = useUpdateTool();
const { isAuthenticated, isAdmin } = useAuth();
const toolSchema = buildToolSchema(t);
const { data: tool, isLoading } = useGetTool(id, {
query: { enabled: !!id, queryKey: getGetToolQueryKey(id) },
});
@@ -108,7 +113,7 @@ export default function ToolEdit() {
{ id, data: payload },
{
onSuccess: () => {
toast({ title: "Tool updated", description: "Changes saved successfully." });
toast({ title: t("toolForm.toastUpdated"), description: t("toolForm.toastUpdatedSub") });
queryClient.invalidateQueries({ queryKey: getGetToolQueryKey(id) });
queryClient.invalidateQueries({ queryKey: getListToolsQueryKey() });
queryClient.invalidateQueries({ queryKey: getListCategoriesQueryKey() });
@@ -120,8 +125,8 @@ export default function ToolEdit() {
},
onError: (err) => {
toast({
title: "Failed to update tool",
description: err.data?.error || err.message || "An unexpected error occurred.",
title: t("toolForm.toastUpdateFailed"),
description: err.data?.error || err.message || t("detail.unexpectedError"),
variant: "destructive",
});
},
@@ -138,13 +143,13 @@ export default function ToolEdit() {
<div className="max-w-3xl mx-auto space-y-6 pb-10">
<Button variant="ghost" asChild className="mb-2 -ml-4 text-muted-foreground">
<Link href={`/tools/${id}`}>
<ArrowLeft className="w-4 h-4 mr-2" /> Back to tool
<ArrowLeft className="w-4 h-4 mr-2" /> {t("toolForm.backToTool")}
</Link>
</Button>
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">Edit Tool</h1>
<p className="text-muted-foreground">Update tool details and metadata.</p>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("toolForm.editTitle")}</h1>
<p className="text-muted-foreground">{t("toolForm.editSubtitle")}</p>
</div>
{isLoading ? (
@@ -157,13 +162,15 @@ export default function ToolEdit() {
</Card>
) : (
<Card>
<CardHeader>
<CardHeader className="flex flex-row items-start justify-between gap-4">
<div className="space-y-1.5">
<CardTitle className="flex items-center gap-2">
<Pencil className="w-5 h-5 text-primary" />
Tool Details
<GuideHelp guide="tool-bearbeiten" label="Tool Details" />
{t("toolForm.toolDetails")}
</CardTitle>
<CardDescription>Modify the tool information below.</CardDescription>
<CardDescription>{t("toolForm.toolDetailsEditSub")}</CardDescription>
</div>
<GuideHelp guide="tool-bearbeiten" label={t("toolForm.toolDetails")} />
</CardHeader>
<CardContent>
<Form {...form}>
@@ -175,11 +182,10 @@ export default function ToolEdit() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Name
<FieldHelp schema="ToolInput" field="name">Name</FieldHelp>
{t("toolForm.name")}
</FormLabel>
<FormControl>
<Input placeholder="Tool name" {...field} />
<Input placeholder={t("toolForm.name")} {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -191,8 +197,7 @@ export default function ToolEdit() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Category
<FieldHelp schema="ToolInput" field="category">Category</FieldHelp>
{t("toolForm.category")}
</FormLabel>
<FormControl>
<CategoryCombobox value={field.value} onChange={field.onChange} />
@@ -209,11 +214,10 @@ export default function ToolEdit() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Website URL (Optional)
<FieldHelp schema="ToolInput" field="websiteUrl">Website URL</FieldHelp>
{t("toolForm.websiteUrlOptional")}
</FormLabel>
<FormControl>
<Input placeholder="https://..." type="url" {...field} />
<Input placeholder={t("toolForm.urlPlaceholder")} type="url" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -226,8 +230,7 @@ export default function ToolEdit() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Icon / Logo URL (Optional)
<FieldHelp schema="ToolInput" field="iconUrl">Icon / Logo URL</FieldHelp>
{t("toolForm.iconUrlOptional")}
</FormLabel>
<FormControl>
<div className="flex items-center gap-3">
@@ -235,16 +238,16 @@ export default function ToolEdit() {
{field.value ? (
<img
src={field.value}
alt="icon preview"
alt={t("toolForm.iconPreview")}
className="w-full h-full object-contain p-0.5"
onError={(e) => { (e.target as HTMLImageElement).style.display = "none"; }}
/>
) : (
<span className="text-xs text-muted-foreground">img</span>
<span className="text-xs text-muted-foreground">{t("toolForm.name").charAt(0)}</span>
)}
</div>
<Input
placeholder="https://example.com/logo.png"
placeholder={t("toolForm.logoPlaceholder")}
type="url"
{...field}
className="flex-1"
@@ -262,12 +265,11 @@ export default function ToolEdit() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Description
<FieldHelp schema="ToolInput" field="description">Description</FieldHelp>
{t("toolForm.description")}
</FormLabel>
<FormControl>
<Textarea
placeholder="What does this tool do?"
placeholder={t("toolForm.descriptionPlaceholderEdit")}
className="min-h-[120px] resize-none"
{...field}
/>
@@ -281,13 +283,12 @@ export default function ToolEdit() {
<div className="flex justify-between items-center">
<div>
<h3 className="text-lg font-medium inline-flex items-center gap-1.5">
Features
<FieldHelp schema="ToolInput" field="features">Features</FieldHelp>
{t("toolForm.features")}
</h3>
<p className="text-sm text-muted-foreground">Key capabilities of this tool. Existing features from other tools are selectable.</p>
<p className="text-sm text-muted-foreground">{t("toolForm.featuresEditSub")}</p>
</div>
<Button type="button" variant="outline" size="sm" onClick={() => appendFeature({ value: "" })}>
<Plus className="w-4 h-4 mr-2" /> Add Feature
<Plus className="w-4 h-4 mr-2" /> {t("toolForm.addFeature")}
</Button>
</div>
<div className="space-y-3">
@@ -302,7 +303,7 @@ export default function ToolEdit() {
<FeatureInput
value={field.value ?? ""}
onChange={field.onChange}
placeholder="e.g. Real-time collaboration"
placeholder={t("toolForm.featurePlaceholder")}
/>
</FormControl>
<Button
@@ -319,7 +320,7 @@ export default function ToolEdit() {
/>
))}
{featureFields.length === 0 && (
<p className="text-sm text-muted-foreground italic">No features added.</p>
<p className="text-sm text-muted-foreground italic">{t("toolForm.noFeatures")}</p>
)}
</div>
</div>
@@ -328,13 +329,12 @@ export default function ToolEdit() {
<div className="flex justify-between items-center">
<div>
<h3 className="text-lg font-medium inline-flex items-center gap-1.5">
Tags
<FieldHelp schema="ToolInput" field="tags">Tags</FieldHelp>
{t("toolForm.tags")}
</h3>
<p className="text-sm text-muted-foreground">Keywords for this tool. Existing tags from other tools are selectable.</p>
<p className="text-sm text-muted-foreground">{t("toolForm.tagsEditSub")}</p>
</div>
<Button type="button" variant="outline" size="sm" onClick={() => appendTag({ value: "" })}>
<Plus className="w-4 h-4 mr-2" /> Add Tag
<Plus className="w-4 h-4 mr-2" /> {t("toolForm.addTag")}
</Button>
</div>
<div className="flex flex-wrap gap-2">
@@ -347,7 +347,7 @@ export default function ToolEdit() {
<FormItem className="flex items-center space-y-0 relative w-[200px]">
<FormControl>
<TagInput
placeholder="Tag"
placeholder={t("toolForm.tag")}
className="pr-8 h-9 text-sm"
onChange={field.onChange}
value={field.value ?? ""}
@@ -371,10 +371,10 @@ export default function ToolEdit() {
<div className="pt-6 border-t flex justify-end gap-3">
<Button type="button" variant="outline" asChild>
<Link href={`/tools/${id}`}>Cancel</Link>
<Link href={`/tools/${id}`}>{t("common.cancel")}</Link>
</Button>
<Button type="submit" disabled={updateTool.isPending || !isAuthenticated}>
{updateTool.isPending ? "Saving" : "Save Changes"}
{updateTool.isPending ? t("toolForm.saving") : t("toolForm.saveChanges")}
</Button>
</div>
</form>
+49 -49
View File
@@ -18,28 +18,33 @@ import { CategoryCombobox } from "@/components/category-combobox";
import { FeatureInput } from "@/components/feature-input";
import { TagInput } from "@/components/tag-input";
import { useAuth } from "@/hooks/use-auth";
import { FieldHelp } from "@/components/field-help";
import { GuideHelp } from "@/components/guide-help";
import { useTranslation } from "react-i18next";
const toolSchema = z.object({
name: z.string().min(2, "Name must be at least 2 characters"),
description: z.string().min(10, "Description must be at least 10 characters"),
category: z.string().min(2, "Category is required"),
websiteUrl: z.string().url("Must be a valid URL").optional().or(z.literal("")),
iconUrl: z.string().url("Must be a valid URL").optional().or(z.literal("")),
type ToolFormValues = z.infer<ReturnType<typeof buildToolSchema>>;
function buildToolSchema(t: (key: string) => string) {
return z.object({
name: z.string().min(2, t("toolForm.nameMin")),
description: z.string().min(10, t("toolForm.descriptionMin")),
category: z.string().min(2, t("toolForm.categoryRequired")),
websiteUrl: z.string().url(t("toolForm.invalidUrl")).optional().or(z.literal("")),
iconUrl: z.string().url(t("toolForm.invalidUrl")).optional().or(z.literal("")),
features: z.array(z.object({ value: z.string() })).optional(),
tags: z.array(z.object({ value: z.string() })).optional(),
});
type ToolFormValues = z.infer<typeof toolSchema>;
}
export default function ToolNew() {
const [location, setLocation] = useLocation();
const { t } = useTranslation();
const { toast } = useToast();
const queryClient = useQueryClient();
const createTool = useCreateTool();
const { isAuthenticated, isLoading: authLoading, login } = useAuth();
const toolSchema = buildToolSchema(t);
const form = useForm<ToolFormValues>({
resolver: zodResolver(toolSchema),
defaultValues: {
@@ -76,7 +81,7 @@ export default function ToolNew() {
{ data: payload },
{
onSuccess: (newTool) => {
toast({ title: "Tool added successfully", description: "Your tool is now available for review." });
toast({ title: t("toolForm.toastAdded"), description: t("toolForm.toastAddedSub") });
queryClient.invalidateQueries({ queryKey: getListToolsQueryKey() });
queryClient.invalidateQueries({ queryKey: getListCategoriesQueryKey() });
queryClient.invalidateQueries({ queryKey: getListAllFeaturesQueryKey() });
@@ -86,7 +91,7 @@ export default function ToolNew() {
setLocation(`/tools/${newTool.id}`);
},
onError: () => {
toast({ title: "Failed to add tool", description: "An unexpected error occurred.", variant: "destructive" });
toast({ title: t("toolForm.toastAddFailed"), description: t("detail.unexpectedError"), variant: "destructive" });
},
},
);
@@ -97,36 +102,38 @@ export default function ToolNew() {
<div className="max-w-3xl mx-auto space-y-6 pb-10">
<Button variant="ghost" asChild className="mb-2 -ml-4 text-muted-foreground">
<Link href="/tools">
<ArrowLeft className="w-4 h-4 mr-2" /> Back to browse
<ArrowLeft className="w-4 h-4 mr-2" /> {t("toolForm.backToBrowse")}
</Link>
</Button>
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">Add a New Tool</h1>
<p className="text-muted-foreground">Submit a tool you use to let the community rate and review it.</p>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("toolForm.addTitle")}</h1>
<p className="text-muted-foreground">{t("toolForm.addSubtitle")}</p>
</div>
{!authLoading && !isAuthenticated && (
<div className="flex items-center gap-4 rounded-md border border-primary/20 bg-primary/5 px-4 py-3">
<LogIn className="w-5 h-5 text-primary shrink-0" />
<div className="flex-1 min-w-0">
<p className="text-sm font-medium">Sign in required</p>
<p className="text-xs text-muted-foreground">You must be signed in to submit a tool.</p>
<p className="text-sm font-medium">{t("toolForm.signInRequired")}</p>
<p className="text-xs text-muted-foreground">{t("toolForm.signInRequiredSub")}</p>
</div>
<Button size="sm" onClick={() => login(location)} data-testid="button-login-prompt">
Sign in
{t("auth.signIn")}
</Button>
</div>
)}
<Card>
<CardHeader>
<CardHeader className="flex flex-row items-start justify-between gap-4">
<div className="space-y-1.5">
<CardTitle className="flex items-center gap-2">
<Wrench className="w-5 h-5 text-primary" />
Tool Details
<GuideHelp guide="tool-anlegen" label="Tool Details" />
{t("toolForm.toolDetails")}
</CardTitle>
<CardDescription>Provide the basic information about the tool.</CardDescription>
<CardDescription>{t("toolForm.toolDetailsNewSub")}</CardDescription>
</div>
<GuideHelp guide="tool-anlegen" label={t("toolForm.toolDetails")} />
</CardHeader>
<CardContent>
<Form {...form}>
@@ -138,11 +145,10 @@ export default function ToolNew() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Name
<FieldHelp schema="ToolInput" field="name">Name</FieldHelp>
{t("toolForm.name")}
</FormLabel>
<FormControl>
<Input placeholder="e.g. React, Next.js, Postgres" {...field} data-testid="input-tool-name" />
<Input placeholder={t("toolForm.namePlaceholder")} {...field} data-testid="input-tool-name" />
</FormControl>
<FormMessage />
</FormItem>
@@ -155,8 +161,7 @@ export default function ToolNew() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Category
<FieldHelp schema="ToolInput" field="category">Category</FieldHelp>
{t("toolForm.category")}
</FormLabel>
<FormControl>
<CategoryCombobox
@@ -176,11 +181,10 @@ export default function ToolNew() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Website URL (Optional)
<FieldHelp schema="ToolInput" field="websiteUrl">Website URL</FieldHelp>
{t("toolForm.websiteUrlOptional")}
</FormLabel>
<FormControl>
<Input placeholder="https://..." type="url" {...field} data-testid="input-tool-url" />
<Input placeholder={t("toolForm.urlPlaceholder")} type="url" {...field} data-testid="input-tool-url" />
</FormControl>
<FormMessage />
</FormItem>
@@ -193,8 +197,7 @@ export default function ToolNew() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Icon / Logo URL (Optional)
<FieldHelp schema="ToolInput" field="iconUrl">Icon / Logo URL</FieldHelp>
{t("toolForm.iconUrlOptional")}
</FormLabel>
<FormControl>
<div className="flex items-center gap-3">
@@ -202,16 +205,16 @@ export default function ToolNew() {
{field.value ? (
<img
src={field.value}
alt="icon preview"
alt={t("toolForm.iconPreview")}
className="w-full h-full object-contain p-0.5"
onError={(e) => { (e.target as HTMLImageElement).style.display = "none"; }}
/>
) : (
<span className="text-xs text-muted-foreground">img</span>
<span className="text-xs text-muted-foreground">{t("toolForm.name").charAt(0)}</span>
)}
</div>
<Input
placeholder="https://example.com/logo.png"
placeholder={t("toolForm.logoPlaceholder")}
type="url"
{...field}
data-testid="input-tool-icon-url"
@@ -230,12 +233,11 @@ export default function ToolNew() {
render={({ field }) => (
<FormItem>
<FormLabel className="inline-flex items-center gap-1.5">
Description
<FieldHelp schema="ToolInput" field="description">Description</FieldHelp>
{t("toolForm.description")}
</FormLabel>
<FormControl>
<Textarea
placeholder="What does this tool do? Why do people use it?"
placeholder={t("toolForm.descriptionPlaceholderNew")}
className="min-h-[120px] resize-none"
{...field}
data-testid="input-tool-description"
@@ -250,10 +252,9 @@ export default function ToolNew() {
<div className="flex justify-between items-center">
<div>
<h3 className="text-lg font-medium inline-flex items-center gap-1.5">
Features
<FieldHelp schema="ToolInput" field="features">Features</FieldHelp>
{t("toolForm.features")}
</h3>
<p className="text-sm text-muted-foreground">List key capabilities. Existing features from other tools are selectable.</p>
<p className="text-sm text-muted-foreground">{t("toolForm.featuresNewSub")}</p>
</div>
<Button
type="button"
@@ -262,7 +263,7 @@ export default function ToolNew() {
onClick={() => appendFeature({ value: "" })}
data-testid="button-add-feature"
>
<Plus className="w-4 h-4 mr-2" /> Add Feature
<Plus className="w-4 h-4 mr-2" /> {t("toolForm.addFeature")}
</Button>
</div>
@@ -278,7 +279,7 @@ export default function ToolNew() {
<FeatureInput
value={field.value ?? ""}
onChange={field.onChange}
placeholder="e.g. Real-time collaboration"
placeholder={t("toolForm.featurePlaceholder")}
data-testid={`input-feature-${index}`}
/>
</FormControl>
@@ -297,7 +298,7 @@ export default function ToolNew() {
/>
))}
{featureFields.length === 0 && (
<p className="text-sm text-muted-foreground italic">No features added.</p>
<p className="text-sm text-muted-foreground italic">{t("toolForm.noFeatures")}</p>
)}
</div>
</div>
@@ -306,10 +307,9 @@ export default function ToolNew() {
<div className="flex justify-between items-center">
<div>
<h3 className="text-lg font-medium inline-flex items-center gap-1.5">
Tags
<FieldHelp schema="ToolInput" field="tags">Tags</FieldHelp>
{t("toolForm.tags")}
</h3>
<p className="text-sm text-muted-foreground">Keywords to help find this tool. Existing tags from other tools are selectable.</p>
<p className="text-sm text-muted-foreground">{t("toolForm.tagsHelp")}</p>
</div>
<Button
type="button"
@@ -318,7 +318,7 @@ export default function ToolNew() {
onClick={() => appendTag({ value: "" })}
data-testid="button-add-tag"
>
<Plus className="w-4 h-4 mr-2" /> Add Tag
<Plus className="w-4 h-4 mr-2" /> {t("toolForm.addTag")}
</Button>
</div>
@@ -332,7 +332,7 @@ export default function ToolNew() {
<FormItem className="flex items-center space-y-0 relative w-[200px]">
<FormControl>
<TagInput
placeholder="Tag"
placeholder={t("toolForm.tagPlaceholder")}
className="pr-8 h-9 text-sm"
onChange={field.onChange}
value={field.value ?? ""}
@@ -363,7 +363,7 @@ export default function ToolNew() {
className="w-full sm:w-auto"
data-testid="button-submit-tool"
>
{createTool.isPending ? "Adding Tool..." : "Submit Tool"}
{createTool.isPending ? t("toolForm.addingTool") : t("toolForm.submitTool")}
</Button>
</div>
</form>
+20 -9
View File
@@ -18,6 +18,7 @@ import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent,
import { useBrowsePreferences, isViewMode, isDensity } from "@/hooks/use-browse-preferences";
import { useAuth } from "@/hooks/use-auth";
import { useWatchlist } from "@/hooks/use-watchlist";
import { useToast } from "@/hooks/use-toast";
import { CompareBar } from "@/components/compare-bar";
import { useTranslation } from "react-i18next";
import { Input } from "@/components/ui/input";
@@ -91,12 +92,20 @@ export default function ToolsBrowse() {
const { serverView, serverDensity, localView, localDensity, persist } = useBrowsePreferences();
const { hasFeature } = useAuth();
const { isWatched, toggle: toggleWatchlist, canWatchlist } = useWatchlist();
const { toast } = useToast();
const [compareIds, setCompareIds] = useState<number[]>([]);
const [compareUpsellOpen, setCompareUpsellOpen] = useState(false);
function toggleCompare(id: number) {
setCompareIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));
setCompareIds((prev) => {
if (prev.includes(id)) return prev.filter((x) => x !== id);
if (prev.length >= 9) {
toast({ title: t("browse.compareLimitReached"), variant: "destructive" });
return prev;
}
return [...prev, id];
});
}
const [search, setSearch] = useState(initialSearch);
@@ -230,7 +239,9 @@ export default function ToolsBrowse() {
<div className="space-y-6 pb-8">
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-end gap-4">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("nav.browseTools")}</h1>
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("nav.browseTools")}
</h1>
<p className="text-muted-foreground">{t("browse.subtitle")}</p>
</div>
<Button asChild>
@@ -362,7 +373,7 @@ export default function ToolsBrowse() {
<button
onClick={() => setFeatures(features.filter((x) => x !== f))}
className="rounded-sm hover:bg-muted p-0.5"
aria-label={`Remove feature ${f}`}
aria-label={t("filter.removeFeature", { feature: f })}
>
<X className="w-3.5 h-3.5" />
</button>
@@ -374,14 +385,14 @@ export default function ToolsBrowse() {
<button
onClick={() => setMinRating(null)}
className="rounded-sm hover:bg-muted p-0.5"
aria-label="Remove min rating"
aria-label={t("filter.removeMinRating")}
>
<X className="w-3.5 h-3.5" />
</button>
</Badge>
)}
<Button variant="link" size="sm" className="px-1 text-muted-foreground" onClick={clearFilters}>
Clear all
{t("common.clearAll")}
</Button>
</div>
)}
@@ -521,15 +532,15 @@ export default function ToolsBrowse() {
<AlertDialog open={compareUpsellOpen} onOpenChange={setCompareUpsellOpen}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Compare is a Premium feature</AlertDialogTitle>
<AlertDialogTitle>{t("browse.comparePremiumTitle")}</AlertDialogTitle>
<AlertDialogDescription>
Comparing tools side-by-side is available to Premium and Enterprise users. Upgrade your plan to unlock it.
{t("browse.comparePremiumSub")}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Not now</AlertDialogCancel>
<AlertDialogCancel>{t("browse.notNow")}</AlertDialogCancel>
<AlertDialogAction asChild>
<a href="/admin?tab=plan">Upgrade to Premium</a>
<a href="/admin?tab=plan">{t("browse.upgradePremium")}</a>
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
+34 -32
View File
@@ -11,7 +11,6 @@ import {
getListAllTagsQueryKey,
getGetTopToolsQueryKey,
getGetAnalyticsSummaryQueryKey,
type Tool,
} from "@workspace/api-client-react";
import { useQueryClient } from "@tanstack/react-query";
import { useAuth } from "@/hooks/use-auth";
@@ -91,12 +90,12 @@ export default function Trash() {
{ data: { ids } },
{
onSuccess: (res) => {
toast({ title: "Tools restored", description: `${res.restored ?? ids.length} tool(s) restored.` });
toast({ title: t("trash.toastRestored"), description: t("trash.toastRestoredSub", { count: res.restored ?? ids.length }) });
setSelected(new Set());
invalidate();
},
onError: (err) => {
toast({ title: "Failed to restore", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("trash.toastRestoreFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -107,13 +106,13 @@ export default function Trash() {
{ data: { ids } },
{
onSuccess: () => {
toast({ title: "Tools deleted", description: `${ids.length} tool(s) permanently removed.` });
toast({ title: t("trash.toastDeleted"), description: t("trash.toastDeletedSub", { count: ids.length }) });
setSelected(new Set());
setConfirmDelete(false);
invalidate();
},
onError: (err) => {
toast({ title: "Failed to delete", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("trash.toastDeleteFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -124,13 +123,13 @@ export default function Trash() {
undefined,
{
onSuccess: (res) => {
toast({ title: "Trash emptied", description: `${res.deleted ?? 0} tool(s) permanently removed.` });
toast({ title: t("trash.toastEmptied"), description: t("trash.toastEmptiedSub", { count: res.deleted ?? 0 }) });
setSelected(new Set());
setConfirmEmpty(false);
invalidate();
},
onError: (err) => {
toast({ title: "Failed to empty trash", description: err.data?.error ?? err.message, variant: "destructive" });
toast({ title: t("trash.toastEmptyFailed"), description: err.data?.error ?? err.message, variant: "destructive" });
},
},
);
@@ -157,7 +156,9 @@ export default function Trash() {
<Layout>
<div className="space-y-6 pb-10">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2">{t("trash.title")}</h1>
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("trash.title")}
</h1>
<p className="text-muted-foreground">{t("trash.subtitle")}</p>
</div>
@@ -191,7 +192,8 @@ export default function Trash() {
<>
<Button
size="sm"
variant="destructive"
variant="outline"
className="text-destructive hover:bg-destructive hover:text-destructive-foreground"
disabled={selectedIds.length === 0 || deletePermanent.isPending}
onClick={() => setConfirmDelete(true)}
>
@@ -227,48 +229,48 @@ export default function Trash() {
<Checkbox
checked={selected.size === trashed.length && trashed.length > 0}
onCheckedChange={toggleAll}
aria-label="Select all"
aria-label={t("trash.selectAll")}
/>
</TableHead>
<TableHead>Name</TableHead>
<TableHead>Category</TableHead>
<TableHead>{t("trash.name")}</TableHead>
<TableHead>{t("trash.category")}</TableHead>
<TableHead>{t("trash.deletedAt")}</TableHead>
<TableHead>{t("trash.deletedBy")}</TableHead>
<TableHead className="text-right">Actions</TableHead>
<TableHead className="text-right">{t("trash.actions")}</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{trashed.map((t: Tool) => (
<TableRow key={t.id} className={selected.has(t.id) ? "bg-muted/40" : undefined}>
{trashed.map((tool) => (
<TableRow key={tool.id} className={selected.has(tool.id) ? "bg-muted/40" : undefined}>
<TableCell>
<Checkbox
checked={selected.has(t.id)}
onCheckedChange={() => toggle(t.id)}
aria-label={`Select ${t.name}`}
checked={selected.has(tool.id)}
onCheckedChange={() => toggle(tool.id)}
aria-label={t("trash.selectName", { name: tool.name })}
/>
</TableCell>
<TableCell className="font-medium">{t.name}</TableCell>
<TableCell className="font-medium">{tool.name}</TableCell>
<TableCell>
<Badge variant="outline">{t.category}</Badge>
<Badge variant="outline">{tool.category}</Badge>
</TableCell>
<TableCell className="text-sm text-muted-foreground">
{t.deletedAt ? format(new Date(t.deletedAt), "dd.MM.yyyy HH:mm") : "—"}
{tool.deletedAt ? format(new Date(tool.deletedAt), "dd.MM.yyyy HH:mm") : "—"}
</TableCell>
<TableCell className="text-sm text-muted-foreground">{t.deletedBy ?? "—"}</TableCell>
<TableCell className="text-sm text-muted-foreground">{tool.deletedBy ?? "—"}</TableCell>
<TableCell className="text-right">
<div className="flex justify-end gap-1">
<Button variant="ghost" size="sm" onClick={() => handleRestore([t.id])} disabled={restore.isPending}>
<RotateCcw className="w-3.5 h-3.5" /> Restore
<Button variant="ghost" size="sm" onClick={() => handleRestore([tool.id])} disabled={restore.isPending}>
<RotateCcw className="w-3.5 h-3.5" /> {t("trash.restoreAction")}
</Button>
{isAdmin && (
<Button
variant="ghost"
size="sm"
className="text-destructive hover:text-destructive"
onClick={() => handleDeletePermanent([t.id])}
onClick={() => handleDeletePermanent([tool.id])}
disabled={deletePermanent.isPending}
>
<TrashIcon className="w-3.5 h-3.5" /> Delete
<TrashIcon className="w-3.5 h-3.5" /> {t("trash.deleteAction")}
</Button>
)}
</div>
@@ -285,13 +287,13 @@ export default function Trash() {
<AlertDialog open={confirmDelete} onOpenChange={setConfirmDelete}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Delete {selectedIds.length} tool(s) permanently?</AlertDialogTitle>
<AlertDialogTitle>{t("trash.deleteConfirmTitle", { count: selectedIds.length })}</AlertDialogTitle>
<AlertDialogDescription>
This permanently removes the selected tools along with all their ratings, costs and relations. This cannot be undone.
{t("trash.deleteConfirmSub")}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogCancel>{t("common.cancel")}</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
onClick={() => handleDeletePermanent(selectedIds)}
@@ -305,13 +307,13 @@ export default function Trash() {
<AlertDialog open={confirmEmpty} onOpenChange={setConfirmEmpty}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Empty the trash?</AlertDialogTitle>
<AlertDialogTitle>{t("trash.emptyConfirmTitle")}</AlertDialogTitle>
<AlertDialogDescription>
This permanently removes all {trashed.length} tool(s) in the trash along with their ratings, costs and relations. This cannot be undone.
{t("trash.emptyConfirmSub", { count: trashed.length })}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogCancel>{t("common.cancel")}</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
onClick={handleEmpty}
+2 -4
View File
@@ -6,7 +6,6 @@ import { useAuth } from "@/hooks/use-auth";
import { useWatchlist } from "@/hooks/use-watchlist";
import { Layout } from "@/components/layout";
import { ToolCard } from "@/components/tool-card";
import { GuideHelp } from "@/components/guide-help";
import { Button } from "@/components/ui/button";
import { Skeleton } from "@/components/ui/skeleton";
import { ShieldAlert, Bookmark } from "lucide-react";
@@ -43,9 +42,8 @@ export default function Watchlist() {
<Layout>
<div className="space-y-6 pb-10">
<div>
<h1 className="text-3xl font-bold tracking-tight mb-2 flex items-center gap-2">
<h1 className="text-3xl font-bold tracking-tight mb-2">
{t("watchlist.title")}
<GuideHelp guide="watchlist" label={t("watchlist.title")} />
</h1>
<p className="text-muted-foreground">{t("watchlist.subtitle")}</p>
</div>
@@ -62,7 +60,7 @@ export default function Watchlist() {
{t("watchlist.emptySub")}
</p>
<Button variant="outline" asChild>
<a href="/tools">Browse tools</a>
<a href="/tools">{t("common.browseTools")}</a>
</Button>
</div>
) : (
+295
View File
@@ -0,0 +1,295 @@
# Beispiel-YAML zum Import in den Admin-Bereich (Tab „Tools" -> Importieren).
# Erwartetes Format pro Eintrag:
# name (Pflicht)
# description, category, websiteUrl, iconUrl (optional)
# features, tags (Listen oder | -getrennte Strings)
# Das Format wird automatisch erkannt; bei CSV den Trenner wählen.
# Fehlerhafte Zeilen werden übersprungen und mit Zeilennummer aufgelistet.
- name: Slack
description: Team-Kommunikation mit Channels, Direktnachrichten und App-Integrationen
category: Kommunikation
websiteUrl: https://slack.com
features:
- Channels
- Videoanrufe
- App-Integrationen
tags:
- communication
- teamwork
- name: Microsoft Teams
description: Chat, Besprechungen, Dateien und Zusammenarbeit in einer Plattform
category: Kommunikation
websiteUrl: https://www.microsoft.com/de-de/microsoft-365/microsoft-teams
features:
- Videokonferenzen
- Teamkanäle
- Office-Integration
tags:
- communication
- meetings
- name: Zoom
description: Videokonferenzen und Webinare für Teams und externe Partner
category: Kommunikation
websiteUrl: https://zoom.us
features:
- Videokonferenzen
- Webinare
- Bildschirmfreigabe
tags:
- video
- meetings
- name: Jira
description: Agile Projekt- und Issue-Verfolgung für Entwicklung und Betrieb
category: Projektmanagement
websiteUrl: https://www.atlassian.com/software/jira
features:
- Backlog
- Sprints
- Kanban-Boards
tags:
- agile
- project-management
- name: Confluence
description: Kollaborative Wissensdatenbank und Dokumentation für Teams
category: Projektmanagement
websiteUrl: https://www.atlassian.com/software/confluence
features:
- Wikis
- Seitenbausteine
- Berechtigungen
tags:
- documentation
- knowledge-base
- name: GitLab
description: DevOps-Plattform mit Git-Repositorys, CI/CD und Code-Review
category: Entwicklung
websiteUrl: https://about.gitlab.com
features:
- Git-Repositorys
- CI/CD
- Merge Requests
tags:
- devops
- git
- name: GitHub
description: Versionsverwaltung, Code-Review und Collaboration auf Git-Basis
category: Entwicklung
websiteUrl: https://github.com
features:
- Repositories
- Pull Requests
- Actions
tags:
- git
- collaboration
- name: Jenkins
description: Automatisierte Build- und Deploy-Pipelines für Softwareprojekte
category: CI/CD
websiteUrl: https://www.jenkins.io
features:
- Pipelines
- Plugins
- Job-Automatisierung
tags:
- ci
- cd
- name: Docker
description: Container-Plattform zum Paketieren und Ausführen von Anwendungen
category: Entwicklung
websiteUrl: https://www.docker.com
features:
- Container
- Images
- Compose
tags:
- containers
- virtualization
- name: Grafana
description: Observability- und Dashboard-Plattform für Metriken, Logs und Alerts
category: Monitoring
websiteUrl: https://grafana.com
features:
- Dashboards
- Alerts
- Datenquellen
tags:
- observability
- monitoring
- name: Prometheus
description: Open-Source-Systeme zur Zeitreihen-Metrikerfassung und -Auswertung
category: Monitoring
websiteUrl: https://prometheus.io
features:
- Metriken
- Alerting
- Time-Series-Datenbank
tags:
- monitoring
- metrics
- name: Datadog
description: Cloud-basierte Observability für Infrastruktur, APM und Logs
category: Monitoring
websiteUrl: https://www.datadoghq.com
features:
- Infrastruktur-Monitoring
- APM
- Log-Management
tags:
- observability
- saas
- name: PagerDuty
description: Incident-Management und On-Call-Benachrichtigungen für Teams
category: Betrieb
websiteUrl: https://www.pagerduty.com
features:
- Alerting
- On-Call-Pläne
- Incident-Response
tags:
- incident-management
- on-call
- name: Sentry
description: Fehlerüberwachung und Performance-Monitoring für Anwendungen
category: Monitoring
websiteUrl: https://sentry.io
features:
- Error-Tracking
- Releases
- Performance
tags:
- error-monitoring
- debugging
- name: Terraform
description: Infrastructure-as-Code zur deklarativen Bereitstellung von Ressourcen
category: Infrastruktur
websiteUrl: https://www.terraform.io
features:
- Modules
- State-Management
- Provider
tags:
- iac
- infrastructure
- name: Ansible
description: Agentenlose Automatisierung für Konfiguration, Deploy und Orchestrierung
category: Infrastruktur
websiteUrl: https://www.ansible.com
features:
- Playbooks
- Inventories
- Modules
tags:
- automation
- configuration
- name: Elasticsearch
description: Verteilter Such- und Analytics-Server für Logs, Metriken und Daten
category: Datenbank
websiteUrl: https://www.elastic.co
features:
- Volltextsuche
- Aggregationen
- Skalierung
tags:
- search
- analytics
- name: Kubernetes
description: Container-Orchestrierung für Deployment, Skalierung und Betrieb
category: Infrastruktur
websiteUrl: https://kubernetes.io
features:
- Pods
- Services
- Autoskalierung
tags:
- containers
- orchestration
- name: Sonarqube
description: Statische Code-Analyse und Qualitätsmessung für Softwareprojekte
category: Entwicklung
websiteUrl: https://www.sonarsource.com/products/sonarqube
features:
- Code-Qualität
- Security-Scans
- Quality Gates
tags:
- code-quality
- static-analysis
- name: Power BI
description: Business-Intelligence-Tool für Dashboards, Berichte und Datenanalyse
category: Analytics
websiteUrl: https://powerbi.microsoft.com
features:
- Dashboards
- Berichte
- Datenmodelle
tags:
- bi
- analytics
- name: Google Workspace
description: Produktivitäts-Suite mit E-Mail, Docs, Drive und Meet
category: Produktivität
websiteUrl: https://workspace.google.com
features:
- Gmail
- Google Docs
- Google Drive
tags:
- suite
- productivity
- name: Microsoft 365
description: Office-Anwendungen, E-Mail und Cloud-Dienste für Unternehmen
category: Produktivität
websiteUrl: https://www.microsoft.com/microsoft-365
features:
- Word
- Excel
- Outlook
tags:
- suite
- productivity
- name: Slack Enterprise Grid
description: Slack-Verwaltung für große Organisationen mit erweiterten Sicherheitsfunktionen
category: Kommunikation
websiteUrl: https://slack.com
features:
- Enterprise-Admin
- Compliance
- Multi-Workspace
tags:
- communication
- enterprise
- name: Atlassian Rovo
description: KI-Assistent für Suche und Zusammenarbeit über Atlassian-Produkte
category: Projektmanagement
websiteUrl: https://www.atlassian.com/software/rovo
features:
- KI-Suche
- Agenten
- Integrationen
tags:
- ai
- search
@@ -36,6 +36,49 @@ Zentraler Zugriff auf den Tool-Katalog.
- **Massenaktion:** mehrere Tools auswählen und in den Papierkorb verschieben
(Bestätigungsdialog; soft gelöschte Tools sind aus allen öffentlichen Ansichten
entfernt und können wiederhergestellt oder endgültig gelöscht werden).
- **Importieren** (Premium): über die Schaltfläche **Importieren** oben rechts
können mehrere Tools gleichzeitig angelegt werden. Das Format wird automatisch
erkannt (CSV, JSON oder YAML); für CSV lässt sich der Trenner wählen
(automatisch, Komma, Semikolon oder Tabulator). Die Daten lassen sich direkt
ins Formular einfügen oder als Datei hochladen.
Unterstützte Felder: `name` (Pflicht), `description`, `category`, `websiteUrl`,
`iconUrl`, `features`, `tags` (`features`/`tags` sind mit `|` getrennte Listen).
**CSV-Beispiel:**
```csv
name;description;category;features;tags
Grafana;Observability- und Dashboard-Plattform;Monitoring;Dashboards|Alerts;devops
Prometheus;Zeitreihen-Datenbank;Monitoring;Metrics;devops
```
**JSON-Beispiel:**
```json
[
{ "name": "Grafana", "category": "Monitoring", "features": ["Dashboards"] },
{ "name": "Prometheus", "category": "Monitoring" }
]
```
**YAML-Beispiel:**
```yaml
- name: Grafana
category: Monitoring
features:
- Dashboards
- name: Prometheus
category: Monitoring
```
Eine umfangreichere, fertig importierbare Beispieldatei liegt unter
`docs/examples/import-tools.yaml` (24 gängige Enterprise-Tools).
Beim Import werden einzelne fehlerhafte Zeilen übersprungen und mit Zeilennummer
aufgelistet; korrekte Zeilen werden trotzdem angelegt. Jeder Import erzeugt
Audit-Log-Einträge.
## Tab „Audit-Log"
+108
View File
@@ -0,0 +1,108 @@
---
title: Administration
order: 13
---
# Administration
The **Admin** area (`/admin`) is exclusively accessible to admins.
Without the admin role, access is denied.
> At the top right, the **Redundancy dashboard** button leads to the automatic
> duplicate detection (see [Redundancy](/docs/handbook/redundanz)).
## "Users" tab
Management of local accounts.
- **Add user:** username (required), password (at least 6 characters),
email (optional), **role** (User/Admin), **plan** (Free/Premium/Enterprise).
- **Edit user:** set role, plan and (for local accounts) a new password.
For OIDC accounts, password management is offered in the identity provider
(e.g. Keycloak).
- **Delete user:** permanently removes the account (not for your own account).
API reference:
[`POST /users`](/docs/reference/endpoints/users#createUser),
[`PATCH /users/{id}`](/docs/reference/endpoints/users#updateUser),
[`DELETE /users/{id}`](/docs/reference/endpoints/users#deleteUser).
## "Tools" tab
Central access to the tool catalog.
- **Search** for tools.
- View, edit or move individual tools to the trash.
- **Bulk action:** select multiple tools and move them to the trash
(confirmation dialog; soft-deleted tools are removed from all public views
and can be restored or permanently deleted).
- **Import** (premium): via the **Import** button at the top right, multiple
tools can be created at once. The format is detected automatically (CSV,
JSON or YAML); for CSV the delimiter can be chosen (auto-detect, comma,
semicolon or tab). Data can be pasted directly into the form or uploaded
as a file.
Supported fields: `name` (required), `description`, `category`, `websiteUrl`,
`iconUrl`, `features`, `tags` (`features`/`tags` are `|`-separated lists).
**CSV example:**
```csv
name;description;category;features;tags
Grafana;Observability and dashboard platform;Monitoring;Dashboards|Alerts;devops
Prometheus;Time-series database;Monitoring;Metrics;devops
```
**JSON example:**
```json
[
{ "name": "Grafana", "category": "Monitoring", "features": ["Dashboards"] },
{ "name": "Prometheus", "category": "Monitoring" }
]
```
**YAML example:**
```yaml
- name: Grafana
category: Monitoring
features:
- Dashboards
- name: Prometheus
category: Monitoring
```
A larger, ready-to-import example file is located at
`docs/examples/import-tools.yaml` (24 common enterprise tools).
During import, individual faulty rows are skipped and listed with their row
number; correct rows are still created. Every import produces audit-log
entries.
## "Audit log" tab
Chronological log of all creation, change and deletion operations
(max. 100 entries): action, entity + ID, timestamp, executing person and
changed fields.
API reference: [`GET /audit-logs`](/docs/reference/endpoints/audit#listAuditLogs).
## "System" tab
Version information of the running instance:
- **Version** (e.g. `v0.8.1`),
- **Commit** (7-digit SHA, linked to the repository),
- **Build date**,
- **Trash retention** ("N days" or "Forever").
## Tool links (Admin)
On the detail page of a tool you can manage **links** as an admin
(own/"manual" as well as automatically detected ones):
- **Link tool:** dialog with tool ID, **relationship type**
(Similar / Replaces / Superseded by) and optional notes.
- Relationship types are displayed as badges on the detail page.
- Manual links can be removed again via the trash icon.
+33
View File
@@ -0,0 +1,33 @@
---
title: Analytics
order: 10
---
# Analytics
The **Analytics** area (`/analytics`) is a public dashboard with
metrics and charts based on all tools and ratings.
## Metrics (KPI cards)
- **Number of tools** — how many tools are recorded in the catalog.
- **Number of ratings** — how many ratings were submitted in total.
- **Active categories** — how many categories exist.
- **Average rating** — global combined value.
## Charts
| Chart | Content |
| --- | --- |
| **Top 8 tools** | Bar chart of the tools with the highest combined score (05) |
| **Tools per category** | Radar chart of the number of tools per category |
| **Score distribution** | Two horizontal bar charts (usefulness & usability) per star |
The charts are interactive (tooltips on hover).
## API
- [`GET /analytics/summary`](/docs/reference/endpoints/analytics#getAnalyticsSummary)
- [`GET /analytics/top-tools`](/docs/reference/endpoints/analytics#getTopTools)
- [`GET /analytics/by-category`](/docs/reference/endpoints/analytics#getAnalyticsByCategory)
- [`GET /analytics/rating-distribution`](/docs/reference/endpoints/analytics#getRatingDistribution)
+43
View File
@@ -0,0 +1,43 @@
---
title: Rating
order: 7
---
# Rating
On the detail page of a tool you can share your experience. Click on
**Submit a rating** (requires an account).
## Form fields
| Field | Required | Notes |
| --- | --- | --- |
| **Usefulness** | Yes | 15 stars |
| **Usability** | Yes | 15 stars |
| **Comment** | No | Free text |
| **Name** | No | Defaults to "Anonymous" |
Next to the fields, the **? icon** links directly to the associated field
description in the [data model reference](/docs/reference/schemas/ratinginput).
## What happens after submitting?
- Your rating is saved immediately and appears in the **rating list** of the
detail page.
- The **averages** (usefulness, usability, combined) and the **score
distribution** are updated.
- The **statistics** in the [Analytics](/docs/handbook/analytics) section are
recalculated.
## Statistic sections on the detail page
- **Rating overview:** usefulness & usability as an average with progress
bars.
- **Score distribution:** number of ratings per star (1★–5★).
- **History:** line chart of combined/individual values over time
(only visible once there are several ratings).
## API
- [`POST /tools/{id}/ratings`](/docs/reference/endpoints/ratings#createRating) — Submit a rating
- [`GET /tools/{id}/ratings`](/docs/reference/endpoints/ratings#listToolRatings) — Ratings of a tool
+74
View File
@@ -0,0 +1,74 @@
---
title: Data model
order: 17
---
# Data model
This chapter explains the central data objects of toolr at the application
level. The complete, automatically generated reference of all fields,
types and constraints can be found in the
[API reference](/docs/reference/schemas/tool).
## Tool
The heart of it all: a tool recorded in the catalog.
| Property | Description |
| --- | --- |
| `id` | Unique identifier |
| `name` | Display name |
| `description` | Description (what does the tool do?) |
| `category` | Category assignment |
| `websiteUrl` | Official website (optional) |
| `iconUrl` | Logo/icon URL (optional) |
| `features` | List of capabilities |
| `tags` | List of keywords |
| `createdAt` / `updatedAt` | Timestamps |
| `createdBy` | Person who created it |
| `deletedAt` / `deletedBy` | Soft deletion (trash) |
Input forms use the derived schemas
[`ToolInput`](/docs/reference/schemas/toolinput) and
[`ToolUpdate`](/docs/reference/schemas/toolupdate).
Aggregated views are provided by [`ToolWithStats`](/docs/reference/schemas/toolwithstats)
(e.g. with average rating).
## Rating (Bewertung)
A single rating for a tool:
- `usefulness` (Nützlichkeit, 15) and `usability` (Bedienbarkeit, 15)
- optional `comment` and a display name (`reviewerName`)
- timestamp
Input schema: [`RatingInput`](/docs/reference/schemas/ratinginput).
## User & Auth
- [`User`](/docs/reference/schemas/user) — user account with role (User/Admin)
and plan (Free/Premium/Enterprise).
- [`AuthUser`](/docs/reference/schemas/authuser) — the logged-in profile
including `entitlements` (available features).
- [`UserPreferences`](/docs/reference/schemas/userpreferences) — view and
density preferences as well as the `watchlist` (list of tool IDs).
## Analytics
The statistics endpoints provide aggregated data:
- [`AnalyticsSummary`](/docs/reference/schemas/analyticssummary) — global
metrics (number of tools/ratings, categories, average).
- [`TopToolEntry`](/docs/reference/schemas/TopToolEntry) — an entry of the
top tools.- [`CategoryStats`](/docs/reference/schemas/categorystats) — number of tools per
category.
- [`RatingDistribution`](/docs/reference/schemas/ratingdistribution) —
score distribution (usefulness & usability).
- [`ScoreBucket`](/docs/reference/schemas/scorebucket) — a value bucket.
## Additional
- [`VersionInfo`](/docs/reference/schemas/versioninfo) — version, commit SHA,
build date and trash retention of the running instance.
- [`AuditLog`](/docs/reference/schemas/auditlog) — a log entry
(action, entity, timestamp, actor, changes).
@@ -10,7 +10,7 @@ Besuch bis zum Anlegen und Bewerten eines Tools.
## 1. Anmelden
Die meisten Aktionen (Tool anlegen, bewerten, Watchlist, Vergleichen) erfordern
Die meisten Aktionen (Tool anlegen, bewerten, Merkliste, Vergleichen) erfordern
ein Konto. Klicke unten links auf **Anmelden**. Je nach Konfiguration der
Instanz hast du zwei Möglichkeiten:
@@ -51,7 +51,7 @@ Siehe [Bewerten](/docs/handbook/bewerten).
## 5. Weiterführend
- [Tools vergleichen](/docs/handbook/vergleichen)
- [Watchlist](/docs/handbook/watchlist)
- [Merkliste](/docs/handbook/watchlist)
- [Analytics](/docs/handbook/analytics)
- [Pläne & Berechtigungen](/docs/handbook/plaene)
- [Administration](/docs/handbook/administration)
+57
View File
@@ -0,0 +1,57 @@
---
title: Getting Started
order: 2
---
# Getting Started
This page guides you through the most important workflows in toolr — from your
first visit to creating and rating a tool.
## 1. Sign in
Most actions (create a tool, rate, watchlist, compare) require
an account. Click **Sign in** in the bottom left corner. Depending on the
instance configuration you have two options:
- **Local accounts:** username + password. Access is created by an admin
(see [Administration](/docs/handbook/administration)).
- **OIDC (SSO):** sign in with the configured identity provider (e.g.
Keycloak).
Which mode is active is shown by the
[`GET /auth/mode`](/docs/reference/endpoints/auth#getAuthMode) endpoint. Details
can be found in the [Sign in & account](/docs/handbook/konto) section.
## 2. Find tools
Open the **Browse tools** section:
- **Search** — full-text search across name & description (shortcut `/`).
- **Filter** — by category, tags, features and minimum rating
(`minRating`).
- **Sort** — by newest, top-rated, most rated, name
(ascending/descending) or last update.
All options in detail: [Find & browse tools](/docs/handbook/tools-finden).
## 3. Create a tool
Go to **Add tool** and fill in the form. Details for each field can be found
in the [Create a tool](/docs/handbook/tool-anlegen) section and in the
[field reference](/docs/reference/schemas/toolinput).
## 4. Rate
On the detail page of a tool you can submit **usefulness** and **usability**
(15 each) and optionally leave a comment. Your
rating is immediately reflected in the statistics.
See [Rating](/docs/handbook/bewerten).
## 5. Further reading
- [Compare tools](/docs/handbook/vergleichen)
- [Watchlist](/docs/handbook/watchlist)
- [Analytics](/docs/handbook/analytics)
- [Plans & permissions](/docs/handbook/plaene)
- [Administration](/docs/handbook/administration)
@@ -6,7 +6,7 @@ order: 1
# Willkommen bei toolr
toolr ist eine Plattform zum **Entdecken, Bewerten und Vergleichen von
Entwicklungstools**. Nutzer:innen pflegen einen gemeinsamen Katalog von Tools,
Entwicklungstools**. Nutzer pflegen einen gemeinsamen Katalog von Tools,
vergeben Bewertungen (Nützlichkeit & Bedienbarkeit) und nutzen Statistiken, um
die richtige Wahl zu treffen.
@@ -16,13 +16,14 @@ die richtige Wahl zu treffen.
| --- | --- | --- |
| **Tools durchsuchen** | Katalog filtern, sortieren und durchsuchen | Alle |
| **Tool anlegen** | Neues Tool mit Beschreibung, Kategorie, Features & Tags eintragen | Angemeldet |
| **Tool bearbeiten/löschen** | Eigene Tools pflegen (Ersteller:in oder Admin) | Angemeldet |
| **Tool bearbeiten/löschen** | Eigene Tools pflegen (Ersteller oder Admin) | Angemeldet |
| **Bewerten** | Nützlichkeit & Bedienbarkeit (15) plus Kommentar vergeben | Angemeldet |
| **Watchlist** | Tools als Favoriten speichern | Premium |
| **Merkliste** | Tools als Favoriten speichern | Premium |
| **Vergleichen** | Tools nebeneinander gegenüberstellen | Premium |
| **Kosten erfassen** | Lizenz- und Kostenmodelle je Tool eintragen | Premium |
| **Analytics** | Statistiken, Top-Tools, Verteilungen | Alle |
| **Papierkorb** | Soft-gelöschte Tools wiederherstellen oder endgültig löschen | Premium |
| **Import** | Mehrere Tools per CSV, JSON oder YAML anlegen | Admin (Premium) |
| **Admin** | Nutzerverwaltung, Audit-Log, Systeminformationen | Admin |
| **Redundanz** | Automatische Doppelungs-Erkennung | Admin |
+56
View File
@@ -0,0 +1,56 @@
---
title: Overview
order: 1
---
# Welcome to toolr
toolr is a platform for **discovering, rating and comparing development
tools**. Users maintain a shared catalog of tools, submit ratings
(usefulness & usability) and use statistics to make the right choice.
## What can you do with toolr?
| Function | Description | Visibility |
| --- | --- | --- |
| **Browse tools** | Filter, sort and search the catalog | Everyone |
| **Create a tool** | Add a new tool with description, category, features & tags | Logged in |
| **Edit/delete tools** | Maintain your own tools (creator or admin) | Logged in |
| **Rate** | Submit usefulness & usability (15) plus a comment | Logged in |
| **Watchlist** | Save tools as favorites | Premium |
| **Compare** | View tools side by side | Premium |
| **Record costs** | Enter license and cost models per tool | Premium |
| **Analytics** | Statistics, top tools, distributions | Everyone |
| **Trash** | Restore soft-deleted tools or delete them permanently | Premium |
| **Import** | Create multiple tools via CSV, JSON or YAML | Admin (premium) |
| **Admin** | User management, audit log, system information | Admin |
| **Redundancy detection** | Automatic duplicate detection | Admin |
## How this documentation is organized
- **User Guide** (these pages): step-by-step instructions for all
functions — from the [Getting Started](/docs/handbook/getting-started) to
[Administration](/docs/handbook/administration).
- **API Reference**: automatically generated from the OpenAPI specification —
all [endpoints](/docs/reference/endpoints/tools) and
[data fields](/docs/reference/schemas/toolinput) of the current version.
- **Release Notes**: what is new in each [version](/docs/releases/v0.8.1).
## Getting started
The fastest way:
1. **Sign in** — without an account you can only browse
(see [Getting Started](/docs/handbook/getting-started#1-anmelden)).
2. **Find tools** — search, filters and sorting in the
[Browse tools](/docs/handbook/tools-finden) section.
3. **Create a tool** — via "Add tool"
([guide](/docs/handbook/tool-anlegen)).
4. **Rate** — on the detail page of a tool
([guide](/docs/handbook/bewerten)).
## Contact & source code
The source code is available at
[git.kubebase.de/admin/tool-evaluator](https://git.kubebase.de/admin/tool-evaluator) —
you can reach it at any time via the repository icon in the top right corner.
@@ -26,7 +26,7 @@ Der aktive Modus steht im Endpunkt
Dein Profil (Avatar, Name, E-Mail, Tarif) siehst du unten links im
Benutzermenü. Dort stehen dir folgende Aktionen zur Verfügung:
- **Watchlist** — deine gespeicherten Tools (nur mit dem entsprechenden Tarif).
- **Merkliste** — deine gespeicherten Tools (nur mit dem entsprechenden Tarif).
- **Papierkorb** — wiederherstellbare, gelöschte Tools (Premium/Enterprise).
- **Passwort ändern** — für lokale Konten direkt in toolr; für OIDC-Konten wird
die Passwortverwaltung im Identitätsanbieter angeboten.
@@ -51,7 +51,7 @@ API-Referenz: [`POST /auth/me/password`](/docs/reference/endpoints/auth#changeMy
- die **Listenansicht** und **Dichte** im Bereich Tools durchsuchen anpassen
(siehe [Tools finden & durchsuchen](/docs/handbook/tools-finden)).
Deine Präferenzen (inkl. Watchlist) werden im Endpunkt
Deine Präferenzen (inkl. Merkliste) werden im Endpunkt
[`GET /auth/me/preferences`](/docs/reference/endpoints/auth#getMePreferences)
gespeichert und über [`PUT /auth/me/preferences`](/docs/reference/endpoints/auth#updateMePreferences)
aktualisiert.
+56
View File
@@ -0,0 +1,56 @@
---
title: Login & Account
order: 3
---
# Login & Account
## Logging in
Click **Login** at the bottom left of the sidebar. Depending on the
configuration of the instance:
- **Local accounts:** enter username and password. The accounts are created
by an admin (see [Administration](/docs/handbook/administration)).
- **OIDC (SSO):** you are redirected to the configured identity provider and
log in there.
The active mode is available at the endpoint
[`GET /auth/mode`](/docs/reference/endpoints/auth#getAuthMode).
> You can reach the login page directly at `/login`. After a successful
> login you are redirected back to the page you originally requested.
## User profile
You can see your profile (avatar, name, email, plan) at the bottom left in
the user menu. There you have the following actions available:
- **Watchlist** — your saved tools (only with the corresponding plan).
- **Trash** — restorable, deleted tools (Premium/Enterprise).
- **Change password** — directly in toolr for local accounts; for OIDC
accounts, password management is offered in the identity provider.
- **Logout** — ends your session.
## Changing your password (local account)
1. Open the user menu at the bottom left.
2. Select **Change password**.
3. Enter the **current** and a **new** password (min. 6 characters) and
confirm it.
4. Save — the password takes effect immediately.
API reference: [`POST /auth/me/password`](/docs/reference/endpoints/auth#changeMyPassword).
## Display settings
Using the buttons at the top right you can:
- switch the **language** (German / English),
- toggle the **theme** (Light / Dark / System),
- adjust the **list view** and **density** in the Browse tools section
(see [Finding & browsing tools](/docs/handbook/tools-finden)).
Your preferences (incl. watchlist) are saved at the endpoint
[`GET /auth/me/preferences`](/docs/reference/endpoints/auth#getMePreferences)
and updated via [`PUT /auth/me/preferences`](/docs/reference/endpoints/auth#updateMePreferences).
+39
View File
@@ -0,0 +1,39 @@
---
title: Recording Costs
order: 12
---
# Recording Costs
On the detail page of a tool you can enter cost and license models so that
the total costs per tool become transparent.
> Costs is a **premium feature** (`costs`, Premium/Enterprise). Admins always
> have access.
## Adding costs
Click **Add costs** in the costs section of the detail page and fill out the
form:
| Field | Notes |
| --- | --- |
| **License type** | Free / Subscription / One-Time / Usage-Based |
| **Billing period** | Only for "Subscription": Monthly / Quarterly / Annually |
| **Costs** | Amount as a number |
| **Currency** | EUR / USD / GBP / CHF |
| **Notes** | Optional free text |
Saving creates the entry. Each cost entry is displayed as a card with
license badge, billing period, amount (`Amount Currency` or "Free") and
notes.
## Editing & deleting costs
Hovering over a cost card shows the **Edit** (pencil) and **Delete** (trash)
actions.
## API
The cost data is managed via the tool endpoints
(see [API reference](/docs/reference/endpoints/tools)).
+44
View File
@@ -0,0 +1,44 @@
---
title: Trash
order: 15
---
# Trash
The **trash** (`/trash`) contains soft-deleted tools. With trash access
they can be restored; permanent deletion is reserved for admins.
> The trash is a **premium feature** (`trash`, Premium/Enterprise).
> Admins always have access.
## Access
The trash can be reached via the user menu or the sidebar.
Without the `trash` permission, a hint about changing the plan appears.
## Restoring
- Select one or more tools (checkboxes).
- Click on **Restore (N)** — the tools appear again in all
public views.
> Restoring is available to anyone with trash access.
## Permanently delete (admin only)
- **Delete (N)** **permanently** removes the selected tools — including
all ratings, costs and links. This cannot be undone.
- **Empty trash** permanently removes all soft-deleted tools.
## Table
The trash lists: name, category, **Deleted on** (`tt.MM.jjjj HH:mm`),
**Deleted by** as well as actions (Restore; Delete admin only). The search
filters by name.
## API
- [`GET /tools/trash`](/docs/reference/endpoints/tools#listTrashedTools) — list
- [`POST /tools/trash/restore`](/docs/reference/endpoints/tools#restoreTools) — restore
- [`DELETE /tools/trash`](/docs/reference/endpoints/tools#deleteTrashedTools) — permanently delete (admin)
- [`POST /tools/trash/empty`](/docs/reference/endpoints/tools#emptyTrash) — empty trash (admin)
@@ -13,7 +13,7 @@ Feature-Beschränkungen.
| Tarif | Beschreibung |
| --- | --- |
| **Free** | Grundfunktionen: suchen, filtern, ansehen, Analytics |
| **Premium** | Zusätzlich Watchlist, Vergleichen, Papierkorb, Kosten |
| **Premium** | Zusätzlich Merkliste, Vergleichen, Papierkorb, Kosten |
| **Enterprise** | Alle Premium-Features + erweiterter Support |
### Feature-Berechtigungen
@@ -23,9 +23,10 @@ Premium/Enterprise schalten folgende Features frei:
| Feature | Funktion | Mehr erfahren |
| --- | --- | --- |
| `compare` | Tools vergleichen | [Vergleichen](/docs/handbook/vergleichen) |
| `watchlist` | Favoritenliste | [Watchlist](/docs/handbook/watchlist) |
| `watchlist` | Favoritenliste | [Merkliste](/docs/handbook/watchlist) |
| `trash` | Papierkorb (soft gelöschte Tools) | [Papierkorb](/docs/handbook/papierkorb) |
| `costs` | Kosten-/Lizenzmodelle erfassen | [Kosten erfassen](/docs/handbook/kosten) |
| `tool-import` | Tools per CSV/JSON/YAML importieren (Admin) | [Administration](/docs/handbook/administration) |
Fehlt dir ein Feature, zeigt die App einen **Upgrade-Hinweis** mit Link zur
Tarifverwaltung.
+46
View File
@@ -0,0 +1,46 @@
---
title: Plans & Permissions
order: 11
---
# Plans & Permissions
toolr distinguishes **plans** (tier) and **roles**. Admins bypass all feature
restrictions.
## Plans
| Plan | Description |
| --- | --- |
| **Free** | Basic functions: search, filter, view, analytics |
| **Premium** | Additionally watchlist, compare, trash, costs |
| **Enterprise** | All premium features + extended support |
### Feature permissions
Premium/Enterprise unlock the following features:
| Feature | Function | Learn more |
| --- | --- | --- |
| `compare` | Compare tools | [Compare](/docs/handbook/vergleichen) |
| `watchlist` | Favorites list | [Watchlist](/docs/handbook/watchlist) |
| `trash` | Trash (soft-deleted tools) | [Trash](/docs/handbook/papierkorb) |
| `costs` | Record cost/license models | [Recording costs](/docs/handbook/kosten) |
| `tool-import` | Import tools via CSV/JSON/YAML (admin) | [Administration](/docs/handbook/administration) |
If you are missing a feature, the app shows an **upgrade notice** with a link
to the plan management.
## Roles
| Role | Permissions |
| --- | --- |
| **User** | Standard account: create/rate tools, edit your own tools |
| **Admin** | All user rights + administration, audit log, redundancy, empty trash, tool links |
Admins pass **all** feature checks — even without a premium plan.
## Plan/role management
The assignment of role and plan is managed by admins in the
[Administration](/docs/handbook/administration) section (tab "Users").
+42
View File
@@ -0,0 +1,42 @@
---
title: Redundancy dashboard
order: 14
---
# Redundancy dashboard
The **Redundancy dashboard** (`/admin/redundancy`) is an admin tool for
automatic detection of duplicate or strongly overlapping tools — per
category — including cost and rating comparison.
> Access is reserved exclusively for admins (the API is
> admin-protected).
## Layout
- **Per category** a group is shown: name of the category,
number of tools and comparisons as well as the **total monthly costs**
if applicable (e.g. `€X.XX/mo total`).
- Each tool is displayed as a card: name, monthly costs, number of
ratings, combined rating, license badges and number of features.
## Comparisons & recommendations
For each tool pair the following appears:
- Tool A vs. Tool B, each with rating (`X.X ★`) and monthly costs.
- **Overlap** in percent (progress bar in the middle).
- A **recommendation** with confidence color:
- **high** (green), **medium** (yellow), **low** (gray)
- The recommended, better tool is marked with a "thumbs up" and justified.
## Manual rating
You can rate a pair manually: click on Tool A or Tool B to
record which one is better. The selection is saved and the
display is updated.
## API
- [`GET /api/admin/redundancy`](#) — load data (admin-protected)
- [`POST /api/admin/redundancy/evaluate`](#) — save manual rating
@@ -19,7 +19,7 @@ Ohne Eingabe zeigt die Palette:
- **Zuletzt angesehen** — die letzten 5 Tools, die du besucht hast.
- **Navigation** — Tools durchsuchen, Tool hinzufügen, Analytics sowie
(abhängig von Berechtigungen) Watchlist, Papierkorb und Admin.
(abhängig von Berechtigungen) Merkliste, Papierkorb und Admin.
### Suche
+40
View File
@@ -0,0 +1,40 @@
---
title: Keyboard shortcuts & command palette
order: 16
---
# Keyboard shortcuts & command palette
## Command palette
The command palette is the central quick navigation:
- Open with **`⌘K`** (macOS) or **`Ctrl+K`** (Windows/Linux).
- Alternatively via the search bar at the top right ("Search tools… ⌘K") or the
search icon on mobile devices.
### Empty state
Without input, the palette shows:
- **Recently viewed** — the last 5 tools you visited.
- **Navigation** — browse tools, add tool, analytics as well as
(depending on permissions) watchlist, trash and admin.
### Search
Type to search for tools live (max. 10 results, incl. rating
`X.X★`).
## Overview of keyboard shortcuts
| Shortcut | Action |
| --- | --- |
| `⌘K` / `Ctrl+K` | Open command palette |
| `/` | Focus search in the "Browse tools" area |
## Additional notes
- **Recently viewed** is stored locally in the browser (max. 5 entries).
- The sidebar (left navigation) can be collapsed on desktop; the
breadcrumb at the top shows your current location.
+50
View File
@@ -0,0 +1,50 @@
---
title: Create a tool
order: 5
---
# Create a tool
To add a new tool to the catalog, click **Add tool**
(`/tools/new`). Creating a tool requires an account — without being signed in
a notice with a login button appears.
## Form fields
| Field | Required | Notes |
| --- | --- | --- |
| **Name** | Yes | At least 2 characters |
| **Category** | Yes | Dropdown; new categories can be created directly |
| **Website URL** | No | Valid URL (e.g. `https://...`) |
| **Icon / Logo URL** | No | Valid URL; preview is shown live |
| **Description** | Yes | At least 10 characters; describe what the tool does |
| **Features** | No | Dynamic list with autocomplete (max. 6) |
| **Tags** | No | Dynamic list with autocomplete |
Next to each field, the **? icon** takes you directly to the corresponding
field description in the [data model reference](/docs/reference/schemas/toolinput).
### Category
- Type to search for existing categories.
- Select **+ Create "..."** to create a new category.
### Features & tags
- **Add feature** / **Add tag** appends a new row.
- The input fields suggest existing features/tags
(autocomplete, max. 6 suggestions).
- Use the **×** button to remove individual rows.
- Features and tags help with filtering and finding tools again.
## Save
Click **Add tool**. After successful creation you will be redirected to the
detail page of the new tool.
## API
- [`POST /tools`](/docs/reference/endpoints/tools#createTool) — create a tool
- [`GET /categories`](/docs/reference/endpoints/tools#listCategories) — categories
- [`GET /features/all`](/docs/reference/endpoints/tools#listAllFeatures) — features
- [`GET /tags/all`](/docs/reference/endpoints/tools#listAllTags) — tags
+36
View File
@@ -0,0 +1,36 @@
---
title: Edit & delete tools
order: 6
---
# Edit & delete tools
## Editing
On the detail page of a tool you will find the **Edit** button
(only for the person who created the tool, as well as for admins).
The edit page (`/tools/:id/edit`) contains the same fields as when
creating (name, category, website/icon URL, description, features, tags) —
already filled with the current values.
- **Save** applies the changes.
- **Cancel** takes you back to the detail page.
API reference: [`PATCH /tools/{id}`](/docs/reference/endpoints/tools#updateTool).
## Deleting
Via **Delete** on the detail page the tool is removed. The behavior
depends on your plan:
- **With trash access** (Premium/Enterprise or Admin): the tool is
**soft deleted** — it disappears from all public views, but can
be restored or permanently deleted in the [trash](/docs/handbook/papierkorb).
- **Without trash access:** the tool is **permanently** deleted and cannot
be restored.
Deletion is only possible for the person who created the tool, as well as
for admins.
API reference: [`DELETE /tools/{id}`](/docs/reference/endpoints/tools#deleteTool).
@@ -47,7 +47,7 @@ Mit **Filter zurücksetzen** bzw. **Alle entfernen** räumst du sie wieder auf.
- **Ansicht wechseln:** Raster / Tabelle / Zeilen.
- **Dichte:** gemütlich / kompakt (Schieberegler).
Deine Auswahl wird gespeichert — lokal im Browser und für angemeldete Nutzer:innen
Deine Auswahl wird gespeichert — lokal im Browser und für angemeldete Nutzer
zusätzlich serverseitig in den Präferenzen. Ansicht, Dichte, Suche, Filter und
Sortierung werden dabei in die URL übernommen, sodass du Ergebnisse teilen
kannst.
@@ -58,12 +58,12 @@ In der Tabellenansicht sind die Spalten **Tool**, **Bewertung** und **Anzahl
Bewertungen** sortierbar. Beim Überfahren einer Zeile erscheint eine Vorschau
mit Bewertungsdetails, Tags und Mini-Balken.
## Auswählen für Vergleich & Watchlist
## Auswählen für Vergleich & Merkliste
- Auf jeder Karte/Zeile findest du ein **Vergleichs-Icon**, mit dem du Tools zur
[Vergleichsleiste](/docs/handbook/vergleichen) hinzufügst.
- Das **Lesezeichen-Icon** speichert Tools in deiner
[Watchlist](/docs/handbook/watchlist) (nur mit dem entsprechenden Tarif).
[Merkliste](/docs/handbook/watchlist) (nur mit dem entsprechenden Tarif).
## API
+70
View File
@@ -0,0 +1,70 @@
---
title: Find & browse tools
order: 4
---
# Find & browse tools
The **Browse tools** section (`/tools`) is your entry point to the catalog.
Here you combine search, filters and sorting to find exactly the tools
you are interested in.
## Search
- The **search bar** searches name and description (full text).
- Shortcut: Press **`/`** to focus the search.
- The input is debounced so that filtering happens immediately with each
keystroke.
## Filter
Via the **Filter** button (with a badge for the number of active filters)
you open the filter popover with:
- **Tags** — selection via checkboxes (scrollable list).
- **Features** — selection via checkboxes.
- **Minimum rating** — slider from 0 to 5 (in steps of 0.5); shows
e.g. "3.0+".
Active filters appear as **removable chips** above the result list.
Use **Reset filters** or **Remove all** to clear them again.
## Sort
The **Sort** dropdown offers the following options:
| Sort | Description |
| --- | --- |
| Newest | New tools first |
| Top rated | By combined rating |
| Most rated | By number of ratings |
| Name (AZ) | Alphabetically ascending |
| Name (ZA) | Alphabetically descending |
| Last updated | By last update |
## View & density
- **Switch view:** grid / table / rows.
- **Density:** comfortable / compact (slider).
Your selection is saved — locally in the browser and, for logged-in users,
additionally on the server in the preferences. View, density, search, filters
and sorting are reflected in the URL so you can share results.
## Table view
In the table view the columns **Tool**, **Rating** and **Number of
ratings** are sortable. Hovering over a row shows a preview
with rating details, tags and mini bars.
## Selecting for comparison & watchlist
- On every card/row you find a **compare icon** that lets you add tools to the
[compare bar](/docs/handbook/vergleichen).
- The **bookmark icon** saves tools to your
[watchlist](/docs/handbook/watchlist) (only with the corresponding plan).
## API
All search, filter and sort parameters correspond to the query parameters of
[`GET /tools`](/docs/reference/endpoints/tools#listTools).
+46
View File
@@ -0,0 +1,46 @@
---
title: Compare
order: 9
---
# Compare
With the compare function you can put several tools **side by side**
ideal for making a well-informed decision.
> Comparing is a **premium feature** (Premium/Enterprise) and is always
> available to admins.
## Selecting tools
1. In the **Browse tools** section, click the **compare icon** (scales) on
each card/row.
2. The **compare bar** appears at the bottom with the selected tools as
chips. You can remove individual tools (×) or clear the selection.
3. Click **Compare (N)** to go to the compare view.
> Without a premium plan the button is locked (lock icon). The dialog takes
> you to the plan switch
> (see [Plans & permissions](/docs/handbook/plaene)).
## The compare view
The view shows a table with one column per tool. Rows:
| Row | Content |
| --- | --- |
| **Rating** | Stars + value (e.g. `4.2/5`) |
| **Usefulness** | Value (X.X/5) |
| **Usability** | Value (X.X/5) |
| **Number of ratings** | Count |
| **Description** | Text |
| **Features** | Badges |
| **Tags** | Badges |
| **Last updated** | Date |
The **best value** per row is highlighted (with trophy icon).
## API
The compare view reads the data via
[`GET /compare`](/docs/reference/endpoints/tools#listCompareTools).
@@ -1,14 +1,14 @@
---
title: Watchlist
title: Merkliste
order: 8
---
# Watchlist
# Merkliste
Die **Watchlist** ist eine persönliche Favoritenliste. Tools darin kannst du
Die **Merkliste** ist eine persönliche Favoritenliste. Tools darin kannst du
jederzeit per Klick wieder aufrufen und vergleichen.
> Die Watchlist ist ein **Premium-Feature** (Premium/Enterprise) und steht
> Die Merkliste ist ein **Premium-Feature** (Premium/Enterprise) und steht
> Admins immer zur Verfügung.
## Voraussetzung
@@ -21,18 +21,18 @@ beim Lesezeichen ein Hinweis auf den Tarifwechsel
- Auf jeder Karte/Zeile im Bereich **Tools durchsuchen** findest du das
**Lesezeichen-Icon**.
- Ein Klick speichert das Tool in deiner Watchlist — das Icon wird gefüllt.
- Ein Klick speichert das Tool in deiner Merkliste — das Icon wird gefüllt.
- Ein erneuter Klick entfernt es wieder.
## Watchlist ansehen
## Merkliste ansehen
Öffne die Watchlist über das Benutzermenü oder die Seitenleiste. Sie zeigt alle
Öffne die Merkliste über das Benutzermenü oder die Seitenleiste. Sie zeigt alle
gespeicherten Tools als Karten. Das gefüllte Lesezeichen auf einer Karte
entfernt das Tool aus der Liste.
## Wo wird die Watchlist gespeichert?
## Wo wird die Merkliste gespeichert?
Die Watchlist ist eine Liste von Tool-IDs in deinen **Benutzerpräferenzen**.
Die Merkliste ist eine Liste von Tool-IDs in deinen **Benutzerpräferenzen**.
Damit ist sie geräteübergreifend mit deinem Konto verbunden.
API-Referenz: [`GET /auth/me/watchlist`](/docs/reference/endpoints/auth#getMeWatchlist).
API-Referenz: [`GET /auth/me/watchlist`](/docs/reference/endpoints/auth#getMeMerkliste).
+37
View File
@@ -0,0 +1,37 @@
---
title: Watchlist
order: 8
---
# Watchlist
The **watchlist** is a personal favorites list. You can open and compare the
tools in it at any time with a click.
> The watchlist is a **premium feature** (Premium/Enterprise) and is always
> available to admins.
## Prerequisite
You need a plan with the `watchlist` permission. If it is missing, a note
about switching plans appears at the bookmark
(see [Plans & permissions](/docs/handbook/plaene)).
## Saving a tool
- On every card/row in the **Browse tools** section you will find the
**bookmark icon**.
- A click saves the tool to your watchlist — the icon becomes filled.
- Clicking it again removes it.
## Viewing the watchlist
Open the watchlist via the user menu or the sidebar. It shows all saved tools
as cards. The filled bookmark on a card removes the tool from the list.
## Where is the watchlist stored?
The watchlist is a list of tool IDs in your **user preferences**. This way it
is linked to your account across devices.
API reference: [`GET /auth/me/watchlist`](/docs/reference/endpoints/auth#getMeWatchlist).
-37
View File
@@ -1,37 +0,0 @@
# v0.6.0 — Release Notes
**Datum:** 2026-08-03 · **Tag:** [`v0.6.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.6.0)
## Neue Features
- Vollständige Modernisierung aller Abhängigkeiten auf die aktuellen Hauptversionen
(TypeScript 7, Vite 8, React 19.2, openid-client 6, zod 4, recharts 3, react-day-picker 10).
## Fixes & Verbesserungen
- CI-Build durch `allowBuilds`-Konfiguration für pnpm 11 repariert
(Build-Scripts für esbuild & Co. werden nicht mehr blockiert).
- Image-Tagging vereinfacht: nur noch `latest` und `v*`-Tags, keine `nightly-*`/`sha-*`-Tags.
- Alle Dependencies exakt gepinnt; automatische Updates via Renovate vorbereitet
(`renovate.json`, `docs/dependency-policy.md`).
## API-Änderungen
- Keine Breaking Changes an der API. openid-client intern auf v6 migriert
(auth-Fluss verhält sich identisch).
## Betrieb / Upgrade
- **Env-Vars:** unverändert. Node-Image auf `node:24.18.1-alpine` gepinnt.
- **Migration:** keine Datenbank-Migration erforderlich.
- **Breaking Changes:** keine.
## Bekannte Einschränkungen
- `typedoc` (indirekte orval-Abhängigkeit) zeigt eine Peer-Dependency-Warnung
(erwartet TypeScript 5.x/6.x, installiert ist 7.x) — harmlos für Build & Laufzeit.
## Links
- Commit: [`2f66fff`](https://git.kubebase.de/admin/tool-evaluator/commit/2f66fff)
- Tag: [`v0.6.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.6.0)
-35
View File
@@ -1,35 +0,0 @@
# v0.7.0 — Release Notes
**Datum:** 2026-08-03 · **Tag:** [`v0.7.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.7.0)
## Neue Features
- Version-gebundene **Release-Dokumentation** in der App unter `/docs`
(Index + Detailseite je Version, Markdown aus `docs/releases/`).
- Generiertes Release-Vorlage (`docs/releases/TEMPLATE.md`) und
Sync-Schritt für den Frontend-Build.
## Fixes & Verbesserungen
- `tsx` auf 4.23.4 angehoben — letzte veraltete Abhängigkeit im Workspace
(`pnpm outdated -r` ist jetzt leer).
## API-Änderungen
- Keine Breaking Changes an der API.
## Betrieb / Upgrade
- **Env-Vars:** unverändert.
- **Migration:** keine.
- **Breaking Changes:** keine.
## Bekannte Einschränkungen
- Die Doku ist bisher auf Release-Notes beschränkt; eine vollständige
API-/Feld-Referenz folgt in v0.8.0.
## Links
- Commit: [`520f917`](https://git.kubebase.de/admin/tool-evaluator/commit/520f917)
- Tag: [`v0.7.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.7.0)
-46
View File
@@ -1,46 +0,0 @@
# v0.8.0 — Release Notes
**Datum:** 2026-08-03 · **Tag:** [`v0.8.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.0)
## Neue Features
- **Vollständige Dokumentations-Site** in mkdocs-Optik unter `/docs`:
- **Handbuch** mit verständlichen Erklärungen zu allen Features
(Erste Schritte, Tool anlegen, Bewertungen, Vergleichen, Watchlist,
Analytics, Administration, Datenmodell).
- **Automatisch generierte Referenz** aus `lib/api-spec/openapi.yaml`:
alle Endpunkte und Datenfelder (Typ, Pflichtstatus, Constraints) —
damit ist garantiert, dass *jedes* Feature dokumentiert ist.
- **Suche** über Handbuch, Endpunkte und Felder.
- **Versions-Dropdown**: ältere Releases behalten ihre vollständige
Feld-/Endpunkt-Referenz als Snapshot.
- **Repo-Link** oben rechts zur Quelle.
- **Hilfe-Buttons (?) in Formularen** (NetBox-Stil): neben jedem Feld
springt ein Icon direkt zur Feldbeschreibung in der Doku.
## Fixes & Verbesserungen
- Doku-Generator `scripts/src/generate-docs.mjs` ersetzt den bisherigen
`sync-release-docs.mjs` (OpenAPI-Parsing, Handbuch, Suchindex, Snapshots).
- Dokumentation für v0.7.0 nachgezogen.
## API-Änderungen
- Keine Breaking Changes an der API.
## Betrieb / Upgrade
- **Env-Vars:** unverändert.
- **Migration:** keine.
- **Breaking Changes:** keine.
## Bekannte Einschränkungen
- Handbuch & Referenz gelten für die aktuelle Version; ältere Versionen
zeigen ihre Release-Notes und einen Referenz-Snapshot, sofern beim Release
erzeugt (`node scripts/src/generate-docs.mjs --snapshot vX.Y.Z`).
## Links
- Commit: [`6c92b63`](https://git.kubebase.de/admin/tool-evaluator/commit/6c92b63)
- Tag: [`v0.8.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.0)
-47
View File
@@ -1,47 +0,0 @@
# v0.8.1 — Release Notes
**Datum:** 2026-08-03 · **Tag:** [`v0.8.1`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.1)
## Neue Features
- **Standalone-Doku-Seite**: Die Dokumentation steht jetzt als eigene,
mkdocs-artige Seite unter `toolr.kubebase.de/docs` — ohne die App-Shell
(eigene Kopfzeile mit Repo-Link, Versions-Dropdown, Suche, Theme-Umschalter
und Link zurück zur App).
- **Navigation umbenannt**: Der Seitenleisten-Eintrag heißt jetzt **„Hilfe"**
und führt zur Standalone-Doku.
- **User Guide komplett überarbeitet**: 17 Handbuch-Seiten mit
Schritt-für-Schritt-Anleitungen für alle Funktionen (Tools finden, Tool
anlegen, Bewerten, Watchlist, Vergleichen, Kosten, Analytics, Pläne,
Administration, Redundanz, Papierkorb, Tastenkürzel, Datenmodell).
## Fixes & Verbesserungen
- Referenz-Links sind jetzt unabhängig von Groß-/Kleinschreibung
(Schema-/Endpoint-Slugs wie `toolinput` und `ToolInput` funktionieren beide).
- Handbuch-Links auf Endpunkt-Anker korrigiert (PascalCase-OperationIds).
- Veraltete, kaputte Handbuch-Links (`vergleichen`, `watchlist` …) ersetzt.
- Dokumentations-Tabellenkopfzeilen und Hinweistexte in der Doku-Seite über
i18n internationalisiert (de/en).
## API-Änderungen
- Keine Änderungen an der API.
## Betrieb / Upgrade
- **Env-Vars:** unverändert.
- **Migration:** keine.
- **Breaking Changes:** keine. Die Doku-Seite ist unter `/docs` erreichbar wie
bisher; lediglich die Darstellung ist nun eigenständig.
## Bekannte Einschränkungen
- Handbuch & Referenz gelten für die aktuelle Version; ältere Versionen zeigen
ihre Release-Notes und einen Referenz-Snapshot, sofern beim Release erzeugt
(`node scripts/src/generate-docs.mjs --snapshot vX.Y.Z`).
## Links
- Commit: [`fdf2d74`](https://git.kubebase.de/admin/tool-evaluator/commit/fdf2d74)
- Tag: [`v0.8.1`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.1)
-104
View File
@@ -1,104 +0,0 @@
[
{
"slug": "index",
"file": "index.md",
"title": "Überblick",
"order": 1
},
{
"slug": "getting-started",
"file": "getting-started.md",
"title": "Erste Schritte",
"order": 2
},
{
"slug": "konto",
"file": "konto.md",
"title": "Anmelden & Konto",
"order": 3
},
{
"slug": "tools-finden",
"file": "tools-finden.md",
"title": "Tools finden & durchsuchen",
"order": 4
},
{
"slug": "tool-anlegen",
"file": "tool-anlegen.md",
"title": "Tool anlegen",
"order": 5
},
{
"slug": "tool-bearbeiten",
"file": "tool-bearbeiten.md",
"title": "Tool bearbeiten & löschen",
"order": 6
},
{
"slug": "bewerten",
"file": "bewerten.md",
"title": "Bewerten",
"order": 7
},
{
"slug": "watchlist",
"file": "watchlist.md",
"title": "Watchlist",
"order": 8
},
{
"slug": "vergleichen",
"file": "vergleichen.md",
"title": "Vergleichen",
"order": 9
},
{
"slug": "analytics",
"file": "analytics.md",
"title": "Analytics",
"order": 10
},
{
"slug": "plaene",
"file": "plaene.md",
"title": "Pläne & Berechtigungen",
"order": 11
},
{
"slug": "kosten",
"file": "kosten.md",
"title": "Kosten erfassen",
"order": 12
},
{
"slug": "administration",
"file": "administration.md",
"title": "Administration",
"order": 13
},
{
"slug": "redundanz",
"file": "redundanz.md",
"title": "Redundanz-Dashboard",
"order": 14
},
{
"slug": "papierkorb",
"file": "papierkorb.md",
"title": "Papierkorb",
"order": 15
},
{
"slug": "tastatur",
"file": "tastatur.md",
"title": "Tastenkürzel & Kommandopalette",
"order": 16
},
{
"slug": "datenmodell",
"file": "datenmodell.md",
"title": "Datenmodell",
"order": 17
}
]
-36
View File
@@ -1,36 +0,0 @@
# v0.8.2 — Release Notes
**Datum:** 2026-08-04 · **Tag:** [`v0.8.2`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.2)
## Fixes & Verbesserungen
- **Mobile Navigation in der Doku**: Die linke Navigationsleiste (Handbuch,
Endpunkte, Schemas) wurde unterhalb von `lg` (1024px) komplett ausgeblendet.
Es gibt jetzt einen Menü-Button im Kopfbereich, der ein seitliches
Navigations-Drawer mit demselben Inhalt öffnet — auf kleinen Bildschirmen
bleibt die Doku voll navigierbar.
- **Versions-Dropdown zeigt die gewählte Version an**: Beim Wechsel zu einem
anderen Release (`/docs/releases/vX.Y.Z`) blieb das Dropdown fälschlich auf
„aktuell". Die angezeigte Version wird jetzt auch aus der releases-Route
abgeleitet.
## API-Änderungen
- Keine Änderungen an der API.
## Betrieb / Upgrade
- **Env-Vars:** unverändert.
- **Migration:** keine.
- **Breaking Changes:** keine.
## Bekannte Einschränkungen
- Handbuch & Referenz gelten für die aktuelle Version; ältere Versionen zeigen
ihre Release-Notes und einen Referenz-Snapshot, sofern beim Release erzeugt
(`node scripts/src/generate-docs.mjs --snapshot vX.Y.Z`).
## Links
- Commit: [`33cf261`](https://git.kubebase.de/admin/tool-evaluator/commit/33cf261)
- Tag: [`v0.8.2`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.2)
-104
View File
@@ -1,104 +0,0 @@
[
{
"slug": "index",
"file": "index.md",
"title": "Überblick",
"order": 1
},
{
"slug": "getting-started",
"file": "getting-started.md",
"title": "Erste Schritte",
"order": 2
},
{
"slug": "konto",
"file": "konto.md",
"title": "Anmelden & Konto",
"order": 3
},
{
"slug": "tools-finden",
"file": "tools-finden.md",
"title": "Tools finden & durchsuchen",
"order": 4
},
{
"slug": "tool-anlegen",
"file": "tool-anlegen.md",
"title": "Tool anlegen",
"order": 5
},
{
"slug": "tool-bearbeiten",
"file": "tool-bearbeiten.md",
"title": "Tool bearbeiten & löschen",
"order": 6
},
{
"slug": "bewerten",
"file": "bewerten.md",
"title": "Bewerten",
"order": 7
},
{
"slug": "watchlist",
"file": "watchlist.md",
"title": "Watchlist",
"order": 8
},
{
"slug": "vergleichen",
"file": "vergleichen.md",
"title": "Vergleichen",
"order": 9
},
{
"slug": "analytics",
"file": "analytics.md",
"title": "Analytics",
"order": 10
},
{
"slug": "plaene",
"file": "plaene.md",
"title": "Pläne & Berechtigungen",
"order": 11
},
{
"slug": "kosten",
"file": "kosten.md",
"title": "Kosten erfassen",
"order": 12
},
{
"slug": "administration",
"file": "administration.md",
"title": "Administration",
"order": 13
},
{
"slug": "redundanz",
"file": "redundanz.md",
"title": "Redundanz-Dashboard",
"order": 14
},
{
"slug": "papierkorb",
"file": "papierkorb.md",
"title": "Papierkorb",
"order": 15
},
{
"slug": "tastatur",
"file": "tastatur.md",
"title": "Tastenkürzel & Kommandopalette",
"order": 16
},
{
"slug": "datenmodell",
"file": "datenmodell.md",
"title": "Datenmodell",
"order": 17
}
]
-49
View File
@@ -1,49 +0,0 @@
# v0.8.3 — Release Notes
**Datum:** 2026-08-04 · **Tag:** [`v0.8.3`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.3)
## Neue Features
- **Versionsbasierte Dokumentation**: Jedes Release trägt jetzt einen
vollständigen Doku-Snapshot (Handbuch + API-Referenz). Über das
Versions-Dropdown gelangst du zur Doku der jeweiligen Version
(`/docs/vX.Y.Z/…`) — inklusive Handbuch und Referenz, wie sie zum
Release-Zeitpunkt galten. Die letzten 7 Versionen bleiben verfügbar.
- **Hilfe-Buttons in Formularen (NetBox-Stil)**: Bei Bewertung, Tool
anlegen/bearbeiten, Kosten, Vergleichen, Watchlist und Analytics gibt es
jetzt ein Hilfe-Icon, das direkt zur passenden Anleitung im Handbuch führt.
## Fixes & Verbesserungen
- **Gitea-Tag-Links korrigiert**: `…/tags/vX.Y.Z` war eine 404-Seite; die
korrekte URL lautet `/releases/tag/vX.Y.Z` (in allen Release-Notes und der
Doku-Seite).
- Versions-Wechsel führt jetzt zur Doku der gewählten Version statt direkt
nur zur Release-Seite; alte `/docs/vX.Y.Z`-Redirects entfallen.
- Doku-Generator: `--snapshot` erzeugt Handbuch + Referenz pro Version; beim
Build werden die Snapshots der letzten 7 Versionen eingespielt.
## API-Änderungen
- Keine Änderungen an der API.
## Betrieb / Upgrade
- **Env-Vars:** unverändert.
- **Migration:** keine.
- **Breaking Changes:** keine. Neue Release-Notes müssen den korrekten
Tag-Link verwenden (siehe `docs/releases/TEMPLATE.md`). Für Versionen vor
diesem Release können Snapshots nachträglich erzeugt werden:
`node scripts/src/generate-docs.mjs --snapshot vX.Y.Z`.
## Bekannte Einschränkungen
- Ältere Releases ohne Snapshot (z. B. v0.6.0) zeigen nur ihre Release-Notes,
kein Handbuch/keine Referenz. Mit `--snapshot` nachpflegen.
- Die Doku-Version entspricht dem Doku-Stand zum Zeitpunkt der Erstellung des
Snapshots; Änderungen am Handbuch gelten ab dem jeweils nächsten Release.
## Links
- Commit: [`3bb4598`](https://git.kubebase.de/admin/tool-evaluator/commit/3bb4598)
- Tag: [`v0.8.3`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.8.3)
+46
View File
@@ -0,0 +1,46 @@
# v0.9.0 — Release Notes
**Datum:** 2026-08-05 · **Tag:** [`v0.9.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.9.0)
## Neue Features
- **Neuausrichtung der Versionierung:** Die Dokumentation startet mit dieser
Version neu bei `v0.9.0`. Ältere Release-Notizen und Versionen-Snapshots
(v0.6.0v0.8.6) wurden entfernt. Das Handbuch und die Referenz (API/Admin)
sind jetzt wieder für jede Version verfügbar — auch für neuere Versionen.
- **Sprachsuffixe:** Alle Dokumentationsdateien verwenden jetzt einheitlich die
Suffixe `.de.md` und `.en.md`. Damit lassen sich später weitere Sprachen
ergänzen; die App liefert automatisch die passende Sprachfassung.
- **Import — fertige Beispieldatei:** Unter `docs/examples/import-tools.yaml`
liegt eine sofort importierbare YAML-Beispieldatei mit 24 gängigen
Enterprise-Tools (Kategorien wie Kommunikation, Monitoring, CI/CD,
Infrastruktur). Die Datei ist in der Administration-Dokumentation verlinkt.
## Fixes & Verbesserungen
- Der Versionsumschalter zeigt die Dokumentation jetzt auch für neuere
Versionen korrekt an (vorher fehlende Versionen-Snapshots machten Handbuch und
Referenz nicht verfügbar).
- Wording bereinigt: Die Tagline und Platzhaltertexte ohne Berufsbezeichnung
(„Bewerte dein Tool." / „Rate your Tool.", „Anonymer Benutzer" /
„Anonymous User"). Es werden keine Gender-Sonderformen mehr verwendet
(`Nutzer:innen``Nutzer`, `Ersteller:in``Ersteller`).
## API-Änderungen
- Keine Änderungen gegenüber v0.8.6 (siehe `lib/api-spec/openapi.yaml`).
## Betrieb / Upgrade
- **Migration:** keine. Bereits vorhandene Tools-, Bewertungs- und Konto-Daten
bleiben unverändert.
- **Breaking Changes:** keine.
## Bekannte Einschränkungen
- Keine im Rahmen dieses Releases.
## Links
- Commit: [`6eb3dfd`](https://git.kubebase.de/admin/tool-evaluator/commit/6eb3dfd)
- Tag: [`v0.9.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.9.0)
+46
View File
@@ -0,0 +1,46 @@
# v0.9.0 — Release Notes
**Date:** 2026-08-05 · **Tag:** [`v0.9.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.9.0)
## New Features
- **Versioning reset:** Documentation starts fresh at `v0.9.0` with this
release. Older release notes and version snapshots (v0.6.0v0.8.6) have been
removed. The handbook and reference (API/admin) are now available again for
every version — including newer versions.
- **Language suffixes:** All documentation files now consistently use the
`.de.md` and `.en.md` suffixes. This makes it easy to add more languages
later; the app automatically serves the matching language variant.
- **Import — ready-to-use example file:** A ready-to-import YAML example file
with 24 common enterprise tools is provided at
`docs/examples/import-tools.yaml` (categories such as communication,
monitoring, CI/CD, infrastructure). The file is linked from the
administration documentation.
## Fixes & Polish
- The version switcher now displays documentation correctly for newer versions
as well (previously, missing version snapshots made the handbook and
reference unavailable).
- Wording cleanup: tagline and placeholder texts no longer reference a specific
job title ("Rate your Tool.", "Anonymous User"). No gender-specific forms are
used anymore.
## API Changes
- No changes compared to v0.8.6 (see `lib/api-spec/openapi.yaml`).
## Operations / Upgrade
- **Migration:** none. Existing tool, rating, and account data remain
unchanged.
- **Breaking Changes:** none.
## Known Limitations
- None within the scope of this release.
## Links
- Commit: [`6eb3dfd`](https://git.kubebase.de/admin/tool-evaluator/commit/6eb3dfd)
- Tag: [`v0.9.0`](https://git.kubebase.de/admin/tool-evaluator/releases/tag/v0.9.0)
@@ -32,6 +32,49 @@ Zentraler Zugriff auf den Tool-Katalog.
- **Massenaktion:** mehrere Tools auswählen und in den Papierkorb verschieben
(Bestätigungsdialog; soft gelöschte Tools sind aus allen öffentlichen Ansichten
entfernt und können wiederhergestellt oder endgültig gelöscht werden).
- **Importieren** (Premium): über die Schaltfläche **Importieren** oben rechts
können mehrere Tools gleichzeitig angelegt werden. Das Format wird automatisch
erkannt (CSV, JSON oder YAML); für CSV lässt sich der Trenner wählen
(automatisch, Komma, Semikolon oder Tabulator). Die Daten lassen sich direkt
ins Formular einfügen oder als Datei hochladen.
Unterstützte Felder: `name` (Pflicht), `description`, `category`, `websiteUrl`,
`iconUrl`, `features`, `tags` (`features`/`tags` sind mit `|` getrennte Listen).
**CSV-Beispiel:**
```csv
name;description;category;features;tags
Grafana;Observability- und Dashboard-Plattform;Monitoring;Dashboards|Alerts;devops
Prometheus;Zeitreihen-Datenbank;Monitoring;Metrics;devops
```
**JSON-Beispiel:**
```json
[
{ "name": "Grafana", "category": "Monitoring", "features": ["Dashboards"] },
{ "name": "Prometheus", "category": "Monitoring" }
]
```
**YAML-Beispiel:**
```yaml
- name: Grafana
category: Monitoring
features:
- Dashboards
- name: Prometheus
category: Monitoring
```
Eine umfangreichere, fertig importierbare Beispieldatei liegt unter
`docs/examples/import-tools.yaml` (24 gängige Enterprise-Tools).
Beim Import werden einzelne fehlerhafte Zeilen übersprungen und mit Zeilennummer
aufgelistet; korrekte Zeilen werden trotzdem angelegt. Jeder Import erzeugt
Audit-Log-Einträge.
## Tab „Audit-Log"
@@ -0,0 +1,104 @@
# Administration
The **Admin** area (`/admin`) is exclusively accessible to admins.
Without the admin role, access is denied.
> At the top right, the **Redundancy dashboard** button leads to the automatic
> duplicate detection (see [Redundancy](/docs/handbook/redundanz)).
## "Users" tab
Management of local accounts.
- **Add user:** username (required), password (at least 6 characters),
email (optional), **role** (User/Admin), **plan** (Free/Premium/Enterprise).
- **Edit user:** set role, plan and (for local accounts) a new password.
For OIDC accounts, password management is offered in the identity provider
(e.g. Keycloak).
- **Delete user:** permanently removes the account (not for your own account).
API reference:
[`POST /users`](/docs/reference/endpoints/users#createUser),
[`PATCH /users/{id}`](/docs/reference/endpoints/users#updateUser),
[`DELETE /users/{id}`](/docs/reference/endpoints/users#deleteUser).
## "Tools" tab
Central access to the tool catalog.
- **Search** for tools.
- View, edit or move individual tools to the trash.
- **Bulk action:** select multiple tools and move them to the trash
(confirmation dialog; soft-deleted tools are removed from all public views
and can be restored or permanently deleted).
- **Import** (premium): via the **Import** button at the top right, multiple
tools can be created at once. The format is detected automatically (CSV,
JSON or YAML); for CSV the delimiter can be chosen (auto-detect, comma,
semicolon or tab). Data can be pasted directly into the form or uploaded
as a file.
Supported fields: `name` (required), `description`, `category`, `websiteUrl`,
`iconUrl`, `features`, `tags` (`features`/`tags` are `|`-separated lists).
**CSV example:**
```csv
name;description;category;features;tags
Grafana;Observability and dashboard platform;Monitoring;Dashboards|Alerts;devops
Prometheus;Time-series database;Monitoring;Metrics;devops
```
**JSON example:**
```json
[
{ "name": "Grafana", "category": "Monitoring", "features": ["Dashboards"] },
{ "name": "Prometheus", "category": "Monitoring" }
]
```
**YAML example:**
```yaml
- name: Grafana
category: Monitoring
features:
- Dashboards
- name: Prometheus
category: Monitoring
```
A larger, ready-to-import example file is located at
`docs/examples/import-tools.yaml` (24 common enterprise tools).
During import, individual faulty rows are skipped and listed with their row
number; correct rows are still created. Every import produces audit-log
entries.
## "Audit log" tab
Chronological log of all creation, change and deletion operations
(max. 100 entries): action, entity + ID, timestamp, executing person and
changed fields.
API reference: [`GET /audit-logs`](/docs/reference/endpoints/audit#listAuditLogs).
## "System" tab
Version information of the running instance:
- **Version** (e.g. `v0.8.1`),
- **Commit** (7-digit SHA, linked to the repository),
- **Build date**,
- **Trash retention** ("N days" or "Forever").
## Tool links (Admin)
On the detail page of a tool you can manage **links** as an admin
(own/"manual" as well as automatically detected ones):
- **Link tool:** dialog with tool ID, **relationship type**
(Similar / Replaces / Superseded by) and optional notes.
- Relationship types are displayed as badges on the detail page.
- Manual links can be removed again via the trash icon.
@@ -0,0 +1,29 @@
# Analytics
The **Analytics** area (`/analytics`) is a public dashboard with
metrics and charts based on all tools and ratings.
## Metrics (KPI cards)
- **Number of tools** — how many tools are recorded in the catalog.
- **Number of ratings** — how many ratings were submitted in total.
- **Active categories** — how many categories exist.
- **Average rating** — global combined value.
## Charts
| Chart | Content |
| --- | --- |
| **Top 8 tools** | Bar chart of the tools with the highest combined score (05) |
| **Tools per category** | Radar chart of the number of tools per category |
| **Score distribution** | Two horizontal bar charts (usefulness & usability) per star |
The charts are interactive (tooltips on hover).
## API
- [`GET /analytics/summary`](/docs/reference/endpoints/analytics#getAnalyticsSummary)
- [`GET /analytics/top-tools`](/docs/reference/endpoints/analytics#getTopTools)
- [`GET /analytics/by-category`](/docs/reference/endpoints/analytics#getAnalyticsByCategory)
- [`GET /analytics/rating-distribution`](/docs/reference/endpoints/analytics#getRatingDistribution)
@@ -0,0 +1,39 @@
# Rating
On the detail page of a tool you can share your experience. Click on
**Submit a rating** (requires an account).
## Form fields
| Field | Required | Notes |
| --- | --- | --- |
| **Usefulness** | Yes | 15 stars |
| **Usability** | Yes | 15 stars |
| **Comment** | No | Free text |
| **Name** | No | Defaults to "Anonymous" |
Next to the fields, the **? icon** links directly to the associated field
description in the [data model reference](/docs/reference/schemas/ratinginput).
## What happens after submitting?
- Your rating is saved immediately and appears in the **rating list** of the
detail page.
- The **averages** (usefulness, usability, combined) and the **score
distribution** are updated.
- The **statistics** in the [Analytics](/docs/handbook/analytics) section are
recalculated.
## Statistic sections on the detail page
- **Rating overview:** usefulness & usability as an average with progress
bars.
- **Score distribution:** number of ratings per star (1★–5★).
- **History:** line chart of combined/individual values over time
(only visible once there are several ratings).
## API
- [`POST /tools/{id}/ratings`](/docs/reference/endpoints/ratings#createRating) — Submit a rating
- [`GET /tools/{id}/ratings`](/docs/reference/endpoints/ratings#listToolRatings) — Ratings of a tool
@@ -0,0 +1,70 @@
# Data model
This chapter explains the central data objects of toolr at the application
level. The complete, automatically generated reference of all fields,
types and constraints can be found in the
[API reference](/docs/reference/schemas/tool).
## Tool
The heart of it all: a tool recorded in the catalog.
| Property | Description |
| --- | --- |
| `id` | Unique identifier |
| `name` | Display name |
| `description` | Description (what does the tool do?) |
| `category` | Category assignment |
| `websiteUrl` | Official website (optional) |
| `iconUrl` | Logo/icon URL (optional) |
| `features` | List of capabilities |
| `tags` | List of keywords |
| `createdAt` / `updatedAt` | Timestamps |
| `createdBy` | Person who created it |
| `deletedAt` / `deletedBy` | Soft deletion (trash) |
Input forms use the derived schemas
[`ToolInput`](/docs/reference/schemas/toolinput) and
[`ToolUpdate`](/docs/reference/schemas/toolupdate).
Aggregated views are provided by [`ToolWithStats`](/docs/reference/schemas/toolwithstats)
(e.g. with average rating).
## Rating (Bewertung)
A single rating for a tool:
- `usefulness` (Nützlichkeit, 15) and `usability` (Bedienbarkeit, 15)
- optional `comment` and a display name (`reviewerName`)
- timestamp
Input schema: [`RatingInput`](/docs/reference/schemas/ratinginput).
## User & Auth
- [`User`](/docs/reference/schemas/user) — user account with role (User/Admin)
and plan (Free/Premium/Enterprise).
- [`AuthUser`](/docs/reference/schemas/authuser) — the logged-in profile
including `entitlements` (available features).
- [`UserPreferences`](/docs/reference/schemas/userpreferences) — view and
density preferences as well as the `watchlist` (list of tool IDs).
## Analytics
The statistics endpoints provide aggregated data:
- [`AnalyticsSummary`](/docs/reference/schemas/analyticssummary) — global
metrics (number of tools/ratings, categories, average).
- [`TopToolEntry`](/docs/reference/schemas/TopToolEntry) — an entry of the
top tools.- [`CategoryStats`](/docs/reference/schemas/categorystats) — number of tools per
category.
- [`RatingDistribution`](/docs/reference/schemas/ratingdistribution) —
score distribution (usefulness & usability).
- [`ScoreBucket`](/docs/reference/schemas/scorebucket) — a value bucket.
## Additional
- [`VersionInfo`](/docs/reference/schemas/versioninfo) — version, commit SHA,
build date and trash retention of the running instance.
- [`AuditLog`](/docs/reference/schemas/auditlog) — a log entry
(action, entity, timestamp, actor, changes).
@@ -6,7 +6,7 @@ Besuch bis zum Anlegen und Bewerten eines Tools.
## 1. Anmelden
Die meisten Aktionen (Tool anlegen, bewerten, Watchlist, Vergleichen) erfordern
Die meisten Aktionen (Tool anlegen, bewerten, Merkliste, Vergleichen) erfordern
ein Konto. Klicke unten links auf **Anmelden**. Je nach Konfiguration der
Instanz hast du zwei Möglichkeiten:
@@ -47,7 +47,7 @@ Siehe [Bewerten](/docs/handbook/bewerten).
## 5. Weiterführend
- [Tools vergleichen](/docs/handbook/vergleichen)
- [Watchlist](/docs/handbook/watchlist)
- [Merkliste](/docs/handbook/watchlist)
- [Analytics](/docs/handbook/analytics)
- [Pläne & Berechtigungen](/docs/handbook/plaene)
- [Administration](/docs/handbook/administration)
@@ -0,0 +1,53 @@
# Getting Started
This page guides you through the most important workflows in toolr — from your
first visit to creating and rating a tool.
## 1. Sign in
Most actions (create a tool, rate, watchlist, compare) require
an account. Click **Sign in** in the bottom left corner. Depending on the
instance configuration you have two options:
- **Local accounts:** username + password. Access is created by an admin
(see [Administration](/docs/handbook/administration)).
- **OIDC (SSO):** sign in with the configured identity provider (e.g.
Keycloak).
Which mode is active is shown by the
[`GET /auth/mode`](/docs/reference/endpoints/auth#getAuthMode) endpoint. Details
can be found in the [Sign in & account](/docs/handbook/konto) section.
## 2. Find tools
Open the **Browse tools** section:
- **Search** — full-text search across name & description (shortcut `/`).
- **Filter** — by category, tags, features and minimum rating
(`minRating`).
- **Sort** — by newest, top-rated, most rated, name
(ascending/descending) or last update.
All options in detail: [Find & browse tools](/docs/handbook/tools-finden).
## 3. Create a tool
Go to **Add tool** and fill in the form. Details for each field can be found
in the [Create a tool](/docs/handbook/tool-anlegen) section and in the
[field reference](/docs/reference/schemas/toolinput).
## 4. Rate
On the detail page of a tool you can submit **usefulness** and **usability**
(15 each) and optionally leave a comment. Your
rating is immediately reflected in the statistics.
See [Rating](/docs/handbook/bewerten).
## 5. Further reading
- [Compare tools](/docs/handbook/vergleichen)
- [Watchlist](/docs/handbook/watchlist)
- [Analytics](/docs/handbook/analytics)
- [Plans & permissions](/docs/handbook/plaene)
- [Administration](/docs/handbook/administration)
@@ -2,7 +2,7 @@
# Willkommen bei toolr
toolr ist eine Plattform zum **Entdecken, Bewerten und Vergleichen von
Entwicklungstools**. Nutzer:innen pflegen einen gemeinsamen Katalog von Tools,
Entwicklungstools**. Nutzer pflegen einen gemeinsamen Katalog von Tools,
vergeben Bewertungen (Nützlichkeit & Bedienbarkeit) und nutzen Statistiken, um
die richtige Wahl zu treffen.
@@ -12,13 +12,14 @@ die richtige Wahl zu treffen.
| --- | --- | --- |
| **Tools durchsuchen** | Katalog filtern, sortieren und durchsuchen | Alle |
| **Tool anlegen** | Neues Tool mit Beschreibung, Kategorie, Features & Tags eintragen | Angemeldet |
| **Tool bearbeiten/löschen** | Eigene Tools pflegen (Ersteller:in oder Admin) | Angemeldet |
| **Tool bearbeiten/löschen** | Eigene Tools pflegen (Ersteller oder Admin) | Angemeldet |
| **Bewerten** | Nützlichkeit & Bedienbarkeit (15) plus Kommentar vergeben | Angemeldet |
| **Watchlist** | Tools als Favoriten speichern | Premium |
| **Merkliste** | Tools als Favoriten speichern | Premium |
| **Vergleichen** | Tools nebeneinander gegenüberstellen | Premium |
| **Kosten erfassen** | Lizenz- und Kostenmodelle je Tool eintragen | Premium |
| **Analytics** | Statistiken, Top-Tools, Verteilungen | Alle |
| **Papierkorb** | Soft-gelöschte Tools wiederherstellen oder endgültig löschen | Premium |
| **Import** | Mehrere Tools per CSV, JSON oder YAML anlegen | Admin (Premium) |
| **Admin** | Nutzerverwaltung, Audit-Log, Systeminformationen | Admin |
| **Redundanz** | Automatische Doppelungs-Erkennung | Admin |

Some files were not shown because too many files have changed in this diff Show More