Merge pull request #29 from MozillaSecurity/translated-comments

Follow-up to #10 - Show translated comments.

Author: denschub

pyproject.toml

@@ -93,6 +93,7 @@ norecursedirs = [
 [tool.ruff]
 fix = true
 target-version = "py39"
+extend-exclude = ["**/migrations/*.py"]
 
 [tool.ruff.lint]
 select = [

server/frontend/src/components/Buckets/ReportPreviewRow.vue

@@ -4,7 +4,7 @@
     <td class="wrap-anywhere">
       <span class="two-line-limit">{{ report.url }}</span>
     </td>
-    <td class="wrap-normal">{{ report.comments }}</td>
+    <td class="wrap-normal">{{ maybeTranslatedComments(report) }}</td>
     <td>
       <img
         v-if="report.os === 'Linux'"
@@ -78,6 +78,21 @@ export default {
     staticLogo(name) {
       return window.location.origin + "/static/img/os/" + name + ".png";
     },
+    maybeTranslatedComments(report) {
+      if (
+        report.comments_original_language &&
+        report.comments_original_language !== "en"
+      ) {
+        // The translation pipeline does escape HTML, and the "easiest" way to
+        // un-escape that is by just assignign it to an element and letting
+        // the browser do the magic.. :/
+        let el = document.createElement("span");
+        el.innerHTML = `[${report.comments_original_language}] ${report.comments_translated}`;
+        return el.innerText;
+      }
+
+      return report.comments;
+    },
   },
 };
 </script>

server/reportmanager/management/commands/import_reports_from_bigquery.py

@@ -34,7 +34,11 @@ def handle(self, *args, **options):
 
         client = bigquery.Client(**params)
         result = client.query_and_wait(
-            f"SELECT * FROM `{settings.BIGQUERY_TABLE}` WHERE reported_at >= @since;",
+            f"""SELECT r.*, t.language_code, t.translated_text
+                FROM `{settings.BIGQUERY_TABLE}` as r
+                LEFT JOIN `{settings.BIGQUERY_TRANSLATIONS_TABLE}` t
+                    ON r.uuid = t.report_uuid
+                WHERE r.reported_at >= @since;""",
             job_config=bigquery.QueryJobConfig(
                 query_parameters=[
                     bigquery.ScalarQueryParameter("since", "DATETIME", options["since"])
@@ -51,6 +55,8 @@ def handle(self, *args, **options):
                 app_version=row.app_version,
                 breakage_category=row.breakage_category,
                 comments=row.comments,
+                comments_translated=row.translated_text,
+                comments_original_language=row.language_code,
                 details=row.details,
                 reported_at=row.reported_at.replace(tzinfo=timezone.utc),
                 url=urlsplit(row.url),

server/reportmanager/migrations/0009_reportentry_comments_original_language_and_more.py

@@ -0,0 +1,22 @@
+# Generated by Django 4.2.17 on 2025-03-27 04:50
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("reportmanager", "0008_bucket_reassign_in_progress"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="reportentry",
+            name="comments_original_language",
+            field=models.TextField(null=True),
+        ),
+        migrations.AddField(
+            model_name="reportentry",
+            name="comments_translated",
+            field=models.TextField(null=True),
+        ),
+    ]

server/reportmanager/models.py

@@ -449,6 +449,8 @@ def create_from_report(self, report):
             os=os,
             details=report.details,
             comments=report.comments,
+            comments_translated=report.comments_translated,
+            comments_original_language=report.comments_original_language,
         )
 
 
@@ -459,6 +461,8 @@ class ReportEntry(models.Model):
     )
     bucket = models.ForeignKey(Bucket, null=True, on_delete=models.deletion.CASCADE)
     comments = models.TextField()
+    comments_translated = models.TextField(null=True)
+    comments_original_language = models.TextField(null=True)
     details = models.JSONField()
     os = models.ForeignKey(OS, on_delete=models.deletion.CASCADE)
     reported_at = models.DateTimeField()
@@ -510,6 +514,8 @@ def get_report(self):
                 app_name=self.app.name,
                 app_version=self.app.version,
                 comments=self.comments,
+                comments_translated=self.comments_translated,
+                comments_original_language=self.comments_original_language,
                 details=self.details,
                 os=self.os.name,
                 reported_at=self.reported_at,

server/reportmanager/serializers.py

@@ -197,6 +197,8 @@ class Meta:
             "breakage_category",
             "bucket",
             "comments",
+            "comments_translated",
+            "comments_original_language",
             "details",
             "id",
             "os",

server/server/settings.py

@@ -127,6 +127,9 @@ def resolver_context_processor(request):
 
 BIGQUERY_PROJECT = "moz-fx-dev-dschubert-wckb"
 BIGQUERY_TABLE = "moz-fx-dev-dschubert-wckb.webcompat_user_reports.user_reports_prod"
+BIGQUERY_TRANSLATIONS_TABLE = (
+    "moz-fx-dev-dschubert-wckb.webcompat_user_reports.translations"
+)
 BIGQUERY_SERVICE_ACCOUNT = ""
 
 # Modify the way we generate our usernames, based on the email address

src/webcompat/models.py

@@ -49,6 +49,8 @@ class Report:
     reported_at: datetime
     uuid: str
     url: SplitResult
+    comments_translated: str | None = None
+    comments_original_language: str | None = None
     app_channel: str | None = None
     breakage_category: str | None = None