admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 01:56:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): Log view improvements (#16489)

Browse Source
This commit is contained in:
Suguru Inoue
2025-07-01 09:30:17 +02:00
committed by GitHub
parent c11e4bd0a8
commit 4124b96a00
23 changed files with 446 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
packages/frontend/editor-ui/src/features/logs/composables/useLogsSelection.ts
View File

@@ -12,8 +12,8 @@ import type { IExecutionResponse } from '@/Interface';
import { useCanvasStore } from '@/stores/canvas.store';
import { useLogsStore } from '@/stores/logs.store';
import { useUIStore } from '@/stores/ui.store';
import { watch } from 'vue';
import { computed, ref, type ComputedRef } from 'vue';
import { shallowRef, watch } from 'vue';
import { computed, type ComputedRef } from 'vue';
export function useLogsSelection(
execution: ComputedRef<IExecutionResponse | undefined>,
@@ -22,8 +22,12 @@ export function useLogsSelection(
toggleExpand: (entry: LogEntry, expand?: boolean) => void,
) {
const telemetry = useTelemetry();
const manualLogEntrySelection = ref<LogEntrySelection>({ type: 'initial' });
const selected = computed(() => findSelectedLogEntry(manualLogEntrySelection.value, tree.value));
const manualLogEntrySelection = shallowRef<LogEntrySelection>({ type: 'initial' });
const nodeNameToSelect = shallowRef<string>();
const isExecutionStopped = computed(() => execution.value?.stoppedAt !== undefined);
const selected = computed(() =>
findSelectedLogEntry(manualLogEntrySelection.value, tree.value, !isExecutionStopped.value),
);
const logsStore = useLogsStore();
const uiStore = useUIStore();
const canvasStore = useCanvasStore();
@@ -38,7 +42,7 @@ export function useLogsSelection(
function select(value: LogEntry | undefined) {
manualLogEntrySelection.value =
value === undefined ? { type: 'none' } : { type: 'selected', id: value.id };
value === undefined ? { type: 'none' } : { type: 'selected', entry: value };
if (value) {
syncSelectionToCanvasIfEnabled(value);
@@ -55,21 +59,31 @@ export function useLogsSelection(
function selectPrev() {
const entries = flatLogEntries.value;
if (entries.length === 0) {
return;
}
const prevEntry = selected.value
? (getEntryAtRelativeIndex(entries, selected.value.id, -1) ?? entries[0])
: entries[entries.length - 1];
manualLogEntrySelection.value = { type: 'selected', id: prevEntry.id };
manualLogEntrySelection.value = { type: 'selected', entry: prevEntry };
syncSelectionToCanvasIfEnabled(prevEntry);
}
function selectNext() {
const entries = flatLogEntries.value;
if (entries.length === 0) {
return;
}
const nextEntry = selected.value
? (getEntryAtRelativeIndex(entries, selected.value.id, 1) ?? entries[entries.length - 1])
: entries[0];
manualLogEntrySelection.value = { type: 'selected', id: nextEntry.id };
manualLogEntrySelection.value = { type: 'selected', entry: nextEntry };
syncSelectionToCanvasIfEnabled(nextEntry);
}
@@ -93,16 +107,19 @@ export function useLogsSelection(
canvasStore.hasRangeSelection ||
selected.value?.node.name === selectedOnCanvas
) {
nodeNameToSelect.value = undefined;
return;
}
const entry = findLogEntryRec((e) => e.node.name === selectedOnCanvas, tree.value);
if (!entry) {
nodeNameToSelect.value = selectedOnCanvas;
return;
}
manualLogEntrySelection.value = { type: 'selected', id: entry.id };
nodeNameToSelect.value = undefined;
manualLogEntrySelection.value = { type: 'selected', entry };
let parent = entry.parent;
@@ -114,5 +131,22 @@ export function useLogsSelection(
{ immediate: true },
);
watch(
tree,
(t) => {
if (nodeNameToSelect.value === undefined) {
return;
}
const entry = findLogEntryRec((e) => e.node.name === nodeNameToSelect.value, t);
if (entry) {
nodeNameToSelect.value = undefined;
manualLogEntrySelection.value = { type: 'selected', entry };
}
},
{ immediate: true },
);
return { selected, select, selectPrev, selectNext };
}