fix(i18n): wire useTranslation into SetupsView — close verification gap
Replace hardcoded English strings in SetupsView.tsx with t() calls using existing setups namespace keys. Closes the 1 gap found during phase 34 verification. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,8 +1,10 @@
|
|||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
|
import { useTranslation } from "react-i18next";
|
||||||
import { useCreateSetup, useSetups } from "../hooks/useSetups";
|
import { useCreateSetup, useSetups } from "../hooks/useSetups";
|
||||||
import { SetupCard } from "./SetupCard";
|
import { SetupCard } from "./SetupCard";
|
||||||
|
|
||||||
export function SetupsView() {
|
export function SetupsView() {
|
||||||
|
const { t } = useTranslation(["setups", "common"]);
|
||||||
const [newSetupName, setNewSetupName] = useState("");
|
const [newSetupName, setNewSetupName] = useState("");
|
||||||
const { data: setups, isLoading } = useSetups();
|
const { data: setups, isLoading } = useSetups();
|
||||||
const createSetup = useCreateSetup();
|
const createSetup = useCreateSetup();
|
||||||
@@ -22,7 +24,7 @@ export function SetupsView() {
|
|||||||
type="text"
|
type="text"
|
||||||
value={newSetupName}
|
value={newSetupName}
|
||||||
onChange={(e) => setNewSetupName(e.target.value)}
|
onChange={(e) => setNewSetupName(e.target.value)}
|
||||||
placeholder="New setup name..."
|
placeholder={t("setups:namePlaceholder")}
|
||||||
className="flex-1 px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
|
className="flex-1 px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
|
||||||
/>
|
/>
|
||||||
<button
|
<button
|
||||||
@@ -30,7 +32,7 @@ export function SetupsView() {
|
|||||||
disabled={!newSetupName.trim() || createSetup.isPending}
|
disabled={!newSetupName.trim() || createSetup.isPending}
|
||||||
className="px-4 py-2 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
|
className="px-4 py-2 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
|
||||||
>
|
>
|
||||||
{createSetup.isPending ? "Creating..." : "Create"}
|
{createSetup.isPending ? t("setups:creating") : t("common:actions.create")}
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
@@ -51,7 +53,7 @@ export function SetupsView() {
|
|||||||
<div className="py-16">
|
<div className="py-16">
|
||||||
<div className="max-w-lg mx-auto text-center">
|
<div className="max-w-lg mx-auto text-center">
|
||||||
<h2 className="text-xl font-semibold text-gray-900 mb-8">
|
<h2 className="text-xl font-semibold text-gray-900 mb-8">
|
||||||
Build your perfect loadout
|
{t("setups:emptyState.title")}
|
||||||
</h2>
|
</h2>
|
||||||
<div className="space-y-6 text-left mb-10">
|
<div className="space-y-6 text-left mb-10">
|
||||||
<div className="flex items-start gap-4">
|
<div className="flex items-start gap-4">
|
||||||
@@ -59,9 +61,9 @@ export function SetupsView() {
|
|||||||
1
|
1
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="font-medium text-gray-900">Create a setup</p>
|
<p className="font-medium text-gray-900">{t("setups:emptyState.step1Title")}</p>
|
||||||
<p className="text-sm text-gray-500">
|
<p className="text-sm text-gray-500">
|
||||||
Name your loadout for a specific trip or activity
|
{t("setups:emptyState.step1Description")}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -70,9 +72,9 @@ export function SetupsView() {
|
|||||||
2
|
2
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="font-medium text-gray-900">Add items</p>
|
<p className="font-medium text-gray-900">{t("setups:emptyState.step2Title")}</p>
|
||||||
<p className="text-sm text-gray-500">
|
<p className="text-sm text-gray-500">
|
||||||
Pick gear from your collection to include in the setup
|
{t("setups:emptyState.step2Description")}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -81,9 +83,9 @@ export function SetupsView() {
|
|||||||
3
|
3
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="font-medium text-gray-900">Track weight</p>
|
<p className="font-medium text-gray-900">{t("setups:emptyState.step3Title")}</p>
|
||||||
<p className="text-sm text-gray-500">
|
<p className="text-sm text-gray-500">
|
||||||
See weight breakdown and optimize your pack
|
{t("setups:emptyState.step3Description")}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user