refactor(editor): Improve linting for component and prop names (no-changelog) (#8169)

packages/editor-ui/src/components/NodeDetailsView.vue

@@ -1,6 +1,6 @@
 <template>
 	<el-dialog
-		:modelValue="(!!activeNode || renaming) && !isActiveStickyNode"
+		:model-value="(!!activeNode || renaming) && !isActiveStickyNode"
 		:before-close="close"
 		:show-close="false"
 		class="data-display-wrapper ndv-wrapper"
@@ -20,7 +20,7 @@
 					{{ $locale.baseText('ndv.backToCanvas.waitingForTriggerWarning') }}
 				</div>
 			</template>
-			<div :class="$style.backToCanvas" @click="close" data-test-id="back-to-canvas">
+			<div :class="$style.backToCanvas" data-test-id="back-to-canvas" @click="close">
 				<n8n-icon icon="arrow-left" color="text-xlight" size="medium" />
 				<n8n-text color="text-xlight" size="medium" :bold="true">
 					{{ $locale.baseText('ndv.backToCanvas') }}
@@ -30,45 +30,45 @@
 
 		<div
 			v-if="activeNode"
-			class="data-display"
 			ref="container"
-			@keydown.capture="onKeyDown"
+			class="data-display"
 			tabindex="0"
+			@keydown.capture="onKeyDown"
 		>
-			<div @click="close" :class="$style.modalBackground"></div>
+			<div :class="$style.modalBackground" @click="close"></div>
 			<NDVDraggablePanels
-				:isTriggerNode="isTriggerNode"
-				:hideInputAndOutput="activeNodeType === null"
-				:position="isTriggerNode && !showTriggerPanel ? 0 : undefined"
-				:isDraggable="!isTriggerNode"
-				:hasDoubleWidth="activeNodeType?.parameterPane === 'wide'"
-				:nodeType="activeNodeType"
 				:key="activeNode.name"
+				:is-trigger-node="isTriggerNode"
+				:hide-input-and-output="activeNodeType === null"
+				:position="isTriggerNode && !showTriggerPanel ? 0 : undefined"
+				:is-draggable="!isTriggerNode"
+				:has-double-width="activeNodeType?.parameterPane === 'wide'"
+				:node-type="activeNodeType"
 				@switchSelectedNode="onSwitchSelectedNode"
 				@close="close"
 				@init="onPanelsInit"
 				@dragstart="onDragStart"
 				@dragend="onDragEnd"
 			>
-				<template #input v-if="showTriggerPanel || !isTriggerNode">
+				<template v-if="showTriggerPanel || !isTriggerNode" #input>
 					<TriggerPanel
 						v-if="showTriggerPanel"
-						:nodeName="activeNode.name"
-						:sessionId="sessionId"
+						:node-name="activeNode.name"
+						:session-id="sessionId"
 						@execute="onNodeExecute"
 						@activate="onWorkflowActivate"
 					/>
 					<InputPanel
 						v-else-if="!isTriggerNode"
 						:workflow="workflow"
-						:canLinkRuns="canLinkRuns"
-						:runIndex="inputRun"
-						:linkedRuns="linked"
-						:currentNodeName="inputNodeName"
-						:sessionId="sessionId"
-						:readOnly="readOnly || hasForeignCredential"
-						:isProductionExecutionPreview="isProductionExecutionPreview"
-						:isPaneActive="isInputPaneActive"
+						:can-link-runs="canLinkRuns"
+						:run-index="inputRun"
+						:linked-runs="linked"
+						:current-node-name="inputNodeName"
+						:session-id="sessionId"
+						:read-only="readOnly || hasForeignCredential"
+						:is-production-execution-preview="isProductionExecutionPreview"
+						:is-pane-active="isInputPaneActive"
 						@activatePane="activateInputPane"
 						@linkRun="onLinkRunToInput"
 						@unlinkRun="() => onUnlinkRun('input')"
@@ -84,14 +84,14 @@
 				<template #output>
 					<OutputPanel
 						data-test-id="output-panel"
-						:canLinkRuns="canLinkRuns"
-						:runIndex="outputRun"
-						:linkedRuns="linked"
-						:sessionId="sessionId"
-						:isReadOnly="readOnly || hasForeignCredential"
-						:blockUI="blockUi && isTriggerNode && !isExecutableTriggerNode"
-						:isProductionExecutionPreview="isProductionExecutionPreview"
-						:isPaneActive="isOutputPaneActive"
+						:can-link-runs="canLinkRuns"
+						:run-index="outputRun"
+						:linked-runs="linked"
+						:session-id="sessionId"
+						:is-read-only="readOnly || hasForeignCredential"
+						:block-u-i="blockUi && isTriggerNode && !isExecutableTriggerNode"
+						:is-production-execution-preview="isProductionExecutionPreview"
+						:is-pane-active="isOutputPaneActive"
 						@activatePane="activateOutputPane"
 						@linkRun="onLinkRunToOutput"
 						@unlinkRun="() => onUnlinkRun('output')"
@@ -104,13 +104,13 @@
 				</template>
 				<template #main>
 					<NodeSettings
-						:eventBus="settingsEventBus"
+						:event-bus="settingsEventBus"
 						:dragging="isDragging"
-						:sessionId="sessionId"
-						:nodeType="activeNodeType"
-						:foreignCredentials="foreignCredentials"
-						:readOnly="readOnly"
-						:blockUI="blockUi && showTriggerPanel"
+						:session-id="sessionId"
+						:node-type="activeNodeType"
+						:foreign-credentials="foreignCredentials"
+						:read-only="readOnly"
+						:block-u-i="blockUi && showTriggerPanel"
 						:executable="!readOnly"
 						@valueChanged="valueChanged"
 						@execute="onNodeExecute"
@@ -120,9 +120,9 @@
 					/>
 					<a
 						v-if="featureRequestUrl"
-						@click="onFeatureRequestClick"
 						:class="$style.featureRequest"
 						target="_blank"
+						@click="onFeatureRequestClick"
 					>
 						<font-awesome-icon icon="lightbulb" />
 						{{ $locale.baseText('ndv.featureRequest') }}
@@ -177,7 +177,6 @@ import { useExternalHooks } from '@/composables/useExternalHooks';
 
 export default defineComponent({
 	name: 'NodeDetailsView',
-	mixins: [workflowHelpers, workflowActivate, pinData],
 	components: {
 		NodeSettings,
 		InputPanel,
@@ -185,6 +184,7 @@ export default defineComponent({
 		NDVDraggablePanels,
 		TriggerPanel,
 	},
+	mixins: [workflowHelpers, workflowActivate, pinData],
 	props: {
 		readOnly: {
 			type: Boolean,