diff --git a/artifacts/toolrate/src/components/admin-tools-tab.tsx b/artifacts/toolrate/src/components/admin-tools-tab.tsx index af0badb..6856ea8 100644 --- a/artifacts/toolrate/src/components/admin-tools-tab.tsx +++ b/artifacts/toolrate/src/components/admin-tools-tab.tsx @@ -15,6 +15,7 @@ import { import { useQueryClient } from "@tanstack/react-query"; import { useAuth } from "@/hooks/use-auth"; import { Button } from "@/components/ui/button"; +import { GuideHelp } from "@/components/guide-help"; import { Input } from "@/components/ui/input"; import { Badge } from "@/components/ui/badge"; import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card"; @@ -105,7 +106,10 @@ export function AdminToolsTab() {
- {t("adminTools.allTools")} + + {t("adminTools.allTools")} + + {selectedIds.length > 0 ? t("adminTools.selected", { count: selectedIds.length }) : t("adminTools.toolCount", { count: allTools.length })} diff --git a/artifacts/toolrate/src/components/density-toggle.tsx b/artifacts/toolrate/src/components/density-toggle.tsx index d16fb40..0cdf88f 100644 --- a/artifacts/toolrate/src/components/density-toggle.tsx +++ b/artifacts/toolrate/src/components/density-toggle.tsx @@ -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 ( -
+
onValueChange(v === 1 ? "compact" : "cozy")} - aria-label="List density" + aria-label={t("common.listDensity")} />
diff --git a/artifacts/toolrate/src/components/filter-popover.tsx b/artifacts/toolrate/src/components/filter-popover.tsx index d49a579..27aedb7 100644 --- a/artifacts/toolrate/src/components/filter-popover.tsx +++ b/artifacts/toolrate/src/components/filter-popover.tsx @@ -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")} /> {minRating != null ? `${minRating.toFixed(1)}+` : t("filter.any")} diff --git a/artifacts/toolrate/src/components/user-menu.tsx b/artifacts/toolrate/src/components/user-menu.tsx index d964dd6..9a7aef6 100644 --- a/artifacts/toolrate/src/components/user-menu.tsx +++ b/artifacts/toolrate/src/components/user-menu.tsx @@ -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"; @@ -164,7 +165,10 @@ export function UserMenu() { - {t("auth.changePassword")} + + {t("auth.changePassword")} + + {!user?.isLocal ? (
@@ -193,7 +197,7 @@ export function UserMenu() { setNewPassword(e.target.value)} - placeholder="min. 6 characters" + placeholder={t("auth.passwordMinLength")} data-testid="input-new-password" />
diff --git a/artifacts/toolrate/src/components/view-toggle.tsx b/artifacts/toolrate/src/components/view-toggle.tsx index a0f6319..a9412d0 100644 --- a/artifacts/toolrate/src/components/view-toggle.tsx +++ b/artifacts/toolrate/src/components/view-toggle.tsx @@ -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 ( - {OPTIONS.map(({ value: v, label, Icon }) => ( - + {OPTIONS.map(({ value: v, labelKey, Icon }) => ( + ))} diff --git a/artifacts/toolrate/src/i18n/locales/de.json b/artifacts/toolrate/src/i18n/locales/de.json index 827949f..7f549dd 100644 --- a/artifacts/toolrate/src/i18n/locales/de.json +++ b/artifacts/toolrate/src/i18n/locales/de.json @@ -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", @@ -54,8 +55,16 @@ "all": "Alle", "none": "Keine", "language": "Sprache", - "viewDetails": "Details ansehen", - "guideTooltip": "Anleitung in der Dokumentation" + "viewDetails": "Details ansehen", + "guideTooltip": "Anleitung in der Dokumentation", + "viewMode": "Ansichtsmodus", + "viewGrid": "Raster", + "viewTable": "Tabelle", + "viewRows": "Zeilen", + "listDensity": "Listendichte", + "densityCompact": "Kompakt", + "densityComfortable": "Komfortabel", + "densityTitle": "Dichte: {{density}}" }, "home": { "welcome": "Willkommen bei toolr", diff --git a/artifacts/toolrate/src/i18n/locales/en.json b/artifacts/toolrate/src/i18n/locales/en.json index 8c6e2a3..a71d070 100644 --- a/artifacts/toolrate/src/i18n/locales/en.json +++ b/artifacts/toolrate/src/i18n/locales/en.json @@ -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", @@ -54,8 +55,16 @@ "all": "All", "none": "None", "language": "Language", - "viewDetails": "View details", - "guideTooltip": "Guide in the documentation" + "viewDetails": "View details", + "guideTooltip": "Guide in the documentation", + "viewMode": "View mode", + "viewGrid": "Grid", + "viewTable": "Table", + "viewRows": "Rows", + "listDensity": "List density", + "densityCompact": "Compact", + "densityComfortable": "Comfortable", + "densityTitle": "Density: {{density}}" }, "home": { "welcome": "Welcome to toolr", diff --git a/artifacts/toolrate/src/pages/home.tsx b/artifacts/toolrate/src/pages/home.tsx index 6447cde..de60aef 100644 --- a/artifacts/toolrate/src/pages/home.tsx +++ b/artifacts/toolrate/src/pages/home.tsx @@ -7,6 +7,7 @@ import { import { Card, CardHeader, CardTitle, CardDescription, CardContent } from "@/components/ui/card"; import { Skeleton } from "@/components/ui/skeleton"; import { Layout } from "@/components/layout"; +import { GuideHelp } from "@/components/guide-help"; import { ToolCard } from "@/components/tool-card"; import { Star, Wrench, MessageSquare, ArrowRight, Plus } from "lucide-react"; import { Link } from "wouter"; @@ -24,7 +25,10 @@ export default function Home() {
-

{t("home.welcome")}

+

+ {t("home.welcome")} + +

{t("home.tagline")}

diff --git a/artifacts/toolrate/src/pages/tools-browse.tsx b/artifacts/toolrate/src/pages/tools-browse.tsx index cefbd27..5feb090 100644 --- a/artifacts/toolrate/src/pages/tools-browse.tsx +++ b/artifacts/toolrate/src/pages/tools-browse.tsx @@ -6,6 +6,7 @@ import { } from "@workspace/api-client-react"; import { useVirtualizer } from "@tanstack/react-virtual"; import { Layout } from "@/components/layout"; +import { GuideHelp } from "@/components/guide-help"; import { ToolCard } from "@/components/tool-card"; import { ToolCardWide } from "@/components/tool-card-wide"; import { ToolRow, TABLE_GRID } from "@/components/tool-row"; @@ -230,7 +231,10 @@ export default function ToolsBrowse() {
-

{t("nav.browseTools")}

+

+ {t("nav.browseTools")} + +

{t("browse.subtitle")}