refactor + add demo

Author: djabif

.firebase/hosting.ZGlzdC9sZWFybi1hbmd1bGFyLWZyb20tc2NyYXRjaA.cache

@@ -0,0 +1,14 @@
+3rdpartylicenses.txt,1555615471248,719b0a21c77440404828870ded740fe783bfe01d572ab0537836971530ca8520
+favicon.ico,1555615471249,3c8f1dca744007357393e9228949f1d36e0865c21c06cb504be0fa21e397df5f
+index.html,1555615471250,d8ca1fb5df8d148b3b10de69d80d4cfa71ef6a4d26bd5e6c3809e3a8ecb4cc83
+runtime.26209474bfa8dc87a77c.js,1555615471249,52d4a5aadcedd90b5828211d17e6ec3110bac1d8d48a7e82f58b7fa8b25b5f0d
+assets/categories.json,1555615471251,7a280ddedfe61aabf0e06e1ddfa75bdb640cdf2c59ab76ef6da93ba739abe172
+polyfills.8bbb231b43165d65d357.js,1555615471249,45a04c7445707e98f5fabc690ed532fc3285d15496495ccf8f2cb4ffcdcd9014
+es2015-polyfills.c5dd28b362270c767b34.js,1555615471249,0da6ba47e82051120ed73ccd2d15c79a68e29ea675de283faf9cc4ad312c283a
+fontawesome-webfont.af7ae505a9eed503f8b8.woff2,1555615471248,156e171dae6239bcd8304d42163d8b1e6bfd029759d46be88a4e446a51249ba2
+fontawesome-webfont.fee66e712a8a08eef580.woff,1555615471248,9cb84ef5f51a04cf0dd3a9aec98c43ad4d44df442b7454c6b448913e36fb0c43
+styles.0800ae2f50afa6efad98.css,1555615471249,20f045fc96d930ea05c8dca2783905d449157df512d48d790267d75c8afe2e1f
+fontawesome-webfont.b06871f281fee6b241d6.ttf,1555615471248,225dc03087123b26cb71296d418705ec2e89e826acd04bfe6fc6353a0f5220c8
+fontawesome-webfont.674f50d287a8c48dc19b.eot,1555615471248,9acdf34fe486fad3cfa8ef4aa925ebbe9e955c8a8d127bff4d427620b0eeb643
+main.0d6768537509e6f8b04d.js,1555615471249,1c63fb00e8b095fc35f105eb814285aad245b8bec2a7091350428451bcf26126
+fontawesome-webfont.912ec66d7572ff821749.svg,1555615471249,303fc405939cc4d296906102b8047b71a4ec14a7b51aa7a2abfaad416ec8fb3c

.firebaserc

@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "tutorial": "learn-angular-from-scratch"
+  }
+}

firebase.json

@@ -0,0 +1,16 @@
+{
+  "hosting": {
+    "public": "dist/learn-angular-from-scratch",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ],
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}

src/app/categories/categories.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { CategoryModel } from "./category.model";
 
 @Component({
@@ -12,10 +12,7 @@ export class CategoriesComponent implements OnInit{
 
   categories: CategoryModel[];
 
-  constructor(
-    private router: Router,
-    private route: ActivatedRoute
-  ){}
+  constructor(private route: ActivatedRoute){}
 
   ngOnInit(): void {
     this.route.data.subscribe(routeData => {

src/app/category-questions/category-questions.component.ts

@@ -1,9 +1,9 @@
 import { Component, OnInit } from '@angular/core';
-import { Router, ActivatedRoute, Params } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { QuestionsService } from '../services/questions.service';
 import { AnswersService } from '../services/answers.service';
 import { Question } from '../../../sdk/models/Question';
-import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialog } from '@angular/material';
 import { DeleteQuestionModalComponent } from './delete-question/delete-question-modal.component';
 import { NewQuestionModalComponent } from './new-question/new-question-modal.component';
 
@@ -20,7 +20,6 @@ export class CategoryQuestionsComponent implements OnInit{
   categorySlug: any;
 
   constructor(
-    private router: Router,
     private route: ActivatedRoute,
     public questionsService: QuestionsService,
     public answersService: AnswersService,

src/app/category-questions/category-questions.resolver.ts

@@ -1,5 +1,4 @@
-
-import {forkJoin as observableForkJoin,  Observable } from 'rxjs';
+import { forkJoin as observableForkJoin } from 'rxjs';
 import { Injectable } from '@angular/core';
 import { Resolve, ActivatedRouteSnapshot } from "@angular/router";
 import { QuestionsService } from '../services/questions.service';

src/app/category-questions/delete-question/delete-question-modal.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Inject } from '@angular/core';
+import { Component, Inject } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 import { QuestionsService } from '../../services/questions.service';
 
@@ -7,6 +7,7 @@ import { QuestionsService } from '../../services/questions.service';
   templateUrl: 'delete-question-modal.component.html',
   styleUrls: ['../../styles/modals.scss']
 })
+
 export class DeleteQuestionModalComponent {
   constructor(
     public thisDialogRef: MatDialogRef<DeleteQuestionModalComponent>,

src/app/category-questions/new-question/new-question-modal.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, EventEmitter, Output, Inject} from '@angular/core';
+import { Component, OnInit, Inject} from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
 import { Validators, FormGroup, FormControl} from '@angular/forms';
 import { QuestionsService } from '../../services/questions.service';
@@ -17,8 +17,6 @@ export class NewQuestionModalComponent implements OnInit{
   questionForm: FormGroup;
 
   constructor(
-    private router: Router,
-    private route: ActivatedRoute,
     public questionsService: QuestionsService,
     private slugifyPipe: SlugifyPipe,
     public thisDialogRef: MatDialogRef<NewQuestionModalComponent>,

src/app/question-answers/delete-answer/delete-answer-modal.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Inject } from '@angular/core';
+import { Component, Inject } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 import { AnswersService } from '../../services/answers.service';
 
@@ -8,6 +8,7 @@ import { AnswersService } from '../../services/answers.service';
   styleUrls: ['../../styles/modals.scss']
 })
 export class DeleteAnswerModalComponent {
+
   constructor(
     public thisDialogRef: MatDialogRef<DeleteAnswerModalComponent>,
     @Inject(MAT_DIALOG_DATA) public modalData: any,

src/app/question-answers/new-answer/new-answer-modal.component.ts

@@ -1,5 +1,4 @@
 import { Component, OnInit, Inject } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
 import { Validators, FormGroup, FormControl} from '@angular/forms';
 import { AnswersService } from '../../services/answers.service';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
@@ -16,8 +15,6 @@ export class NewAnswerModalComponent implements OnInit{
   answerForm: FormGroup;
 
   constructor(
-    private router: Router,
-    private route: ActivatedRoute,
     public answersService: AnswersService,
     public thisDialogRef: MatDialogRef<NewAnswerModalComponent>,
     @Inject(MAT_DIALOG_DATA) public modalData: any,

src/app/question-answers/question-answers.component.ts

@@ -1,8 +1,8 @@
-import { Component, OnInit } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
+import { Component } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 import { AnswersService } from '../services/answers.service'
 import { Question } from '../../../sdk/models/Question';
-import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
+import { MatDialog } from '@angular/material';
 import { DeleteAnswerModalComponent } from './delete-answer/delete-answer-modal.component';
 import { NewAnswerModalComponent } from './new-answer/new-answer-modal.component';
 import { UpdateAnswerModalComponent } from './update-answer/update-answer-modal.component';
@@ -19,7 +19,6 @@ export class QuestionAnswersComponent {
 
   constructor(
     private answersService: AnswersService,
-    private router: Router,
     private route: ActivatedRoute,
     public dialog: MatDialog
   ){}

src/app/question-answers/question-answers.resolver.ts

@@ -2,7 +2,6 @@ import { Injectable } from '@angular/core';
 import { Resolve, ActivatedRouteSnapshot } from "@angular/router";
 import { QuestionsService } from '../services/questions.service';
 
-
 @Injectable()
 export class QuestionAnswersResolver implements Resolve<any> {
 

src/app/question-answers/update-answer/update-answer-modal.component.ts

@@ -1,8 +1,6 @@
 import { Component, OnInit, Inject } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
 import { Validators, FormGroup, FormControl} from '@angular/forms';
 import { AnswersService } from '../../services/answers.service';
-import { Answer } from '../../../../sdk';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 
 @Component({
@@ -17,8 +15,6 @@ export class UpdateAnswerModalComponent implements OnInit{
   answerForm: FormGroup;
 
   constructor(
-    private router: Router,
-    private route: ActivatedRoute,
     public answersService: AnswersService,
     public thisDialogRef: MatDialogRef<UpdateAnswerModalComponent>,
     @Inject(MAT_DIALOG_DATA) public modalData: any

src/app/services/categories.service.ts

@@ -1,6 +1,5 @@
 import { Injectable } from '@angular/core';
 import { Http } from '@angular/http';
-import { Observable } from "rxjs";
 import { CategoryModel } from "../categories/category.model";
 
 @Injectable()

src/app/shared/breadcrumb/breadcrumb.component.ts

@@ -4,10 +4,7 @@
 import {switchMap, map, filter} from 'rxjs/operators';
 import { Component, ViewEncapsulation, OnInit } from '@angular/core';
 import { Router, ActivatedRoute, NavigationEnd, Params, PRIMARY_OUTLET } from "@angular/router";
-import { Observable } from "rxjs";
-
-
-
+ 
 
 interface IBreadcrumb {
   label: string;

src/app/shared/shared.module.ts

@@ -6,7 +6,7 @@ import { RouterModule } from '@angular/router';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 import { SDKBrowserModule } from '../../../sdk/index';
-import { SlugifyPipe } from './slugify.pipe';
+import { SlugifyPipe } from '../shared/slugify.pipe';
 // Material modules
 import {
   MatDialogModule,
@@ -21,7 +21,8 @@ import { BreadcrumbComponent } from './breadcrumb/breadcrumb.component';
 
 @NgModule({
   declarations: [
-    BreadcrumbComponent
+    BreadcrumbComponent,
+    SlugifyPipe
   ],
   imports: [
     CommonModule,

src/environments/environment.prod.ts

@@ -1,3 +1,4 @@
 export const environment = {
-  production: true
+  production: true,
+  api_url: 'https://q-a-example-loopback-api.herokuapp.com'
 };