Changeset 7899209 for src/Clients/Angular

Timestamp:

10/27/21 19:32:04 (3 years ago)

Author:

Стојков Марко <mst@…>

Branches:

dev

Children:

6b0fbbe, 79ae621

Parents:

466d1ac (diff), a3b5f34 (diff)
Note: this is a merge changeset, the changes displayed below correspond to the merge itself.
Use the (diff) links above to see all the changes relative to each parent.

Message:

Merged feature/search-questions into dev

Location:

src/Clients/Angular/finki-chattery/src

Files:

• app/core/state/question-facade.service.ts (modified) (3 diffs)
• app/core/state/question-state/question.actions.ts (modified) (4 diffs)
• app/core/state/question-state/question.effects.ts (modified) (5 diffs)
• app/core/state/question-state/question.reducers.ts (modified) (1 diff)
• app/core/state/question-state/question.selectors.ts (modified) (2 diffs)
• app/core/state/question-state/question.state.ts (modified) (3 diffs)
• app/modules/questioning/components/questioning-components.ts (modified) (1 diff)
• app/modules/questioning/components/questions-preview-general/questions-preview-general.component.html (modified) (1 diff)
• app/modules/questioning/components/questions-preview-general/questions-preview-general.component.ts (modified) (1 diff)
• app/modules/questioning/components/questions-search/questions-search.component.html (added)
• app/modules/questioning/components/questions-search/questions-search.component.scss (added)
• app/modules/questioning/components/questions-search/questions-search.component.spec.ts (added)
• app/modules/questioning/components/questions-search/questions-search.component.ts (added)
• app/modules/questioning/questioning.routes.ts (modified) (2 diffs)
• app/shared-app/components/question/search-question/search-question.component.html (modified) (1 diff)
• app/shared-app/components/question/search-question/search-question.component.ts (modified) (4 diffs)
• app/shared-app/models/question-state-view-models.models.ts (modified) (1 diff)
• assets/translations/en.json (modified) (1 diff)

src/Clients/Angular/finki-chattery/src/app/core/state/question-facade.service.ts

@@ -5 +5 @@
 import { catchError, filter, map } from 'rxjs/operators';
 
-import { PreviewQuestionsOrderEnum, PreviewQuestionViewModel, QuestionStateViewModel } from 'src/app/shared-app/models';
+import {
+  PreviewQuestionsOrderEnum,
+  PreviewQuestionViewModel,
+  QuestionStateViewModel,
+  SearchQuestionsQueryViewModel
+} from 'src/app/shared-app/models';
 import {
   EffectStartedWorking,
   GetPreviewQuestionsLatest,
   GetPreviewQuestionsPopular,
-  GetQuestionState
+  GetQuestionState,
+  GetSearchQuestions
 } from './question-state/question.actions';
 import { questionStateQuery } from './question-state/question.selectors';
@@ -43 +49 @@
   }
 
+  public getSearchQuestions(): Observable<PreviewQuestionViewModel[]> {
+    return this.store.select(questionStateQuery.getSearchQuestions);
+  }
+
+  public getSearchQuestionsQuery(): Observable<SearchQuestionsQueryViewModel> {
+    return this.store
+      .select(questionStateQuery.getSearchQuestionsQuery)
+      .pipe(filter((x: SearchQuestionsQueryViewModel | null): x is SearchQuestionsQueryViewModel => x !== null));
+  }
+
   public getPreviewQuestionsLatest(): Observable<PreviewQuestionViewModel[]> {
     return this.store.select(questionStateQuery.getPreviewQuestionsLatest);
@@ -63 +79 @@
   }
 
+  public searchQuestions(searchText: string, categories: string[]): void {
+    this.dispatchEffect(new GetSearchQuestions(searchText, categories));
+  }
+
   private fetchPreviewQuestionsLatest(): void {
     this.dispatchEffect(new GetPreviewQuestionsLatest());

src/Clients/Angular/finki-chattery/src/app/core/state/question-state/question.actions.ts

@@ -2 +2 @@
 import { Action } from '@ngrx/store';
 
-import { PreviewQuestionViewModel, QuestionStateViewModel } from 'src/app/shared-app/models';
-import { PreviewQuestionResponse } from './question-state.models';
+import { PreviewQuestionViewModel, QuestionStateViewModel, SearchQuestionsQueryViewModel } from 'src/app/shared-app/models';
 
 export enum QuestionActionTypes {
@@ -12 +11 @@
   GetPreviewQuestionsPopular = '[Question] Get preview questions Popular',
   GetPreviewQuestionsPopularSuccess = '[Question] Get preview questions Popular Success',
+  GetSearchQuestions = '[Question] Get search questions',
+  GetSearchQuestionsSuccess = '[Question] Get search questions Success',
   EffectStartedWorking = '[Question] Effect Started Working',
   EffectFinishedWorking = '[Question] Effect Finished Working',
@@ -53 +54 @@
 }
 
+export class GetSearchQuestions implements Action {
+  readonly type = QuestionActionTypes.GetSearchQuestions;
+
+  constructor(public searchText: string, public categories: string[]) {}
+}
+
+export class GetSearchQuestionsSuccess implements Action {
+  readonly type = QuestionActionTypes.GetSearchQuestionsSuccess;
+
+  constructor(public payload: PreviewQuestionViewModel[], public query: SearchQuestionsQueryViewModel) {}
+}
+
 export class EffectStartedWorking implements Action {
   readonly type = QuestionActionTypes.EffectStartedWorking;
@@ -75 +88 @@
   | GetPreviewQuestionsLatestSuccess
   | GetPreviewQuestionsPopularSuccess
+  | GetSearchQuestionsSuccess
   | EffectStartedWorking
   | EffectFinishedWorking

src/Clients/Angular/finki-chattery/src/app/core/state/question-state/question.effects.ts

@@ -1 +1 @@
 import { Injectable } from '@angular/core';
-import { Actions, createEffect, ofType } from '@ngrx/effects';
-import { catchError, filter, switchMap, withLatestFrom } from 'rxjs/operators';
-import { PreviewQuestionsOrderEnum } from 'src/app/shared-app/models';
+import { act, Actions, createEffect, ofType } from '@ngrx/effects';
+import { catchError, filter, mergeMap, switchMap, withLatestFrom } from 'rxjs/operators';
+import { PreviewQuestionsOrderEnum, SearchQuestionsQueryViewModel } from 'src/app/shared-app/models';
 import { TranslateFromJsonService } from 'src/app/shared-app/services';
 
@@ -11 +11 @@
   EffectFinishedWorking,
   EffectFinishedWorkingError,
+  GetPreviewQuestionsLatest,
   GetPreviewQuestionsLatestSuccess,
+  GetPreviewQuestionsPopular,
   GetPreviewQuestionsPopularSuccess,
   GetQuestionState,
   GetQuestionStateSuccess,
+  GetSearchQuestions,
+  GetSearchQuestionsSuccess,
   QuestionActionTypes
 } from './question.actions';
@@ -44 +48 @@
   getPreviewQuestionsLatest$ = createEffect(() => {
     return this.actions$.pipe(
-      ofType<GetQuestionState>(QuestionActionTypes.GetPreviewQuestionsLatest),
+      ofType<GetPreviewQuestionsLatest>(QuestionActionTypes.GetPreviewQuestionsLatest),
       withLatestFrom(this.facade.getPreviewQuestionsLatest()),
       filter(([action, questions]) => questions.length === 0),
@@ -61 +65 @@
   getPreviewQuestionsPopular$ = createEffect(() => {
     return this.actions$.pipe(
-      ofType<GetQuestionState>(QuestionActionTypes.GetPreviewQuestionsPopular),
+      ofType<GetPreviewQuestionsPopular>(QuestionActionTypes.GetPreviewQuestionsPopular),
       withLatestFrom(this.facade.getPreviewQuestionsPopular()),
       filter(([action, questions]) => questions.length === 0),
@@ -75 +79 @@
     );
   });
+
+  getSearchQuestions$ = createEffect(() => {
+    return this.actions$.pipe(
+      ofType<GetSearchQuestions>(QuestionActionTypes.GetSearchQuestions),
+      mergeMap((action) => {
+        const categoriesAsString = action.categories !== null ? action.categories.join(',') : '';
+        return this.api
+          .get<PreviewQuestionResponse[]>(`v1/questions/search?searchText=${action.searchText}&categories=${categoriesAsString}`)
+          .pipe(
+            switchMap((state) => [
+              new GetSearchQuestionsSuccess(
+                QuestionMapper.ToPreviwQuestionsViewModel(state, this.translate),
+                new SearchQuestionsQueryViewModel(action.searchText)
+              ),
+              new EffectFinishedWorking()
+            ]),
+            catchError((err) => [new EffectFinishedWorkingError(err)])
+          );
+      })
+    );
+  });
 }

src/Clients/Angular/finki-chattery/src/app/core/state/question-state/question.reducers.ts

@@ -18 +18 @@
         ...state,
         previewQuestionsPopular: action.payload
+      };
+    case QuestionActionTypes.GetSearchQuestionsSuccess:
+      return {
+        ...state,
+        searchQuestions: action.payload,
+        searchQuestionsQuery: action.query
       };
     case QuestionActionTypes.EffectStartedWorking: {

src/Clients/Angular/finki-chattery/src/app/core/state/question-state/question.selectors.ts

@@ -7 +7 @@
 const getPreviewQuestionsLatest = createSelector(getQuestionState, (state) => state.previewQuestionsLatest);
 const getPreviewQuestionsPopular = createSelector(getQuestionState, (state) => state.previewQuestionsPopular);
+const getSearchQuestions = createSelector(getQuestionState, (state) => state.searchQuestions);
+const getSearchQuestionsQuery = createSelector(getQuestionState, (state) => state.searchQuestionsQuery);
 const effectWorking = createSelector(getQuestionState, (state) => state.effectWorking);
 
@@ -13 +15 @@
   getQuestion,
   getPreviewQuestionsLatest,
-  getPreviewQuestionsPopular
+  getPreviewQuestionsPopular,
+  getSearchQuestions,
+  getSearchQuestionsQuery
 };

src/Clients/Angular/finki-chattery/src/app/core/state/question-state/question.state.ts

@@ -1 +1 @@
 import { HttpErrorResponse } from '@angular/common/http';
-import { PreviewQuestionViewModel, QuestionStateViewModel } from 'src/app/shared-app/models';
+import { PreviewQuestionViewModel, QuestionStateViewModel, SearchQuestionsQueryViewModel } from 'src/app/shared-app/models';
 
 export const questionStateKey = 'question';
@@ -9 +9 @@
   previewQuestionsPopular: PreviewQuestionViewModel[];
   effectWorking: boolean | HttpErrorResponse;
+  searchQuestions: PreviewQuestionViewModel[];
+  searchQuestionsQuery: SearchQuestionsQueryViewModel | null;
 }
 
@@ -15 +17 @@
   previewQuestionsLatest: [],
   previewQuestionsPopular: [],
-  effectWorking: false
+  searchQuestions: [],
+  effectWorking: false,
+  searchQuestionsQuery: null
 };

src/Clients/Angular/finki-chattery/src/app/modules/questioning/components/questioning-components.ts

@@ -2 +2 @@
 import { QuestioningGeneralComponent } from './questioning-general/questioning-general.component';
 import { QuestionsPreviewGeneralComponent } from './questions-preview-general/questions-preview-general.component';
+import { QuestionsSearchComponent } from './questions-search/questions-search.component';
 
 export const QUESTIONING_COMPONENTS: any[] = [
   QuestionPreviewGeneralComponent,
   QuestionsPreviewGeneralComponent,
-  QuestioningGeneralComponent
+  QuestioningGeneralComponent,
+  QuestionsSearchComponent
 ];

src/Clients/Angular/finki-chattery/src/app/modules/questioning/components/questions-preview-general/questions-preview-general.component.html

@@ -1 @@
-<app-search-question></app-search-question>
+<app-search-question (searched)="routeToSearch()"></app-search-question>
 <div class="margin-x-lg">
   <h1 class="mat-headline">{{ 'questions-preview' | translate }}</h1>

src/Clients/Angular/finki-chattery/src/app/modules/questioning/components/questions-preview-general/questions-preview-general.component.ts

@@ -36 +36 @@
     this.router.navigateByUrl(`questioning/${uid}`);
   }
+
+  routeToSearch(): void {
+    this.router.navigateByUrl(`questioning/search`);
+  }
 }

src/Clients/Angular/finki-chattery/src/app/modules/questioning/questioning.routes.ts

@@ -4 +4 @@
 import { QuestioningGeneralComponent } from './components/questioning-general/questioning-general.component';
 import { QuestionsPreviewGeneralComponent } from './components/questions-preview-general/questions-preview-general.component';
+import { QuestionsSearchComponent } from './components/questions-search/questions-search.component';
 
 const routes: Routes = [
@@ -14 +15 @@
         pathMatch: 'full',
         component: QuestionsPreviewGeneralComponent
+      },
+      {
+        path: 'search',
+        pathMatch: 'full',
+        component: QuestionsSearchComponent
       },
       {

src/Clients/Angular/finki-chattery/src/app/shared-app/components/question/search-question/search-question.component.html

@@ -11 +11 @@
       <mat-icon matSuffix>search</mat-icon>
     </mat-form-field>
-    <mat-form-field appearance="fill">
+    <mat-form-field class="full-width" appearance="fill">
       <mat-select
         [formControl]="questionCategoriesFormContor"

src/Clients/Angular/finki-chattery/src/app/shared-app/components/question/search-question/search-question.component.ts

@@ -1 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
 import { FormControl, Validators } from '@angular/forms';
+
 import { CategoryFacadeService } from 'src/app/core/state/category-facade.service';
-import { CategoryStateViewModel } from 'src/app/shared-app/models';
+import { QuestionFacadeService } from 'src/app/core/state/question-facade.service';
 import { ButtonType } from '../../generic/button/button.models';
 
@@ -11 +12 @@
 })
 export class SearchQuestionComponent implements OnInit {
+  @Output() searched = new EventEmitter();
+
   ButtonType = ButtonType;
   questionSearchFormContor = new FormControl('', [Validators.required, Validators.maxLength(250)]);
@@ -16 +19 @@
   categories$ = this.categoriesFacade.getCategories();
 
-  constructor(private categoriesFacade: CategoryFacadeService) {}
+  constructor(private categoriesFacade: CategoryFacadeService, private questionsFacade: QuestionFacadeService) {}
 
   ngOnInit(): void {}
@@ -27 +30 @@
 
   public searchQuestions(): void {
-    alert('SEARCH');
+    this.questionsFacade.searchQuestions(this.questionSearchFormContor.value, this.questionCategoriesFormContor.value);
+    this.searched.emit();
   }
 }

src/Clients/Angular/finki-chattery/src/app/shared-app/models/question-state-view-models.models.ts

@@ -69 +69 @@
   constructor(public uid: string, public text: string, public nameTranslated: string) {}
 }
+
+export class SearchQuestionsQueryViewModel {
+  constructor(public text: string) {}
+}

src/Clients/Angular/finki-chattery/src/assets/translations/en.json

@@ -43 +43 @@
   "questions-preview-question-subtitle": "Asked on: {{date}}",
   "questions-preview-question-answers": "Answers",
-  "questions-preview-question-views": "Views"
+  "questions-preview-question-views": "Views",
+  "questions-search-title": "Search results for: {{searchQuery}}"
 }