chore: add a new angular app overlay (#124)

.gitignore

@@ -44,6 +44,5 @@ testem.log
 # System Files
 .DS_Store
 Thumbs.db
-package-lock.json
 
 /src/_redirects

.prettierignore

@@ -0,0 +1,2 @@
+dist
+coverage

.vscode/settings.json

@@ -1,13 +1,6 @@
 {
-  "editor.tabSize": 2,
   "editor.formatOnSave": true,
-  "[html]": {
-    "editor.formatOnSave": false
-  },
-  "prettier.trailingComma": "all",
-  "prettier.bracketSpacing": true,
-  "prettier.singleQuote": true,
-  "prettier.disableLanguages": ["json", "html"],
-
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "prettier.useEditorConfig": true,
+  "files.insertFinalNewline": true,
+  "typescript.tsdk": "./node_modules/typescript/lib"
 }

README.md

@@ -1,38 +1,34 @@
-# voluntar-web
+# VoluntarWeb
 
-This is a companion app for [`voluntar-backend`](https://github.com/code4moldova/voluntar-backend)
+> This is a companion app for [`voluntar-backend`](https://github.com/code4moldova/voluntar-backend)
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.0.
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.1.
 
-## Get started
+## Development server
 
-Clone this repository and run `npm install` to install all needed development dependencies.
+Run `npx ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
 
-## Local Development server
-
-Run `npm run start` for a dev server. The app will automatically reload if you change any of the source files.
-
-In local development mode all requests that start with `/api` will be proxied to a deployed development backend server. See [`proxy.conf.json`](./src/proxy.conf.json) for more info. In production, `proxy.conf.json` is ignored, for more info read [Deployment instructions](#deployment-instructions)
+> In local development mode all requests that start with `/api` will be proxied to a deployed development backend server. See [`proxy.conf.json`](./src/proxy.conf.json) for more info. In production, `proxy.conf.json` is ignored, for more info read [Deployment instructions](#deployment-instructions)
 
 ## Code scaffolding
 
 Run `npx ng generate component component-name` to generate a new component. You can also use `npx ng generate directive|pipe|service|class|guard|interface|enum|module`.
 
 ## Build
 
-Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
+Run `npx 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 `npm run test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+Run `npx ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
 
 ## Running end-to-end tests
 
-Run `npm run e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+Run `npx 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).
+To get more help on the Angular CLI use `npx ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
 
 ## Deployment instructions
 

angular.json

@@ -23,9 +23,6 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.app.json",
             "aot": true,
-            "stylePreprocessorOptions": {
-              "includePaths": ["src/styles"]
-            },
             "assets": ["src/favicon.ico", "src/assets", "src/_redirects"],
             "styles": [
               "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
@@ -70,9 +67,6 @@
             "browserTarget": "client:build",
             "proxyConfig": "src/proxy.conf.json"
           },
-          "stylePreprocessorOptions": {
-            "includePaths": ["src/styles"]
-          },
           "configurations": {
             "production": {
               "browserTarget": "client:build:production"
@@ -93,9 +87,6 @@
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
             "assets": ["src/favicon.ico", "src/assets"],
-            "stylePreprocessorOptions": {
-              "includePaths": ["src/styles"]
-            },
             "styles": [
               "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.scss"
@@ -129,8 +120,5 @@
       }
     }
   },
-  "defaultProject": "client",
-  "cli": {
-    "analytics": "11bdf562-cebf-43b0-a2dd-7b241a32732a"
-  }
+  "defaultProject": "client"
 }

e2e/protractor.conf.js

@@ -2,7 +2,7 @@
 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 
-const { SpecReporter } = require("jasmine-spec-reporter");
+const { SpecReporter, StacktraceOption } = require("jasmine-spec-reporter");
 
 /**
  * @type { import("protractor").Config }
@@ -25,8 +25,12 @@ exports.config = {
     require("ts-node").register({
       project: require("path").join(__dirname, "./tsconfig.json"),
     });
-    jasmine
-      .getEnv()
-      .addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+    jasmine.getEnv().addReporter(
+      new SpecReporter({
+        spec: {
+          displayStacktrace: StacktraceOption.PRETTY,
+        },
+      })
+    );
   },
 };

e2e/tsconfig.json

@@ -1,3 +1,4 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
   "extends": "../tsconfig.json",
   "compilerOptions": {

package.json

@@ -3,8 +3,8 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --open",
-    "build": "ng build --prod",
+    "start": "ng serve",
+    "build": "ng build",
     "preci:build": "node scripts/generate-redirects.js",
     "ci:build": "ng build --prod",
     "test": "ng test",
@@ -34,22 +34,22 @@
     "@ngx-translate/http-loader": "^6.0.0",
     "esri-loader": "^2.15.0",
     "ngx-mask": "^10.0.1",
-    "rxjs": "~6.6.3",
+    "rxjs": "~6.6.0",
     "tslib": "^2.0.0",
-    "zone.js": "~0.11.1"
+    "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.1001.1",
+    "@angular-devkit/build-angular": "~0.1001.1",
     "@angular/cli": "~10.1.1",
     "@angular/compiler-cli": "~10.1.1",
     "@angular/language-service": "~10.1.1",
-    "@types/jasmine": "~3.5.14",
+    "@types/jasmine": "~3.5.0",
     "@types/jasminewd2": "~2.0.3",
-    "@types/node": "^14.10.0",
+    "@types/node": "^12.11.1",
     "bootstrap-4-grid": "^3.4.0",
     "codelyzer": "^6.0.0",
     "husky": "^4.3.0",
-    "jasmine-core": "~3.5.0",
+    "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",
     "karma": "~5.0.0",
     "karma-chrome-launcher": "~3.1.0",
@@ -59,7 +59,7 @@
     "lint-staged": "^10.3.0",
     "prettier": "^2.1.1",
     "protractor": "~7.0.0",
-    "ts-node": "~9.0.0",
+    "ts-node": "~8.3.0",
     "tslint": "~6.1.0",
     "typescript": "~4.0.2"
   },
@@ -69,6 +69,6 @@
     }
   },
   "lint-staged": {
-    "*": "prettier --write"
+    "*.{js,jsx,ts,tsx,html,md,json,css,scss}": "prettier --write"
   }
 }

src/app/app.component.spec.ts

@@ -1,14 +1,14 @@
-import { TestBed, async } from '@angular/core/testing';
+import { TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [RouterTestingModule],
       declarations: [AppComponent],
     }).compileComponents();
-  }));
+  });
 
   it('should create the app', () => {
     const fixture = TestBed.createComponent(AppComponent);

tsconfig.app.json

@@ -1,3 +1,4 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {

tsconfig.json

@@ -1,28 +1,23 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
   "compileOnSave": false,
   "compilerOptions": {
-    "baseUrl": ".",
+    "baseUrl": "./",
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
     "downlevelIteration": true,
-    "module": "es2020",
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
+    "moduleResolution": "node",
     "importHelpers": true,
     "target": "es2015",
+    "module": "es2020",
     "paths": {
       "@services/*": ["src/app/services/*"],
       "@store/*": ["src/app/root-store/*"],
       "@models/*": ["src/app/models/*"],
       "@shared/*": ["src/app/shared/*"]
     },
-    "typeRoots": ["node_modules/@types"],
     "lib": ["es2018", "dom"]
-  },
-  "angularCompilerOptions": {
-    "fullTemplateTypeCheck": true,
-    "strictInjectionParameters": true
   }
 }

tsconfig.spec.json

@@ -1,8 +1,9 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/spec",
-    "types": ["jasmine", "node"]
+    "types": ["jasmine"]
   },
   "files": ["src/test.ts", "src/polyfills.ts"],
   "include": ["src/**/*.spec.ts", "src/**/*.d.ts"]