fix: redesign session log player controls, fix tooltip overlap and drop dot separators

plugins/ssh-terminal/locales/en.json

@@ -86,7 +86,10 @@
     "imageUploaded": "Image uploaded: {{path}}",
     "imageClipboardUnavailable": "This browser cannot read images from the clipboard",
     "imageClipboardEmpty": "No image found in the clipboard",
-    "localShell": "Local terminal shell"
+    "localShell": "Local terminal shell",
+    "autocompleteHintComplete": "Tab or Enter to complete",
+    "autocompleteHintNavigate": "↑↓ to navigate",
+    "autocompleteHintClose": "Esc to close"
   },
   "terminalToolbar": {
     "detachTmux": "Detach tmux",
@@ -163,7 +166,7 @@
       },
       "sessionTimeoutMinutes": {
         "label": "Terminal Session Persistence",
-        "description": "How long a disconnected terminal is kept alive on the server before it is closed. Min 1 · Max 1440 minutes. For sessions that must outlive this, enable Auto-Tmux on the host."
+        "description": "How long a disconnected terminal is kept alive on the server before it is closed. Min 1, max 1440 minutes. For sessions that must outlive this, enable Auto-Tmux on the host."
       },
       "commandHistoryEnabled": {
         "label": "Command History",

plugins/ssh-terminal/src/frontend/terminal/command-history/CommandAutocomplete.tsx

@@ -1,5 +1,6 @@
 import React, { useEffect, useRef } from "react";
 import { cn } from "@termix/plugin-sdk/ui";
+import { useTranslation } from "@termix/plugin-sdk/frontend";
 
 interface CommandAutocompleteProps {
   suggestions: string[];
@@ -53,6 +54,7 @@ export function CommandAutocomplete({
   position,
   visible,
 }: CommandAutocompleteProps) {
+  const { t } = useTranslation();
   const containerRef = useRef<HTMLDivElement>(null);
   const selectedRef = useRef<HTMLDivElement>(null);
 
@@ -103,7 +105,11 @@ export function CommandAutocomplete({
         ))}
       </div>
       <div className="px-3 py-1 text-xs text-muted-foreground border-t border-border bg-muted/50 shrink-0">
-        Tab/Enter to complete • ↑↓ to navigate • Esc to close
+        <span className="flex flex-wrap gap-x-3">
+          <span>{t("terminal.autocompleteHintComplete")}</span>
+          <span>{t("terminal.autocompleteHintNavigate")}</span>
+          <span>{t("terminal.autocompleteHintClose")}</span>
+        </span>
       </div>
     </div>
   );