feat(mcp): show OAuth connect instructions in settings

Replace the "Claude Desktop & ChatGPT coming soon" placeholder with real
instructions: expose the /mcp/oauth URL (new oauthUrl prop) for users to add
as a custom connector and sign in through the consent screen, and state that
connected apps can read and analyse data but not change it. Update es.json.
This commit is contained in:
Víctor Falcón 2026-07-17 17:51:58 +02:00
parent 2330fdf98c
commit a1b730f335
3 changed files with 26 additions and 5 deletions

View File

@ -41,6 +41,7 @@ class McpTokenController extends Controller implements HasMiddleware
return Inertia::render('settings/mcp', [
'tokens' => $this->tokensFor($request),
'serverUrl' => url('/mcp'),
'oauthUrl' => url('/mcp/oauth'),
'subscribeUrl' => route('subscribe'),
'newToken' => $request->session()->get('mcp_token'),
]);

View File

@ -2273,7 +2273,8 @@
"Here is your connection URL. Use it with a token you created above.": "Esta es tu URL de conexión. Úsala con un token que hayas creado arriba.",
"Run this, using one of your tokens in place of <token>.": "Ejecuta esto, usando uno de tus tokens en lugar de <token>.",
"Claude Desktop & ChatGPT": "Claude Desktop y ChatGPT",
"Coming soon. These apps sign in with OAuth, which we are still building, so a token will not work with them yet. Use Claude Code for now.": "Muy pronto. Estas apps inician sesión con OAuth, que todavía estamos construyendo, así que de momento un token no funciona con ellas. Usa Claude Code por ahora.",
"These apps sign in instead of using a token. Add a custom connector pointing at the URL below, then approve the connection on the Whisper Money screen that opens. No token needed.": "Estas apps inician sesión en lugar de usar un token. Añade un conector personalizado que apunte a la URL de abajo y luego aprueba la conexión en la pantalla de Whisper Money que se abre. No hace falta ningún token.",
"Connected apps can read and analyse your data, but cannot change it.": "Las apps conectadas pueden leer y analizar tus datos, pero no pueden modificarlos.",
"Connect to :app": "Conectar con :app",
"Connect :client to :app": "Conectar :client con :app",
":client is asking to read and analyse your finance data.": ":client solicita leer y analizar tus datos financieros.",

View File

@ -56,6 +56,7 @@ interface TokenRow {
interface McpPageProps {
tokens: TokenRow[];
serverUrl: string;
oauthUrl: string;
subscribeUrl: string;
newToken: string | null;
}
@ -69,9 +70,8 @@ function formatDate(value: string | null): string {
}
export default function Mcp() {
const { tokens, serverUrl, subscribeUrl, newToken, auth } = usePage<
SharedData & McpPageProps
>().props;
const { tokens, serverUrl, oauthUrl, subscribeUrl, newToken, auth } =
usePage<SharedData & McpPageProps>().props;
const [, copy] = useClipboard();
const form = useForm<{ name: string; scope: 'read' | 'read_write' }>({
@ -442,7 +442,26 @@ export default function Mcp() {
</h3>
<p className="text-sm text-muted-foreground">
{__(
'Coming soon. These apps sign in with OAuth, which we are still building, so a token will not work with them yet. Use Claude Code for now.',
'These apps sign in instead of using a token. Add a custom connector pointing at the URL below, then approve the connection on the Whisper Money screen that opens. No token needed.',
)}
</p>
<div className="flex items-center gap-2 pt-1">
<code className="flex-1 overflow-x-auto rounded-md bg-muted px-3 py-2 text-sm">
{oauthUrl}
</code>
<Button
type="button"
variant="outline"
size="icon"
onClick={() => copyValue(oauthUrl)}
aria-label={__('Copy')}
>
<Copy className="h-4 w-4" />
</Button>
</div>
<p className="pt-1 text-sm text-muted-foreground">
{__(
'Connected apps can read and analyse your data, but cannot change it.',
)}
</p>
</div>