feat: add clear logs button

src/components/newtab/logs/LogsFilters.vue

@@ -68,6 +68,13 @@
         </ui-select>
       </div>
     </ui-popover>
+    <ui-button
+      v-tooltip:bottom="t('log.clearLogs.title')"
+      icon
+      @click="$emit('clear')"
+    >
+      <v-remixicon name="riDeleteBin7Line" />
+    </ui-button>
   </div>
 </template>
 <script setup>
@@ -84,7 +91,7 @@ defineProps({
     default: () => ({}),
   },
 });
-const emit = defineEmits(['updateSorts', 'updateFilters']);
+const emit = defineEmits(['updateSorts', 'updateFilters', 'clear']);
 
 const { t } = useI18n();
 const shortcut = useShortcut('action:search', () => {

src/locales/en/newtab.json

@@ -204,6 +204,10 @@
     "selectAll": "Select all",
     "deselectAll": "Deselect all",
     "deleteSelected": "Delete selected logs",
+    "clearLogs": {
+      "title": "Clear logs",
+      "description": "Are you sure to clear all logs?"
+    },
     "types": {
       "stop": "Workflow is stopped",
       "finish": "Finish"

src/newtab/pages/Logs.vue

@@ -4,6 +4,7 @@
     <logs-filters
       :sorts="sortsBuilder"
       :filters="filtersBuilder"
+      @clear="clearLogs"
       @updateSorts="sortsBuilder[$event.key] = $event.value"
       @updateFilters="filtersBuilder[$event.key] = $event.value"
     />
@@ -184,6 +185,19 @@ function deleteSelectedLogs() {
     },
   });
 }
+function clearLogs() {
+  dialog.confirm({
+    title: t('log.clearLogs.title'),
+    okVariant: 'danger',
+    body: t('log.clearLogs.description'),
+    onConfirm: () => {
+      Log.deleteAll().then(() => {
+        selectedLogs.value = [];
+        store.dispatch('saveToStorage', 'logs');
+      });
+    },
+  });
+}
 function selectAllLogs() {
   if (selectedLogs.value.length >= logs.value.length) {
     selectedLogs.value = [];