mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-01-12 05:17:28 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix(editor): Move workerview entry into settings menu (#7761)

Browse source 
As the worker view is not an essential function, it is being moved from
the main side bar to the settings side bar for the time being.
This commit is contained in:
Michael Auerswald 2023-11-21 11:29:24 +01:00 committed by GitHub
parent b7c5c7406f
commit 366cd672a7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 55 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
cypress/pages/workerView.ts
View file

@ -1,14 +1,14 @@
import { BasePage } from './base';
export class WorkerViewPage extends BasePage {
url = '/workers';
url = '/settings/workers';
getters = {
workerCards: () => cy.getByTestId('worker-card'),
workerCard: (workerId: string) => this.getters.workerCards().contains(workerId),
workerViewLicensed: () => cy.getByTestId('worker-view-licensed'),
workerViewUnlicensed: () => cy.getByTestId('worker-view-unlicensed'),
menuItems: () => cy.get('.el-menu-item'),
menuItem: () => this.getters.menuItems().get('#workersview'),
menuItem: () => this.getters.menuItems().get('#settings-workersview'),
};
actions = {};

15
packages/editor-ui/src/components/MainSidebar.vue
View file

@ -261,15 +261,6 @@ export default defineComponent({
position: 'top',
activateOnRouteNames: [VIEWS.EXECUTIONS],
},
{
id: 'workersview',
icon: 'truck-monster',
label: this.$locale.baseText('mainSidebar.workersView'),
position: 'top',
available:
this.settingsStore.isQueueModeEnabled && this.settingsStore.isWorkerViewAvailable,
activateOnRouteNames: [VIEWS.WORKER_VIEW],
},
{
id: 'cloud-admin',
type: 'link',
@ -448,12 +439,6 @@ export default defineComponent({
}
break;
}
case 'workersview': {
if (this.$router.currentRoute.name !== VIEWS.WORKER_VIEW) {
this.goToRoute({ name: VIEWS.WORKER_VIEW });
}
break;
}
case 'settings': {
const defaultRoute = this.findFirstAccessibleSettingsRoute();
if (defaultRoute) {

13
packages/editor-ui/src/components/SettingsSidebar.vue
View file

@ -117,6 +117,15 @@ export default defineComponent({
available: this.canAccessLdapSettings(),
activateOnRouteNames: [VIEWS.LDAP_SETTINGS],
},
{
id: 'settings-workersview',
icon: 'truck-monster',
label: this.$locale.baseText('mainSidebar.workersView'),
position: 'top',
available:
this.settingsStore.isQueueModeEnabled && this.settingsStore.isWorkerViewAvailable,
activateOnRouteNames: [VIEWS.WORKER_VIEW],
},
];
for (const item of this.settingsFakeDoorFeatures) {
@ -241,6 +250,10 @@ export default defineComponent({
void this.$router.push({ name: VIEWS.AUDIT_LOGS });
}
break;
case 'settings-workersview': {
await this.navigateTo(VIEWS.WORKER_VIEW);
break;
}
default:
break;
}

8
packages/editor-ui/src/components/Workers/WorkerCard.ee.vue
View file

@ -7,8 +7,8 @@
:class="stale ? [$style.cardHeading, $style.stale] : [$style.cardHeading]"
data-test-id="worker-card-name"
>
{{ worker.workerId }} ({{ worker.hostname }}) | Average Load:
{{ averageWorkerLoadFromLoadsAsString(worker.loadAvg ?? [0]) }} | Free Memory:
Name: {{ worker.workerId }} ({{ worker.hostname }}) <br />
Average Load: {{ averageWorkerLoadFromLoadsAsString(worker.loadAvg ?? [0]) }} | Free Memory:
{{ memAsGb(worker.freeMem).toFixed(2) }}GB / {{ memAsGb(worker.totalMem).toFixed(2) }}GB
{{ stale ? ' (stale)' : '' }}
</n8n-heading>
@ -17,8 +17,8 @@
<n8n-text color="text-light" size="small" :class="$style.container">
<span
>{{ $locale.baseText('workerList.item.lastUpdated') }} {{ secondsSinceLastUpdateString }}s
ago | Architecture: {{ worker.arch }} | Platform: {{ worker.platform }} | n8n-Version:
{{ worker.version }} | Uptime: {{ upTime(worker.uptime) }}</span
ago | n8n-Version: {{ worker.version }} | Architecture: {{ worker.arch }} (
{{ worker.platform }}) | Uptime: {{ upTime(worker.uptime) }}</span
>
<WorkerJobAccordion :items="worker.runningJobsSummary" />
<WorkerNetAccordion :items="sortedWorkerInterfaces" />

29
packages/editor-ui/src/router.ts
View file

@ -217,21 +217,6 @@ export const routes = [
},
},
},
{
path: '/workers',
name: VIEWS.WORKER_VIEW,
components: {
default: WorkerView,
sidebar: MainSidebar,
},
meta: {
permissions: {
allow: {
loginStatus: [LOGIN_STATUS.LoggedIn],
},
},
},
},
{
path: '/workflows',
name: VIEWS.WORKFLOWS,
@ -736,6 +721,20 @@ export const routes = [
},
},
},
{
path: 'workers',
name: VIEWS.WORKER_VIEW,
components: {
settingsView: WorkerView,
},
meta: {
permissions: {
allow: {
loginStatus: [LOGIN_STATUS.LoggedIn],
},
},
},
},
{
path: 'community-nodes',
name: VIEWS.COMMUNITY_NODES,

67
packages/editor-ui/src/views/WorkerView.vue
View file

@ -1,30 +1,26 @@
<template>
<div :class="$style.workerListWrapper">
<div :class="$style.workerList">
<WorkerList
v-if="settingsStore.isQueueModeEnabled && settingsStore.isWorkerViewAvailable"
data-test-id="worker-view-licensed"
/>
<n8n-action-box
v-else
data-test-id="worker-view-unlicensed"
:class="$style.actionBox"
:description="$locale.baseText('workerList.actionBox.description')"
:buttonText="$locale.baseText('workerList.actionBox.buttonText')"
@click:button="goToUpgrade"
>
<template #heading>
<span>{{ $locale.baseText('workerList.actionBox.title') }}</span>
</template>
<template #description>
{{ $locale.baseText('workerList.actionBox.description') }}
<a :href="$locale.baseText('workerList.docs.url')" target="_blank">
{{ $locale.baseText('workerList.actionBox.description.link') }}
</a>
</template>
</n8n-action-box>
</div>
</div>
<WorkerList
v-if="settingsStore.isQueueModeEnabled && settingsStore.isWorkerViewAvailable"
data-test-id="worker-view-licensed"
/>
<n8n-action-box
v-else
data-test-id="worker-view-unlicensed"
:class="$style.actionBox"
:description="$locale.baseText('workerList.actionBox.description')"
:buttonText="$locale.baseText('workerList.actionBox.buttonText')"
@click:button="goToUpgrade"
>
<template #heading>
<span>{{ $locale.baseText('workerList.actionBox.title') }}</span>
</template>
<template #description>
{{ $locale.baseText('workerList.actionBox.description') }}
<a :href="$locale.baseText('workerList.docs.url')" target="_blank">
{{ $locale.baseText('workerList.actionBox.description.link') }}
</a>
</template>
</n8n-action-box>
</template>
<script setup lang="ts">
@ -41,25 +37,6 @@ const goToUpgrade = () => {
</script>
<style module lang="scss">
.workerListWrapper {
display: grid;
grid-template-rows: 1fr 0;
position: relative;
height: 100%;
width: 100%;
max-width: 1280px;
}
.workerList {
position: relative;
height: 100%;
overflow: auto;
padding: var(--spacing-l) var(--spacing-l) 0;
@media (min-width: 1200px) {
padding: var(--spacing-2xl) var(--spacing-2xl) 0;
}
}
.actionBox {
margin: var(--spacing-2xl) 0 0;
}