Merge pull request #405 from maktarsis/release-4.2.0

Release 4.2.0

Author: tarsisexistence

browserslist .browserslistrc

@@ -3,7 +3,6 @@
     "prettier --write",
     "tslint",
     "git add"
-  ],
-  ".*{rc,json}": "jsonlint"
+  ]
 }
 

.lintstagedrc.json

@@ -1,3 +1,10 @@
+# 4.2.0 2020-07-02
+
+- Added compatibility with Angular 10
+- Updated documentation documentation
+- Updated dependencies
+- Refactored internal utilities
+
 # 4.1.1 2020-04-04
 
 - Updated dependencies
@@ -40,7 +47,6 @@
 - added contributors board
 - added test commit check
 
-
 # 3.0.0 2019-06-21
 
 - changed a way of slice connection [BREAKING CHANGE]
@@ -50,26 +56,22 @@
 - raised the test cover
 - updated documentation
 
-
 # 2.1.3 2019-06-21
 
 - insignificant api changes
 - fixed issues with typing of getter functions
 - covered with tests all api
 
-
 # 2.1.2 2019-06-17
 
 - improved documentation
 - refactored code
 
-
 # 2.1.1 2019-06-16
 
 - added new getSlice function (as an alternative to @Sliced decorator)
 - refactored code
 
-
 # 2.1.0 2019-06-14
 
 - added new @Sliced decorator
@@ -78,7 +80,6 @@
 - slightly refactored pattern
 - updated documentation
 
-
 # 2.0.0 2019-06-09
 
 - reduced the amount of required boilerplate code
@@ -91,7 +92,6 @@
 - finish hub management pattern and improved semantics
 - updated dependencies
 
-
 # 1.3.0 2019-05-08
 
 - added new navLinkActive directive
@@ -100,7 +100,6 @@
 - updated documentation
 - updated dependencies
 
-
 # 1.2.0 2019-05-01
 
 - added few navigation directives
@@ -110,7 +109,6 @@
 - updated documentation
 - updated dependencies
 
-
 # 1.1.1 2019-03-09
 
 - improved reliability and typing
@@ -126,7 +124,6 @@
 - updated and fixed readme
 - refactored and made functionality clearer
 
-
 # 1.0.0 2019-02-09
 
 - initial release

CHANGELOG.md

@@ -4,21 +4,21 @@
 
 A **route manager** and pattern for **[Angular]**
 
-* **Manager.** Introduces a new route management experience leading to better application control.
-* **Navigation.** Provides declarative experience of navigation.
+* **Manager.** Introduces a new route management experience that leads to better application control.
+* **Navigation.** It provides declarative navigation experience.
 * **Fast.** In addition to speeding up development, it works as fast as it does without it.
-* **Pluggable.** Engineered as a plug-in. Designed to be added at any time during the development process.
-* **Pattern.** Provides a unified approach managing the routing of the entire application.
-* **Small.** ~3.5kB (minified + gzipped). It uses [Angular] and [rxjs] as peerDependencies.
+* **Pluggable.** Engineered as a plug-in and designed to be added at any time during the development process.
+* **Pattern.** It provides a unified approach managing the routing of the entire application.
+* **Small.** ~3.5 kB (minified + gzipped). It uses [Angular] and [rxjs] as peerDependencies.
 
-In short, this is an add-on to the **@angular/router** which provides state based routing for medium to large-size applications.
+In short, this is an add-on to the **@angular/router**, which provides state-based routing for medium to large-size applications.
 
 Read more about Routeshub on the [docs site](https://routeshub.gitbook.io)
 
 <br/>
 
 ## Install
-To get started, you need install the package from npm
+To get started, you need to install the package from npm
 ```sh
 npm install routeshub
 ```
@@ -74,17 +74,17 @@ import { aboutUnit } from '../views/about/hub/about.hub';
 createRoot<AppNotes>(routes, { key: APP_NOTES_KEY });
 
 /**
- * connects features which have attached relation to parent module
+ * connects features which have attached relating to the parent module
  *
- * about module has its own routes which we wanna connect
+ * about module has its routes which we want to connect
  */
 connectFeatures<AppNotes>(APP_NOTES_KEY, {
   about: aboutUnit
 });
 
 /**
  * Routing module contains its configuration
- * and providers (resolvers, guard, interceptors etc)
+ * and providers (resolvers, guard, interceptors, etc.)
  * 
  * Exports RouterModule
  * and NavigationModule for navLink directives
@@ -120,7 +120,7 @@ export class HeaderComponent {
 
   //or
 
-   // getting unit by name
+   // getting the unit by name
    @Secluded('app')
    public app: Unit<AppNotes>;
 
@@ -142,10 +142,10 @@ You can find a more complex example in this [repo](https://github.com/maktarsis/
 Routeshub offers an approach (pattern) to structure routing in the application. You can explore it in this [repo](https://github.com/maktarsis/routeshub/tree/master/example-app).
 
 **Guideline**:
-- Each module in application has a hub directory
-- hub directory contains three files that configure routing of the current module
-1. hub - sets routing configuration, exports RoutingModule and NavigationModule, connects feature units.
-2. notes - place for interfaces and unique key of the unit.
+- Each module in the application has a hub directory
+- hub directory contains three files that configure the routing of the current module.
+1. hub - sets routing configuration; exports RoutingModule and NavigationModule; connects feature units.
+2. notes - it is a place for interfaces and the unique key of the unit.
 3. routes - simple routes file as is without any changes.
 
 ![diagram](http://i.piccy.info/i9/baf248d94b1260e13d5bff6acb6e6727/1569138770/128577/1338898/2019_09_22_10_51_00.jpg)
@@ -165,10 +165,10 @@ There are two ways to create the `unit`:
 
 Each creator takes the `routes: Routes` and an object of options 
 - key - unit identifier and accepts string or symbol
-- routeName - accepts an object with optional custom names for wildcard ('**') and root ('') paths
-- nearby - accepts lazy units (**connectors**) which are outputs of  **feature creator**. Nearby option should be used when one or more connected features are eager modules with their own routes files.
+- routeName - accepts an object with optional custom names for a wildcard ('**') and root ('') paths
+- nearby - accepts lazy units (**connectors**), which are outputs of  **feature creator**. A nearby option should use when one or more connected features are eager modules with their own routes files.
 
-**Root** creator invokes only once to initialize the hub in the application. `createRoot` takes initial `appNotes` 
+**Root** creator invokes only once to initialize the hub in the application. `createRoot` takes initial `appNotes`. 
 
 **Usage example**:
 ```typescript
@@ -179,7 +179,7 @@ Each creator takes the `routes: Routes` and an object of options
  });
 ```
 
-In turn, the **feature** creator is responsible for creating lazy units (**connectors**) which should be connected to the parent unit
+In turn, the **feature** creator is responsible for creating lazy units (**connectors**), which should connect to the parent unit.
 
 ```typescript
 export const routes: Routes = [
@@ -200,13 +200,13 @@ export const aboutConnector: Connector<AboutNotes> = createFeature<AboutNotes>(a
 <br/>
 
 ## Note
-You need understand how routeshub transforms routes into the keys. Actually, all notes related things routeshub handles internally.
+You need to understand how routeshub transforms routes into the keys. All notes related things routeshub handles internally.
 
 The `Note` is input to reproduce the unit. Each `Note` represents one route.
 
 **In short, it assigns the names to the 'spots'**
 
-The example below shows capabilities and illustrates how this actually works. Unnecessary route information is shortened.
+The example below shows capabilities and illustrates how this works. Unnecessary route information shortened.
 
 ```typescript
 export const routes: Routes = [
@@ -237,7 +237,7 @@ export interface AppChildNotes extends Root {
 */
 
 /**
-  * btw, this shorthand provides opportunity to describe root children interface through generics
+  * btw, this shorthand provides an opportunity to describe root children interface through generics
 */
 export interface AppNotes extends Root<AppChildNotes> {
   firstName: Note;
@@ -263,7 +263,7 @@ export const appUnit = createRoot<AppNotes, AppChildNotes>(routes, { routeName:
 <br/>
 
 ## Get Unit
-Essentially, you need the unit to pass it into directive/decorator for navigation purposes.
+Essentially, you need the unit to pass it into a directive/decorator for navigation purposes.
 There are several ways to get a unit:
 
 -  **@United decorator**. Apply this decorator on the component's prop. You should pass the key or unit name.
@@ -282,7 +282,7 @@ export class HeaderComponent {
 }
 ```
 
--  **getUnit** - This is a function that works as decorator. Essentially, it is created as an alternative to @Secluded decorator.
+-  **get unit** - This is a function that works as a decorator. Primarily, it created as an alternative to @Secluded decorator.
 ```typescript
 @Component({
   ...
@@ -312,7 +312,7 @@ export class HeaderComponent {
 **Routeshub** provides directives and functions to make your experience with navigation better.
 
 Before you start, don't forget to import **NavigationModule**.
-It's a good practice importing NavigationModule into the **[module]**.hub.ts file
+It's a good practice importing NavigationModule into the **[module]**.hub.ts file.
 
 
 ### navLink
@@ -339,7 +339,7 @@ It's a good practice importing NavigationModule into the **[module]**.hub.ts fil
 ```
 
 ### forwardParams
-A function that inserts parameters into route's state and outputs a ready-made dynamic state. 
+A function that inserts parameters into the route's state and outputs a ready-made dynamic state. 
 
 ```typescript
 ...
@@ -382,7 +382,7 @@ If you made a PR, make sure to update tests as appropriate and keep the examples
 
 ## Contributors ✨
 
-Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
+Thanks go to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
 
 <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
 <!-- prettier-ignore -->

README.md

@@ -11,9 +11,9 @@ import {
 } from 'routeshub';
 
 import { Hub } from '../../../hub/app.hub';
-import { APP_NOTES_KEY, AppChildNotes, AppNotes } from '../../../hub/app.notes';
+import { AppChildNotes, AppNotes, APP_NOTES_KEY } from '../../../hub/app.notes';
 import { AboutNotes } from '../../../views/about/hub/about.notes';
-import { CAR_NOTES_KEY, CarNotes } from '../../../views/car/hub/car.notes';
+import { CarNotes, CAR_NOTES_KEY } from '../../../views/car/hub/car.notes';
 
 @Component({
   selector: 'app-header',

example-app/app/core/components/header/header.component.ts

@@ -5,7 +5,7 @@ import { RouterModule } from '@angular/router';
 import { connectFeatures, createRoot, NavigationModule } from 'routeshub';
 
 import { routes } from './app.routes';
-import { APP_NOTES_KEY, AppChildNotes, AppNotes } from './app.notes';
+import { AppChildNotes, AppNotes, APP_NOTES_KEY } from './app.notes';
 import { aboutConnector } from '../views/about/hub/about.hub';
 import { carConnector } from '../views/car/hub/car.hub';
 import { homeConnector } from '../views/home/hub/home.hub';
@@ -58,12 +58,15 @@ export interface Hub {
 /**
  * Routing configuration
  */
-export const routing: ModuleWithProviders = RouterModule.forRoot(routes, {
-  enableTracing: false,
-  initialNavigation: 'enabled',
-  onSameUrlNavigation: 'reload',
-  scrollPositionRestoration: 'top'
-});
+export const routing: ModuleWithProviders<AppHub> = RouterModule.forRoot(
+  routes,
+  {
+    enableTracing: false,
+    initialNavigation: 'enabled',
+    onSameUrlNavigation: 'reload',
+    scrollPositionRestoration: 'top'
+  }
+);
 
 /**
  * Routing module contains its configuration

example-app/app/hub/app.hub.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { createFeature } from 'routeshub';
-import { ABOUT_NOTES_KEY, AboutNotes } from './about.notes';
+import { AboutNotes, ABOUT_NOTES_KEY } from './about.notes';
 import { aboutRoutes } from './about.routes';
 
 export const aboutConnector = createFeature<AboutNotes>(aboutRoutes, {

example-app/app/views/about/hub/about.hub.ts

@@ -1,7 +1,5 @@
 import { Routes } from '@angular/router';
-import { createFeature } from 'routeshub';
 import { AboutComponent } from '../components/about.component';
-import { ABOUT_NOTES_KEY, AboutNotes } from './about.notes';
 
 /**
  * Declares routes on AboutModule level

example-app/app/views/about/hub/about.routes.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { createFeature } from 'routeshub';
-import { CAR_NOTES_KEY, CarNotes } from './car.notes';
+import { CarNotes, CAR_NOTES_KEY } from './car.notes';
 import { carRoutes } from './car.routes';
 import { detailsUnit } from '../../details/hub/details.hub';
 

example-app/app/views/car/hub/car.hub.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { connectFeatures, createFeature } from 'routeshub';
-import { DETAILS_NOTES_KEY, DetailsNotes } from './details.notes';
+import { DetailsNotes, DETAILS_NOTES_KEY } from './details.notes';
 import { infoConnector } from '../../info/hub/info.hub';
 import { detailsRoutes } from './details.routes';
 

example-app/app/views/details/hub/details.hub.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { createFeature } from 'routeshub';
-import { HOME_NOTES_KEY, HomeNotes } from './home.notes';
+import { HomeNotes, HOME_NOTES_KEY } from './home.notes';
 import { homeRoutes } from './home.routes';
 
 export const homeConnector = createFeature<HomeNotes>(homeRoutes, {

example-app/app/views/home/hub/home.hub.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { createFeature } from 'routeshub';
-import { INFO_NOTES_KEY, InfoNotes } from './info.notes';
+import { InfoNotes, INFO_NOTES_KEY } from './info.notes';
 import { infoRoutes } from './info.routes';
 
 export const infoConnector = createFeature<InfoNotes>(infoRoutes, {

example-app/app/views/info/hub/info.hub.ts

@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { createFeature, NavigationModule } from 'routeshub';
-import { USERS_NOTES_KEY, UsersChildNotes, UsersNotes } from './users.notes';
+import { UsersChildNotes, UsersNotes, USERS_NOTES_KEY } from './users.notes';
 import { usersRoutes } from './users.routes';
 
 export const usersConnector = createFeature<UsersNotes, UsersChildNotes>(

example-app/app/views/users/hub/users.hub.ts

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.json",
+  "extends": "../tsconfig.base.json",
   "compilerOptions": {
     "outDir": "../out-tsc/app",
     "types": []