package upgrade done (#23)

.github/workflows/prod.yml

@@ -22,24 +22,24 @@ jobs:
       - name: 🚚 Get latest code
         uses: actions/checkout@v2
 
-      - name: Install Node.js 18
+      - name: Install Node.js 20
         uses: actions/setup-node@v1
         with:
-          node-version: "18.x"
+          node-version: '20.x'
 
       - name: 🔨 Build Project
         run: |
-          npm i --legacy-peer-deps
-          npm run build-prod
+          yarn
+          yarn build-prod
 
       - name: 📂 Deploy to Server
         uses: easingthemes/ssh-deploy@v2.1.5
         env:
           SSH_PRIVATE_KEY: ${{ secrets.SERVER_SSH_KEY }}
           # ARGS: "-rltgoDzvO --delete"
-          SOURCE: "dist/"
+          SOURCE: 'dist/'
           REMOTE_HOST: 217.21.92.35
           REMOTE_USER: u778408432
-          REMOTE_PORT: "65002"
+          REMOTE_PORT: '65002'
           TARGET: domains/codedthemes.com/public_html/demos/admin-templates/datta-able/angular/free
-          EXCLUDE: "/node_modules/"
+          EXCLUDE: '/node_modules/'

.prettierrc

@@ -0,0 +1,10 @@
+{
+  "bracketSpacing": true,
+  "printWidth": 140,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "tabWidth": 2,
+  "useTabs": false,
+  "htmlWhitespaceSensitivity": "ignore",
+  "bracketSameLine": false
+}

angular.json

@@ -25,10 +25,7 @@
             "tsConfig": "tsconfig.app.json",
             "inlineStyleLanguage": "scss",
             "assets": ["src/favicon.ico", "src/assets", "src/fake-data"],
-            "styles": [
-              "node_modules/bootstrap/scss/bootstrap.scss",
-              "src/styles.scss"
-            ],
+            "styles": ["node_modules/bootstrap/scss/bootstrap.scss", "src/styles.scss"],
             "scripts": ["node_modules/apexcharts/dist/apexcharts.min.js"]
           },
           "configurations": {

karma.conf.js

@@ -3,14 +3,14 @@
 
 module.exports = function (config) {
   config.set({
-    basePath: "",
-    frameworks: ["jasmine", "@angular-devkit/build-angular"],
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
     plugins: [
-      require("karma-jasmine"),
-      require("karma-chrome-launcher"),
-      require("karma-jasmine-html-reporter"),
-      require("karma-coverage"),
-      require("@angular-devkit/build-angular/plugins/karma"),
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage'),
+      require('@angular-devkit/build-angular/plugins/karma')
     ],
     client: {
       jasmine: {
@@ -19,23 +19,23 @@ module.exports = function (config) {
         // for example, you can disable the random execution with `random: false`
         // or set a specific seed with `seed: 4321`
       },
-      clearContext: false, // leave Jasmine Spec Runner output visible in browser
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
     jasmineHtmlReporter: {
-      suppressAll: true, // removes the duplicated traces
+      suppressAll: true // removes the duplicated traces
     },
     coverageReporter: {
-      dir: require("path").join(__dirname, "./coverage/datta-able-free"),
-      subdir: ".",
-      reporters: [{ type: "html" }, { type: "text-summary" }],
+      dir: require('path').join(__dirname, './coverage/datta-able-free'),
+      subdir: '.',
+      reporters: [{ type: 'html' }, { type: 'text-summary' }]
     },
-    reporters: ["progress", "kjhtml"],
+    reporters: ['progress', 'kjhtml'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,
     autoWatch: true,
-    browsers: ["Chrome"],
+    browsers: ['Chrome'],
     singleRun: false,
-    restartOnFileChange: true,
+    restartOnFileChange: true
   });
 };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "datta-able-free-angular-admin-template",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "author": "CodedThemes",
   "scripts": {
     "ng": "ng",
@@ -12,40 +12,40 @@
   },
   "private": false,
   "dependencies": {
-    "@angular/animations": "^18.0.0-next.3",
-    "@angular/cdk": "^18.0.0-next.3",
-    "@angular/common": "^18.0.0-next.3",
-    "@angular/compiler": "^18.0.0-next.3",
-    "@angular/core": "^18.0.0-next.3",
-    "@angular/forms": "^18.0.0-next.3",
-    "@angular/localize": "^18.0.0-next.3",
-    "@angular/platform-browser": "^18.0.0-next.3",
-    "@angular/platform-browser-dynamic": "^18.0.0-next.3",
-    "@angular/router": "^18.0.0-next.3",
-    "@ng-bootstrap/ng-bootstrap": "^16.0.0",
+    "@angular/animations": "^18.0.5",
+    "@angular/cdk": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/compiler": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
+    "@angular/localize": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
+    "@angular/platform-browser-dynamic": "^18.0.5",
+    "@angular/router": "^18.0.5",
+    "@ng-bootstrap/ng-bootstrap": "^17.0.0",
     "@popperjs/core": "^2.11.8",
-    "apexcharts": "^3.49.0",
+    "apexcharts": "^3.49.2",
     "bootstrap": "^5.3.3",
-    "ng-apexcharts": "^1.10.0",
-    "ngx-scrollbar": "^13.0.3",
+    "ng-apexcharts": "^1.11.0",
+    "ngx-scrollbar": "^15.0.1",
     "rxjs": "~7.8.1",
     "screenfull": "^6.0.2",
-    "tslib": "^2.6.2",
-    "zone.js": "~0.14.4"
+    "tslib": "^2.6.3",
+    "zone.js": "~0.14.7"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^18.0.0-next.3",
-    "@angular/cli": "~18.0.0-next.3",
-    "@angular/compiler-cli": "^18.0.0-next.3",
+    "@angular-devkit/build-angular": "^18.0.6",
+    "@angular/cli": "~18.0.6",
+    "@angular/compiler-cli": "^18.0.5",
     "@types/jasmine": "~5.1.4",
-    "@types/node": "^20.12.7",
+    "@types/node": "^20.14.9",
     "jasmine-core": "~5.1.2",
     "karma": "~6.4.3",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.1",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "prettier": "3.2.5",
+    "prettier": "3.3.2",
     "typescript": "5.4"
   }
 }

src/app/app-routing.module.ts

@@ -11,62 +11,48 @@ const routes: Routes = [
       {
         path: '',
         redirectTo: 'dashboard',
-        pathMatch: 'full',
+        pathMatch: 'full'
       },
       {
         path: 'dashboard',
-        loadComponent: () => import('./demo/dashboard/dashboard.component'),
+        loadComponent: () => import('./demo/dashboard/dashboard.component')
       },
       {
         path: 'basic',
-        loadChildren: () =>
-          import('./demo/ui-elements/ui-basic/ui-basic.module').then(
-            (m) => m.UiBasicModule,
-          ),
+        loadChildren: () => import('./demo/ui-elements/ui-basic/ui-basic.module').then((m) => m.UiBasicModule)
       },
       {
         path: 'forms',
-        loadChildren: () =>
-          import('./demo/pages/form-elements/form-elements.module').then(
-            (m) => m.FormElementsModule,
-          ),
+        loadChildren: () => import('./demo/pages/form-elements/form-elements.module').then((m) => m.FormElementsModule)
       },
       {
         path: 'tables',
-        loadChildren: () =>
-          import('./demo/pages/tables/tables.module').then(
-            (m) => m.TablesModule,
-          ),
+        loadChildren: () => import('./demo/pages/tables/tables.module').then((m) => m.TablesModule)
       },
       {
         path: 'apexchart',
-        loadComponent: () =>
-          import('./demo/chart/apex-chart/apex-chart.component'),
+        loadComponent: () => import('./demo/chart/apex-chart/apex-chart.component')
       },
       {
         path: 'sample-page',
-        loadComponent: () =>
-          import('./demo/extra/sample-page/sample-page.component'),
-      },
-    ],
+        loadComponent: () => import('./demo/extra/sample-page/sample-page.component')
+      }
+    ]
   },
   {
     path: '',
     component: GuestComponent,
     children: [
       {
         path: 'auth',
-        loadChildren: () =>
-          import('./demo/pages/authentication/authentication.module').then(
-            (m) => m.AuthenticationModule,
-          ),
-      },
-    ],
-  },
+        loadChildren: () => import('./demo/pages/authentication/authentication.module').then((m) => m.AuthenticationModule)
+      }
+    ]
+  }
 ];
 
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule],
+  exports: [RouterModule]
 })
 export class AppRoutingModule {}

src/app/app.component.ts

@@ -4,7 +4,7 @@ import { NavigationEnd, Router } from '@angular/router';
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss'],
+  styleUrls: ['./app.component.scss']
 })
 export class AppComponent implements OnInit {
   title = 'datta-able';

src/app/app.module.ts

@@ -40,17 +40,10 @@ import { ToggleFullScreenDirective } from './theme/shared/components/full-screen
     NavGroupComponent,
     NavItemComponent,
     NavSearchComponent,
-    ToggleFullScreenDirective,
-  ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule,
-    FormsModule,
-    ReactiveFormsModule,
-    SharedModule,
-    BrowserAnimationsModule,
+    ToggleFullScreenDirective
   ],
+  imports: [BrowserModule, AppRoutingModule, FormsModule, ReactiveFormsModule, SharedModule, BrowserAnimationsModule],
   providers: [NavigationItem],
-  bootstrap: [AppComponent],
+  bootstrap: [AppComponent]
 })
 export class AppModule {}