diff --git a/src/app/xtream-tauri/category-view/category-view.component.html b/src/app/xtream-tauri/category-view/category-view.component.html
new file mode 100644
index 000000000..715c95c0d
--- /dev/null
+++ b/src/app/xtream-tauri/category-view/category-view.component.html
@@ -0,0 +1,36 @@
+@let items = xtreamStore.getCategoriesBySelectedType();
+
+@if (items?.length > 0) {
+    <mat-nav-list>
+        @for (item of items; track $index) {
+            <mat-list-item
+                class="category-item"
+                [class.selected]="isSelected(item)"
+                (click)="categoryClicked.emit(item)"
+            >
+                {{
+                    item.category_name || $any(item).name || 'No category name'
+                }}
+            </mat-list-item>
+        }
+        @if (!items?.length) {
+            <app-playlist-error-view
+                title="No results"
+                [description]="
+                    'PORTALS.EMPTY_LIST_VIEW.NO_SEARCH_RESULTS' | translate
+                "
+                [showActionButtons]="false"
+                [viewType]="'NO_SEARCH_RESULTS'"
+            />
+        }
+    </mat-nav-list>
+} @else {
+    <app-playlist-error-view
+        [title]="'PORTALS.ERROR_VIEW.EMPTY_CATEGORY.TITLE' | translate"
+        [description]="
+            'PORTALS.ERROR_VIEW.EMPTY_CATEGORY.DESCRIPTION' | translate
+        "
+        [showActionButtons]="false"
+        [viewType]="'EMPTY_CATEGORY'"
+    />
+}
diff --git a/src/app/xtream-tauri/category-view/category-view.component.ts b/src/app/xtream-tauri/category-view/category-view.component.ts
index 631247b82..dcf8724b7 100644
--- a/src/app/xtream-tauri/category-view/category-view.component.ts
+++ b/src/app/xtream-tauri/category-view/category-view.component.ts
@@ -6,13 +6,11 @@ import {
     inject,
 } from '@angular/core';
 import { MatCardModule } from '@angular/material/card';
-import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { ActivatedRoute } from '@angular/router';
 import { TranslateModule } from '@ngx-translate/core';
 import { XtreamCategory } from '../../../../shared/xtream-category.interface';
-import { FilterPipe } from '../../shared/pipes/filter.pipe';
 import { PlaylistErrorViewComponent } from '../playlist-error-view/playlist-error-view.component';
 import { XtreamStore } from '../xtream.store';
 
@@ -20,63 +18,21 @@ import { XtreamStore } from '../xtream.store';
     selector: 'app-category-view',
     standalone: true,
     imports: [
-        FilterPipe,
         MatCardModule,
-        MatIconModule,
         MatListModule,
+        MatTooltipModule,
         PlaylistErrorViewComponent,
         TranslateModule,
-        MatTooltipModule,
     ],
     changeDetection: ChangeDetectionStrategy.OnPush,
-    template: `
-        @let items = xtreamStore.getCategoriesBySelectedType();
-
-        @if (items?.length > 0) {
-            <mat-nav-list>
-                @for (item of items; track $index) {
-                    <mat-list-item
-                        class="category-item"
-                        [class.selected]="isSelected(item)"
-                        (click)="categoryClicked.emit(item)"
-                    >
-                        {{
-                            item.category_name ||
-                                $any(item).name ||
-                                'No category name'
-                        }}
-                    </mat-list-item>
-                }
-                @if (!items?.length) {
-                    <app-playlist-error-view
-                        title="No results"
-                        [description]="
-                            'PORTALS.EMPTY_LIST_VIEW.NO_SEARCH_RESULTS'
-                                | translate
-                        "
-                        [showActionButtons]="false"
-                        [viewType]="'NO_SEARCH_RESULTS'"
-                    />
-                }
-            </mat-nav-list>
-        } @else {
-            <app-playlist-error-view
-                [title]="'PORTALS.ERROR_VIEW.EMPTY_CATEGORY.TITLE' | translate"
-                [description]="
-                    'PORTALS.ERROR_VIEW.EMPTY_CATEGORY.DESCRIPTION' | translate
-                "
-                [showActionButtons]="false"
-                [viewType]="'EMPTY_CATEGORY'"
-            />
-        }
-    `,
+    templateUrl: './category-view.component.html',
     styleUrl: './category-view.component.scss',
 })
 export class CategoryViewComponent {
     @Output() categoryClicked = new EventEmitter<XtreamCategory>();
 
-    xtreamStore = inject(XtreamStore);
-    route = inject(ActivatedRoute);
+    readonly xtreamStore = inject(XtreamStore);
+    private readonly route = inject(ActivatedRoute);
 
     ngOnInit(): void {
         const { categoryId } = this.route.snapshot.params;