Does localization

assets/components/LogViewer/SkippedEntriesLogItem.vue

@@ -1,11 +1,11 @@
 <template>
-  <span class="text">{{ logEntry.message }}</span>
+  <span class="text">{{ $t("error.logs-skipped", { total: logEntry.totalSkipped }) }}</span>
 </template>
 <script lang="ts" setup>
-import { DockerEventLogEntry } from "@/models/LogEntry";
+import { SkippedLogsEntry } from "@/models/LogEntry";
 
 defineProps<{
-  logEntry: DockerEventLogEntry;
+  logEntry: SkippedLogsEntry;
 }>();
 </script>
 

assets/models/LogEntry.ts

@@ -81,7 +81,7 @@ export class DockerEventLogEntry extends LogEntry<string> {
 }
 
 export class SkippedLogsEntry extends LogEntry<string> {
-  private totalSkipped = 0;
+  private _totalSkipped = 0;
   private lastSkipped: LogEntry<string | JSONObject>;
 
   constructor(
@@ -91,7 +91,7 @@ export class SkippedLogsEntry extends LogEntry<string> {
     lastSkipped: LogEntry<string | JSONObject>
   ) {
     super("", date.getTime(), date);
-    this.totalSkipped = totalSkipped;
+    this._totalSkipped = totalSkipped;
     this.lastSkipped = lastSkipped;
   }
   getComponent(): Component {
@@ -103,9 +103,13 @@ export class SkippedLogsEntry extends LogEntry<string> {
   }
 
   public addSkippedEntries(totalSkipped: number, lastItem: LogEntry<string | JSONObject>) {
-    this.totalSkipped += totalSkipped;
+    this._totalSkipped += totalSkipped;
     this.lastSkipped = lastItem;
   }
+
+  public get totalSkipped(): number {
+    return this._totalSkipped;
+  }
 }
 
 export function asLogEntry(event: LogEvent): LogEntry<string | JSONObject> {

locales/en.yml

@@ -18,6 +18,7 @@ tooltip:
 error:
   page-not-found: This page does not exist.
   invalid-auth: Username and password are not valid.
+  logs-skipped: Skipped {total} entries
 title:
   page-not-found: Page not found
   login: Authentication Required
@@ -45,5 +46,5 @@ settings:
     <code>ctrl+f</code>
   using-version: You are using Dozzle {version}.
   update-available: >-
-    New version is available! Update to
-    <a :href="{href}" class="next-release" target="_blank" rel="noreferrer noopener">{nextVersion}</a>.
+    New version is available! Update to <a :href="{href}" class="next-release"
+    target="_blank" rel="noreferrer noopener">{nextVersion}</a>.