refactor(favs-recent): adapt UI and routing behavior

- Introduced StalkerCollectionDetailComponent to handle detailed views for Stalker collections.
- Added XtreamCollectionDetailComponent for managing Xtream collection details.
- Updated routing components to integrate new detail components for both Stalker and Xtream.
- Enhanced global favorites and recently viewed functionalities to support new detail navigation for Stalker and Xtream items.
- Improved styling and structure for better responsiveness and user experience in detail views.

Entire-Checkpoint: c6e522b4276c

apps/web/src/app/app.routes.ts

@@ -98,8 +98,8 @@ export const routes: Routes = [
                     defaultScope: 'all',
                 },
                 loadComponent: () =>
-                    import('@iptvnator/portal/shared/ui').then(
-                        (c) => c.UnifiedCollectionPageComponent
+                    import('./global-collection-route.component').then(
+                        (c) => c.GlobalCollectionRouteComponent
                     ),
             },
             {
@@ -109,8 +109,8 @@ export const routes: Routes = [
                     defaultScope: 'all',
                 },
                 loadComponent: () =>
-                    import('@iptvnator/portal/shared/ui').then(
-                        (c) => c.UnifiedCollectionPageComponent
+                    import('./global-collection-route.component').then(
+                        (c) => c.GlobalCollectionRouteComponent
                     ),
             },
             {

apps/web/src/app/global-collection-route.component.ts

@@ -0,0 +1,40 @@
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
+import {
+    UnifiedCollectionDetailDirective,
+    UnifiedCollectionPageComponent,
+} from '@iptvnator/portal/shared/ui';
+import { CollectionScope } from '@iptvnator/portal/shared/util';
+import { StalkerCollectionDetailComponent } from '@iptvnator/portal/stalker/feature';
+import { XtreamCollectionDetailComponent } from '@iptvnator/portal/xtream/feature';
+
+@Component({
+    selector: 'app-global-collection-route',
+    imports: [
+        StalkerCollectionDetailComponent,
+        UnifiedCollectionDetailDirective,
+        UnifiedCollectionPageComponent,
+        XtreamCollectionDetailComponent,
+    ],
+    template: `
+        <app-unified-collection-page
+            [mode]="mode()"
+            [defaultScope]="defaultScope()"
+        >
+            <ng-template unifiedCollectionDetail let-item let-close="close">
+                @if (item.sourceType === 'xtream') {
+                    <app-xtream-collection-detail [item]="item" />
+                } @else if (item.sourceType === 'stalker') {
+                    <app-stalker-collection-detail
+                        [item]="item"
+                        (closeRequested)="close()"
+                    />
+                }
+            </ng-template>
+        </app-unified-collection-page>
+    `,
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class GlobalCollectionRouteComponent {
+    readonly mode = input<'favorites' | 'recent'>('favorites');
+    readonly defaultScope = input<CollectionScope | undefined>(undefined);
+}