diff --git a/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.html b/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.html index 3261558f2f..c2ff227973 100644 --- a/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.html +++ b/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.html @@ -2,7 +2,7 @@
diff --git a/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.ts b/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.ts index 73d4123d05..9f358fdf6e 100644 --- a/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.ts +++ b/packages/admin-ui/src/lib/core/src/shared/components/asset-gallery/asset-gallery.component.ts @@ -38,9 +38,9 @@ export class AssetGalleryComponent implements OnChanges { } } - toggleSelection(event: MouseEvent, asset: Asset) { + toggleSelection(asset: AssetLike, event?: MouseEvent) { const index = this.selection.findIndex(a => a.id === asset.id); - if (this.multiSelect && event.shiftKey && 1 <= this.selection.length) { + if (this.multiSelect && event?.shiftKey && 1 <= this.selection.length) { const lastSelection = this.selection[this.selection.length - 1]; const lastSelectionIndex = this.assets.findIndex(a => a.id === lastSelection.id); const currentIndex = this.assets.findIndex(a => a.id === asset.id); @@ -50,13 +50,13 @@ export class AssetGalleryComponent implements OnChanges { ...this.assets.slice(start, end).filter(a => !this.selection.find(s => s.id === a.id)), ); } else if (index === -1) { - if (this.multiSelect && (event.ctrlKey || event.shiftKey)) { + if (this.multiSelect && (event?.ctrlKey || event?.shiftKey)) { this.selection.push(asset); } else { this.selection = [asset]; } } else { - if (this.multiSelect && event.ctrlKey) { + if (this.multiSelect && event?.ctrlKey) { this.selection.splice(index, 1); } else if (1 < this.selection.length) { this.selection = [asset]; @@ -69,6 +69,11 @@ export class AssetGalleryComponent implements OnChanges { this.selectionChange.emit(this.selection); } + selectMultiple(assets: AssetLike[]) { + this.selection = assets; + this.selectionChange.emit(this.selection); + } + isSelected(asset: AssetLike): boolean { return !!this.selection.find(a => a.id === asset.id); } diff --git a/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.html b/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.html index 4fc0037d13..24ddc642b7 100644 --- a/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.html +++ b/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.html @@ -21,6 +21,7 @@ [assets]="(assets$ | async)! | paginate: paginationConfig" [multiSelect]="multiSelect" (selectionChange)="selection = $event" + #assetGalleryComponent >
diff --git a/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts b/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts index 7d1164f721..80bd71e0bb 100644 --- a/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts +++ b/packages/admin-ui/src/lib/core/src/shared/components/asset-picker-dialog/asset-picker-dialog.component.ts @@ -13,6 +13,7 @@ import { debounceTime, delay, finalize, map, take as rxjsTake, takeUntil, tap } import { Asset, + CreateAssets, GetAssetList, LogicalOperator, SortOrder, @@ -22,6 +23,7 @@ import { DataService } from '../../../data/providers/data.service'; import { QueryResult } from '../../../data/query-result'; import { Dialog } from '../../../providers/modal/modal.service'; import { NotificationService } from '../../../providers/notification/notification.service'; +import { AssetGalleryComponent } from '../asset-gallery/asset-gallery.component'; import { AssetSearchInputComponent } from '../asset-search-input/asset-search-input.component'; /** @@ -43,6 +45,8 @@ export class AssetPickerDialogComponent implements OnInit, AfterViewInit, OnDest }; @ViewChild('assetSearchInputComponent') private assetSearchInputComponent: AssetSearchInputComponent; + @ViewChild('assetGalleryComponent') + private assetGalleryComponent: AssetGalleryComponent; multiSelect = true; initialTags: string[] = []; @@ -119,6 +123,10 @@ export class AssetPickerDialogComponent implements OnInit, AfterViewInit, OnDest this.notificationService.success(_('asset.notify-create-assets-success'), { count: files.length, }); + const assets = res.createAssets.filter( + a => a.__typename === 'Asset', + ) as CreateAssets.AssetInlineFragment[]; + this.assetGalleryComponent.selectMultiple(assets); }); } }