diff options
| author | Adam <[email protected]> | 2026-01-22 05:36:28 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2026-01-22 05:36:38 -0600 |
| commit | d9b94850192554d4d7ef9d47e213997b79543833 (patch) | |
| tree | d743d7c517a63bc7ba802b186615bcd5fd95b972 /packages/app/src/components | |
| parent | 366da595afaf98387544550fa1e08fceaf453779 (diff) | |
| download | opencode-d9b94850192554d4d7ef9d47e213997b79543833.tar.gz opencode-d9b94850192554d4d7ef9d47e213997b79543833.zip | |
fix(app): a11y translations
Diffstat (limited to 'packages/app/src/components')
8 files changed, 39 insertions, 16 deletions
diff --git a/packages/app/src/components/dialog-connect-provider.tsx b/packages/app/src/components/dialog-connect-provider.tsx index bf0b648c3..be33cba75 100644 --- a/packages/app/src/components/dialog-connect-provider.tsx +++ b/packages/app/src/components/dialog-connect-provider.tsx @@ -144,7 +144,15 @@ export function DialogConnectProvider(props: { provider: string }) { return ( <Dialog - title={<IconButton tabIndex={-1} icon="arrow-left" variant="ghost" onClick={goBack} aria-label="Go back" />} + title={ + <IconButton + tabIndex={-1} + icon="arrow-left" + variant="ghost" + onClick={goBack} + aria-label={language.t("common.goBack")} + /> + } > <div class="flex flex-col gap-6 px-2.5 pb-3"> <div class="px-2.5 flex gap-4 items-center"> diff --git a/packages/app/src/components/dialog-edit-project.tsx b/packages/app/src/components/dialog-edit-project.tsx index cf5535a67..9cf7ce575 100644 --- a/packages/app/src/components/dialog-edit-project.tsx +++ b/packages/app/src/components/dialog-edit-project.tsx @@ -193,7 +193,7 @@ export function DialogEditProject(props: { project: LocalProject }) { {(color) => ( <button type="button" - aria-label={`Select ${color} color`} + aria-label={language.t("dialog.project.edit.color.select", { color })} aria-pressed={store.color === color} classList={{ "flex items-center justify-center size-10 p-0.5 rounded-lg overflow-hidden transition-colors cursor-default": true, diff --git a/packages/app/src/components/dialog-select-server.tsx b/packages/app/src/components/dialog-select-server.tsx index a8e7ca4f7..4466fdde1 100644 --- a/packages/app/src/components/dialog-select-server.tsx +++ b/packages/app/src/components/dialog-select-server.tsx @@ -158,7 +158,7 @@ export function DialogSelectServer() { icon="circle-x" variant="ghost" class="bg-transparent transition-opacity shrink-0 hover:scale-110" - aria-label="Remove server" + aria-label={language.t("dialog.server.action.remove")} onClick={(e) => { e.stopPropagation() handleRemove(i) diff --git a/packages/app/src/components/prompt-input.tsx b/packages/app/src/components/prompt-input.tsx index c43338e50..b0ab5a3b0 100644 --- a/packages/app/src/components/prompt-input.tsx +++ b/packages/app/src/components/prompt-input.tsx @@ -1487,7 +1487,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { variant="ghost" class="h-6 w-6" onClick={() => prompt.context.removeActive()} - aria-label="Remove active file from context" + aria-label={language.t("prompt.context.removeActiveFile")} /> </div> )} @@ -1525,7 +1525,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { variant="ghost" class="h-6 w-6" onClick={() => prompt.context.remove(item.key)} - aria-label="Remove file from context" + aria-label={language.t("prompt.context.removeFile")} /> </div> )} @@ -1558,7 +1558,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { type="button" onClick={() => removeImageAttachment(attachment.id)} class="absolute -top-1.5 -right-1.5 size-5 rounded-full bg-surface-raised-stronger-non-alpha border border-border-base flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity hover:bg-surface-raised-base-hover" - aria-label="Remove attachment" + aria-label={language.t("prompt.attachment.remove")} > <Icon name="close" class="size-3 text-text-weak" /> </button> @@ -1691,7 +1691,11 @@ export const PromptInput: Component<PromptInputProps> = (props) => { "text-text-base": !permission.isAutoAccepting(params.id!, sdk.directory), "hover:bg-surface-success-base": permission.isAutoAccepting(params.id!, sdk.directory), }} - aria-label="Toggle auto-accept permissions" + aria-label={ + permission.isAutoAccepting(params.id!, sdk.directory) + ? language.t("command.permissions.autoaccept.disable") + : language.t("command.permissions.autoaccept.enable") + } aria-pressed={permission.isAutoAccepting(params.id!, sdk.directory)} > <Icon @@ -1726,7 +1730,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { variant="ghost" class="size-6" onClick={() => fileInputRef.click()} - aria-label="Attach file" + aria-label={language.t("prompt.action.attachFile")} > <Icon name="photo" class="size-4.5" /> </Button> @@ -1759,7 +1763,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { icon={working() ? "stop" : "arrow-up"} variant="primary" class="h-6 w-4.5" - aria-label={working() ? "Stop" : "Send message"} + aria-label={working() ? language.t("prompt.action.stop") : language.t("prompt.action.send")} /> </Tooltip> </div> diff --git a/packages/app/src/components/session-context-usage.tsx b/packages/app/src/components/session-context-usage.tsx index 677e29dbb..ee93b3f03 100644 --- a/packages/app/src/components/session-context-usage.tsx +++ b/packages/app/src/components/session-context-usage.tsx @@ -96,7 +96,13 @@ export function SessionContextUsage(props: SessionContextUsageProps) { <Switch> <Match when={variant() === "indicator"}>{circle()}</Match> <Match when={true}> - <Button type="button" variant="ghost" class="size-6" onClick={openContext} aria-label="View context usage"> + <Button + type="button" + variant="ghost" + class="size-6" + onClick={openContext} + aria-label={language.t("context.usage.view")} + > {circle()} </Button> </Match> diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx index fc4aee71f..a76734a69 100644 --- a/packages/app/src/components/session/session-header.tsx +++ b/packages/app/src/components/session/session-header.tsx @@ -48,6 +48,7 @@ export function SessionHeader() { const currentSession = createMemo(() => sync.data.session.find((s) => s.id === params.id)) const shareEnabled = createMemo(() => sync.data.config.share !== "disabled") const showShare = createMemo(() => shareEnabled() && !!currentSession()) + const showReview = createMemo(() => !!currentSession()) const sessionKey = createMemo(() => `${params.dir}${params.id ? "/" + params.id : ""}`) const view = createMemo(() => layout.view(sessionKey())) @@ -135,7 +136,7 @@ export function SessionHeader() { type="button" class="hidden md:flex w-[320px] p-1 pl-1.5 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-raised-base transition-colors cursor-default hover:bg-surface-raised-base-hover focus:bg-surface-raised-base-hover active:bg-surface-raised-base-active" onClick={() => command.trigger("file.open")} - aria-label="Search files" + aria-label={language.t("session.header.searchFiles")} > <div class="flex min-w-0 flex-1 items-center gap-2 overflow-visible"> <Icon name="magnifying-glass" size="normal" class="icon-base shrink-0" /> @@ -185,7 +186,7 @@ export function SessionHeader() { variant="ghost" class="group/review-toggle size-6 p-0" onClick={() => view().reviewPanel.toggle()} - aria-label="Toggle review panel" + aria-label={language.t("command.review.toggle")} aria-expanded={view().reviewPanel.opened()} aria-controls="review-panel" tabIndex={showReview() ? 0 : -1} @@ -219,7 +220,7 @@ export function SessionHeader() { variant="ghost" class="group/terminal-toggle size-6 p-0" onClick={() => view().terminal.toggle()} - aria-label="Toggle terminal" + aria-label={language.t("command.terminal.toggle")} aria-expanded={view().terminal.opened()} aria-controls="terminal-panel" > @@ -323,7 +324,11 @@ export function SessionHeader() { class="rounded-l-none" onClick={copyLink} disabled={state.unshare} - aria-label="Copy share link" + aria-label={ + state.copied + ? language.t("session.share.copy.copied") + : language.t("session.share.copy.copyLink") + } /> </Tooltip> </Show> diff --git a/packages/app/src/components/session/session-sortable-tab.tsx b/packages/app/src/components/session/session-sortable-tab.tsx index ea2b84f49..af2f57b06 100644 --- a/packages/app/src/components/session/session-sortable-tab.tsx +++ b/packages/app/src/components/session/session-sortable-tab.tsx @@ -41,7 +41,7 @@ export function SortableTab(props: { tab: string; onTabClose: (tab: string) => v icon="close" variant="ghost" onClick={() => props.onTabClose(props.tab)} - aria-label="Close tab" + aria-label={language.t("common.closeTab")} /> </Tooltip> } diff --git a/packages/app/src/components/session/session-sortable-terminal-tab.tsx b/packages/app/src/components/session/session-sortable-terminal-tab.tsx index 3ef395c9a..d16379e80 100644 --- a/packages/app/src/components/session/session-sortable-terminal-tab.tsx +++ b/packages/app/src/components/session/session-sortable-terminal-tab.tsx @@ -139,7 +139,7 @@ export function SortableTerminalTab(props: { terminal: LocalPTY; onClose?: () => e.stopPropagation() close() }} - aria-label="Close terminal" + aria-label={language.t("terminal.close")} /> } > |
