diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.spec.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.spec.ts index 7c8dd9719..2f372eb57 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.spec.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.spec.ts @@ -95,13 +95,6 @@ describe('ProductDetailFeedbackComponent', () => { expect(component).toBeTruthy(); }); - it('should initialize feedbacks and star ratings on ngOnInit', () => { - expect( - mockProductFeedbackService.findProductFeedbackOfUser - ).toHaveBeenCalled(); - expect(mockProductStarRatingService.fetchData).toHaveBeenCalled(); - }); - it('should render ProductStarRatingPanelComponent and ProductFeedbacksPanelComponent', () => { const starRatingPanel = fixture.debugElement.query( By.directive(ProductStarRatingPanelComponent) diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.ts index 5f6c3f2dc..d86a49cf9 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-detail-feedback.component.ts @@ -31,7 +31,7 @@ const MAX_ELEMENTS = 6; templateUrl: './product-detail-feedback.component.html', styleUrls: ['./product-detail-feedback.component.scss'] }) -export class ProductDetailFeedbackComponent implements OnInit { +export class ProductDetailFeedbackComponent { isMobileMode = input(); isShowBtnMore: Signal = computed(() => { if ( @@ -46,18 +46,9 @@ export class ProductDetailFeedbackComponent implements OnInit { productFeedbackService = inject(ProductFeedbackService); appModalService = inject(AppModalService); - private readonly productStarRatingService = inject(ProductStarRatingService); - private readonly authService = inject(AuthService); - private readonly route = inject(ActivatedRoute); - private readonly router = inject(Router); showPopup!: boolean; - ngOnInit(): void { - this.productFeedbackService.findProductFeedbackOfUser(); - this.productStarRatingService.fetchData(); - } - openShowFeedbacksDialog(): void { if (this.isMobileMode()) { this.productFeedbackService.loadMoreFeedbacks(); diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.spec.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.spec.ts index 2c0103dd4..45ac6ef43 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.spec.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.spec.ts @@ -112,22 +112,4 @@ describe('ProductFeedbackService', () => { expect(service.feedbacks()).toEqual([{ content: 'Sorting test', rating: 3, productId: '123' }]); }); - - it('should find product feedback of user', () => { - const mockFeedback: Feedback = { - content: 'User feedback', - rating: 5, - productId: '123' - }; - - authService.getUserId.and.returnValue('user123'); - productDetailService.productId.and.returnValue('123'); - - service.findProductFeedbackOfUser(); - const req = httpMock.expectOne('api/feedback?productId=123&userId=user123'); - expect(req.request.method).toBe('GET'); - req.flush(mockFeedback); - - expect(service.userFeedback()).toEqual(mockFeedback); - }); }); diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.ts index 22da90117..3e4666442 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-feedback/product-feedbacks-panel/product-feedback.service.ts @@ -96,13 +96,13 @@ export class ProductFeedbackService { findProductFeedbackOfUser( productId: string = this.productDetailService.productId() - ): void { + ): Observable { const params = new HttpParams() .set('productId', productId) .set('userId', this.authService.getUserId() ?? ''); const requestURL = FEEDBACK_API_URL; - this.http + return this.http .get(requestURL, { params, context: new HttpContext().set(SkipLoading, true) @@ -120,8 +120,7 @@ export class ProductFeedbackService { this.userFeedback.set(feedback); return of(feedback); }) - ) - .subscribe(); + ); } initFeedbacks(): void { diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts index b40b2f615..bb6c4b52b 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts @@ -27,10 +27,9 @@ import { ProductFeedbackService } from './product-detail-feedback/product-feedba import { AppModalService } from '../../../shared/services/app-modal.service'; import { AuthService } from '../../../auth/auth.service'; import { ProductStarRatingNumberComponent } from './product-star-rating-number/product-star-rating-number.component'; -import { - ProductInstallationCountActionComponent -} from "./product-installation-count-action/product-installation-count-action.component"; +import { ProductInstallationCountActionComponent } from './product-installation-count-action/product-installation-count-action.component'; import { ProductTypeIconPipe } from '../../../shared/pipes/icon.pipe'; +import { ProductStarRatingService } from './product-detail-feedback/product-star-rating-panel/product-star-rating.service'; export interface DetailTab { activeClass: string; @@ -56,7 +55,7 @@ const DEFAULT_ACTIVE_TAB = 'description'; MultilingualismPipe, ProductDetailFeedbackComponent, ProductInstallationCountActionComponent, - ProductTypeIconPipe, + ProductTypeIconPipe ], providers: [ProductService, MarkdownService], templateUrl: './product-detail.component.html', @@ -70,6 +69,7 @@ export class ProductDetailComponent { languageService = inject(LanguageService); productDetailService = inject(ProductDetailService); productFeedbackService = inject(ProductFeedbackService); + productStarRatingService = inject(ProductStarRatingService); appModalService = inject(AppModalService); authService = inject(AuthService); elementRef = inject(ElementRef); @@ -119,6 +119,7 @@ export class ProductDetailComponent { this.installationCount = productDetail.installationCount; }); this.productFeedbackService.initFeedbacks(); + this.productStarRatingService.fetchData(); } const savedTab = localStorage.getItem(STORAGE_ITEM); @@ -130,13 +131,16 @@ export class ProductDetailComponent { ngAfterViewInit(): void { this.checkMediaSize(); - this.route.queryParams.subscribe(params => { - this.showPopup = params['showPopup'] === 'true'; - if (this.showPopup && this.authService.getToken()) { - this.appModalService.openAddFeedbackDialog().then( - () => this.removeQueryParam() - ); - } + this.productFeedbackService.findProductFeedbackOfUser().subscribe(() => { + this.route.queryParams.subscribe(params => { + this.showPopup = params['showPopup'] === 'true'; + if (this.showPopup && this.authService.getToken()) { + this.appModalService + .openAddFeedbackDialog() + .then(() => this.removeQueryParam()) + .catch(() => this.removeQueryParam()); + } + }); }); }