feat(admin-ui): Link up product filters with url

admin-ui/src/app/catalog/components/asset-list/asset-list.component.scss

@@ -18,5 +18,6 @@ vdr-asset-gallery {
 }
 
 .search-input {
+    margin-top: 6px;
     min-width: 300px;
 }

admin-ui/src/app/catalog/components/product-list/product-list.component.html

@@ -1,23 +1,17 @@
 <vdr-action-bar>
-    <vdr-ab-left>
-        <form class="clr-form search-form" [formGroup]="searchForm">
-            <input
-                type="text"
-                name="searchTerm"
-                formControlName="searchTerm"
-                [placeholder]="'catalog.search-product-name-or-code' | translate"
-                class="clr-input search-input"
-            />
-            <clr-checkbox-wrapper>
-                <input
-                    type="checkbox"
-                    clrCheckbox
-                    formControlName="groupByProduct"
-                    (ngModelChange)="groupByProduct = $event"
-                />
-                <label>{{ 'catalog.group-by-product' | translate }}</label>
-            </clr-checkbox-wrapper>
-        </form>
+    <vdr-ab-left [grow]="true">
+        <div class="search-form">
+            <vdr-product-search-input
+                #productSearchInputComponent
+                [facetValueResults]="facetValues$ | async"
+                (searchTermChange)="setSearchTerm($event)"
+                (facetValueChange)="setFacetValueIds($event)"
+            ></vdr-product-search-input>
+        </div>
+        <clr-checkbox-wrapper>
+            <input type="checkbox" clrCheckbox [(ngModel)]="groupByProduct" />
+            <label>{{ 'catalog.group-by-product' | translate }}</label>
+        </clr-checkbox-wrapper>
     </vdr-ab-left>
     <vdr-ab-right>
         <a class="btn btn-primary" [routerLink]="['./create']">

admin-ui/src/app/catalog/components/product-list/product-list.component.scss

@@ -12,9 +12,8 @@
 .search-form {
     display: flex;
     align-items: center;
-    .search-input {
-        margin-right: 6px;
-    }
+    width: 100%;
+    margin-bottom: 6px;
 }
 .search-input {
     min-width: 300px;

admin-ui/src/app/catalog/components/product-list/product-list.component.ts

@@ -1,15 +1,15 @@
-import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup } from '@angular/forms';
+import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { EMPTY, Observable } from 'rxjs';
-import { debounceTime, map, switchMap, takeUntil } from 'rxjs/operators';
+import { delay, filter, map, switchMap, take, takeUntil, withLatestFrom } from 'rxjs/operators';
 
 import { BaseListComponent } from '../../../common/base-list.component';
-import { DeletionResult, GetProductList, SearchProducts } from '../../../common/generated-types';
+import { SearchInput, SearchProducts } from '../../../common/generated-types';
 import { _ } from '../../../core/providers/i18n/mark-for-extraction';
 import { NotificationService } from '../../../core/providers/notification/notification.service';
 import { DataService } from '../../../data/providers/data.service';
 import { ModalService } from '../../../shared/providers/modal/modal.service';
+import { ProductSearchInputComponent } from '../product-search-input/product-search-input.component';
 
 @Component({
     selector: 'vdr-products-list',
@@ -19,8 +19,11 @@ import { ModalService } from '../../../shared/providers/modal/modal.service';
 export class ProductListComponent
     extends BaseListComponent<SearchProducts.Query, SearchProducts.Items, SearchProducts.Variables>
     implements OnInit {
-    searchForm: FormGroup | undefined;
+    searchTerm = '';
+    facetValueIds: string[] = [];
     groupByProduct = true;
+    facetValues$: Observable<SearchProducts.FacetValues[]>;
+    @ViewChild('productSearchInputComponent') private productSearchInput: ProductSearchInputComponent;
     constructor(
         private dataService: DataService,
         private modalService: ModalService,
@@ -30,32 +33,60 @@ export class ProductListComponent
     ) {
         super(router, route);
         super.setQueryFn(
-            (...args: any[]) =>
-                this.dataService.product.searchProducts(this.getFormValue('searchTerm', ''), ...args),
+            (...args: any[]) => this.dataService.product.searchProducts(this.searchTerm, ...args),
             data => data.search,
+            // tslint:disable-next-line:no-shadowed-variable
             (skip, take) => ({
                 input: {
                     skip,
                     take,
-                    term: this.getFormValue('searchTerm', ''),
-                    groupByProduct: this.getFormValue('groupByProduct', true),
-                },
+                    term: this.searchTerm,
+                    facetIds: this.facetValueIds,
+                    groupByProduct: this.groupByProduct,
+                } as SearchInput,
             }),
         );
     }
 
     ngOnInit() {
         super.ngOnInit();
-        this.searchForm = new FormGroup({
-            searchTerm: new FormControl(''),
-            groupByProduct: new FormControl(true),
-        });
-        this.searchForm.valueChanges
+        this.facetValues$ = this.listQuery.mapStream(data => data.search.facetValues);
+        this.route.queryParamMap
             .pipe(
-                debounceTime(250),
+                map(qpm => qpm.get('q')),
                 takeUntil(this.destroy$),
             )
-            .subscribe(() => this.refresh());
+            .subscribe(term => {
+                this.productSearchInput.setSearchTerm(term);
+            });
+
+        const fvids$ = this.route.queryParamMap.pipe(map(qpm => qpm.getAll('fvids')));
+
+        fvids$.pipe(takeUntil(this.destroy$)).subscribe(ids => {
+            this.productSearchInput.setFacetValues(ids);
+        });
+
+        this.facetValues$
+            .pipe(
+                take(1),
+                delay(100),
+                withLatestFrom(fvids$),
+            )
+            .subscribe(([__, ids]) => {
+                this.productSearchInput.setFacetValues(ids);
+            });
+    }
+
+    setSearchTerm(term: string) {
+        this.searchTerm = term;
+        this.setQueryParam('q', term || null);
+        this.refresh();
+    }
+
+    setFacetValueIds(ids: string[]) {
+        this.facetValueIds = ids;
+        this.setQueryParam('fvids', ids);
+        this.refresh();
     }
 
     deleteProduct(productId: string) {
@@ -84,16 +115,4 @@ export class ProductListComponent
                 },
             );
     }
-
-    private getFormValue<T>(controlName: string, defaultValue: T): T {
-        if (!this.searchForm) {
-            return defaultValue;
-        }
-        const control = this.searchForm.get(controlName);
-        if (control) {
-            return control.value;
-        } else {
-            throw new Error(`Form does not contain a control named ${controlName}`);
-        }
-    }
 }

admin-ui/src/app/catalog/components/product-search-input/product-search-input.component.ts

@@ -1,5 +1,6 @@
 import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
 import { NgSelectComponent, SELECTION_MODEL_FACTORY } from '@ng-select/ng-select';
+import { notNullOrUndefined } from 'shared/shared-utils';
 
 import { SearchProducts } from '../../../common/generated-types';
 
@@ -17,6 +18,46 @@ export class ProductSearchInputComponent {
     @Output() searchTermChange = new EventEmitter<string>();
     @Output() facetValueChange = new EventEmitter<string[]>();
     @ViewChild('selectComponent') private selectComponent: NgSelectComponent;
+    private lastTerm = '';
+    private lastFacetValueIds: string[] = [];
+
+    setSearchTerm(term: string | null) {
+        if (term) {
+            this.selectComponent.select({ label: term, value: { label: term } });
+        } else {
+            const currentTerm = this.selectComponent.selectedItems.find(i => !this.isFacetValueItem(i.value));
+            if (currentTerm) {
+                this.selectComponent.unselect(currentTerm);
+            }
+        }
+    }
+
+    setFacetValues(ids: string[]) {
+        const items = this.selectComponent.items;
+
+        this.selectComponent.selectedItems.forEach(item => {
+            if (this.isFacetValueItem(item.value) && !ids.includes(item.value.facetValue.id)) {
+                this.selectComponent.unselect(item);
+            }
+        });
+
+        ids.map(id => {
+            return items.find(item => this.isFacetValueItem(item) && item.facetValue.id === id);
+        })
+            .filter(notNullOrUndefined)
+            .forEach(item => {
+                const isSelected = this.selectComponent.selectedItems.find(i => {
+                    const val = i.value;
+                    if (this.isFacetValueItem(val)) {
+                        return val.facetValue.id === item.facetValue.id;
+                    }
+                    return false;
+                });
+                if (!isSelected) {
+                    this.selectComponent.select({ label: '', value: item });
+                }
+            });
+    }
 
     filterFacetResults = (term: string, item: SearchProducts.FacetValues | { label: string }) => {
         if (!this.isFacetValueItem(item)) {
@@ -37,6 +78,9 @@ export class ProductSearchInputComponent {
     };
 
     onSelectChange(selectedItems: Array<SearchProducts.FacetValues | { label: string }>) {
+        if (!Array.isArray(selectedItems)) {
+            selectedItems = [selectedItems];
+        }
         const searchTermItem = selectedItems.find(item => !this.isFacetValueItem(item)) as
             | { label: string }
             | undefined;
@@ -44,8 +88,14 @@ export class ProductSearchInputComponent {
 
         const facetValueIds = selectedItems.filter(this.isFacetValueItem).map(i => i.facetValue.id);
 
-        this.searchTermChange.emit(searchTerm);
-        this.facetValueChange.emit(facetValueIds);
+        if (searchTerm !== this.lastTerm) {
+            this.searchTermChange.emit(searchTerm);
+            this.lastTerm = searchTerm;
+        }
+        if (this.lastFacetValueIds.join(',') !== facetValueIds.join(',')) {
+            this.facetValueChange.emit(facetValueIds);
+            this.lastFacetValueIds = facetValueIds;
+        }
     }
 
     isSearchHeaderSelected(): boolean {

admin-ui/src/app/common/base-list.component.ts

@@ -18,6 +18,7 @@ export class BaseListComponent<ResultType, ItemType, VariableType = any> impleme
     totalItems$: Observable<number>;
     itemsPerPage$: Observable<number>;
     currentPage$: Observable<number>;
+    protected listQuery: QueryResult<ResultType, VariableType>;
     protected destroy$ = new Subject<void>();
     private listQueryFn: ListQueryFn<ResultType>;
     private mappingFn: MappingFn<ItemType, ResultType>;
@@ -48,16 +49,16 @@ export class BaseListComponent<ResultType, ItemType, VariableType = any> impleme
                 `No listQueryFn has been defined. Please call super.setQueryFn() in the constructor.`,
             );
         }
-        const listQuery = this.listQueryFn(10, 0);
+        this.listQuery = this.listQueryFn(10, 0);
 
         const fetchPage = ([currentPage, itemsPerPage, _]: [number, number, undefined]) => {
             const take = itemsPerPage;
             const skip = (currentPage - 1) * itemsPerPage;
-            listQuery.ref.refetch(this.onPageChangeFn(skip, take));
+            this.listQuery.ref.refetch(this.onPageChangeFn(skip, take));
         };
 
-        this.items$ = listQuery.stream$.pipe(map(data => this.mappingFn(data).items));
-        this.totalItems$ = listQuery.stream$.pipe(map(data => this.mappingFn(data).totalItems));
+        this.items$ = this.listQuery.stream$.pipe(map(data => this.mappingFn(data).items));
+        this.totalItems$ = this.listQuery.stream$.pipe(map(data => this.mappingFn(data).totalItems));
         this.currentPage$ = this.route.queryParamMap.pipe(
             map(qpm => qpm.get('page')),
             map(page => (!page ? 1 : +page)),
@@ -92,7 +93,7 @@ export class BaseListComponent<ResultType, ItemType, VariableType = any> impleme
         this.refresh$.next(undefined);
     }
 
-    private setQueryParam(key: string, value: any) {
+    protected setQueryParam(key: string, value: any) {
         this.router.navigate(['./'], {
             queryParams: { [key]: value },
             relativeTo: this.route,

admin-ui/src/app/common/generated-types.ts

@@ -1412,26 +1412,26 @@ export type Mutation = {
   updateAdministrator: Administrator,
   /** Assign a Role to an Administrator */
   assignRoleToAdministrator: Administrator,
+  login: LoginResult,
+  logout: Scalars['Boolean'],
   /** Create a new Asset */
   createAssets: Array<Asset>,
   /** Create a new Channel */
   createChannel: Channel,
   /** Update an existing Channel */
   updateChannel: Channel,
-  login: LoginResult,
-  logout: Scalars['Boolean'],
-  /** Create a new Collection */
-  createCollection: Collection,
-  /** Update an existing Collection */
-  updateCollection: Collection,
-  /** Move a Collection to a different parent or index */
-  moveCollection: Collection,
   /** Create a new Country */
   createCountry: Country,
   /** Update an existing Country */
   updateCountry: Country,
   /** Delete a Country */
   deleteCountry: DeletionResponse,
+  /** Create a new Collection */
+  createCollection: Collection,
+  /** Update an existing Collection */
+  updateCollection: Collection,
+  /** Move a Collection to a different parent or index */
+  moveCollection: Collection,
   /** Create a new CustomerGroup */
   createCustomerGroup: CustomerGroup,
   /** Update an existing CustomerGroup */
@@ -1452,6 +1452,7 @@ export type Mutation = {
   updateCustomerAddress: Address,
   /** Update an existing Address */
   deleteCustomerAddress: Scalars['Boolean'],
+  updateGlobalSettings: GlobalSettings,
   /** Create a new Facet */
   createFacet: Facet,
   /** Update an existing Facet */
@@ -1464,14 +1465,21 @@ export type Mutation = {
   updateFacetValues: Array<FacetValue>,
   /** Delete one or more FacetValues */
   deleteFacetValues: Array<DeletionResponse>,
-  updateGlobalSettings: GlobalSettings,
   importProducts?: Maybe<ImportInfo>,
-  /** Update an existing PaymentMethod */
-  updatePaymentMethod: PaymentMethod,
   /** Create a new ProductOptionGroup */
   createProductOptionGroup: ProductOptionGroup,
   /** Update an existing ProductOptionGroup */
   updateProductOptionGroup: ProductOptionGroup,
+  reindex: SearchReindexResponse,
+  /** Update an existing PaymentMethod */
+  updatePaymentMethod: PaymentMethod,
+  createPromotion: Promotion,
+  updatePromotion: Promotion,
+  deletePromotion: DeletionResponse,
+  /** Create a new ShippingMethod */
+  createShippingMethod: ShippingMethod,
+  /** Update an existing ShippingMethod */
+  updateShippingMethod: ShippingMethod,
   /** Create a new Product */
   createProduct: Product,
   /** Update an existing Product */
@@ -1486,10 +1494,6 @@ export type Mutation = {
   generateVariantsForProduct: Product,
   /** Update existing ProductVariants */
   updateProductVariants: Array<Maybe<ProductVariant>>,
-  reindex: SearchReindexResponse,
-  createPromotion: Promotion,
-  updatePromotion: Promotion,
-  deletePromotion: DeletionResponse,
   /** Create a new Role */
   createRole: Role,
   /** Update an existing Role */
@@ -1498,10 +1502,6 @@ export type Mutation = {
   createTaxCategory: TaxCategory,
   /** Update an existing TaxCategory */
   updateTaxCategory: TaxCategory,
-  /** Create a new ShippingMethod */
-  createShippingMethod: ShippingMethod,
-  /** Update an existing ShippingMethod */
-  updateShippingMethod: ShippingMethod,
   /** Create a new TaxRate */
   createTaxRate: TaxRate,
   /** Update an existing TaxRate */
@@ -1540,6 +1540,13 @@ export type MutationAssignRoleToAdministratorArgs = {
 };
 
 
+export type MutationLoginArgs = {
+  username: Scalars['String'],
+  password: Scalars['String'],
+  rememberMe?: Maybe<Scalars['Boolean']>
+};
+
+
 export type MutationCreateAssetsArgs = {
   input: Array<CreateAssetInput>
 };
@@ -1555,40 +1562,33 @@ export type MutationUpdateChannelArgs = {
 };
 
 
-export type MutationLoginArgs = {
-  username: Scalars['String'],
-  password: Scalars['String'],
-  rememberMe?: Maybe<Scalars['Boolean']>
-};
-
-
-export type MutationCreateCollectionArgs = {
-  input: CreateCollectionInput
+export type MutationCreateCountryArgs = {
+  input: CreateCountryInput
 };
 
 
-export type MutationUpdateCollectionArgs = {
-  input: UpdateCollectionInput
+export type MutationUpdateCountryArgs = {
+  input: UpdateCountryInput
 };
 
 
-export type MutationMoveCollectionArgs = {
-  input: MoveCollectionInput
+export type MutationDeleteCountryArgs = {
+  id: Scalars['ID']
 };
 
 
-export type MutationCreateCountryArgs = {
-  input: CreateCountryInput
+export type MutationCreateCollectionArgs = {
+  input: CreateCollectionInput
 };
 
 
-export type MutationUpdateCountryArgs = {
-  input: UpdateCountryInput
+export type MutationUpdateCollectionArgs = {
+  input: UpdateCollectionInput
 };
 
 
-export type MutationDeleteCountryArgs = {
-  id: Scalars['ID']
+export type MutationMoveCollectionArgs = {
+  input: MoveCollectionInput
 };
 
 
@@ -1646,6 +1646,11 @@ export type MutationDeleteCustomerAddressArgs = {
 };
 
 
+export type MutationUpdateGlobalSettingsArgs = {
+  input: UpdateGlobalSettingsInput
+};
+
+
 export type MutationCreateFacetArgs = {
   input: CreateFacetInput
 };
@@ -1678,13 +1683,18 @@ export type MutationDeleteFacetValuesArgs = {
 };
 
 
-export type MutationUpdateGlobalSettingsArgs = {
-  input: UpdateGlobalSettingsInput
+export type MutationImportProductsArgs = {
+  csvFile: Scalars['Upload']
 };
 
 
-export type MutationImportProductsArgs = {
-  csvFile: Scalars['Upload']
+export type MutationCreateProductOptionGroupArgs = {
+  input: CreateProductOptionGroupInput
+};
+
+
+export type MutationUpdateProductOptionGroupArgs = {
+  input: UpdateProductOptionGroupInput
 };
 
 
@@ -1693,13 +1703,28 @@ export type MutationUpdatePaymentMethodArgs = {
 };
 
 
-export type MutationCreateProductOptionGroupArgs = {
-  input: CreateProductOptionGroupInput
+export type MutationCreatePromotionArgs = {
+  input: CreatePromotionInput
 };
 
 
-export type MutationUpdateProductOptionGroupArgs = {
-  input: UpdateProductOptionGroupInput
+export type MutationUpdatePromotionArgs = {
+  input: UpdatePromotionInput
+};
+
+
+export type MutationDeletePromotionArgs = {
+  id: Scalars['ID']
+};
+
+
+export type MutationCreateShippingMethodArgs = {
+  input: CreateShippingMethodInput
+};
+
+
+export type MutationUpdateShippingMethodArgs = {
+  input: UpdateShippingMethodInput
 };
 
 
@@ -1743,21 +1768,6 @@ export type MutationUpdateProductVariantsArgs = {
 };
 
 
-export type MutationCreatePromotionArgs = {
-  input: CreatePromotionInput
-};
-
-
-export type MutationUpdatePromotionArgs = {
-  input: UpdatePromotionInput
-};
-
-
-export type MutationDeletePromotionArgs = {
-  id: Scalars['ID']
-};
-
-
 export type MutationCreateRoleArgs = {
   input: CreateRoleInput
 };
@@ -1778,16 +1788,6 @@ export type MutationUpdateTaxCategoryArgs = {
 };
 
 
-export type MutationCreateShippingMethodArgs = {
-  input: CreateShippingMethodInput
-};
-
-
-export type MutationUpdateShippingMethodArgs = {
-  input: UpdateShippingMethodInput
-};
-
-
 export type MutationCreateTaxRateArgs = {
   input: CreateTaxRateInput
 };
@@ -2295,44 +2295,44 @@ export type PromotionSortParameter = {
 export type Query = {
   administrators: AdministratorList,
   administrator?: Maybe<Administrator>,
+  me?: Maybe<CurrentUser>,
   assets: AssetList,
   asset?: Maybe<Asset>,
   channels: Array<Channel>,
   channel?: Maybe<Channel>,
   activeChannel: Channel,
-  me?: Maybe<CurrentUser>,
+  countries: CountryList,
+  country?: Maybe<Country>,
   collections: CollectionList,
   collection?: Maybe<Collection>,
   collectionFilters: Array<ConfigurableOperation>,
-  countries: CountryList,
-  country?: Maybe<Country>,
   customerGroups: Array<CustomerGroup>,
   customerGroup?: Maybe<CustomerGroup>,
   customers: CustomerList,
   customer?: Maybe<Customer>,
+  globalSettings: GlobalSettings,
   facets: FacetList,
   facet?: Maybe<Facet>,
-  globalSettings: GlobalSettings,
   order?: Maybe<Order>,
   orders: OrderList,
-  paymentMethods: PaymentMethodList,
-  paymentMethod?: Maybe<PaymentMethod>,
   productOptionGroups: Array<ProductOptionGroup>,
   productOptionGroup?: Maybe<ProductOptionGroup>,
-  products: ProductList,
-  product?: Maybe<Product>,
   search: SearchResponse,
+  paymentMethods: PaymentMethodList,
+  paymentMethod?: Maybe<PaymentMethod>,
   promotion?: Maybe<Promotion>,
   promotions: PromotionList,
   adjustmentOperations: AdjustmentOperations,
-  roles: RoleList,
-  role?: Maybe<Role>,
-  taxCategories: Array<TaxCategory>,
-  taxCategory?: Maybe<TaxCategory>,
   shippingMethods: ShippingMethodList,
   shippingMethod?: Maybe<ShippingMethod>,
   shippingEligibilityCheckers: Array<ConfigurableOperation>,
   shippingCalculators: Array<ConfigurableOperation>,
+  products: ProductList,
+  product?: Maybe<Product>,
+  roles: RoleList,
+  role?: Maybe<Role>,
+  taxCategories: Array<TaxCategory>,
+  taxCategory?: Maybe<TaxCategory>,
   taxRates: TaxRateList,
   taxRate?: Maybe<TaxRate>,
   zones: Array<Zone>,
@@ -2369,25 +2369,25 @@ export type QueryChannelArgs = {
 };
 
 
-export type QueryCollectionsArgs = {
-  languageCode?: Maybe<LanguageCode>,
-  options?: Maybe<CollectionListOptions>
+export type QueryCountriesArgs = {
+  options?: Maybe<CountryListOptions>
 };
 
 
-export type QueryCollectionArgs = {
-  id: Scalars['ID'],
-  languageCode?: Maybe<LanguageCode>
+export type QueryCountryArgs = {
+  id: Scalars['ID']
 };
 
 
-export type QueryCountriesArgs = {
-  options?: Maybe<CountryListOptions>
+export type QueryCollectionsArgs = {
+  languageCode?: Maybe<LanguageCode>,
+  options?: Maybe<CollectionListOptions>
 };
 
 
-export type QueryCountryArgs = {
-  id: Scalars['ID']
+export type QueryCollectionArgs = {
+  id: Scalars['ID'],
+  languageCode?: Maybe<LanguageCode>
 };
 
 
@@ -2428,16 +2428,6 @@ export type QueryOrdersArgs = {
 };
 
 
-export type QueryPaymentMethodsArgs = {
-  options?: Maybe<PaymentMethodListOptions>
-};
-
-
-export type QueryPaymentMethodArgs = {
-  id: Scalars['ID']
-};
-
-
 export type QueryProductOptionGroupsArgs = {
   languageCode?: Maybe<LanguageCode>,
   filterTerm?: Maybe<Scalars['String']>
@@ -2450,20 +2440,18 @@ export type QueryProductOptionGroupArgs = {
 };
 
 
-export type QueryProductsArgs = {
-  languageCode?: Maybe<LanguageCode>,
-  options?: Maybe<ProductListOptions>
+export type QuerySearchArgs = {
+  input: SearchInput
 };
 
 
-export type QueryProductArgs = {
-  id: Scalars['ID'],
-  languageCode?: Maybe<LanguageCode>
+export type QueryPaymentMethodsArgs = {
+  options?: Maybe<PaymentMethodListOptions>
 };
 
 
-export type QuerySearchArgs = {
-  input: SearchInput
+export type QueryPaymentMethodArgs = {
+  id: Scalars['ID']
 };
 
 
@@ -2477,27 +2465,39 @@ export type QueryPromotionsArgs = {
 };
 
 
-export type QueryRolesArgs = {
-  options?: Maybe<RoleListOptions>
+export type QueryShippingMethodsArgs = {
+  options?: Maybe<ShippingMethodListOptions>
 };
 
 
-export type QueryRoleArgs = {
+export type QueryShippingMethodArgs = {
   id: Scalars['ID']
 };
 
 
-export type QueryTaxCategoryArgs = {
-  id: Scalars['ID']
+export type QueryProductsArgs = {
+  languageCode?: Maybe<LanguageCode>,
+  options?: Maybe<ProductListOptions>
 };
 
 
-export type QueryShippingMethodsArgs = {
-  options?: Maybe<ShippingMethodListOptions>
+export type QueryProductArgs = {
+  id: Scalars['ID'],
+  languageCode?: Maybe<LanguageCode>
 };
 
 
-export type QueryShippingMethodArgs = {
+export type QueryRolesArgs = {
+  options?: Maybe<RoleListOptions>
+};
+
+
+export type QueryRoleArgs = {
+  id: Scalars['ID']
+};
+
+
+export type QueryTaxCategoryArgs = {
   id: Scalars['ID']
 };
 
@@ -3407,7 +3407,7 @@ export type SearchProductsQueryVariables = {
 };
 
 
-export type SearchProductsQuery = ({ __typename?: 'Query' } & { search: ({ __typename?: 'SearchResponse' } & Pick<SearchResponse, 'totalItems'> & { items: Array<({ __typename?: 'SearchResult' } & Pick<SearchResult, 'enabled' | 'productId' | 'productName' | 'productPreview' | 'productVariantId' | 'productVariantName' | 'productVariantPreview' | 'sku'>)> }) });
+export type SearchProductsQuery = ({ __typename?: 'Query' } & { search: ({ __typename?: 'SearchResponse' } & Pick<SearchResponse, 'totalItems'> & { items: Array<({ __typename?: 'SearchResult' } & Pick<SearchResult, 'enabled' | 'productId' | 'productName' | 'productPreview' | 'productVariantId' | 'productVariantName' | 'productVariantPreview' | 'sku'>)>, facetValues: Array<({ __typename?: 'FacetValueResult' } & Pick<FacetValueResult, 'count'> & { facetValue: ({ __typename?: 'FacetValue' } & Pick<FacetValue, 'id' | 'name'> & { facet: ({ __typename?: 'Facet' } & Pick<Facet, 'id' | 'name'>) }) })> }) });
 
 export type ConfigurableOperationFragment = ({ __typename?: 'ConfigurableOperation' } & Pick<ConfigurableOperation, 'code' | 'description'> & { args: Array<({ __typename?: 'ConfigArg' } & Pick<ConfigArg, 'name' | 'type' | 'value'>)> });
 
@@ -4166,6 +4166,9 @@ export namespace SearchProducts {
   export type Query = SearchProductsQuery;
   export type Search = SearchProductsQuery['search'];
   export type Items = (NonNullable<SearchProductsQuery['search']['items'][0]>);
+  export type FacetValues = (NonNullable<SearchProductsQuery['search']['facetValues'][0]>);
+  export type FacetValue = (NonNullable<SearchProductsQuery['search']['facetValues'][0]>)['facetValue'];
+  export type Facet = (NonNullable<SearchProductsQuery['search']['facetValues'][0]>)['facetValue']['facet'];
 }
 
 export namespace ConfigurableOperation {

admin-ui/src/app/data/definitions/product-definitions.ts

@@ -305,6 +305,17 @@ export const SEARCH_PRODUCTS = gql`
                 productVariantPreview
                 sku
             }
+            facetValues {
+                count
+                facetValue {
+                    id
+                    name
+                    facet {
+                        id
+                        name
+                    }
+                }
+            }
         }
     }
 `;

admin-ui/src/app/shared/components/action-bar/action-bar.component.html

@@ -1,2 +1,2 @@
-<div class="left-content"><ng-content select="vdr-ab-left"></ng-content></div>
-<div class="right-content"><ng-content select="vdr-ab-right"></ng-content></div>
+<div class="left-content" [class.grow]="left?.grow"><ng-content select="vdr-ab-left"></ng-content></div>
+<div class="right-content" [class.grow]="right?.grow"><ng-content select="vdr-ab-right"></ng-content></div>

admin-ui/src/app/shared/components/action-bar/action-bar.component.scss

@@ -3,10 +3,14 @@
 :host {
     display: flex;
     justify-content: space-between;
-    align-items: center;
+    align-items: flex-start;
     background-color: $color-grey-100;
     position: sticky;
     top: -24px;
     z-index: 25;
     border-bottom: 1px solid $color-grey-300;
+
+    > .grow {
+        flex: 1;
+    }
 }

admin-ui/src/app/shared/components/action-bar/action-bar.component.spec.ts

@@ -1,24 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ActionBarComponent } from './action-bar.component';
-
-describe('ActionBarComponent', () => {
-    let component: ActionBarComponent;
-    let fixture: ComponentFixture<ActionBarComponent>;
-
-    beforeEach(async(() => {
-        TestBed.configureTestingModule({
-            declarations: [ActionBarComponent],
-        }).compileComponents();
-    }));
-
-    beforeEach(() => {
-        fixture = TestBed.createComponent(ActionBarComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
-
-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
-});

admin-ui/src/app/shared/components/action-bar/action-bar.component.ts

@@ -1,11 +1,4 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-    selector: 'vdr-action-bar',
-    templateUrl: './action-bar.component.html',
-    styleUrls: ['./action-bar.component.scss'],
-})
-export class ActionBarComponent {}
+import { Component, ContentChild, Input, OnInit } from '@angular/core';
 
 @Component({
     selector: 'vdr-ab-left',
@@ -13,7 +6,9 @@ export class ActionBarComponent {}
         <ng-content></ng-content>
     `,
 })
-export class ActionBarLeftComponent {}
+export class ActionBarLeftComponent {
+    @Input() grow = false;
+}
 
 @Component({
     selector: 'vdr-ab-right',
@@ -21,4 +16,16 @@ export class ActionBarLeftComponent {}
         <ng-content></ng-content>
     `,
 })
-export class ActionBarRightComponent {}
+export class ActionBarRightComponent {
+    @Input() grow = false;
+}
+
+@Component({
+    selector: 'vdr-action-bar',
+    templateUrl: './action-bar.component.html',
+    styleUrls: ['./action-bar.component.scss'],
+})
+export class ActionBarComponent {
+    @ContentChild(ActionBarLeftComponent) left: ActionBarLeftComponent;
+    @ContentChild(ActionBarRightComponent) right: ActionBarRightComponent;
+}

admin-ui/src/i18n-messages/en.json

@@ -75,6 +75,7 @@
     "public": "Public",
     "remove-asset": "Remove asset",
     "search-asset-name": "Search assets by name",
+    "search-for-term": "Search for term",
     "search-product-name-or-code": "Search by product name or code",
     "select-assets": "Select assets",
     "select-option-group": "Select option group",

packages/common/src/generated-types.ts

@@ -1411,26 +1411,26 @@ export type Mutation = {
   updateAdministrator: Administrator,
   /** Assign a Role to an Administrator */
   assignRoleToAdministrator: Administrator,
+  login: LoginResult,
+  logout: Scalars['Boolean'],
   /** Create a new Asset */
   createAssets: Array<Asset>,
   /** Create a new Channel */
   createChannel: Channel,
   /** Update an existing Channel */
   updateChannel: Channel,
-  login: LoginResult,
-  logout: Scalars['Boolean'],
-  /** Create a new Collection */
-  createCollection: Collection,
-  /** Update an existing Collection */
-  updateCollection: Collection,
-  /** Move a Collection to a different parent or index */
-  moveCollection: Collection,
   /** Create a new Country */
   createCountry: Country,
   /** Update an existing Country */
   updateCountry: Country,
   /** Delete a Country */
   deleteCountry: DeletionResponse,
+  /** Create a new Collection */
+  createCollection: Collection,
+  /** Update an existing Collection */
+  updateCollection: Collection,
+  /** Move a Collection to a different parent or index */
+  moveCollection: Collection,
   /** Create a new CustomerGroup */
   createCustomerGroup: CustomerGroup,
   /** Update an existing CustomerGroup */
@@ -1451,6 +1451,7 @@ export type Mutation = {
   updateCustomerAddress: Address,
   /** Update an existing Address */
   deleteCustomerAddress: Scalars['Boolean'],
+  updateGlobalSettings: GlobalSettings,
   /** Create a new Facet */
   createFacet: Facet,
   /** Update an existing Facet */
@@ -1463,14 +1464,21 @@ export type Mutation = {
   updateFacetValues: Array<FacetValue>,
   /** Delete one or more FacetValues */
   deleteFacetValues: Array<DeletionResponse>,
-  updateGlobalSettings: GlobalSettings,
   importProducts?: Maybe<ImportInfo>,
-  /** Update an existing PaymentMethod */
-  updatePaymentMethod: PaymentMethod,
   /** Create a new ProductOptionGroup */
   createProductOptionGroup: ProductOptionGroup,
   /** Update an existing ProductOptionGroup */
   updateProductOptionGroup: ProductOptionGroup,
+  reindex: SearchReindexResponse,
+  /** Update an existing PaymentMethod */
+  updatePaymentMethod: PaymentMethod,
+  createPromotion: Promotion,
+  updatePromotion: Promotion,
+  deletePromotion: DeletionResponse,
+  /** Create a new ShippingMethod */
+  createShippingMethod: ShippingMethod,
+  /** Update an existing ShippingMethod */
+  updateShippingMethod: ShippingMethod,
   /** Create a new Product */
   createProduct: Product,
   /** Update an existing Product */
@@ -1485,10 +1493,6 @@ export type Mutation = {
   generateVariantsForProduct: Product,
   /** Update existing ProductVariants */
   updateProductVariants: Array<Maybe<ProductVariant>>,
-  reindex: SearchReindexResponse,
-  createPromotion: Promotion,
-  updatePromotion: Promotion,
-  deletePromotion: DeletionResponse,
   /** Create a new Role */
   createRole: Role,
   /** Update an existing Role */
@@ -1497,10 +1501,6 @@ export type Mutation = {
   createTaxCategory: TaxCategory,
   /** Update an existing TaxCategory */
   updateTaxCategory: TaxCategory,
-  /** Create a new ShippingMethod */
-  createShippingMethod: ShippingMethod,
-  /** Update an existing ShippingMethod */
-  updateShippingMethod: ShippingMethod,
   /** Create a new TaxRate */
   createTaxRate: TaxRate,
   /** Update an existing TaxRate */
@@ -1534,6 +1534,13 @@ export type MutationAssignRoleToAdministratorArgs = {
 };
 
 
+export type MutationLoginArgs = {
+  username: Scalars['String'],
+  password: Scalars['String'],
+  rememberMe?: Maybe<Scalars['Boolean']>
+};
+
+
 export type MutationCreateAssetsArgs = {
   input: Array<CreateAssetInput>
 };
@@ -1549,40 +1556,33 @@ export type MutationUpdateChannelArgs = {
 };
 
 
-export type MutationLoginArgs = {
-  username: Scalars['String'],
-  password: Scalars['String'],
-  rememberMe?: Maybe<Scalars['Boolean']>
-};
-
-
-export type MutationCreateCollectionArgs = {
-  input: CreateCollectionInput
+export type MutationCreateCountryArgs = {
+  input: CreateCountryInput
 };
 
 
-export type MutationUpdateCollectionArgs = {
-  input: UpdateCollectionInput
+export type MutationUpdateCountryArgs = {
+  input: UpdateCountryInput
 };
 
 
-export type MutationMoveCollectionArgs = {
-  input: MoveCollectionInput
+export type MutationDeleteCountryArgs = {
+  id: Scalars['ID']
 };
 
 
-export type MutationCreateCountryArgs = {
-  input: CreateCountryInput
+export type MutationCreateCollectionArgs = {
+  input: CreateCollectionInput
 };
 
 
-export type MutationUpdateCountryArgs = {
-  input: UpdateCountryInput
+export type MutationUpdateCollectionArgs = {
+  input: UpdateCollectionInput
 };
 
 
-export type MutationDeleteCountryArgs = {
-  id: Scalars['ID']
+export type MutationMoveCollectionArgs = {
+  input: MoveCollectionInput
 };
 
 
@@ -1640,6 +1640,11 @@ export type MutationDeleteCustomerAddressArgs = {
 };
 
 
+export type MutationUpdateGlobalSettingsArgs = {
+  input: UpdateGlobalSettingsInput
+};
+
+
 export type MutationCreateFacetArgs = {
   input: CreateFacetInput
 };
@@ -1672,13 +1677,18 @@ export type MutationDeleteFacetValuesArgs = {
 };
 
 
-export type MutationUpdateGlobalSettingsArgs = {
-  input: UpdateGlobalSettingsInput
+export type MutationImportProductsArgs = {
+  csvFile: Scalars['Upload']
 };
 
 
-export type MutationImportProductsArgs = {
-  csvFile: Scalars['Upload']
+export type MutationCreateProductOptionGroupArgs = {
+  input: CreateProductOptionGroupInput
+};
+
+
+export type MutationUpdateProductOptionGroupArgs = {
+  input: UpdateProductOptionGroupInput
 };
 
 
@@ -1687,13 +1697,28 @@ export type MutationUpdatePaymentMethodArgs = {
 };
 
 
-export type MutationCreateProductOptionGroupArgs = {
-  input: CreateProductOptionGroupInput
+export type MutationCreatePromotionArgs = {
+  input: CreatePromotionInput
 };
 
 
-export type MutationUpdateProductOptionGroupArgs = {
-  input: UpdateProductOptionGroupInput
+export type MutationUpdatePromotionArgs = {
+  input: UpdatePromotionInput
+};
+
+
+export type MutationDeletePromotionArgs = {
+  id: Scalars['ID']
+};
+
+
+export type MutationCreateShippingMethodArgs = {
+  input: CreateShippingMethodInput
+};
+
+
+export type MutationUpdateShippingMethodArgs = {
+  input: UpdateShippingMethodInput
 };
 
 
@@ -1737,21 +1762,6 @@ export type MutationUpdateProductVariantsArgs = {
 };
 
 
-export type MutationCreatePromotionArgs = {
-  input: CreatePromotionInput
-};
-
-
-export type MutationUpdatePromotionArgs = {
-  input: UpdatePromotionInput
-};
-
-
-export type MutationDeletePromotionArgs = {
-  id: Scalars['ID']
-};
-
-
 export type MutationCreateRoleArgs = {
   input: CreateRoleInput
 };
@@ -1772,16 +1782,6 @@ export type MutationUpdateTaxCategoryArgs = {
 };
 
 
-export type MutationCreateShippingMethodArgs = {
-  input: CreateShippingMethodInput
-};
-
-
-export type MutationUpdateShippingMethodArgs = {
-  input: UpdateShippingMethodInput
-};
-
-
 export type MutationCreateTaxRateArgs = {
   input: CreateTaxRateInput
 };
@@ -2274,44 +2274,44 @@ export type PromotionSortParameter = {
 export type Query = {
   administrators: AdministratorList,
   administrator?: Maybe<Administrator>,
+  me?: Maybe<CurrentUser>,
   assets: AssetList,
   asset?: Maybe<Asset>,
   channels: Array<Channel>,
   channel?: Maybe<Channel>,
   activeChannel: Channel,
-  me?: Maybe<CurrentUser>,
+  countries: CountryList,
+  country?: Maybe<Country>,
   collections: CollectionList,
   collection?: Maybe<Collection>,
   collectionFilters: Array<ConfigurableOperation>,
-  countries: CountryList,
-  country?: Maybe<Country>,
   customerGroups: Array<CustomerGroup>,
   customerGroup?: Maybe<CustomerGroup>,
   customers: CustomerList,
   customer?: Maybe<Customer>,
+  globalSettings: GlobalSettings,
   facets: FacetList,
   facet?: Maybe<Facet>,
-  globalSettings: GlobalSettings,
   order?: Maybe<Order>,
   orders: OrderList,
-  paymentMethods: PaymentMethodList,
-  paymentMethod?: Maybe<PaymentMethod>,
   productOptionGroups: Array<ProductOptionGroup>,
   productOptionGroup?: Maybe<ProductOptionGroup>,
-  products: ProductList,
-  product?: Maybe<Product>,
   search: SearchResponse,
+  paymentMethods: PaymentMethodList,
+  paymentMethod?: Maybe<PaymentMethod>,
   promotion?: Maybe<Promotion>,
   promotions: PromotionList,
   adjustmentOperations: AdjustmentOperations,
-  roles: RoleList,
-  role?: Maybe<Role>,
-  taxCategories: Array<TaxCategory>,
-  taxCategory?: Maybe<TaxCategory>,
   shippingMethods: ShippingMethodList,
   shippingMethod?: Maybe<ShippingMethod>,
   shippingEligibilityCheckers: Array<ConfigurableOperation>,
   shippingCalculators: Array<ConfigurableOperation>,
+  products: ProductList,
+  product?: Maybe<Product>,
+  roles: RoleList,
+  role?: Maybe<Role>,
+  taxCategories: Array<TaxCategory>,
+  taxCategory?: Maybe<TaxCategory>,
   taxRates: TaxRateList,
   taxRate?: Maybe<TaxRate>,
   zones: Array<Zone>,
@@ -2345,25 +2345,25 @@ export type QueryChannelArgs = {
 };
 
 
-export type QueryCollectionsArgs = {
-  languageCode?: Maybe<LanguageCode>,
-  options?: Maybe<CollectionListOptions>
+export type QueryCountriesArgs = {
+  options?: Maybe<CountryListOptions>
 };
 
 
-export type QueryCollectionArgs = {
-  id: Scalars['ID'],
-  languageCode?: Maybe<LanguageCode>
+export type QueryCountryArgs = {
+  id: Scalars['ID']
 };
 
 
-export type QueryCountriesArgs = {
-  options?: Maybe<CountryListOptions>
+export type QueryCollectionsArgs = {
+  languageCode?: Maybe<LanguageCode>,
+  options?: Maybe<CollectionListOptions>
 };
 
 
-export type QueryCountryArgs = {
-  id: Scalars['ID']
+export type QueryCollectionArgs = {
+  id: Scalars['ID'],
+  languageCode?: Maybe<LanguageCode>
 };
 
 
@@ -2404,16 +2404,6 @@ export type QueryOrdersArgs = {
 };
 
 
-export type QueryPaymentMethodsArgs = {
-  options?: Maybe<PaymentMethodListOptions>
-};
-
-
-export type QueryPaymentMethodArgs = {
-  id: Scalars['ID']
-};
-
-
 export type QueryProductOptionGroupsArgs = {
   languageCode?: Maybe<LanguageCode>,
   filterTerm?: Maybe<Scalars['String']>
@@ -2426,20 +2416,18 @@ export type QueryProductOptionGroupArgs = {
 };
 
 
-export type QueryProductsArgs = {
-  languageCode?: Maybe<LanguageCode>,
-  options?: Maybe<ProductListOptions>
+export type QuerySearchArgs = {
+  input: SearchInput
 };
 
 
-export type QueryProductArgs = {
-  id: Scalars['ID'],
-  languageCode?: Maybe<LanguageCode>
+export type QueryPaymentMethodsArgs = {
+  options?: Maybe<PaymentMethodListOptions>
 };
 
 
-export type QuerySearchArgs = {
-  input: SearchInput
+export type QueryPaymentMethodArgs = {
+  id: Scalars['ID']
 };
 
 
@@ -2453,27 +2441,39 @@ export type QueryPromotionsArgs = {
 };
 
 
-export type QueryRolesArgs = {
-  options?: Maybe<RoleListOptions>
+export type QueryShippingMethodsArgs = {
+  options?: Maybe<ShippingMethodListOptions>
 };
 
 
-export type QueryRoleArgs = {
+export type QueryShippingMethodArgs = {
   id: Scalars['ID']
 };
 
 
-export type QueryTaxCategoryArgs = {
-  id: Scalars['ID']
+export type QueryProductsArgs = {
+  languageCode?: Maybe<LanguageCode>,
+  options?: Maybe<ProductListOptions>
 };
 
 
-export type QueryShippingMethodsArgs = {
-  options?: Maybe<ShippingMethodListOptions>
+export type QueryProductArgs = {
+  id: Scalars['ID'],
+  languageCode?: Maybe<LanguageCode>
 };
 
 
-export type QueryShippingMethodArgs = {
+export type QueryRolesArgs = {
+  options?: Maybe<RoleListOptions>
+};
+
+
+export type QueryRoleArgs = {
+  id: Scalars['ID']
+};
+
+
+export type QueryTaxCategoryArgs = {
   id: Scalars['ID']
 };
 

packages/core/e2e/graphql/generated-e2e-admin-types.ts

@@ -1408,26 +1408,26 @@ export type Mutation = {
     updateAdministrator: Administrator;
     /** Assign a Role to an Administrator */
     assignRoleToAdministrator: Administrator;
+    login: LoginResult;
+    logout: Scalars['Boolean'];
     /** Create a new Asset */
     createAssets: Array<Asset>;
     /** Create a new Channel */
     createChannel: Channel;
     /** Update an existing Channel */
     updateChannel: Channel;
-    login: LoginResult;
-    logout: Scalars['Boolean'];
-    /** Create a new Collection */
-    createCollection: Collection;
-    /** Update an existing Collection */
-    updateCollection: Collection;
-    /** Move a Collection to a different parent or index */
-    moveCollection: Collection;
     /** Create a new Country */
     createCountry: Country;
     /** Update an existing Country */
     updateCountry: Country;
     /** Delete a Country */
     deleteCountry: DeletionResponse;
+    /** Create a new Collection */
+    createCollection: Collection;
+    /** Update an existing Collection */
+    updateCollection: Collection;
+    /** Move a Collection to a different parent or index */
+    moveCollection: Collection;
     /** Create a new CustomerGroup */
     createCustomerGroup: CustomerGroup;
     /** Update an existing CustomerGroup */
@@ -1448,6 +1448,7 @@ export type Mutation = {
     updateCustomerAddress: Address;
     /** Update an existing Address */
     deleteCustomerAddress: Scalars['Boolean'];
+    updateGlobalSettings: GlobalSettings;
     /** Create a new Facet */
     createFacet: Facet;
     /** Update an existing Facet */
@@ -1460,14 +1461,21 @@ export type Mutation = {
     updateFacetValues: Array<FacetValue>;
     /** Delete one or more FacetValues */
     deleteFacetValues: Array<DeletionResponse>;
-    updateGlobalSettings: GlobalSettings;
     importProducts?: Maybe<ImportInfo>;
-    /** Update an existing PaymentMethod */
-    updatePaymentMethod: PaymentMethod;
     /** Create a new ProductOptionGroup */
     createProductOptionGroup: ProductOptionGroup;
     /** Update an existing ProductOptionGroup */
     updateProductOptionGroup: ProductOptionGroup;
+    reindex: SearchReindexResponse;
+    /** Update an existing PaymentMethod */
+    updatePaymentMethod: PaymentMethod;
+    createPromotion: Promotion;
+    updatePromotion: Promotion;
+    deletePromotion: DeletionResponse;
+    /** Create a new ShippingMethod */
+    createShippingMethod: ShippingMethod;
+    /** Update an existing ShippingMethod */
+    updateShippingMethod: ShippingMethod;
     /** Create a new Product */
     createProduct: Product;
     /** Update an existing Product */
@@ -1482,10 +1490,6 @@ export type Mutation = {
     generateVariantsForProduct: Product;
     /** Update existing ProductVariants */
     updateProductVariants: Array<Maybe<ProductVariant>>;
-    reindex: SearchReindexResponse;
-    createPromotion: Promotion;
-    updatePromotion: Promotion;
-    deletePromotion: DeletionResponse;
     /** Create a new Role */
     createRole: Role;
     /** Update an existing Role */
@@ -1494,10 +1498,6 @@ export type Mutation = {
     createTaxCategory: TaxCategory;
     /** Update an existing TaxCategory */
     updateTaxCategory: TaxCategory;
-    /** Create a new ShippingMethod */
-    createShippingMethod: ShippingMethod;
-    /** Update an existing ShippingMethod */
-    updateShippingMethod: ShippingMethod;
     /** Create a new TaxRate */
     createTaxRate: TaxRate;
     /** Update an existing TaxRate */
@@ -1527,6 +1527,12 @@ export type MutationAssignRoleToAdministratorArgs = {
     roleId: Scalars['ID'];
 };
 
+export type MutationLoginArgs = {
+    username: Scalars['String'];
+    password: Scalars['String'];
+    rememberMe?: Maybe<Scalars['Boolean']>;
+};
+
 export type MutationCreateAssetsArgs = {
     input: Array<CreateAssetInput>;
 };
@@ -1539,10 +1545,16 @@ export type MutationUpdateChannelArgs = {
     input: UpdateChannelInput;
 };
 
-export type MutationLoginArgs = {
-    username: Scalars['String'];
-    password: Scalars['String'];
-    rememberMe?: Maybe<Scalars['Boolean']>;
+export type MutationCreateCountryArgs = {
+    input: CreateCountryInput;
+};
+
+export type MutationUpdateCountryArgs = {
+    input: UpdateCountryInput;
+};
+
+export type MutationDeleteCountryArgs = {
+    id: Scalars['ID'];
 };
 
 export type MutationCreateCollectionArgs = {
@@ -1557,18 +1569,6 @@ export type MutationMoveCollectionArgs = {
     input: MoveCollectionInput;
 };
 
-export type MutationCreateCountryArgs = {
-    input: CreateCountryInput;
-};
-
-export type MutationUpdateCountryArgs = {
-    input: UpdateCountryInput;
-};
-
-export type MutationDeleteCountryArgs = {
-    id: Scalars['ID'];
-};
-
 export type MutationCreateCustomerGroupArgs = {
     input: CreateCustomerGroupInput;
 };
@@ -1613,6 +1613,10 @@ export type MutationDeleteCustomerAddressArgs = {
     id: Scalars['ID'];
 };
 
+export type MutationUpdateGlobalSettingsArgs = {
+    input: UpdateGlobalSettingsInput;
+};
+
 export type MutationCreateFacetArgs = {
     input: CreateFacetInput;
 };
@@ -1639,18 +1643,10 @@ export type MutationDeleteFacetValuesArgs = {
     force?: Maybe<Scalars['Boolean']>;
 };
 
-export type MutationUpdateGlobalSettingsArgs = {
-    input: UpdateGlobalSettingsInput;
-};
-
 export type MutationImportProductsArgs = {
     csvFile: Scalars['Upload'];
 };
 
-export type MutationUpdatePaymentMethodArgs = {
-    input: UpdatePaymentMethodInput;
-};
-
 export type MutationCreateProductOptionGroupArgs = {
     input: CreateProductOptionGroupInput;
 };
@@ -1659,6 +1655,30 @@ export type MutationUpdateProductOptionGroupArgs = {
     input: UpdateProductOptionGroupInput;
 };
 
+export type MutationUpdatePaymentMethodArgs = {
+    input: UpdatePaymentMethodInput;
+};
+
+export type MutationCreatePromotionArgs = {
+    input: CreatePromotionInput;
+};
+
+export type MutationUpdatePromotionArgs = {
+    input: UpdatePromotionInput;
+};
+
+export type MutationDeletePromotionArgs = {
+    id: Scalars['ID'];
+};
+
+export type MutationCreateShippingMethodArgs = {
+    input: CreateShippingMethodInput;
+};
+
+export type MutationUpdateShippingMethodArgs = {
+    input: UpdateShippingMethodInput;
+};
+
 export type MutationCreateProductArgs = {
     input: CreateProductInput;
 };
@@ -1692,18 +1712,6 @@ export type MutationUpdateProductVariantsArgs = {
     input: Array<UpdateProductVariantInput>;
 };
 
-export type MutationCreatePromotionArgs = {
-    input: CreatePromotionInput;
-};
-
-export type MutationUpdatePromotionArgs = {
-    input: UpdatePromotionInput;
-};
-
-export type MutationDeletePromotionArgs = {
-    id: Scalars['ID'];
-};
-
 export type MutationCreateRoleArgs = {
     input: CreateRoleInput;
 };
@@ -1720,14 +1728,6 @@ export type MutationUpdateTaxCategoryArgs = {
     input: UpdateTaxCategoryInput;
 };
 
-export type MutationCreateShippingMethodArgs = {
-    input: CreateShippingMethodInput;
-};
-
-export type MutationUpdateShippingMethodArgs = {
-    input: UpdateShippingMethodInput;
-};
-
 export type MutationCreateTaxRateArgs = {
     input: CreateTaxRateInput;
 };
@@ -2213,44 +2213,44 @@ export type PromotionSortParameter = {
 export type Query = {
     administrators: AdministratorList;
     administrator?: Maybe<Administrator>;
+    me?: Maybe<CurrentUser>;
     assets: AssetList;
     asset?: Maybe<Asset>;
     channels: Array<Channel>;
     channel?: Maybe<Channel>;
     activeChannel: Channel;
-    me?: Maybe<CurrentUser>;
+    countries: CountryList;
+    country?: Maybe<Country>;
     collections: CollectionList;
     collection?: Maybe<Collection>;
     collectionFilters: Array<ConfigurableOperation>;
-    countries: CountryList;
-    country?: Maybe<Country>;
     customerGroups: Array<CustomerGroup>;
     customerGroup?: Maybe<CustomerGroup>;
     customers: CustomerList;
     customer?: Maybe<Customer>;
+    globalSettings: GlobalSettings;
     facets: FacetList;
     facet?: Maybe<Facet>;
-    globalSettings: GlobalSettings;
     order?: Maybe<Order>;
     orders: OrderList;
-    paymentMethods: PaymentMethodList;
-    paymentMethod?: Maybe<PaymentMethod>;
     productOptionGroups: Array<ProductOptionGroup>;
     productOptionGroup?: Maybe<ProductOptionGroup>;
-    products: ProductList;
-    product?: Maybe<Product>;
     search: SearchResponse;
+    paymentMethods: PaymentMethodList;
+    paymentMethod?: Maybe<PaymentMethod>;
     promotion?: Maybe<Promotion>;
     promotions: PromotionList;
     adjustmentOperations: AdjustmentOperations;
-    roles: RoleList;
-    role?: Maybe<Role>;
-    taxCategories: Array<TaxCategory>;
-    taxCategory?: Maybe<TaxCategory>;
     shippingMethods: ShippingMethodList;
     shippingMethod?: Maybe<ShippingMethod>;
     shippingEligibilityCheckers: Array<ConfigurableOperation>;
     shippingCalculators: Array<ConfigurableOperation>;
+    products: ProductList;
+    product?: Maybe<Product>;
+    roles: RoleList;
+    role?: Maybe<Role>;
+    taxCategories: Array<TaxCategory>;
+    taxCategory?: Maybe<TaxCategory>;
     taxRates: TaxRateList;
     taxRate?: Maybe<TaxRate>;
     zones: Array<Zone>;
@@ -2278,22 +2278,22 @@ export type QueryChannelArgs = {
     id: Scalars['ID'];
 };
 
-export type QueryCollectionsArgs = {
-    languageCode?: Maybe<LanguageCode>;
-    options?: Maybe<CollectionListOptions>;
+export type QueryCountriesArgs = {
+    options?: Maybe<CountryListOptions>;
 };
 
-export type QueryCollectionArgs = {
+export type QueryCountryArgs = {
     id: Scalars['ID'];
-    languageCode?: Maybe<LanguageCode>;
 };
 
-export type QueryCountriesArgs = {
-    options?: Maybe<CountryListOptions>;
+export type QueryCollectionsArgs = {
+    languageCode?: Maybe<LanguageCode>;
+    options?: Maybe<CollectionListOptions>;
 };
 
-export type QueryCountryArgs = {
+export type QueryCollectionArgs = {
     id: Scalars['ID'];
+    languageCode?: Maybe<LanguageCode>;
 };
 
 export type QueryCustomerGroupArgs = {
@@ -2326,14 +2326,6 @@ export type QueryOrdersArgs = {
     options?: Maybe<OrderListOptions>;
 };
 
-export type QueryPaymentMethodsArgs = {
-    options?: Maybe<PaymentMethodListOptions>;
-};
-
-export type QueryPaymentMethodArgs = {
-    id: Scalars['ID'];
-};
-
 export type QueryProductOptionGroupsArgs = {
     languageCode?: Maybe<LanguageCode>;
     filterTerm?: Maybe<Scalars['String']>;
@@ -2344,18 +2336,16 @@ export type QueryProductOptionGroupArgs = {
     languageCode?: Maybe<LanguageCode>;
 };
 
-export type QueryProductsArgs = {
-    languageCode?: Maybe<LanguageCode>;
-    options?: Maybe<ProductListOptions>;
+export type QuerySearchArgs = {
+    input: SearchInput;
 };
 
-export type QueryProductArgs = {
-    id: Scalars['ID'];
-    languageCode?: Maybe<LanguageCode>;
+export type QueryPaymentMethodsArgs = {
+    options?: Maybe<PaymentMethodListOptions>;
 };
 
-export type QuerySearchArgs = {
-    input: SearchInput;
+export type QueryPaymentMethodArgs = {
+    id: Scalars['ID'];
 };
 
 export type QueryPromotionArgs = {
@@ -2366,23 +2356,33 @@ export type QueryPromotionsArgs = {
     options?: Maybe<PromotionListOptions>;
 };
 
-export type QueryRolesArgs = {
-    options?: Maybe<RoleListOptions>;
+export type QueryShippingMethodsArgs = {
+    options?: Maybe<ShippingMethodListOptions>;
 };
 
-export type QueryRoleArgs = {
+export type QueryShippingMethodArgs = {
     id: Scalars['ID'];
 };
 
-export type QueryTaxCategoryArgs = {
+export type QueryProductsArgs = {
+    languageCode?: Maybe<LanguageCode>;
+    options?: Maybe<ProductListOptions>;
+};
+
+export type QueryProductArgs = {
     id: Scalars['ID'];
+    languageCode?: Maybe<LanguageCode>;
 };
 
-export type QueryShippingMethodsArgs = {
-    options?: Maybe<ShippingMethodListOptions>;
+export type QueryRolesArgs = {
+    options?: Maybe<RoleListOptions>;
 };
 
-export type QueryShippingMethodArgs = {
+export type QueryRoleArgs = {
+    id: Scalars['ID'];
+};
+
+export type QueryTaxCategoryArgs = {
     id: Scalars['ID'];
 };