i18n-dashboard 0.4.3 → 0.6.2

package/README.md

@@ -30,10 +30,11 @@
 
 ### Scan & Sync
 - **Source scan (local)** — browse your file system with the built-in folder picker, detect all `$t()`, `t()`, `<i18n-t>`, `v-t`, and `<i18n>` block usages across `.vue`, `.ts`, `.js` files
-- **Source scan (Git)** — clone any Git repository (public or private) using a URL, branch, and access token, then scan the source files without needing a local checkout
-- **Source scan (URL)** — fetch `en.json`, `fr.json`… from any remote URL and import all keys
-- **Sync** — import existing `.json` locale files (local path or remote URL) into the database
+- **Source scan (git)** — provide a git repository URL (+ optional branch and access token); the dashboard clones the repo, scans source files, and imports locale files in one step
+- **Sync (local)** — import existing `.json` locale files from a local path into the database
+- **Sync (git)** — clone the configured git repository and import locale JSON files; only fills missing or empty translations — never overwrites existing values
 - **Unused key detection** — keys not found in source files are automatically flagged
+- **Conflict-safe import** — sync and scan never overwrite a translation that already has a value in the database
 
 ### Advanced Formats
 *(enable per project in Settings)*
@@ -43,7 +44,11 @@
 - **Snippet generator** — generates a ready-to-paste `createI18n()` configuration block
 
 ### Projects
-- **Inline settings** — edit project name, root path, source URLs, Git repository info, locales folder, key separator, color, and description directly from the project settings page
+- **3-step creation wizard** — Source → Info → Languages: add a local path or git repo, auto-detect project name, locales folder and existing languages, then pick languages with the built-in BCP 47 picker
+- **Auto-detect on creation** — reads `package.json` for the project name and scans the locale folder to pre-fill languages; works with both local paths and git repos
+- **Auto-scan on creation** — a scan is automatically triggered after project creation so keys are immediately available
+- **Git repository per project** — configure a git URL, branch, and optional access token; used for scan and sync operations without requiring a local clone
+- **Inline settings** — edit project name, root path, git repo, locales folder, key separator, color, and description directly from the project settings page
 - **Folder browser** — navigate your file system visually to pick the project root path
 - **Project snapshot** — export a complete backup (config + languages + all keys + translations) as a single JSON file, import it on any other instance (merge or replace mode)
 
@@ -306,7 +311,7 @@ The `{count}` and `{n}` parameters are always available implicitly.
 
 ### Scan
 
-Click **Scan project** in the sidebar to open the scan modal. Three modes are available:
+Click **Scan project** in the sidebar or on any project card to open the scan modal.
 
 **Local mode** — browse your file system with the folder picker and scan `.vue`, `.ts`, `.js` files for:
 - `$t('key')`, `$tc()`, `$te()`, `$tm()`
@@ -315,13 +320,11 @@ Click **Scan project** in the sidebar to open the scan modal. Three modes are av
 - `v-t="'key'"`
 - `<i18n>` SFC blocks
 
-**Git mode** — provide a repository URL, branch (default: `main`), and a personal access token. The dashboard clones the repo (shallow, depth 1) into a temp directory, scans the source files exactly like local mode, then cleans up automatically. Useful for CI environments or when you don't have a local checkout.
+**Git mode** — enter a git repository URL (and optionally a branch and access token); the scanner clones the repo (shallow, depth 1), scans all source files, and also imports locale JSON files to populate missing translations in one step. Useful for CI environments or when you don't have a local checkout.
 
 > Required token permission: **Contents → Read** (GitHub fine-grained PAT) or **repo** scope (classic PAT).
 
-**URL mode** — enter the base URL of your app; the scanner fetches each configured locale file (`/locale/en.json`, `/locale/fr.json`…) and imports all keys it finds.
-
-Results (keys found, new keys, unused keys, files scanned) are displayed inline.
+Results displayed inline: keys found, new keys, unused keys, files scanned, languages added, translations imported.
 
 ### Settings
 
@@ -577,8 +580,10 @@ POST /api/translations/batch-translate   # Auto-translate all missing for a lang
 ### Scan & Sync
 
 ```http
-POST /api/scan   # body: { project_id, mode: 'local'|'git'|'url', root_path?, url?, git_url?, git_branch?, git_token? }
-POST /api/sync   # body: { project_id }
+POST /api/scan     # body: { project_id, mode: 'local'|'git', root_path?, git_url?, git_branch?, git_token? }
+POST /api/sync     # body: { project_id }  — uses project's configured git repo or local path
+POST /api/projects/detect  # body: { root_path?, git_url?, git_branch?, git_token? }
+GET  /api/projects/check-name?name=&exclude_id=   # Availability check
 ```
 
 ### Project Snapshot

package/assets/locales/en.json

@@ -39,6 +39,13 @@
   "user.save_password": "Save",
   "user.password_changed": "Password changed",
   "user.passwords_mismatch": "Passwords do not match",
+  "keys.created": "Key created",
+  "keys.deleted": "Key deleted",
+  "keys.description_updated": "Description updated",
+  "keys.version_restored": "Version restored",
+  "keys.translate_done": "Auto-translate complete",
+  "keys.translated": "translated",
+  "keys.skipped": "skipped",
   "translations.title": "Translations",
   "translations.keys_count": "keys",
   "translations.langs_count": "languages",
@@ -86,6 +93,8 @@
   "status.rejected": "Rejected",
   "status.missing": "Missing",
   "status.unused": "Unused",
+  "review.marked_reviewed": "Marked as reviewed",
+  "review.translations_reviewed": "translation(s) marked as reviewed",
   "review.title": "Review queue",
   "review.approve_all": "Approve all",
   "review.empty_title": "No translations pending",
@@ -99,12 +108,17 @@
   "review.mark_all_reviewed": "Mark all as reviewed",
   "review.reject": "Reject",
   "review.mark_reviewed": "Mark as reviewed",
+  "languages.deleted": "Language deleted",
+  "languages.translating": "Translating",
+  "languages.translate_done": "Translation complete",
+  "languages.with_errors": "with errors",
   "languages.title": "Languages",
   "languages.subtitle": "Manage project languages",
   "languages.add": "Add a language",
   "languages.none": "No language configured",
   "languages.none_hint": "Add languages to start translating.",
   "languages.default_badge": "Default",
+  "settings.saved": "Settings saved",
   "settings.title": "Settings",
   "settings.save": "Save",
   "settings.root_path": "Root path",
@@ -167,6 +181,12 @@
   "formats.number_title": "Number formats",
   "formats.datetime_title": "Date & time formats",
   "formats.modifiers_title": "Modifiers",
+  "users.created": "User created",
+  "users.invitation_sent": "Invitation sent to",
+  "users.access_updated": "Access updated",
+  "users.deactivated": "User deactivated",
+  "users.reactivated": "User reactivated",
+  "users.deleted": "User deleted",
   "users.title": "Users",
   "users.subtitle": "Manage dashboard access",
   "users.all_title": "All users",
@@ -207,6 +227,9 @@
   "users.delete_warning": "This action is irreversible. The account and all associated data will be permanently deleted.",
   "users.global_access_all": "All projects",
   "users.no_access": "No access",
+  "projects.created": "Project added",
+  "projects.updated": "Project updated",
+  "projects.deleted": "Project deleted",
   "projects.subtitle": "Manage your translation projects",
   "projects.add": "Add a project",
   "projects.none": "No project",
@@ -214,7 +237,11 @@
   "projects.add_first": "Add my first project",
   "projects.keys_stat": "keys",
   "projects.separator": "separator",
-  "projects.scan_requires_local": "Requires a local path",
+  "projects.git_repos_count": "git repo(s)",
+  "projects.more_repos": "more repo(s)",
+  "projects.no_description": "No description",
+  "projects.name_taken": "This name is already taken",
+  "projects.scan_requires_local": "Requires a local path or git repo",
   "projects.scan_tooltip": "Scan source files to detect translation keys",
   "projects.sync_requires_source": "Requires a local path or remote URL",
   "projects.sync_tooltip": "Import locale JSON files into the database",
@@ -249,6 +276,31 @@
   "projects.color_pink": "Pink",
   "projects.color_yellow": "Yellow",
   "projects.color_gray": "Gray",
+  "projects.git_repo_title": "Git repository",
+  "projects.step_source": "Source",
+  "projects.step_info": "Info",
+  "projects.step_languages": "Languages",
+  "projects.step_source_hint": "Enter a local path and/or a git repository to auto-detect project configuration.",
+  "projects.detecting": "Detecting...",
+  "projects.detect_next": "Detect & Next",
+  "projects.creating_languages": "Adding languages...",
+  "projects.scanning_files": "Scanning source files...",
+  "projects.syncing_translations": "Syncing translations...",
+  "projects.no_source_hint": "Enter a local path or git repo URL to continue.",
+  "projects.step_languages_hint": "Add the languages for this project. The first one will be set as default. You can add more later.",
+  "languages.selected": "Selected languages",
+  "languages.set_as_default": "Set as default",
+  "projects.git_repos_title": "Git repositories",
+  "projects.git_token_set": "token set",
+  "projects.git_repo_url_label": "Repository URL",
+  "projects.git_repo_branch_label": "Branch",
+  "projects.git_repo_name_label": "Name (optional)",
+  "projects.git_repo_name_placeholder": "e.g. frontend",
+  "projects.git_token_label": "Access token (optional)",
+  "projects.git_token_placeholder": "ghp_...",
+  "projects.git_add_btn": "Add repository",
+  "profile.updated": "Account updated",
+  "profile.access_updated": "Access updated",
   "profile.member_since": "Member since",
   "profile.last_login": "Last login",
   "profile.edit_account": "Edit account",
@@ -262,8 +314,11 @@
   "profile.name_label": "Full name",
   "profile.name_placeholder": "John Doe",
   "profile.total_translations": "Total translations",
-  "profile.this_month": "This month",
-  "profile.this_week": "This week",
+  "profile.period_1d": "Last 24 hours",
+  "profile.period_7d": "Last 7 days",
+  "profile.period_30d": "Last 30 days",
+  "profile.period_365d": "Last year",
+  "profile.period_all": "Since account creation",
   "profile.general": "General",
   "profile.name_email_required": "Name and email are required",
   "dashboard.title": "Dashboard",
@@ -290,6 +345,7 @@
   "dashboard.languages_coverage": "Language coverage",
   "dashboard.no_languages": "No language configured",
   "dashboard.missing": "missing",
+  "common.errors": "errors",
   "common.cancel": "Cancel",
   "common.save": "Save",
   "common.delete": "Delete",
@@ -301,6 +357,8 @@
   "common.create": "Create",
   "common.or": "or",
   "common.irreversible": "This action is irreversible.",
+  "common.back": "Back",
+  "common.next": "Next",
   "common.just_now": "just now",
   "common.ago": "ago",
   "login.title": "Log in",
@@ -361,15 +419,28 @@
   "pathpicker.title": "Select a folder",
   "pathpicker.empty": "No subfolder",
   "pathpicker.select": "Select this folder",
+  "sync.toast_title": "Sync",
+  "sync.added": "added",
+  "sync.updated": "updated",
+  "sync.total": "total",
+  "scan.toast_title": "Scan",
+  "scan.langs_added": "language(s) added",
   "scan.modal_title": "Scan project",
   "scan.mode_local": "Local",
-  "scan.mode_url": "Via URL",
+  "scan.mode_git": "Git repo",
   "scan.local_hint": "Select the root folder of your Vue.js project. The scanner will detect all $t(), t(), <i18n-t> and v-t usages.",
   "scan.local_path_label": "Project root folder",
-  "scan.url_hint": "Enter the base URL of your app. The scanner will fetch each configured locale file (en.json, fr.json…) and import all keys.",
-  "scan.url_label": "Base URL",
-  "scan.url_hint2": "Example: https://my-app.com",
-  "scan.url_no_langs": "No languages configured yet. Add languages first so the scanner knows which locale files to fetch.",
+  "scan.git_hint": "Enter the URL of a Git repository. The dashboard will clone it and scan source files for translation keys.",
+  "scan.git_url_label": "Repository URL",
+  "scan.git_url_hint": "Example: https://github.com/user/my-app",
+  "scan.git_branch_label": "Branch",
+  "scan.git_branch_hint": "Leave empty to use the default branch",
+  "scan.git_token_label": "Access token",
+  "scan.git_token_hint": "For private repositories",
+  "scan.git_save": "Save this repository to the project",
+  "scan.git_saved": "Saved repositories",
+  "scan.git_repo_name_label": "Repository name",
+  "scan.git_repo_name_placeholder": "My App",
   "scan.results": "Results",
   "scan.keys_found": "keys found",
   "scan.keys_added": "new keys",
@@ -377,19 +448,5 @@
   "scan.files_scanned": "files scanned",
   "scan.errors": "errors",
   "scan.run": "Scan",
-  "scan.mode_git": "Git",
-  "scan.git_hint": "Enter the Git repository URL. The scanner will clone it and detect all translation key usages in source files.",
-  "scan.git_url_label": "Repository URL",
-  "scan.git_url_hint": "Example: https://github.com/user/repo.git",
-  "scan.git_branch_label": "Branch",
-  "scan.git_branch_hint": "Leave empty to use main",
-  "scan.git_token_label": "Access token",
-  "scan.git_token_hint": "Required for private repositories",
-  "scan.git_token_placeholder": "ghp_xxxxxxxxxxxx",
-  "settings.git_url": "Git repository URL",
-  "settings.git_url_hint": "Used for Git scan mode",
-  "settings.git_branch": "Git branch",
-  "settings.git_branch_hint": "Default: main",
-  "settings.git_token": "Git access token",
-  "settings.git_token_hint": "For private repositories"
+  "scan.translations_synced": "translations imported"
 }

package/components/GitRepoManager.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="space-y-2">
+    <div class="grid grid-cols-2 gap-2">
+      <UFormField :label="t('projects.git_repo_url_label', 'Repository URL')" class="col-span-2">
+        <UInput v-model="local.url" class="w-full" placeholder="https://github.com/org/repo.git" @input="emitCurrent" />
+      </UFormField>
+      <UFormField :label="t('projects.git_repo_branch_label', 'Branch')" class="col-span-2">
+        <UInput v-model="local.branch" class="w-full" placeholder="main" @input="emitCurrent" />
+      </UFormField>
+    </div>
+    <UFormField :label="t('projects.git_token_label', 'Access token (optional)')">
+      <UInput v-model="local.token" type="password" class="w-full" :placeholder="t('projects.git_token_placeholder', 'ghp_...')" @input="emitCurrent" />
+    </UFormField>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { GitRepo } from '~/interfaces/project.interface'
+
+const { t } = useT()
+
+const props = defineProps<{
+  modelValue: GitRepo | null | undefined
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: GitRepo | null]
+}>()
+
+const local = reactive<GitRepo>({ url: '', branch: '', token: '' })
+
+watch(() => props.modelValue, (val) => {
+  local.url = val?.url ?? ''
+  local.branch = val?.branch ?? ''
+  local.token = val?.token ?? ''
+}, { immediate: true })
+
+function emitCurrent() {
+  emit('update:modelValue', local.url.trim() ? { ...local } : null)
+}
+</script>

package/components/LanguagePicker.vue

@@ -0,0 +1,145 @@
+<template>
+  <div class="space-y-3">
+    <!-- Search -->
+    <UInput
+      v-model="search"
+      :placeholder="t('onboarding.languages_search', 'Search for a language...')"
+      icon="i-heroicons-magnifying-glass"
+      class="w-full"
+    />
+
+    <!-- List -->
+    <div class="border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden">
+      <div class="max-h-48 overflow-y-auto">
+        <button
+          v-for="lang in filteredList"
+          :key="lang.code"
+          class="w-full flex items-center gap-3 px-3 py-2 text-sm text-left transition-colors hover:bg-gray-50 dark:hover:bg-gray-800"
+          :class="isSelected(lang.code) ? 'opacity-40 cursor-default' : 'text-gray-700 dark:text-gray-300'"
+          :disabled="isSelected(lang.code)"
+          @click="add(lang)"
+        >
+          <span class="font-mono text-xs text-gray-400 w-14 shrink-0">{{ lang.code }}</span>
+          <span class="flex-1">{{ lang.nativeName }}</span>
+          <span class="text-xs text-gray-400 shrink-0">{{ lang.name }}</span>
+          <UIcon v-if="isSelected(lang.code)" name="i-heroicons-check" class="text-primary-500 shrink-0" />
+        </button>
+        <div v-if="!filteredList.length" class="px-3 py-4 text-sm text-center text-gray-400">
+          {{ t('languages.none_found', 'No language found') }}
+        </div>
+      </div>
+
+      <!-- Custom BCP-47 -->
+      <div
+        v-if="search && isValidBcp47(search) && !filteredList.find(l => l.code.toLowerCase() === search.toLowerCase())"
+        class="border-t border-gray-200 dark:border-gray-700"
+      >
+        <button
+          class="w-full flex items-center gap-3 px-3 py-2.5 text-sm text-left hover:bg-amber-50 dark:hover:bg-amber-900/20 text-gray-500 dark:text-gray-400 transition-colors"
+          @click="addCustom(search)"
+        >
+          <UIcon name="i-heroicons-plus-circle" class="shrink-0 text-amber-500" />
+          <span class="flex-1">{{ t('languages.use_code', 'Use code') }} <code class="font-mono bg-gray-100 dark:bg-gray-800 px-1 rounded">{{ search }}</code></span>
+          <UBadge size="xs" color="warning" variant="soft">BCP 47</UBadge>
+        </button>
+      </div>
+    </div>
+
+    <!-- Selected languages -->
+    <div v-if="modelValue.length" class="space-y-1.5">
+      <p class="text-xs font-medium text-gray-500 dark:text-gray-400">{{ t('languages.selected', 'Selected languages') }}</p>
+      <div class="flex flex-wrap gap-2">
+        <div
+          v-for="lang in modelValue"
+          :key="lang.code"
+          class="flex items-center gap-1.5 bg-gray-100 dark:bg-gray-800 rounded-lg px-2 py-1"
+        >
+          <span class="text-xs font-mono font-medium text-gray-700 dark:text-gray-300">{{ lang.code }}</span>
+          <UBadge
+            v-if="lang.is_default"
+            size="xs"
+            color="primary"
+            variant="soft"
+            class="cursor-pointer"
+            @click="setDefault(lang.code)"
+          >{{ t('languages.default_badge', 'Default') }}</UBadge>
+          <button
+            v-else
+            class="text-xs text-gray-400 hover:text-primary-500 transition-colors"
+            :title="t('languages.set_as_default', 'Set as default')"
+            @click="setDefault(lang.code)"
+          >
+            <UIcon name="i-heroicons-star" class="text-xs" />
+          </button>
+          <button class="text-gray-300 hover:text-red-500 transition-colors" @click="remove(lang.code)">
+            <UIcon name="i-heroicons-x-mark" class="text-xs" />
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { LANGUAGES } from '~/consts/languages.const'
+
+const { t } = useT()
+
+const props = defineProps<{
+  modelValue: Array<{ code: string; name: string; is_default: boolean }>
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: Array<{ code: string; name: string; is_default: boolean }>]
+}>()
+
+const search = ref('')
+
+const filteredList = computed(() => {
+  const q = search.value.toLowerCase()
+  const list = q
+    ? LANGUAGES.filter(l =>
+        l.code.toLowerCase().includes(q)
+        || l.name.toLowerCase().includes(q)
+        || l.nativeName.toLowerCase().includes(q),
+      )
+    : LANGUAGES
+  return list
+})
+
+function isSelected(code: string) {
+  return props.modelValue.some(l => l.code === code)
+}
+
+function isValidBcp47(code: string): boolean {
+  return /^[a-z]{2,8}(-[A-Za-z0-9]{1,8})*$/i.test(code) && code.length >= 2
+}
+
+function add(lang: { code: string; name: string; nativeName: string }) {
+  if (isSelected(lang.code)) return
+  const isFirst = props.modelValue.length === 0
+  emit('update:modelValue', [...props.modelValue, { code: lang.code, name: lang.name, is_default: isFirst }])
+  search.value = ''
+}
+
+function addCustom(code: string) {
+  const normalized = code.trim()
+  if (isSelected(normalized)) return
+  const isFirst = props.modelValue.length === 0
+  emit('update:modelValue', [...props.modelValue, { code: normalized, name: normalized, is_default: isFirst }])
+  search.value = ''
+}
+
+function remove(code: string) {
+  const updated = props.modelValue.filter(l => l.code !== code)
+  // If we removed the default, set the first one as default
+  if (updated.length && !updated.some(l => l.is_default)) {
+    updated[0].is_default = true
+  }
+  emit('update:modelValue', updated)
+}
+
+function setDefault(code: string) {
+  emit('update:modelValue', props.modelValue.map(l => ({ ...l, is_default: l.code === code })))
+}
+</script>

package/components/ScanModal.vue

@@ -1,5 +1,5 @@
 <template>
-  <UModal v-model:open="open" :title="t('scan.modal_title', 'Scan project')" :ui="{ width: 'sm:max-w-lg' }">
+  <UModal v-model:open="open" :title="t('scan.modal_title', 'Scan project')" :ui="{ width: '48rem' }">
     <template #body>
       <div class="space-y-5">
 
@@ -29,24 +29,16 @@
           </UFormField>
         </div>
 
-        <!-- URL mode -->
-        <div v-if="mode === 'url'" class="space-y-3">
+        <!-- Git mode -->
+        <div v-if="mode === 'git'" class="space-y-4">
           <p class="text-sm text-gray-500 dark:text-gray-400">
-            {{ t('scan.url_hint', 'Enter the base URL of your app. The scanner will fetch each configured locale file (en.json, fr.json…) and import all keys it finds.') }}
+            {{ t('scan.git_hint', 'Clone a Git repository and scan source files for translation keys.') }}
           </p>
-          <UFormField :label="t('scan.url_label', 'Base URL')" :hint="t('scan.url_hint2', 'First configured URL is used by default')">
-            <UInput v-model="remoteUrl" class="w-full" placeholder="https://my-app.com" />
-          </UFormField>
-          <div v-if="!project?.languages?.length" class="flex items-start gap-2 bg-amber-50 dark:bg-amber-900/20 rounded-lg px-3 py-2 text-xs text-amber-700 dark:text-amber-300">
-            <UIcon name="i-heroicons-exclamation-triangle" class="shrink-0 mt-0.5" />
-            {{ t('scan.url_no_langs', 'No languages configured on this project yet. Add languages first so the scanner knows which locale files to fetch.') }}
-          </div>
-          <div v-else class="flex flex-wrap gap-1.5">
-            <UBadge v-for="lang in project.languages" :key="lang.code" color="neutral" variant="soft" size="xs">
-              <UIcon name="i-heroicons-document-text" class="mr-1 opacity-60" />
-              {{ lang.code }}.json
-            </UBadge>
-          </div>
+          <GitRepoManager v-model="gitRepo" />
+          <label class="flex items-center gap-2 cursor-pointer">
+            <UToggle v-model="saveRepo" size="sm" />
+            <span class="text-sm text-gray-600 dark:text-gray-400">{{ t('scan.git_save', 'Save this repository to the project') }}</span>
+          </label>
         </div>
 
         <!-- Results -->
@@ -69,6 +61,14 @@
               <p class="text-xl font-bold text-gray-900 dark:text-white">{{ result.scannedFiles }}</p>
               <p class="text-xs text-gray-400">{{ t('scan.files_scanned', 'files scanned') }}</p>
             </div>
+            <div v-if="result.langsAdded" class="bg-white dark:bg-gray-900 rounded-lg p-2.5 text-center">
+              <p class="text-xl font-bold text-primary-600 dark:text-primary-400">{{ result.langsAdded }}</p>
+              <p class="text-xs text-gray-400">{{ t('scan.langs_added', 'language(s) added') }}</p>
+            </div>
+            <div v-if="result.translationsAdded !== undefined" class="bg-white dark:bg-gray-900 rounded-lg p-2.5 text-center col-span-2">
+              <p class="text-xl font-bold text-green-600 dark:text-green-400">{{ result.translationsAdded }}</p>
+              <p class="text-xs text-gray-400">{{ t('scan.translations_synced', 'translations imported') }}</p>
+            </div>
           </div>
           <p v-if="result.errors?.length" class="text-xs text-red-500">
             {{ result.errors.length }} {{ t('scan.errors', 'errors') }}
@@ -84,7 +84,7 @@
         <UButton color="neutral" variant="ghost" @click="open = false">{{ t('common.cancel', 'Cancel') }}</UButton>
         <UButton
           :loading="loading"
-          :disabled="mode === 'local' ? !localPath : !remoteUrl"
+          :disabled="mode === 'local' ? !localPath : !gitRepo?.url"
           icon="i-heroicons-magnifying-glass"
           @click="runScan"
         >
@@ -96,27 +96,30 @@
 </template>
 
 <script setup lang="ts">
+import type { GitRepo } from '~/interfaces/project.interface'
+
 const { t } = useT()
 
 const props = defineProps<{
   projectId: number
-  project?: { languages?: { code: string; name: string }[]; root_path?: string; source_url?: string }
+  project?: { languages?: { code: string; name: string }[]; root_path?: string; git_repo?: GitRepo | null }
 }>()
 
 const emit = defineEmits<{ done: [] }>()
 
 const open = defineModel<boolean>('open', { default: false })
 
-const mode = ref<'local' | 'url'>('local')
+const mode = ref<'local' | 'git'>('local')
 const localPath = ref(props.project?.root_path ?? '')
-const remoteUrl = ref(props.project?.source_url?.split(/[\n,]+/).map(u => u.trim()).filter(Boolean)[0] ?? '')
+const gitRepo = ref<GitRepo | null>(null)
+const saveRepo = ref(false)
 const loading = ref(false)
 const result = ref<any>(null)
 const error = ref('')
 
 const modes = computed(() => [
   { value: 'local', label: t('scan.mode_local', 'Local'), icon: 'i-heroicons-computer-desktop' },
-  { value: 'url', label: t('scan.mode_url', 'Via URL'), icon: 'i-heroicons-globe-alt' },
+  { value: 'git', label: t('scan.mode_git', 'Git repo'), icon: 'i-heroicons-code-bracket' },
 ])
 
 watch(open, (val) => {
@@ -124,8 +127,9 @@ watch(open, (val) => {
     result.value = null
     error.value = ''
     localPath.value = props.project?.root_path ?? ''
-    remoteUrl.value = props.project?.source_url?.split(/[\n,]+/).map(u => u.trim()).filter(Boolean)[0] ?? ''
-    mode.value = props.project?.root_path ? 'local' : props.project?.source_url ? 'url' : 'local'
+    saveRepo.value = false
+    mode.value = props.project?.root_path ? 'local' : 'git'
+    gitRepo.value = props.project?.git_repo ? { ...props.project.git_repo } : null
   }
 })
 
@@ -134,13 +138,22 @@ async function runScan() {
   error.value = ''
   result.value = null
   try {
+    if (mode.value === 'git' && saveRepo.value && gitRepo.value?.url) {
+      await $fetch(`/api/projects/${props.projectId}`, {
+        method: 'PUT',
+        body: { git_repo: gitRepo.value },
+      })
+    }
+
     result.value = await $fetch('/api/scan', {
       method: 'POST',
       body: {
         project_id: props.projectId,
         mode: mode.value,
         root_path: mode.value === 'local' ? localPath.value : undefined,
-        url: mode.value === 'url' ? remoteUrl.value : undefined,
+        git_url: mode.value === 'git' ? gitRepo.value?.url : undefined,
+        git_branch: mode.value === 'git' ? gitRepo.value?.branch : undefined,
+        git_token: mode.value === 'git' ? gitRepo.value?.token : undefined,
       },
     })
     emit('done')

package/components/TranslationRow.vue

@@ -143,8 +143,11 @@
             <!-- Status dot -->
             <UTooltip :text="statusLabel(lang.code)" :delay-duration="300">
               <span
-                class="mt-1.5 w-2 h-2 rounded-full shrink-0"
-                :class="[statusDot(lang.code), canClickStatus(lang.code) ? 'cursor-pointer' : 'cursor-default']"
+                class="mt-1.5 w-2 h-2 rounded-full shrink-0 transition-opacity"
+                :class="[
+                  cyclingStatusLang === lang.code ? 'bg-gray-300 dark:bg-gray-600 animate-pulse cursor-wait' : statusDot(lang.code),
+                  canClickStatus(lang.code) && cyclingStatusLang !== lang.code ? 'cursor-pointer' : 'cursor-default'
+                ]"
                 @click="cycleStatus(lang.code)"
               />
             </UTooltip>
@@ -275,6 +278,8 @@ const editingCell = ref<string | null>(null)
 const editValues = ref<Record<string, string>>({})
 const saving = ref<string | null>(null)
 const translateLoading = ref<string | null>(null)
+const cyclingStatusLang = ref<string | null>(null)
+const deletingKey = ref(false)
 const showHistory = ref(false)
 const historyTranslationId = ref<number | null>(null)
 const textareaWrappers = ref<Record<string, HTMLElement | null>>({})
@@ -387,7 +392,7 @@ function canClickStatus(langCode: string): boolean {
 
 async function cycleStatus(langCode: string) {
   const tr = props.translationKey.translations[langCode]
-  if (!tr?.value) return
+  if (!tr?.value || cyclingStatusLang.value) return
 
   const current = (tr.status as TRANSLATION_STATUS) || TRANSLATION_STATUS.DRAFT
   let next: TRANSLATION_STATUS
@@ -400,6 +405,7 @@ async function cycleStatus(langCode: string) {
     next = current === TRANSLATION_STATUS.DRAFT ? TRANSLATION_STATUS.REVIEWED : TRANSLATION_STATUS.DRAFT
   }
 
+  cyclingStatusLang.value = langCode
   try {
     await $fetch('/api/translations/status', {
       method: 'POST',
@@ -409,6 +415,8 @@ async function cycleStatus(langCode: string) {
     refreshNuxtData('project-stats')
   } catch (e: any) {
     toast.add({ title: t('common.error', 'Error'), description: e.data?.message || e.message, color: 'error' })
+  } finally {
+    cyclingStatusLang.value = null
   }
 }
 
@@ -529,6 +537,7 @@ const rowActions = computed(() => {
 })
 
 async function deleteKey() {
+  deletingKey.value = true
   try {
     await $fetch(`/api/keys/${props.translationKey.id}`, { method: 'DELETE' })
     toast.add({ title: t('translations.key_deleted', 'Key deleted'), color: 'success' })
@@ -536,6 +545,8 @@ async function deleteKey() {
     refreshNuxtData('project-stats')
   } catch (e: any) {
     toast.add({ title: t('common.error', 'Error'), description: e.data?.message || e.message, color: 'error' })
+  } finally {
+    deletingKey.value = false
   }
 }
 </script>