diff --git a/client/src/app/add-new-torrent/add-new-torrent.component.html b/client/src/app/add-new-torrent/add-new-torrent.component.html index 56b1c68..143f2f9 100644 --- a/client/src/app/add-new-torrent/add-new-torrent.component.html +++ b/client/src/app/add-new-torrent/add-new-torrent.component.html @@ -220,8 +220,24 @@
-
- +
+ + @if (categoryDropdownOpen && filteredCategories.length > 0) { +
+ @for (cat of filteredCategories; track $index) { + {{ cat }} + } +
+ }

The category becomes a sub-folder in your main download path.

diff --git a/client/src/app/add-new-torrent/add-new-torrent.component.scss b/client/src/app/add-new-torrent/add-new-torrent.component.scss index c7038b4..6569a7a 100644 --- a/client/src/app/add-new-torrent/add-new-torrent.component.scss +++ b/client/src/app/add-new-torrent/add-new-torrent.component.scss @@ -27,3 +27,29 @@ .separator:not(:empty)::after { margin-left: 0.25em; } + +.category-combo { + position: relative; +} + +.category-dropdown { + position: absolute; + z-index: 10; + width: 100%; + background: white; + border: 1px solid #dbdbdb; + border-top: none; + border-radius: 0 0 4px 4px; + max-height: 200px; + overflow-y: auto; +} + +.category-option { + display: block; + padding: 0.375rem 0.75rem; + color: #363636; + + &:hover { + background: #f5f5f5; + } +} diff --git a/client/src/app/add-new-torrent/add-new-torrent.component.ts b/client/src/app/add-new-torrent/add-new-torrent.component.ts index a96198c..2728321 100644 --- a/client/src/app/add-new-torrent/add-new-torrent.component.ts +++ b/client/src/app/add-new-torrent/add-new-torrent.component.ts @@ -25,6 +25,8 @@ export class AddNewTorrentComponent implements OnInit { public downloadClient: number; public category: string; + public categories: string[] = []; + public categoryDropdownOpen = false; public hostDownloadAction: number = 0; public downloadAction: number = 0; public finishedAction: number = 0; @@ -81,6 +83,18 @@ export class AddNewTorrentComponent implements OnInit { this.downloadClient = settings.find((m) => m.key === 'DownloadClient:Client')?.value as number; this.category = settings.find((m) => m.key === 'Gui:Default:Category')?.value as string; + const categoriesSetting = settings.find((m) => m.key === 'General:Categories')?.value as string; + this.categories = (categoriesSetting ?? '') + .split(',') + .map((c) => c.trim()) + .filter((c) => c.length > 0) + .filter((c, i, arr) => arr.findIndex((a) => a.toLowerCase() === c.toLowerCase()) === i); + const matchedCategory = this.categories.find( + (c) => c.toLowerCase() === (this.category ?? '').toLowerCase(), + ); + if (matchedCategory) { + this.category = matchedCategory; + } this.hostDownloadAction = this.downloadAction = settings.find((m) => m.key === 'Gui:Default:HostDownloadAction') ?.value as number; this.downloadAction = @@ -100,6 +114,21 @@ export class AddNewTorrentComponent implements OnInit { }); } + get filteredCategories(): string[] { + if (!this.category) return this.categories; + const search = this.category.toLowerCase(); + return this.categories.filter((c) => c.toLowerCase().includes(search)); + } + + public selectCategory(cat: string): void { + this.category = cat; + this.categoryDropdownOpen = false; + } + + public onCategoryBlur(): void { + setTimeout(() => (this.categoryDropdownOpen = false), 150); + } + public setFinishAction() { if (this.downloadClient === 2) { if (this.finishedAction === 1) {