feat(icons): update to @coreui/icons v2 and @coreui/icons-angular

Author: xidedix

CHANGELOG.md

@@ -1,5 +1,37 @@
 ## [CoreUI for Angular](./README.md) version `changelog`
 
+###### `v2.9.6`
+- feat(icons): update to @coreui/icons v2 and @coreui/icons-angular
+
+###### dependencies update
+- update `@angular/animations` to `^9.1.13`
+- update `@angular/cdk` to `^9.2.4`
+- update `@angular/common` to `^9.1.13`
+- update `@angular/compiler` to `^9.1.13`
+- update `@angular/core` to `^9.1.13`
+- update `@angular/forms` to `^9.1.13`
+- update `@angular/platform-browser` to `^9.1.13`
+- update `@angular/platform-browser-dynamic` to `^9.1.13`
+- update `@angular/router` to `^9.1.13`
+- update `@coreui/angular`: `~2.9.6`
+- update `@coreui/icons` to `^2.0.0-rc.0`
+- update `@coreui/icons-angular` to `1.0.0-alpha.3`
+- update `bootstrap` to `^4.5.3`
+- update `chart.js` to `^2.9.4`
+- update `core-js` to `^3.8.2`
+- update `ng2-charts` to `~2.3.3`
+- update `ngx-bootstrap` to `^5.6.2`
+- update `rxjs` to `^6.6.3`
+- update `simple-line-icons` to `^2.5.5`
+- update `tslib` to `^1.14.1`
+- update `@angular-devkit/build-angular` to `^0.901.13`
+- update `@angular/cli` to `^9.1.13`
+- update `@angular/compiler-cli` to `^9.1.13`
+- update `@angular/language-service` to `^9.1.13`
+- update `@types/jasmine` to `^3.6.2`
+- update `@types/node` to `^14.14.20`
+- update `karma` to `^5.2.3`
+
 ###### `v2.9.5`
 - fix(simple-line-icons): Can't resolve simple-line-icons.css - fixes #196
 

README.md

@@ -187,11 +187,11 @@ Some of projects created by community but not maintained by CoreUI team.
 
 ## Copyright and license
 
-copyright 2017-2020 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-free-angular-admin-template/blob/master/LICENSE).
+copyright 2017-2021 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-free-angular-admin-template/blob/master/LICENSE).
 There is only one limitation you can't re-distribute the CoreUI as stock. You can’t do this if you modify the CoreUI. In past we faced some problems with persons who tried to sell CoreUI based templates.
 
 ## Support CoreUI Development
 
 CoreUI is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing. You can support development by donating on [PayPal](https://www.paypal.me/holeczek), buying [CoreUI Pro Version](https://coreui.io/pro) or buying one of our [premium admin templates](https://genesisui.com/?support=1).
 
-As of now I am exploring the possibility of working on CoreUI fulltime - if you are a business that is building core products using CoreUI, I am also open to conversations regarding custom sponsorship / consulting arrangements. Get in touch on [Twitter](https://twitter.com/lukaszholeczek).
+As of now I am exploring the possibility of working on CoreUI full-time - if you are a business that is building core products using CoreUI, I am also open to conversations regarding custom sponsorship / consulting arrangements. Get in touch on [Twitter](https://twitter.com/lukaszholeczek).

angular.json

@@ -20,7 +20,7 @@
               "src/assets"
             ],
             "styles": [
-              "node_modules/@coreui/icons/css/coreui-icons.css",
+              "node_modules/@coreui/icons/css/free.css",
               "node_modules/flag-icon-css/css/flag-icon.css",
               "node_modules/font-awesome/css/font-awesome.css",
               "node_modules/simple-line-icons/dist/styles/simple-line-icons.css",

e2e/app.e2e-spec.ts

@@ -36,8 +36,6 @@ describe('CoreUI template', () => {
     button.click();
     browser.sleep(sleep);
     expect(body.getAttribute('class')).not.toContain('sidebar-minimized');
-    browser.driver.manage().window().setSize(600, 800);
-    browser.sleep(1000);
   });
 
   it('should toggle `sidebar-show` body.class on `navbar-toggler` click', () => {
@@ -56,4 +54,19 @@ describe('CoreUI template', () => {
     browser.sleep(sleep);
     expect(body.getAttribute('class')).not.toContain('sidebar-show');
   });
+
+  it('should toggle `aside-menu-lg-show` body.class on `navbar-toggler` click', () => {
+    browser.manage().window().maximize();
+    browser.sleep(1000);
+    const body = page.getBody();
+    expect(body.getAttribute('class')).not.toContain('aside-menu-lg-show');
+    const button1 = page.getByCss('.navbar-toggler.d-none.d-lg-block').last();
+    button1.click();
+    browser.sleep(sleep);
+    expect(body.getAttribute('class')).toContain('aside-menu-lg-show');
+    browser.sleep(sleep);
+    button1.click();
+    browser.sleep(sleep);
+    expect(body.getAttribute('class')).not.toContain('aside-menu-lg-show');
+  });
 });

package.json

@@ -15,7 +15,7 @@
     }
   ],
   "homepage": "https://coreui.io/angular",
-  "copyright": "Copyright 2020 creativeLabs Łukasz Holeczek",
+  "copyright": "Copyright 2021 creativeLabs Łukasz Holeczek",
   "license": "MIT",
   "scripts": {
     "ng": "ng",
@@ -37,16 +37,16 @@
     "@angular/platform-browser": "^9.1.13",
     "@angular/platform-browser-dynamic": "^9.1.13",
     "@angular/router": "^9.1.13",
-    "@coreui/angular": "~2.9.5",
+    "@coreui/angular": "~2.9.6",
     "@coreui/coreui": "^2.1.16",
     "@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1",
-    "@coreui/icons": "0.3.0",
+    "@coreui/icons": "^2.0.0-rc.0",
+    "@coreui/icons-angular": "1.0.0-alpha.3",
     "bootstrap": "^4.5.3",
     "chart.js": "^2.9.4",
     "core-js": "^3.8.2",
     "flag-icon-css": "^3.5.0",
     "font-awesome": "^4.7.0",
-    "moment": "^2.29.1",
     "mutationobserver-shim": "^0.3.7",
     "ng2-charts": "~2.3.3",
     "ngx-bootstrap": "^5.6.2",

src/app/app.component.ts

@@ -1,13 +1,23 @@
 import { Component, OnInit } from '@angular/core';
 import { Router, NavigationEnd } from '@angular/router';
 
+import { IconSetService } from '@coreui/icons-angular';
+import { freeSet } from '@coreui/icons';
+
 @Component({
   // tslint:disable-next-line
   selector: 'body',
-  template: '<router-outlet></router-outlet>'
+  template: '<router-outlet></router-outlet>',
+  providers: [IconSetService],
 })
 export class AppComponent implements OnInit {
-  constructor(private router: Router) { }
+  constructor(
+    private router: Router,
+    public iconSet: IconSetService
+  ) {
+    // iconSet singleton
+    iconSet.icons = { ...freeSet };
+  }
 
   ngOnInit() {
     this.router.events.subscribe((evt) => {

src/app/app.module.ts

@@ -7,6 +7,8 @@ import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
 import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar';
 import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';
 
+import { IconModule, IconSetModule, IconSetService } from '@coreui/icons-angular';
+
 const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
   suppressScrollX: true
 };
@@ -54,7 +56,9 @@ import { ChartsModule } from 'ng2-charts';
     PerfectScrollbarModule,
     BsDropdownModule.forRoot(),
     TabsModule.forRoot(),
-    ChartsModule
+    ChartsModule,
+    IconModule,
+    IconSetModule.forRoot(),
   ],
   declarations: [
     AppComponent,
@@ -64,10 +68,13 @@ import { ChartsModule } from 'ng2-charts';
     LoginComponent,
     RegisterComponent
   ],
-  providers: [{
-    provide: LocationStrategy,
-    useClass: HashLocationStrategy
-  }],
+  providers: [
+    {
+      provide: LocationStrategy,
+      useClass: HashLocationStrategy
+    },
+    IconSetService,
+  ],
   bootstrap: [ AppComponent ]
 })
 export class AppModule { }

src/app/containers/default-layout/default-layout.component.html

@@ -336,6 +336,6 @@ <h6>System Utilization</h6>
   </app-aside>
 </div>
 <app-footer>
-  <span><a href="https://coreui.io">CoreUI</a> &copy; 2018 creativeLabs.</span>
+  <span><a href="https://coreui.io">CoreUI</a> &copy; 2021 creativeLabs.</span>
   <span class="ml-auto">Powered by <a href="https://coreui.io/angular">CoreUI for Angular</a></span>
 </app-footer>