# PVStream

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.23.

## Development server

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Code rules
This is the rules, that should be followed as you write the code in this project. They're not particularly strict, but it would be very nice to follow them as much as you could.

#### TODOs
TODOs should be written in this pattern: `todo:%firstName%.%lastName%:%date% - %todoContent%`

E.g.:
`todo:igor.vinogradov:25.02.2020 - this is an example todo`

This ensures that developers who will be going through your code, will know when, by who and why this TODO was left and if it's still valid.

#### Variable and method naming
##### Underscores (_) for private methods
Since TypeScript doesn't allow accessing private methods outside of the class, underscoring them is not necessary. Please don't do it.

##### Prefixing with "b" or "is"
For easier code readability every variable, that contains `boolean` value should be prefixed with "b" (e.g.: `bLoading` or `bAccessAllowed`).

Every method that returns a `boolean` value should be prefixed with "is" (e.g.: `isLoggedIn`, `isAdmin`).

##### Postfixing with "$"
Every variable that contains something related to RxJS or NgRX should be postfixed with "$". That also includes all the selectors for store.

E.g.: `bLoading$` - selector for Store, `private store$: Store<any>` - injecting Store in a component, `private onDestroy$: Subject<void>` - creating Subject for onDestroy event. 

## Code scaffolding
#### Angular-schematics
##### Creating structure for new page
 - Go to `src/app/modules` folder 
 - Run `ng g m %pageName% --routing=true` where `%pageName%` is the name of the new page (e.g. `Login`) - new folder `%pageName%` should be created, containing module declaration file and routing module declaration file
 - Run `ng g c %pageName%`. `%pageName%` should be the same as created module name. This will create main component for created page module in the root folder of the module. 
 - Specify this component as main loading component in routes module (`path: ''`)
 - Add new object in the `routes` const in `src/app-routing.module.ts` file
 
As you need to create new components or file types (services, enums, etc), you need to create new folders named accordingly (`components`, `enums`, `services`, etc).

##### Other types
 - Go to `src/app/modules/%module%/%fileType%`
   - `%module%` - the module where you want to put your file or component
   - `%fileType%` - type of the file you want to create (e.g. `components` if you want to create component, `enums` if you want to create enum, etc). If no folder is created for desired file type - create one
 - Run `ng g %schematic% [--options]`.
   - List of available angular-default schematics can be found [here](https://angular.io/cli/generate)
   - List of available options for specified schematic can be found using `--help` option (`ng g component --help`)
   
#### NgRX schematics
##### Initializing Store state for a module
Before creating `features` or `actions` you need to initialize Store state for a module.
 - Go to module folder where you want initialize Store state.
 - Create folder `store`. If this folder is already created - state has been already initialized and no need to do it again - this section.
 - Go to newly created folder
 - Run `ng g store %moduleName% --module %pathToModule%`
   - `%moduleName%` - name of the module for which you want to initialize state.
   - `%pathToModule%` - relative path to the module declaration file (e.g.: `..\home.module.ts`).

##### Creating new feature
Feature contains `reducers`, `actions`, etc for a new piece of Store state.

**NOTE:** If you're not planning on creating new Store state part and want just to create actions or effects for manipulating already existing state refer to sections of creating Actions or Effects separately.  
 - Go to module where you want to create a new feature.
 - Go to `store` folder. If none exists - refer to [Initializing Store state for a module](#initializing-store-state-for-a-module) section.
 - Run `ng g feature %featureName% --module %pathToModule% --reducers %pathToReducers%`
   - `%featureName%` - the name of new feature.
   - `%pathToModule%` - relative path to module where are you creating new feature (e.g.: `..\home.module.ts`).
   - `%pathToReducers%` - relative path to `index.ts` file located in `reducers` folder
   - **Note:** If CLI prompts you with question about success and failure actions - answer No (n)
 - Open module declaration file of the module, where you're creating a `feature`.
 - Remove `StoreModule.forFeature` line created by the generator. It should contain something like `for%featureName%`.
 - Remove `import` that contains something like `for%featureName%` 
 - Go through [Preparing generated actions file to use](#preparing-generated-actions-file-to-use)
   - **Note:** "generated actions file" means the actions file that was generated by executing command from previous step. It should be located in `store/actions` directory.
   - **WARNING:** Be aware, that after preparing actions file to use, generated `reducers` and `effects` files contains invalid `import` for actions which will need to be corrected before writing any `reducers` or `effects`. 
   
##### Creating new Actions file
 - Go to module where you want to create actions file.
 - Go to `store/actions` folder. If `actions` folder is not present - create one.
 - Run `ng g action %actionName%`.
   - `%actionName%` - name of the action you want to create.
 - Go through [Preparing generated actions file to use](#preparing-generated-actions-file-to-use)
   
##### Preparing generated actions file to use
The structure of action file is a bit different from what NgRX devs propose, since I (Igor Vinogradov) think that my approach is much more structurized and clean, steps below are necessary before using actions file.
 - Open the generated actions file.
 - Delete all contents (`Ctrl+A` then `Delete` or `Backspace`).
 - Do not close this file. Open `src/app/modules/shared/store/actions/example.actions.ts` file
 - Copy all the contents from `example.actions.ts` file to the file you are preparing to use.
   - `example.actions.ts` file contains rough structure of actions file that should be used in the project.
 - Delete all the comments.
 - Rename `ExampleActions`. (e.g. `UserActions`)

Actions file is ready to use.

##### Creating new Effects file
TODO

## Build

Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.

## Running unit tests

Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Running end-to-end tests

Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).