UI: add import order rule to eslint (#2838)

* npm install -D eslint-import-resolver-typescript eslint-plugin-import * add import rules * fix: add ignore comment for eslint-plugin-import bug. cf. import-js/eslint-plugin-import#1479 * eslint src/ --fix Co-authored-by: Hiromasa Ihara <[email protected]>
OpenEMS · Oct 13, 2024 · fd71353 · fd71353
1 parent a98d38c
commit fd71353
Show file tree

Hide file tree

Showing 25 changed files with 145 additions and 47 deletions.
diff --git a/ui/.eslintrc.json b/ui/.eslintrc.json
@@ -20,18 +20,27 @@
  "createDefaultProgram": true
  },
  "plugins": [
+ "import",
  "unused-imports",
  "@stylistic"
  ],
  "extends": [
  "eslint:recommended",
  "plugin:@typescript-eslint/recommended",
  "plugin:@angular-eslint/recommended",
- "plugin:@angular-eslint/template/process-inline-templates"
+ "plugin:@angular-eslint/template/process-inline-templates",
+ "plugin:import/recommended"
  ],
  "rules": {
  "curly": "error",
  "unused-imports/no-unused-imports": "error",
+ "import/order": [
+ "error",
+ {
+ "groups": ["builtin", "external", "internal", "parent", "sibling", "index"],
+ "alphabetize": { "order": "asc", "caseInsensitive": true }
+ }
+ ],
  "@typescript-eslint/explicit-member-accessibility": [
  "error",
  {
@@ -111,6 +120,11 @@
  "message": "Using 'xdescribe' is not allowed."
  }
  ]
+ },
+ "settings": {
+ "import/resolver": {
+ "typescript": {}
+ }
  }
  },
  {

diff --git a/ui/package-lock.json b/ui/package-lock.json
diff --git a/ui/package.json b/ui/package.json
@@ -80,7 +80,8 @@
  "@typescript-eslint/parser": "^7.0.0",
  "@typescript-eslint/types": "^8.7.0",
  "eslint": "^8.57.0",
- "eslint-plugin-import": "2.30.0",
+ "eslint-import-resolver-typescript": "^3.6.3",
+ "eslint-plugin-import": "^2.30.0",
  "eslint-plugin-jsdoc": "50.2.4",
  "eslint-plugin-prefer-arrow": "1.2.3",
  "eslint-plugin-unused-imports": "^4.1.4",

diff --git a/ui/src/app/app.service.ts b/ui/src/app/app.service.ts
@@ -3,8 +3,8 @@ import { Injectable } from "@angular/core";
 import { App } from "@capacitor/app";
 import { Capacitor } from "@capacitor/core";
 import { Directory, Encoding, Filesystem } from "@capacitor/filesystem";
-import { FileOpener } from "@ionic-native/file-opener";
 import { AlertController } from "@ionic/angular";
+import { FileOpener } from "@ionic-native/file-opener";
 import { TranslateService } from "@ngx-translate/core";
 import { saveAs } from "file-saver-es";
 import { DeviceDetectorService, DeviceInfo } from "ngx-device-detector";

diff --git a/ui/src/app/edge/history/Controller/Io/DigitalOutput/digitalOutput.module.ts b/ui/src/app/edge/history/Controller/Io/DigitalOutput/digitalOutput.module.ts
@@ -1,12 +1,12 @@
 import { NgModule } from "@angular/core";
 import { BrowserModule } from "@angular/platform-browser";
+import { FooterNavigationModule } from "src/app/shared/components/footer/subnavigation/footerNavigation.module";
 import { SharedModule } from "src/app/shared/shared.module";
 import { TotalChartComponent } from "./chart/chart";
-import { FlatComponent } from "./flat/flat";
-import { OverviewComponent } from "./overview/overview";
 import { ChartComponent } from "./details/chart/chart";
 import { DetailsOverviewComponent } from "./details/details.overview";
-import { FooterNavigationModule } from "src/app/shared/components/footer/subnavigation/footerNavigation.module";
+import { FlatComponent } from "./flat/flat";
+import { OverviewComponent } from "./overview/overview";
 
 @NgModule({
  imports: [

diff --git a/ui/src/app/edge/history/Controller/ModbusTcpApi/modbusTcpApi.module.ts b/ui/src/app/edge/history/Controller/ModbusTcpApi/modbusTcpApi.module.ts
@@ -1,9 +1,9 @@
 import { NgModule } from "@angular/core";
 import { BrowserModule } from "@angular/platform-browser";
 import { SharedModule } from "src/app/shared/shared.module";
+import { ChartComponent } from "./chart/chart";
 import { FlatComponent } from "./flat/flat";
 import { OverviewComponent } from "./overview/overview";
-import { ChartComponent } from "./chart/chart";
 
 @NgModule({
  imports: [

diff --git a/ui/src/app/edge/history/Controller/controller.module.ts b/ui/src/app/edge/history/Controller/controller.module.ts
@@ -1,9 +1,9 @@
 import { NgModule } from "@angular/core";
-import { ControllerEss } from "./Ess/ess.module";
-import { ControllerIo } from "./Io/Io.module";
 import { ChannelThreshold } from "./ChannelThreshold/channelThreshold.module";
+import { ControllerEss } from "./Ess/ess.module";
 import { GridOptimizeCharge } from "./Ess/GridoptimizedCharge/gridOptimizeCharge.module";
 import { TimeOfUseTariff } from "./Ess/TimeOfUseTariff/timeOfUseTariff.module";
+import { ControllerIo } from "./Io/Io.module";
 import { ModbusTcpApi } from "./ModbusTcpApi/modbusTcpApi.module";
 
 @NgModule({

diff --git a/ui/src/app/edge/history/common/consumption/Consumption.ts b/ui/src/app/edge/history/common/consumption/Consumption.ts
@@ -1,9 +1,9 @@
 import { NgModule } from "@angular/core";
 import { BrowserModule } from "@angular/platform-browser";
+import { CurrentVoltageModule } from "src/app/shared/components/edge/meter/currentVoltage/currentVoltageModule";
 import { FooterNavigationModule } from "src/app/shared/components/footer/subnavigation/footerNavigation.module";
 import { SharedModule } from "src/app/shared/shared.module";
 
-import { CurrentVoltageModule } from "src/app/shared/components/edge/meter/currentVoltage/currentVoltageModule";
 import { ChartComponent } from "./chart/chart";
 import { ConsumptionMeterChartDetailsComponent } from "./details/chart/consumptionMeter";
 import { EvcsChartDetailsComponent } from "./details/chart/evcs";

diff --git a/ui/src/app/edge/history/common/production/production.ts b/ui/src/app/edge/history/common/production/production.ts
@@ -1,9 +1,9 @@
 import { NgModule } from "@angular/core";
 import { BrowserModule } from "@angular/platform-browser";
+import { CurrentVoltageModule } from "src/app/shared/components/edge/meter/currentVoltage/currentVoltageModule";
 import { FooterNavigationModule } from "src/app/shared/components/footer/subnavigation/footerNavigation.module";
 import { SharedModule } from "src/app/shared/shared.module";
 
-import { CurrentVoltageModule } from "src/app/shared/components/edge/meter/currentVoltage/currentVoltageModule";
 import { TotalChartComponent } from "./chart/totalChart";
 import { ChargerChartDetailsComponent } from "./details/chart/charger";
 import { ProductionMeterChartDetailsComponent } from "./details/chart/productionMeter";

diff --git a/ui/src/app/edge/history/shared.ts b/ui/src/app/edge/history/shared.ts
@@ -1,7 +1,10 @@
 // @ts-strict-ignore
 import * as Chart from "chart.js";
+/* eslint-disable import/no-duplicates */
+// cf. https://github.com/import-js/eslint-plugin-import/issues/1479
 import { differenceInDays, differenceInMinutes, startOfDay } from "date-fns";
 import { de } from "date-fns/locale";
+/* eslint-enable import/no-duplicates */
 import { QueryHistoricTimeseriesDataResponse } from "src/app/shared/jsonrpc/response/queryHistoricTimeseriesDataResponse";
 import { ChannelAddress, Service } from "src/app/shared/shared";
 import { DateUtils } from "src/app/shared/utils/date/dateutils";

diff --git a/ui/src/app/edge/history/storage/totalchart.component.ts b/ui/src/app/edge/history/storage/totalchart.component.ts
@@ -1,4 +1,5 @@
 // @ts-strict-ignore
+import { formatNumber } from "@angular/common";
 import { Component, Input, OnChanges, OnDestroy, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { TranslateService } from "@ngx-translate/core";
@@ -7,7 +8,6 @@ import { DefaultTypes } from "src/app/shared/service/defaulttypes";
 import { ChartAxis, Utils, YAxisType } from "src/app/shared/service/utils";
 import { ChannelAddress, Edge, EdgeConfig, Service } from "src/app/shared/shared";
 
-import { formatNumber } from "@angular/common";
 import { AbstractHistoryChart } from "../abstracthistorychart";
 
 @Component({

diff --git a/ui/src/app/edge/live/common/storage/storage.component.ts b/ui/src/app/edge/live/common/storage/storage.component.ts
@@ -2,10 +2,9 @@
 import { formatNumber } from "@angular/common";
 import { Component } from "@angular/core";
 import { AbstractFlatWidget } from "src/app/shared/components/flat/abstract-flat-widget";
-import { CurrentData } from "src/app/shared/shared";
+import { CurrentData , ChannelAddress, EdgeConfig, Utils } from "src/app/shared/shared";
 import { DateUtils } from "src/app/shared/utils/date/dateutils";
 
-import { ChannelAddress, EdgeConfig, Utils } from "../../../../shared/shared";
 import { StorageModalComponent } from "./modal/modal.component";
 
 @Component({

diff --git a/ui/src/app/edge/live/live.module.ts b/ui/src/app/edge/live/live.module.ts
@@ -3,14 +3,21 @@ import { BrowserModule } from "@angular/platform-browser";
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
 import { EdgeOfflineModule } from "src/app/shared/components/edge/offline/offline.module";
 import { SharedModule } from "./../../shared/shared.module";
+import { Common_Autarchy } from "./common/autarchy/Common_Autarchy";
+import { Common_Consumption } from "./common/consumption/Common_Consumption";
+import { Common_Grid } from "./common/grid/Common_Grid";
+import { Common_Production } from "./common/production/Common_Production";
+import { Common_Selfconsumption } from "./common/selfconsumption/Common_Selfconsumption";
+import { StorageModalComponent } from "./common/storage/modal/modal.component";
+import { StorageComponent } from "./common/storage/storage.component";
 import { Controller_ChannelthresholdComponent } from "./Controller/Channelthreshold/Channelthreshold";
 import { Controller_ChpSocComponent } from "./Controller/ChpSoc/ChpSoc";
 import { Controller_ChpSocModalComponent } from "./Controller/ChpSoc/modal/modal.component";
 import { Controller_Ess_FixActivePower } from "./Controller/Ess/FixActivePower/Ess_FixActivePower";
 import { Controller_Ess_GridOptimizedCharge } from "./Controller/Ess/GridOptimizedCharge/Ess_GridOptimizedCharge";
 import { Controller_Ess_TimeOfUseTariff } from "./Controller/Ess/TimeOfUseTariff/Ess_TimeOfUseTariff";
-import { Controller_Evcs } from "./Controller/Evcs/Evcs";
 import { AdministrationComponent } from "./Controller/Evcs/administration/administration.component";
+import { Controller_Evcs } from "./Controller/Evcs/Evcs";
 import { Controller_Io_ChannelSingleThresholdComponent } from "./Controller/Io/ChannelSingleThreshold/Io_ChannelSingleThreshold";
 import { Controller_Io_ChannelSingleThresholdModalComponent } from "./Controller/Io/ChannelSingleThreshold/modal/modal.component";
 import { Controller_Io_FixDigitalOutputComponent } from "./Controller/Io/FixDigitalOutput/Io_FixDigitalOutput";
@@ -21,27 +28,20 @@ import { Controller_Io_HeatpumpModalComponent } from "./Controller/Io/Heatpump/m
 import { Controller_Api_ModbusTcp } from "./Controller/ModbusTcpApi/modbusTcpApi.module";
 import { Controller_Asymmetric_PeakShavingComponent } from "./Controller/PeakShaving/Asymmetric/Asymmetric";
 import { Controller_Asymmetric_PeakShavingModalComponent } from "./Controller/PeakShaving/Asymmetric/modal/modal.component";
-import { Controller_Symmetric_PeakShavingComponent } from "./Controller/PeakShaving/Symmetric/Symmetric";
 import { Controller_Symmetric_PeakShavingModalComponent } from "./Controller/PeakShaving/Symmetric/modal/modal.component";
-import { Controller_Symmetric_TimeSlot_PeakShavingComponent } from "./Controller/PeakShaving/Symmetric_TimeSlot/Symmetric_TimeSlot";
+import { Controller_Symmetric_PeakShavingComponent } from "./Controller/PeakShaving/Symmetric/Symmetric";
 import { Controller_Symmetric_TimeSlot_PeakShavingModalComponent } from "./Controller/PeakShaving/Symmetric_TimeSlot/modal/modal.component";
-import { Io_Api_DigitalInputComponent } from "./Io/Api_DigitalInput/Io_Api_DigitalInput";
-import { Io_Api_DigitalInput_ModalComponent } from "./Io/Api_DigitalInput/modal/modal.component";
-import { Evcs_Api_ClusterComponent } from "./Multiple/Evcs_Api_Cluster/Evcs_Api_Cluster";
-import { EvcsChartComponent } from "./Multiple/Evcs_Api_Cluster/modal/evcs-chart/evcs.chart";
-import { Evcs_Api_ClusterModalComponent } from "./Multiple/Evcs_Api_Cluster/modal/evcsCluster-modal.page";
-import { Common_Autarchy } from "./common/autarchy/Common_Autarchy";
-import { Common_Consumption } from "./common/consumption/Common_Consumption";
-import { Common_Grid } from "./common/grid/Common_Grid";
-import { Common_Production } from "./common/production/Common_Production";
-import { Common_Selfconsumption } from "./common/selfconsumption/Common_Selfconsumption";
-import { StorageModalComponent } from "./common/storage/modal/modal.component";
-import { StorageComponent } from "./common/storage/storage.component";
+import { Controller_Symmetric_TimeSlot_PeakShavingComponent } from "./Controller/PeakShaving/Symmetric_TimeSlot/Symmetric_TimeSlot";
 import { DelayedSellToGridComponent } from "./delayedselltogrid/delayedselltogrid.component";
 import { DelayedSellToGridModalComponent } from "./delayedselltogrid/modal/modal.component";
 import { EnergymonitorModule } from "./energymonitor/energymonitor.module";
 import { InfoComponent } from "./info/info.component";
+import { Io_Api_DigitalInputComponent } from "./Io/Api_DigitalInput/Io_Api_DigitalInput";
+import { Io_Api_DigitalInput_ModalComponent } from "./Io/Api_DigitalInput/modal/modal.component";
 import { LiveComponent } from "./live.component";
+import { Evcs_Api_ClusterComponent } from "./Multiple/Evcs_Api_Cluster/Evcs_Api_Cluster";
+import { EvcsChartComponent } from "./Multiple/Evcs_Api_Cluster/modal/evcs-chart/evcs.chart";
+import { Evcs_Api_ClusterModalComponent } from "./Multiple/Evcs_Api_Cluster/modal/evcsCluster-modal.page";
 
 @NgModule({
  imports: [

diff --git a/ui/src/app/edge/settings/channels/channels.component.ts b/ui/src/app/edge/settings/channels/channels.component.ts
@@ -3,12 +3,12 @@ import { Component } from "@angular/core";
 import { ActivatedRoute, Router } from "@angular/router";
 import { TranslateService } from "@ngx-translate/core";
 import { PersistencePriority } from "src/app/shared/components/edge/edgeconfig";
-import { SetChannelValueRequest } from "src/app/shared/jsonrpc/request/setChannelValueRequest";
-import { environment } from "src/environments";
 
 import { ComponentJsonApiRequest } from "src/app/shared/jsonrpc/request/componentJsonApiRequest";
 import { GetChannelsOfComponentRequest } from "src/app/shared/jsonrpc/request/getChannelsOfComponentRequest";
+import { SetChannelValueRequest } from "src/app/shared/jsonrpc/request/setChannelValueRequest";
 import { Channel, GetChannelsOfComponentResponse } from "src/app/shared/jsonrpc/response/getChannelsOfComponentResponse";
+import { environment } from "src/environments";
 import { ChannelAddress, Edge, EdgeConfig, EdgePermission, Service, Websocket } from "../../../shared/shared";
 
 @Component({

diff --git a/ui/src/app/index/login.component.ts b/ui/src/app/index/login.component.ts
@@ -2,10 +2,10 @@
 import { AfterContentChecked, ChangeDetectorRef, Component, OnDestroy, OnInit } from "@angular/core";
 import { FormGroup } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
+import { Capacitor } from "@capacitor/core";
 import { Subject } from "rxjs";
 import { environment } from "src/environments";
 
-import { Capacitor } from "@capacitor/core";
 import { AppService } from "../app.service";
 import { AuthenticateWithPasswordRequest } from "../shared/jsonrpc/request/authenticateWithPasswordRequest";
 import { States } from "../shared/ngrx-store/states";

diff --git a/ui/src/app/shared/components/abstracthistorywidget.ts b/ui/src/app/shared/components/abstracthistorywidget.ts
@@ -4,9 +4,9 @@ import { ActivatedRoute } from "@angular/router";
 import { ModalController } from "@ionic/angular";
 import { TranslateService } from "@ngx-translate/core";
 import { Subject } from "rxjs";
+import { v4 as uuidv4 } from "uuid";
 import { DefaultTypes } from "src/app/shared/service/defaulttypes";
 import { ChannelAddress, CurrentData, Edge, EdgeConfig, Service, Websocket } from "src/app/shared/shared";
-import { v4 as uuidv4 } from "uuid";
 
 // NOTE: Auto-refresh of widgets is currently disabled to reduce server load
 @Directive()