Version 3 of the kit: - Radix UI replaced with Base UI (using the Shadcn UI patterns) - next-intl replaces react-i18next - enhanceAction deprecated; usage moved to next-safe-action - main layout now wrapped with [locale] path segment - Teams only mode - Layout updates - Zod v4 - Next.js 16.2 - Typescript 6 - All other dependencies updated - Removed deprecated Edge CSRF - Dynamic Github Action runner
40 lines
1.3 KiB
Plaintext
40 lines
1.3 KiB
Plaintext
---
|
|
status: "published"
|
|
description: "The Next.js Supabase Turbo Dev Tools allows you to edit translations and use AI to translate them."
|
|
title: "Translations Editor"
|
|
label: "Translations Editor"
|
|
order: 1
|
|
---
|
|
|
|
The Translations Editor is a tool that allows you to edit translations and use AI to translate them.
|
|
|
|
It's a simple editor that allows you to edit translations for your project.
|
|
|
|
{% img src="/assets/images/dev-tools-translations.webp" width="1000"
|
|
height="600" /%}
|
|
|
|
## Set OpenAI API Key
|
|
|
|
First, you need to set the OpenAI API Key in the `apps/dev-tool/.env.local` file.
|
|
|
|
```bash apps/dev-tool/.env.local
|
|
OPENAI_API_KEY=your-openai-api-key
|
|
```
|
|
|
|
Either make sure your key has access to the `gpt-4o-mini` model or set the `LLM_MODEL_NAME` environment variable to whichever model you have access to.
|
|
|
|
## Adding a new language
|
|
|
|
First, you need to add the language to the `packages/i18n/src/locales.tsx` file as described in the [Adding Translations](/docs/next-supabase-turbo/translations/adding-translations) documentation.
|
|
|
|
## Generate Translations with AI
|
|
|
|
The Translations Editor allows you to generate translations with AI.
|
|
|
|
You can use the AI to translate the translations for you by clicking the "Translate missing with AI" button.
|
|
|
|
## Editing Translations
|
|
|
|
Every time you update a translation, it will be saved automatically to the same file it's defined in.
|
|
|