refactored code due to PR request comments:

1.renaming 
variable : enableScrollUp-showScrollButton
method : goPageTop-scrollToTop
2. hostlistener used instead of rxjs scroll evnt sub 
3.window.pageYoffet or document.scrollTop value  is used instead of cal scroll percentage.
4.space before ButtonModule

Author: DongreJaipal

angular-primeng-app/src/app/app.component.html

@@ -3,6 +3,6 @@
   <router-outlet />
 </div>
 <app-footer />
-@if (enableScrollUp) {
-<p-button class="pageUpButton" (click)="goPageTop()" icon="pi pi-angle-up" [rounded]="true" size="small"></p-button>
+@if (showScrollButton) {
+<p-button class="pageUpButton" (click)="scrollToTop()" icon="pi pi-angle-up" [rounded]="true" size="small"></p-button>
 }

angular-primeng-app/src/app/app.component.ts

@@ -1,6 +1,6 @@
-import { Component, OnInit, OnDestroy, inject, Inject } from "@angular/core";
+import { Component, OnInit, OnDestroy, inject, Inject, HostListener } from "@angular/core";
 import { RouterOutlet } from "@angular/router";
-import { Subscription, fromEvent } from "rxjs";
+import { Subscription } from "rxjs";
 import { BlogInfo } from "./models/blog-info";
 import { BlogService } from "./services/blog.service";
 import { ThemeService } from "./services/theme.service";
@@ -12,7 +12,7 @@ import { ButtonModule } from "primeng/button";
 @Component({
 	selector: "app-root",
 	standalone: true,
-	imports: [RouterOutlet, HeaderComponent, FooterComponent,ButtonModule],
+	imports: [RouterOutlet, HeaderComponent, FooterComponent, ButtonModule],
 	templateUrl: "./app.component.html",
 	styleUrl: "./app.component.scss",
 })
@@ -24,11 +24,10 @@ export class AppComponent implements OnInit, OnDestroy {
 	themeService: ThemeService = inject(ThemeService);
 	blogService: BlogService = inject(BlogService);
 	private querySubscription?: Subscription;
-	private scrollEvntSub?: Subscription;
-	enableScrollUp: boolean=false;
+	showScrollButton: boolean = false;
 	private readonly scroller = inject(ViewportScroller);
 
-	constructor(@Inject(DOCUMENT) private document: Document) {}
+	constructor(@Inject(DOCUMENT) private document: Document) { }
 
 	ngOnInit(): void {
 		this.blogURL = this.blogService.getBlogURL();
@@ -54,30 +53,23 @@ export class AppComponent implements OnInit, OnDestroy {
 					});
 				}
 			});
-
-		this.scrollEvntSub = fromEvent(this.document, 'scroll')
-			.subscribe(() => {
-				if (this.calculatePositionScroll() > 50)
-					this.enableScrollUp = true;
-				else
-					this.enableScrollUp = false;
-			})
 	}
 
-	goPageTop() {
-		this.scroller.scrollToPosition([0, 0]);
+	@HostListener('window:scroll', [])
+	onWindowScroll() {
+		const yOffset = window.pageYOffset || document.documentElement.scrollTop;
+		if (yOffset > 300) { 
+			this.showScrollButton = true;
+		} else {
+			this.showScrollButton = false;
+		}
 	}
 
-	calculatePositionScroll(): number {
-		var scrollTop = this.document.documentElement.scrollTop;
-		var docHeight = this.document.documentElement.scrollHeight;
-		var winHeight = this.document.documentElement.clientHeight;
-		var scrollPercent = (scrollTop) / (docHeight - winHeight);
-		return Math.round(scrollPercent * 100);
+	scrollToTop() {
+		this.scroller.scrollToPosition([0, 0]);
 	}
 
 	ngOnDestroy(): void {
-		this.scrollEvntSub?.unsubscribe();
 		this.querySubscription?.unsubscribe();
 	}
 }