feat: support modify the range of annotation display (#2)

* wip: support i18n-ally.annotationRange

* wip: translate description

* wip: update test.js.snap

* wip: update translation

* wip: update flutter_l10n

examples/by-frameworks/flutter_l10n/.vscode/settings.json

@@ -5,9 +5,9 @@
   ],
   "i18n-ally.pathMatcher": "app_{locale}.{ext}",
   "i18n-ally.extract.keygenStyle": "snake_case",
-  "i18n-ally.annotationInPlace": false,
+  "i18n-ally.annotationInPlace": true,
+  "i18n-ally.annotationRange": "annotation",
   "i18n-ally.annotationDelimiter": "//",
-  // "i18n-ally.sortKeys": true,
   "editor.formatOnSave": true,
   "[dart]": {
     "editor.codeActionsOnSave": {

locales/en.json

@@ -35,6 +35,7 @@
   "config.annotation_delimiter": "The delimiter for annotations",
   "config.annotation_in_place": "Show annotation in place instead of appending to the tail",
   "config.annotation_max_length": "Max number of characters shown in the inline annotations. Excess characters will display as an ellipses (...)",
+  "config.annotation_range": "Range of annotation display\n- `key`: The annotation is displayed at the key position\n- `annotation`: The annotation is displayed at the position of the matching group named `annotation` in the regular expression of `i18n-ally.regex`",
   "config.annotations": "Enable the inline annotations.",
   "config.auto_detection": "Enable locales auto detection for projects",
   "config.baidu_app_secret": "APP Secret to use Baidu translate engine",
@@ -88,8 +89,8 @@
   "config.review_remove_on_resolved": "Remove the comment instead of marking it as resolved.",
   "config.review_username": "Username for reviewing",
   "config.show_flags": "Show flags along with locale codes",
-  "config.sort_keys": "Sort keys when saving to JSON/YAML",
   "config.sort_compare": "Strategy for sorting keys.",
+  "config.sort_keys": "Sort keys when saving to JSON/YAML",
   "config.sort_locale": "Locale to with if locale sort is used (will use the file's own locale if not specified)",
   "config.source_language": "Source language for machine translation",
   "config.tab_style": "Tab style for locale files",
@@ -237,4 +238,4 @@
   "view.usage_keys_missing": "{0} keys are missing",
   "view.usage_keys_not_in_use": "{0} keys are NOT in use",
   "view.usage_report_none": "Press refresh to start analysing key usage"
-}
+}

locales/zh-CN.json

@@ -35,6 +35,7 @@
   "config.annotation_delimiter": "内联注释的分隔符",
   "config.annotation_in_place": "在路径原位显示翻译文案，而不是附加在末尾",
   "config.annotation_max_length": "内联注释显示的最大字符数。超出的部分将显示为省略号（...）",
+  "config.annotation_range": "注释显示的范围\n- `key`: 注释显示在key的位置\n- `annotation`: 注释显示在`i18n-ally.regex`的正则表达式中名为`annotation`的匹配组的位置",
   "config.annotations": "启用内联注释",
   "config.auto_detection": "",
   "config.baidu_app_secret": "百度平台分配的密钥",
@@ -88,7 +89,9 @@
   "config.review_remove_on_resolved": "删除已处理的审批留言，而不是只将其标记为已处理。",
   "config.review_username": "使用者名称",
   "config.show_flags": "显示国旗图标",
+  "config.sort_compare": "key的排序策略",
   "config.sort_keys": "保存排序后的JSON/YAML",
+  "config.sort_locale": "当排序方式为`locale`时，用来排序的区域（若不指定，使用文件自己的区域）",
   "config.source_language": "翻译源语言",
   "config.tab_style": "文案文件的缩进样式",
   "config.target_picking_strategy": "如果找到多个语言文件时的语言文件选择策略",
@@ -234,5 +237,6 @@
   "view.usage_keys_in_use": "{0} 条文案使用中",
   "view.usage_keys_missing": "{0} 条文案缺失",
   "view.usage_keys_not_in_use": "{0} 条文案未被使用",
-  "view.usage_report_none": "点击刷新开始使用分析"
-}
+  "view.usage_report_none": "点击刷新开始使用分析",
+  "นามสกุล": ""
+}

package.json

@@ -779,6 +779,15 @@
           "default": true,
           "description": "%config.annotation_in_place%"
         },
+        "i18n-ally.annotationRange" : {
+          "type": "string",
+          "default": "key",
+          "enum": [
+            "key",
+            "annotation"
+          ],
+          "description": "%config.annotation_range%"
+        },
         "i18n-ally.annotationMaxLength": {
           "type": "number",
           "default": 40,

src/core/Config.ts

@@ -138,6 +138,10 @@ export class Config {
     return this.getConfig<boolean>('annotationInPlace') ?? true
   }
 
+  static get annotationRange(): 'key' | 'annotation' {
+    return this.getConfig('annotationRange') ?? 'key'
+  }
+
   static get namespace(): boolean | undefined {
     return this.getConfig<boolean>('namespace')
   }

src/core/types.ts

@@ -115,6 +115,8 @@ export interface KeyInDocument {
   end: number
   key: string
   quoted: boolean
+  annotationStart?: number
+  annotationEnd?: number
 }
 
 export interface KeyOccurrence {

src/editor/annotation.ts

@@ -93,6 +93,7 @@ const annotation: ExtensionModule = (ctx) => {
     const sourceLanguage = Config.sourceLanguage
     const showAnnotations = Config.annotations
     const annotationInPlace = Config.annotationInPlace
+    const annotationRange = Config.annotationRange
     const themeAnnotationMissing = Config.themeAnnotationMissing
     const themeAnnotation = Config.themeAnnotation
     const themeAnnotationBorder = Config.themeAnnotationBorder
@@ -105,11 +106,12 @@ const annotation: ExtensionModule = (ctx) => {
         ? `${namespace}.${key.key}`
         : key.key
 
+      const isUseAnnotation = annotationRange === 'annotation' && key.annotationStart != null && key.annotationEnd != null
       const range = new Range(
-        document.positionAt(key.start),
-        document.positionAt(key.end),
+        document.positionAt(isUseAnnotation ? key.annotationStart! : key.start),
+        document.positionAt(isUseAnnotation ? key.annotationEnd! : key.end),
       )
-      const rangeWithQuotes = key.quoted
+      const rangeWithQuotes = !isUseAnnotation && key.quoted
         ? new Range(
           range.start.with(undefined, range.start.character - 1),
           range.end.with(undefined, range.end.character + 1),

src/frameworks/flutter-l10n.ts

@@ -32,8 +32,8 @@ class FlutterL10nFramework extends Framework {
 
   // for visualize the regex, you can use https://regexper.com/
   usageMatchRegex = [
-    'S\\.of\\([\\w.]+\\)[?!]?\\.({key})\\W',
-    'AppLocalizations\\.of\\([\\w.]+\\)[?!]?\\.({key})\\W',
+    '(?<annotation>S\\.of\\([\\w.]+\\)[?!]?\\.(?<key>{key}))\\W',
+    '(?<annotation>AppLocalizations\\.of\\([\\w.]+\\)[?!]?\\.(?<key>{key}))\\W',
   ]
 
   preferredKeystyle?: KeyStyle = 'flat'

src/utils/Regex.ts

@@ -17,14 +17,17 @@ export function handleRegexMatch(
   starts: number[] = [],
 ): KeyInDocument | undefined {
   const matchString = match[0]
-  let key = match[1]
+  let key = match.groups?.key ?? match[1]
   if (!key)
     return
 
   const start = match.index + matchString.lastIndexOf(key)
   const end = start + key.length
   const scope = scopes.find(s => s.start <= start && s.end >= end)
   const quoted = QUOTE_SYMBOLS.includes(text[start - 1])
+  const annotation = match.groups?.annotation ?? match[0]
+  const annotationStart = match.index + matchString.lastIndexOf(annotation)
+  const annotationEnd = annotationStart + annotation.length
 
   const namespace = scope?.namespace || defaultNamespace
 
@@ -50,6 +53,8 @@ export function handleRegexMatch(
       start,
       end,
       quoted,
+      annotationStart,
+      annotationEnd,
     }
   }
 }

test/e2e/frameworks/i18next-shopify/basic.test.js.snap

@@ -34,84 +34,112 @@ Object {
 exports[`Shopify React i18next get keys 1`] = `
 Array [
   Object {
+    "annotationEnd": 531,
+    "annotationStart": 509,
     "end": 530,
     "key": "translation.title",
     "quoted": true,
     "start": 513,
   },
   Object {
+    "annotationEnd": 746,
+    "annotationStart": 706,
     "end": 745,
     "key": "translation.description.part1",
     "quoted": true,
     "start": 716,
   },
   Object {
+    "annotationEnd": 1342,
+    "annotationStart": 1308,
     "end": 1341,
     "key": "translation.description.part2",
     "quoted": true,
     "start": 1312,
   },
   Object {
+    "annotationEnd": 1437,
+    "annotationStart": 1397,
     "end": 1436,
     "key": "translation.description.part2",
     "quoted": true,
     "start": 1407,
   },
   Object {
+    "annotationEnd": 1491,
+    "annotationStart": 1469,
     "end": 1490,
     "key": "translation.count",
     "quoted": true,
     "start": 1473,
   },
   Object {
+    "annotationEnd": 1674,
+    "annotationStart": 1666,
     "end": 1673,
     "key": "translation.foo.bar",
     "quoted": true,
     "start": 1670,
   },
   Object {
+    "annotationEnd": 1724,
+    "annotationStart": 1703,
     "end": 1723,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1707,
   },
   Object {
+    "annotationEnd": 1749,
+    "annotationStart": 1728,
     "end": 1748,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1732,
   },
   Object {
+    "annotationEnd": 1859,
+    "annotationStart": 1849,
     "end": 1858,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1853,
   },
   Object {
+    "annotationEnd": 1910,
+    "annotationStart": 1888,
     "end": 1909,
     "key": "translation.title",
     "quoted": true,
     "start": 1892,
   },
   Object {
+    "annotationEnd": 2023,
+    "annotationStart": 2013,
     "end": 2022,
     "key": "pages.home.title",
     "quoted": true,
     "start": 2017,
   },
   Object {
+    "annotationEnd": 2062,
+    "annotationStart": 2052,
     "end": 2061,
     "key": "translation.title",
     "quoted": true,
     "start": 2056,
   },
   Object {
+    "annotationEnd": 2261,
+    "annotationStart": 2245,
     "end": 2260,
     "key": "pages.home.title",
     "quoted": true,
     "start": 2255,
   },
   Object {
+    "annotationEnd": 2338,
+    "annotationStart": 2322,
     "end": 2337,
     "key": "translation.title",
     "quoted": true,

test/e2e/frameworks/react-i18next/basic.test.js.snap

@@ -30,78 +30,104 @@ Object {
 exports[`React with i18next get keys 1`] = `
 Array [
   Object {
+    "annotationEnd": 527,
+    "annotationStart": 505,
     "end": 526,
     "key": "translation.title",
     "quoted": true,
     "start": 509,
   },
   Object {
+    "annotationEnd": 740,
+    "annotationStart": 700,
     "end": 739,
     "key": "translation.description.part1",
     "quoted": true,
     "start": 710,
   },
   Object {
+    "annotationEnd": 1334,
+    "annotationStart": 1300,
     "end": 1333,
     "key": "translation.description.part2",
     "quoted": true,
     "start": 1304,
   },
   Object {
+    "annotationEnd": 1429,
+    "annotationStart": 1389,
     "end": 1428,
     "key": "translation.description.part2",
     "quoted": true,
     "start": 1399,
   },
   Object {
+    "annotationEnd": 1612,
+    "annotationStart": 1604,
     "end": 1611,
     "key": "translation.foo.bar",
     "quoted": true,
     "start": 1608,
   },
   Object {
+    "annotationEnd": 1661,
+    "annotationStart": 1640,
     "end": 1660,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1644,
   },
   Object {
+    "annotationEnd": 1685,
+    "annotationStart": 1664,
     "end": 1684,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1668,
   },
   Object {
+    "annotationEnd": 1793,
+    "annotationStart": 1783,
     "end": 1792,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1787,
   },
   Object {
+    "annotationEnd": 1843,
+    "annotationStart": 1821,
     "end": 1842,
     "key": "translation.title",
     "quoted": true,
     "start": 1825,
   },
   Object {
+    "annotationEnd": 1954,
+    "annotationStart": 1944,
     "end": 1953,
     "key": "pages.home.title",
     "quoted": true,
     "start": 1948,
   },
   Object {
+    "annotationEnd": 1992,
+    "annotationStart": 1982,
     "end": 1991,
     "key": "translation.title",
     "quoted": true,
     "start": 1986,
   },
   Object {
+    "annotationEnd": 2191,
+    "annotationStart": 2175,
     "end": 2190,
     "key": "pages.home.title",
     "quoted": true,
     "start": 2185,
   },
   Object {
+    "annotationEnd": 2268,
+    "annotationStart": 2252,
     "end": 2267,
     "key": "translation.title",
     "quoted": true,