feat(ui): make log buttons friendlier (#13404)

Co-authored-by: Miloš Paunović <paun992@hotmail.com>
Co-authored-by: Barthélémy Ledoux <bledoux@kestra.io>
This commit is contained in:
yuri
2025-12-15 10:58:36 +01:00
committed by GitHub
parent a960a9f982
commit a81de811d7
2 changed files with 16 additions and 3 deletions

View File

@@ -24,7 +24,7 @@
/>
</el-form-item>
<el-form-item>
<el-button @click="expandCollapseAll()" :disabled="raw_view">
<el-button @click="expandCollapseAll()" :disabled="raw_view" :icon="logDisplayButtonIcon">
{{ logDisplayButtonText }}
</el-button>
</el-form-item>
@@ -32,7 +32,7 @@
<el-tooltip
:content="!raw_view ? $t('logs_view.raw_details') : $t('logs_view.compact_details')"
>
<el-button @click="toggleViewType">
<el-button @click="toggleViewType" :icon="logViewTypeButtonIcon">
{{ !raw_view ? $t('logs_view.raw') : $t('logs_view.compact') }}
</el-button>
</el-tooltip>
@@ -121,6 +121,10 @@
import TaskRunDetails from "../logs/TaskRunDetails.vue";
import Download from "vue-material-design-icons/Download.vue";
import ContentCopy from "vue-material-design-icons/ContentCopy.vue";
import UnfoldMoreHorizontal from "vue-material-design-icons/UnfoldMoreHorizontal.vue";
import UnfoldLessHorizontal from "vue-material-design-icons/UnfoldLessHorizontal.vue";
import ViewList from "vue-material-design-icons/ViewList.vue";
import ViewGrid from "vue-material-design-icons/ViewGrid.vue";
import Kicon from "../Kicon.vue";
import LogLevelNavigator from "../logs/LogLevelNavigator.vue";
import {DynamicScroller, DynamicScrollerItem} from "vue-virtual-scroller";
@@ -135,6 +139,7 @@
import {mapStores} from "pinia";
import {useExecutionsStore} from "../../stores/executions";
import KSFilter from "../filter/components/KSFilter.vue";
import {storageKeys} from "../../utils/constants";
export default {
components: {
@@ -157,7 +162,7 @@
level: undefined,
filter: undefined,
openedTaskrunsCount: 0,
raw_view: false,
raw_view: (localStorage.getItem(storageKeys.LOGS_VIEW_TYPE) ?? "false").toLowerCase() === "true",
logIndicesByLevel: Object.fromEntries(LogUtils.levelOrLower(undefined).map(level => [level, []])),
logCursor: undefined
};
@@ -209,6 +214,12 @@
logDisplayButtonText() {
return this.openedTaskrunsCount === 0 ? this.$t("expand all") : this.$t("collapse all")
},
logDisplayButtonIcon() {
return this.openedTaskrunsCount === 0 ? UnfoldMoreHorizontal : UnfoldLessHorizontal;
},
logViewTypeButtonIcon() {
return this.raw_view ? ViewGrid : ViewList;
},
currentLevelOrLower() {
return LogUtils.levelOrLower(this.level);
},
@@ -292,6 +303,7 @@
toggleViewType() {
this.logCursor = undefined;
this.raw_view = !this.raw_view;
localStorage.setItem(storageKeys.LOGS_VIEW_TYPE, String(this.raw_view));
},
sortLogsByViewOrder(a, b) {
const aSplit = a.split("/");

View File

@@ -37,6 +37,7 @@ export const storageKeys = {
SAVED_FILTERS_PREFIX: "saved_filters",
FILTER_DATA_OPTIONS_PREFIX: "filterDataOptions",
FILTER_ORDER_PREFIX: "filter-order",
LOGS_VIEW_TYPE: "logsViewType",
SCROLL_MEMORY_PREFIX: "scroll",
} as const;