feat: implement scrollUp utility and integrate across components

Author: emp74ark

src/app/components/article-list/article-list.ts

@@ -22,6 +22,7 @@ import { HttpErrorResponse } from '@angular/common/http'
 import { FeedService } from '../../services/feed-service'
 import { Tag } from '../../entities/tag/tag.types'
 import { PageService } from '../../services/page-service'
+import { scrollUp } from '../../../utils'
 
 @Component({
   selector: 'app-article-list',
@@ -49,11 +50,7 @@ import { PageService } from '../../services/page-service'
 export class ArticleList {
   constructor() {
     effect(() => {
-      if (!this.articles().length) {
-        return
-      }
-      const page = document.querySelector('.page-content')
-      page?.scroll({ top: 0, behavior: 'smooth' })
+      scrollUp({ trigger: !!this.articles().length })
     })
   }
   router = inject(Router)

src/app/pages/subscriptions/subscriptions-page.component.ts

@@ -1,4 +1,4 @@
-import { Component, DestroyRef, inject, OnInit, signal } from '@angular/core'
+import { Component, DestroyRef, effect, inject, OnInit, signal } from '@angular/core'
 import { MatCardModule } from '@angular/material/card'
 import { FeedService } from '../../services/feed-service'
 import { catchError, combineLatest, of, switchMap } from 'rxjs'
@@ -17,6 +17,7 @@ import { LinkTrimPipe } from '../../pipes/link-trim-pipe'
 import { Paginator } from '../../components/paginator/paginator'
 import { PageService } from '../../services/page-service'
 import { TitleService } from '../../services/title-service'
+import { scrollUp } from '../../../utils'
 
 @Component({
   selector: 'app-subscriptions',
@@ -36,6 +37,12 @@ import { TitleService } from '../../services/title-service'
   styleUrl: './subscriptions-page.component.css',
 })
 export class SubscriptionsPage implements OnInit {
+  constructor() {
+    effect(() => {
+      scrollUp({ trigger: !!this.feeds().length })
+    })
+  }
+
   feedService = inject(FeedService)
   pageService = inject(PageService)
   readonly dialog = inject(MatDialog)
@@ -74,6 +81,7 @@ export class SubscriptionsPage implements OnInit {
 
     dialogRef.afterClosed().subscribe((result) => {
       console.log('The dialog was closed', result)
+      this.pageService.setCurrentPage(1)
     })
   }
 

src/app/pages/tags/tags-page.component.ts

@@ -66,6 +66,7 @@ export class TagsPage implements OnInit {
 
     dialogRef.afterClosed().subscribe((result) => {
       console.log('The dialog was closed', result)
+      this.pageService.setCurrentPage(1)
     })
   }
 

src/utils/index.ts

@@ -0,0 +1 @@
+export { scrollUp } from './scrollUp'

src/utils/scrollUp.ts

@@ -0,0 +1,7 @@
+export function scrollUp({ trigger }: { trigger: boolean }) {
+  if (!trigger) {
+    return
+  }
+  const page = document.querySelector('.page-content')
+  page?.scroll({ top: 0, behavior: 'smooth' })
+}