mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-11-10 06:34:05 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor(editor): Migrate SettingsView to composition api (no-changelog) (#9746)

Browse source
This commit is contained in:
Alex Grozav 2024-06-17 11:53:40 +03:00 committed by GitHub
parent 4a1ff4878f
commit 076c35d193
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 31 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/editor-ui/src/utils/typeGuards.ts
View file

@ -8,6 +8,7 @@ import { nodeConnectionTypes } from 'n8n-workflow';
import type { IExecutionResponse, ICredentialsResponse, NewCredentialsModal } from '@/Interface';
import type { jsPlumbDOMElement } from '@jsplumb/browser-ui';
import type { Connection } from '@jsplumb/core';
import type { RouteLocationRaw } from 'vue-router';
/*
Type guards used in editor-ui project
@ -79,3 +80,10 @@ export function isFullExecutionResponse(
): execution is IExecutionResponse {
return !!execution && 'status' in execution;
}
export function isRouteLocationRaw(value: unknown): value is RouteLocationRaw {
return (
typeof value === 'string' ||
(typeof value === 'object' && value !== null && ('name' in value || 'path' in value))
);
}

57
packages/editor-ui/src/views/SettingsView.vue
View file

@ -1,3 +1,26 @@
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import type { HistoryState } from 'vue-router';
import { useRouter } from 'vue-router';
import { VIEWS } from '@/constants';
import SettingsSidebar from '@/components/SettingsSidebar.vue';
import { isRouteLocationRaw } from '@/utils/typeGuards';
const router = useRouter();
const previousRoute = ref<HistoryState[string] | undefined>();
function onReturn() {
void router.push(
isRouteLocationRaw(previousRoute.value) ? previousRoute.value : { name: VIEWS.HOMEPAGE },
);
}
onMounted(() => {
previousRoute.value = router.options.history.state.back;
});
</script>
<template>
<div :class="$style.container">
<SettingsSidebar @return="onReturn" />
@ -13,40 +36,6 @@
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { RouteLocationPathRaw } from 'vue-router';
import { VIEWS } from '@/constants';
import SettingsSidebar from '@/components/SettingsSidebar.vue';
const SettingsView = defineComponent({
name: 'SettingsView',
components: {
SettingsSidebar,
},
beforeRouteEnter(_to, from, next) {
next((vm) => {
(vm as unknown as InstanceType<typeof SettingsView>).previousRoute = from;
});
},
data() {
return {
previousRoute: null as RouteLocationPathRaw | null,
};
},
methods: {
onReturn() {
void this.$router.push(
this.previousRoute ? this.previousRoute.path : { name: VIEWS.HOMEPAGE },
);
},
},
});
export default SettingsView;
</script>
<style lang="scss" module>
.container {
height: 100%;