@vendure/admin-ui 2.0.0-next.26 → 2.0.0-next.28

package/fesm2015/vendure-admin-ui-login.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"vendure-admin-ui-login.mjs","sources":["../../src/lib/login/src/components/login/login.component.ts","../../src/lib/login/src/components/login/login.component.html","../../src/lib/login/src/providers/login.guard.ts","../../src/lib/login/src/login.routes.ts","../../src/lib/login/src/login.module.ts","../../src/lib/login/src/public_api.ts","../../src/lib/login/src/vendure-admin-ui-login.ts"],"sourcesContent":["import { HttpClient, HttpParams } from '@angular/common/http';\nimport { Component } from '@angular/core';\nimport { Router } from '@angular/router';\nimport { ADMIN_UI_VERSION, AuthService, AUTH_REDIRECT_PARAM, getAppConfig } from '@vendure/admin-ui/core';\n\n@Component({\n    selector: 'vdr-login',\n    templateUrl: './login.component.html',\n    styleUrls: ['./login.component.scss'],\n})\nexport class LoginComponent {\n    username = '';\n    password = '';\n    rememberMe = false;\n    version = ADMIN_UI_VERSION;\n    errorMessage: string | undefined;\n    brand = getAppConfig().brand;\n    hideVendureBranding = getAppConfig().hideVendureBranding;\n    hideVersion = getAppConfig().hideVersion;\n    customImageUrl = getAppConfig().loginImageUrl;\n    imageUrl = '';\n    imageUnsplashUrl = '';\n    imageLocation = '';\n    imageCreator = '';\n    imageCreatorUrl = '';\n\n    constructor(private authService: AuthService, private router: Router, private httpClient: HttpClient) {\n        if (this.customImageUrl) {\n            this.imageUrl = this.customImageUrl;\n        } else {\n            this.loadImage();\n        }\n    }\n\n    logIn(): void {\n        this.errorMessage = undefined;\n        this.authService.logIn(this.username, this.password, this.rememberMe).subscribe(result => {\n            switch (result.__typename) {\n                case 'CurrentUser':\n                    const redirect = this.getRedirectRoute();\n                    this.router.navigateByUrl(redirect ? redirect : '/');\n                    break;\n                case 'InvalidCredentialsError':\n                case 'NativeAuthStrategyError':\n                    this.errorMessage = result.message;\n                    break;\n            }\n        });\n    }\n\n    loadImage() {\n        this.httpClient\n            .get('https://login-image.vendure.io')\n            .toPromise()\n            .then(res => {\n                this.updateImage(res);\n            });\n    }\n\n    updateImage(res: any) {\n        const user: any = (res as any).user;\n        const location: any = (res as any).location;\n\n        this.imageUrl = res.urls.regular + '?utm_source=Vendure+Login+Image&utm_medium=referral';\n        this.imageCreator = user.name;\n        this.imageLocation = location.name;\n        this.imageCreatorUrl = user.links.html + '?utm_source=Vendure+Login+Image&utm_medium=referral';\n        this.imageUnsplashUrl = res.links.html;\n    }\n\n    /**\n     * Attempts to read a redirect param from the current url and parse it into a\n     * route from which the user was redirected after a 401 error.\n     */\n    private getRedirectRoute(): string | undefined {\n        let redirectTo: string | undefined;\n        const re = new RegExp(`${AUTH_REDIRECT_PARAM}=(.*)`);\n        try {\n            const redirectToParam = window.location.search.match(re);\n            if (redirectToParam && 1 < redirectToParam.length) {\n                redirectTo = atob(decodeURIComponent(redirectToParam[1]));\n            }\n        } catch (e: any) {\n            // ignore\n        }\n        return redirectTo;\n    }\n}\n","<div class=\"login-wrapper\">\r\n    <div class=\"login-wrapper-inner\">\r\n        <div class=\"login-wrapper-image\">\r\n            <div class=\"login-wrapper-image-content\">\r\n                <div class=\"login-wrapper-image-title\">\r\n                    {{ 'common.login-image-title' | translate }}\r\n                </div>\r\n                <div class=\"login-wrapper-image-copyright\">\r\n                    <p *ngIf=\"imageCreator\" class=\"creator\">Photo by  <a [href]=\"imageCreatorUrl\" target=\"_blank\">{{ imageCreator }}</a> on <a [href]=\"imageUnsplashUrl\" target=\"_blank\">Unsplash</a></p>\r\n                    <p *ngIf=\"imageLocation\" class=\"location\">{{ imageLocation }}</p>\r\n                </div>\r\n            </div>\r\n            <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" [alt]=\"imageUrl\">\r\n        </div>\r\n        <div class=\"login-wrapper-form\">\r\n            <p class=\"login-title\">\r\n                {{ 'common.login-title' | translate }}\r\n            </p>\r\n            <form class=\"login-form\">\r\n                <div class=\"login-group\">\r\n                    <input\r\n                        class=\"username\"\r\n                        type=\"text\"\r\n                        name=\"username\"\r\n                        id=\"login_username\"\r\n                        [(ngModel)]=\"username\"\r\n                        [placeholder]=\"'common.username' | translate\"\r\n                    />\r\n                    <input\r\n                        class=\"password\"\r\n                        name=\"password\"\r\n                        type=\"password\"\r\n                        id=\"login_password\"\r\n                        [(ngModel)]=\"password\"\r\n                        [placeholder]=\"'common.password' | translate\"\r\n                    />\r\n                    <clr-alert [clrAlertType]=\"'danger'\"  [clrAlertClosable]=\"false\" [class.visible]=\"errorMessage\" class=\"login-error\">\r\n                        <clr-alert-item>\r\n                            <span class=\"alert-text\">\r\n                                {{ errorMessage }}\r\n                            </span>\r\n                        </clr-alert-item>\r\n                    </clr-alert>\r\n                    <clr-checkbox-wrapper>\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrCheckbox\r\n                            id=\"rememberme\"\r\n                            name=\"rememberme\"\r\n                            [(ngModel)]=\"rememberMe\"\r\n                        />\r\n                        <label>{{ 'common.remember-me' | translate }}</label>\r\n                    </clr-checkbox-wrapper>\r\n                    <button\r\n                        type=\"submit\"\r\n                        class=\"btn btn-primary\"\r\n                        (click)=\"logIn()\"\r\n                        [disabled]=\"!username || !password\"\r\n                    >\r\n                        {{ 'common.login' | translate }}\r\n                    </button>\r\n                </div>\r\n                <div class=\"version\">\r\n                    <span *ngIf=\"brand\">{{ brand }} <span *ngIf=\"!hideVendureBranding || !hideVersion\">-</span></span>\r\n                    <span *ngIf=\"!hideVendureBranding\">vendure</span>\r\n                    <span *ngIf=\"!hideVersion\">v{{ version }}</span>\r\n                </div>\r\n            </form>\r\n        </div>\r\n        <img class=\"login-wrapper-logo\" src=\"assets/logo-300px.png\" />\r\n    </div>\r\n</div>\r\n","import { Injectable } from '@angular/core';\r\nimport { ActivatedRouteSnapshot, CanActivate, Router } from '@angular/router';\r\nimport { AuthService } from '@vendure/admin-ui/core';\r\nimport { Observable } from 'rxjs';\r\nimport { map } from 'rxjs/operators';\r\n\r\n/**\r\n * This guard prevents loggen-in users from navigating to the login screen.\r\n */\r\n@Injectable({\r\n    providedIn: 'root',\r\n})\r\nexport class LoginGuard implements CanActivate {\r\n    constructor(private router: Router, private authService: AuthService) {}\r\n\r\n    canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {\r\n        return this.authService.checkAuthenticatedStatus().pipe(\r\n            map(authenticated => {\r\n                if (authenticated) {\r\n                    this.router.navigate(['/']);\r\n                }\r\n                return !authenticated;\r\n            }),\r\n        );\r\n    }\r\n}\r\n","import { Routes } from '@angular/router';\r\n\r\nimport { LoginComponent } from './components/login/login.component';\r\nimport { LoginGuard } from './providers/login.guard';\r\n\r\nexport const loginRoutes: Routes = [\r\n    {\r\n        path: '',\r\n        component: LoginComponent,\r\n        pathMatch: 'full',\r\n        canActivate: [LoginGuard],\r\n    },\r\n];\r\n","import { NgModule } from '@angular/core';\r\nimport { RouterModule } from '@angular/router';\r\nimport { SharedModule } from '@vendure/admin-ui/core';\r\n\r\nimport { LoginComponent } from './components/login/login.component';\r\nimport { loginRoutes } from './login.routes';\r\n\r\n@NgModule({\r\n    imports: [SharedModule, RouterModule.forChild(loginRoutes)],\r\n    exports: [],\r\n    declarations: [LoginComponent],\r\n})\r\nexport class LoginModule {}\r\n","// This file was generated by the build-public-api.ts script\nexport * from './components/login/login.component';\nexport * from './login.module';\nexport * from './login.routes';\nexport * from './providers/login.guard';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"vendure-admin-ui-login.mjs","sources":["../../src/lib/login/src/components/login/login.component.ts","../../src/lib/login/src/components/login/login.component.html","../../src/lib/login/src/providers/login.guard.ts","../../src/lib/login/src/login.routes.ts","../../src/lib/login/src/login.module.ts","../../src/lib/login/src/public_api.ts","../../src/lib/login/src/vendure-admin-ui-login.ts"],"sourcesContent":["import { HttpClient, HttpParams } from '@angular/common/http';\r\nimport { Component } from '@angular/core';\r\nimport { Router } from '@angular/router';\r\nimport { ADMIN_UI_VERSION, AuthService, AUTH_REDIRECT_PARAM, getAppConfig } from '@vendure/admin-ui/core';\r\n\r\n@Component({\r\n    selector: 'vdr-login',\r\n    templateUrl: './login.component.html',\r\n    styleUrls: ['./login.component.scss'],\r\n})\r\nexport class LoginComponent {\r\n    username = '';\r\n    password = '';\r\n    rememberMe = false;\r\n    version = ADMIN_UI_VERSION;\r\n    errorMessage: string | undefined;\r\n    brand = getAppConfig().brand;\r\n    hideVendureBranding = getAppConfig().hideVendureBranding;\r\n    hideVersion = getAppConfig().hideVersion;\r\n    customImageUrl = getAppConfig().loginImageUrl;\r\n    imageUrl = '';\r\n    imageUnsplashUrl = '';\r\n    imageLocation = '';\r\n    imageCreator = '';\r\n    imageCreatorUrl = '';\r\n\r\n    constructor(private authService: AuthService, private router: Router, private httpClient: HttpClient) {\r\n        if (this.customImageUrl) {\r\n            this.imageUrl = this.customImageUrl;\r\n        } else {\r\n            this.loadImage();\r\n        }\r\n    }\r\n\r\n    logIn(): void {\r\n        this.errorMessage = undefined;\r\n        this.authService.logIn(this.username, this.password, this.rememberMe).subscribe(result => {\r\n            switch (result.__typename) {\r\n                case 'CurrentUser':\r\n                    const redirect = this.getRedirectRoute();\r\n                    this.router.navigateByUrl(redirect ? redirect : '/');\r\n                    break;\r\n                case 'InvalidCredentialsError':\r\n                case 'NativeAuthStrategyError':\r\n                    this.errorMessage = result.message;\r\n                    break;\r\n            }\r\n        });\r\n    }\r\n\r\n    loadImage() {\r\n        this.httpClient\r\n            .get('https://login-image.vendure.io')\r\n            .toPromise()\r\n            .then(res => {\r\n                this.updateImage(res);\r\n            });\r\n    }\r\n\r\n    updateImage(res: any) {\r\n        const user: any = (res as any).user;\r\n        const location: any = (res as any).location;\r\n\r\n        this.imageUrl = res.urls.regular + '?utm_source=Vendure+Login+Image&utm_medium=referral';\r\n        this.imageCreator = user.name;\r\n        this.imageLocation = location.name;\r\n        this.imageCreatorUrl = user.links.html + '?utm_source=Vendure+Login+Image&utm_medium=referral';\r\n        this.imageUnsplashUrl = res.links.html;\r\n    }\r\n\r\n    /**\r\n     * Attempts to read a redirect param from the current url and parse it into a\r\n     * route from which the user was redirected after a 401 error.\r\n     */\r\n    private getRedirectRoute(): string | undefined {\r\n        let redirectTo: string | undefined;\r\n        const re = new RegExp(`${AUTH_REDIRECT_PARAM}=(.*)`);\r\n        try {\r\n            const redirectToParam = window.location.search.match(re);\r\n            if (redirectToParam && 1 < redirectToParam.length) {\r\n                redirectTo = atob(decodeURIComponent(redirectToParam[1]));\r\n            }\r\n        } catch (e: any) {\r\n            // ignore\r\n        }\r\n        return redirectTo;\r\n    }\r\n}\r\n","<div class=\"login-wrapper\">\r\n    <div class=\"login-wrapper-inner\">\r\n        <div class=\"login-wrapper-image\">\r\n            <div class=\"login-wrapper-image-content\">\r\n                <div class=\"login-wrapper-image-title\">\r\n                    {{ 'common.login-image-title' | translate }}\r\n                </div>\r\n                <div class=\"login-wrapper-image-copyright\">\r\n                    <p *ngIf=\"imageCreator\" class=\"creator\">Photo by  <a [href]=\"imageCreatorUrl\" target=\"_blank\">{{ imageCreator }}</a> on <a [href]=\"imageUnsplashUrl\" target=\"_blank\">Unsplash</a></p>\r\n                    <p *ngIf=\"imageLocation\" class=\"location\">{{ imageLocation }}</p>\r\n                </div>\r\n            </div>\r\n            <img *ngIf=\"imageUrl\" [src]=\"imageUrl\" [alt]=\"imageUrl\">\r\n        </div>\r\n        <div class=\"login-wrapper-form\">\r\n            <p class=\"login-title\">\r\n                {{ 'common.login-title' | translate }}\r\n            </p>\r\n            <form class=\"login-form\">\r\n                <div class=\"login-group\">\r\n                    <input\r\n                        class=\"username\"\r\n                        type=\"text\"\r\n                        name=\"username\"\r\n                        id=\"login_username\"\r\n                        [(ngModel)]=\"username\"\r\n                        [placeholder]=\"'common.username' | translate\"\r\n                    />\r\n                    <input\r\n                        class=\"password\"\r\n                        name=\"password\"\r\n                        type=\"password\"\r\n                        id=\"login_password\"\r\n                        [(ngModel)]=\"password\"\r\n                        [placeholder]=\"'common.password' | translate\"\r\n                    />\r\n                    <clr-alert [clrAlertType]=\"'danger'\"  [clrAlertClosable]=\"false\" [class.visible]=\"errorMessage\" class=\"login-error\">\r\n                        <clr-alert-item>\r\n                            <span class=\"alert-text\">\r\n                                {{ errorMessage }}\r\n                            </span>\r\n                        </clr-alert-item>\r\n                    </clr-alert>\r\n                    <clr-checkbox-wrapper>\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrCheckbox\r\n                            id=\"rememberme\"\r\n                            name=\"rememberme\"\r\n                            [(ngModel)]=\"rememberMe\"\r\n                        />\r\n                        <label>{{ 'common.remember-me' | translate }}</label>\r\n                    </clr-checkbox-wrapper>\r\n                    <button\r\n                        type=\"submit\"\r\n                        class=\"btn btn-primary\"\r\n                        (click)=\"logIn()\"\r\n                        [disabled]=\"!username || !password\"\r\n                    >\r\n                        {{ 'common.login' | translate }}\r\n                    </button>\r\n                </div>\r\n                <div class=\"version\">\r\n                    <span *ngIf=\"brand\">{{ brand }} <span *ngIf=\"!hideVendureBranding || !hideVersion\">-</span></span>\r\n                    <span *ngIf=\"!hideVendureBranding\">vendure</span>\r\n                    <span *ngIf=\"!hideVersion\">v{{ version }}</span>\r\n                </div>\r\n            </form>\r\n        </div>\r\n        <img class=\"login-wrapper-logo\" src=\"assets/logo-300px.png\" />\r\n    </div>\r\n</div>\r\n","import { Injectable } from '@angular/core';\r\nimport { ActivatedRouteSnapshot, CanActivate, Router } from '@angular/router';\r\nimport { AuthService } from '@vendure/admin-ui/core';\r\nimport { Observable } from 'rxjs';\r\nimport { map } from 'rxjs/operators';\r\n\r\n/**\r\n * This guard prevents loggen-in users from navigating to the login screen.\r\n */\r\n@Injectable({\r\n    providedIn: 'root',\r\n})\r\nexport class LoginGuard implements CanActivate {\r\n    constructor(private router: Router, private authService: AuthService) {}\r\n\r\n    canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {\r\n        return this.authService.checkAuthenticatedStatus().pipe(\r\n            map(authenticated => {\r\n                if (authenticated) {\r\n                    this.router.navigate(['/']);\r\n                }\r\n                return !authenticated;\r\n            }),\r\n        );\r\n    }\r\n}\r\n","import { Routes } from '@angular/router';\r\n\r\nimport { LoginComponent } from './components/login/login.component';\r\nimport { LoginGuard } from './providers/login.guard';\r\n\r\nexport const loginRoutes: Routes = [\r\n    {\r\n        path: '',\r\n        component: LoginComponent,\r\n        pathMatch: 'full',\r\n        canActivate: [LoginGuard],\r\n    },\r\n];\r\n","import { NgModule } from '@angular/core';\r\nimport { RouterModule } from '@angular/router';\r\nimport { SharedModule } from '@vendure/admin-ui/core';\r\n\r\nimport { LoginComponent } from './components/login/login.component';\r\nimport { loginRoutes } from './login.routes';\r\n\r\n@NgModule({\r\n    imports: [SharedModule, RouterModule.forChild(loginRoutes)],\r\n    exports: [],\r\n    declarations: [LoginComponent],\r\n})\r\nexport class LoginModule {}\r\n","// This file was generated by the build-public-api.ts script\nexport * from './components/login/login.component';\nexport * from './login.module';\nexport * from './login.routes';\nexport * from './providers/login.guard';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2015/vendure-admin-ui-order.mjs

@@ -3,7 +3,7 @@ import { Component, ChangeDetectionStrategy, EventEmitter, Input, Output, Inject
 import * as i3$1 from '@angular/forms';
 import { FormGroup, FormControl, Validators, FormArray } from '@angular/forms';
 import * as i1 from '@vendure/admin-ui/core';
-import { getAppConfig, ADDRESS_FRAGMENT, HistoryEntryType, SortOrder, AdjustmentType, BaseDetailComponent, DeletionResult, configurableDefinitionToInstance, GlobalFlag, configurableOperationValueIsValid, toConfigurableOperationInput, EditNoteDialogComponent, transformRelationCustomFieldInputs, BaseListComponent, LogicalOperator, CanDeactivateDetailGuard, detailBreadcrumb, SharedModule } from '@vendure/admin-ui/core';
+import { getAppConfig, ADDRESS_FRAGMENT, HistoryEntryType, SortOrder, AdjustmentType, BaseDetailComponent, DeletionResult, configurableDefinitionToInstance, GlobalFlag, configurableOperationValueIsValid, toConfigurableOperationInput, EditNoteDialogComponent, transformRelationCustomFieldInputs, BaseListComponent, LogicalOperator, OrderType, CanDeactivateDetailGuard, SharedModule } from '@vendure/admin-ui/core';
 import * as i3 from '@ng-select/ng-select';
 import * as i4 from '@ngx-translate/core';
 import * as i4$1 from '@angular/common';
@@ -17,6 +17,7 @@ import * as i1$1 from '@angular/router';
 import { ActivationStart, RouterModule } from '@angular/router';
 import * as i3$3 from '@angular/cdk/bidi';
 import { isObject, summate, assertNever, notNullOrUndefined } from '@vendure/common/lib/shared-utils';
+import { DEFAULT_CHANNEL_CODE } from '@vendure/common/lib/shared-constants';
 import { simpleDeepClone } from '@vendure/common/lib/simple-deep-clone';
 
 class AddManualPaymentDialogComponent {
@@ -1473,6 +1474,60 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
             args: [{ selector: 'vdr-settle-refund-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template vdrDialogTitle>{{ 'order.settle-refund' | translate }}</ng-template>\r\n<p class=\"instruction\">\r\n    {{ 'order.settle-refund-manual-instructions' | translate: { method: refund.method } }}\r\n</p>\r\n<clr-input-container>\r\n    <label>{{ 'order.transaction-id' | translate }}</label>\r\n    <input clrInput name=\"transactionId\" [(ngModel)]=\"transactionId\" />\r\n</clr-input-container>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button type=\"submit\" (click)=\"submit()\" [disabled]=\"!transactionId\" class=\"btn btn-primary\">\r\n        {{ 'order.settle-refund' | translate }}\r\n    </button>\r\n</ng-template>\r\n", styles: [":host{padding-bottom:32px}.instruction{margin-top:0;margin-bottom:24px}\n"] }]
         }] });
 
+const GET_SELLER_ORDERS = gql `
+    query GetSellerOrders($orderId: ID!) {
+        order(id: $orderId) {
+            id
+            sellerOrders {
+                id
+                code
+                state
+                orderPlacedAt
+                currencyCode
+                totalWithTax
+                channels {
+                    id
+                    code
+                    seller {
+                        id
+                        name
+                    }
+                }
+            }
+        }
+    }
+`;
+
+class SellerOrdersCardComponent {
+    constructor(router, dataService, channelService) {
+        this.router = router;
+        this.dataService = dataService;
+        this.channelService = channelService;
+    }
+    ngOnInit() {
+        this.sellerOrders$ = this.dataService
+            .query(GET_SELLER_ORDERS, {
+            orderId: this.orderId,
+        })
+            .mapSingle(({ order }) => { var _a; return (_a = order === null || order === void 0 ? void 0 : order.sellerOrders) !== null && _a !== void 0 ? _a : []; });
+    }
+    getSeller(order) {
+        const sellerChannel = order.channels.find(channel => channel.code !== DEFAULT_CHANNEL_CODE);
+        return sellerChannel === null || sellerChannel === void 0 ? void 0 : sellerChannel.seller;
+    }
+    navigateToSellerOrder(order) {
+        this.router.navigate(['/orders', order.id]);
+    }
+}
+SellerOrdersCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: SellerOrdersCardComponent, deps: [{ token: i1$1.Router }, { token: i1.DataService }, { token: i1.ChannelService }], target: i0.ɵɵFactoryTarget.Component });
+SellerOrdersCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: SellerOrdersCardComponent, selector: "vdr-seller-orders-card", inputs: { orderId: "orderId" }, ngImport: i0, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.seller-orders' | translate }}\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\" *ngFor=\"let order of sellerOrders$ | async\">\r\n\r\n        <vdr-labeled-data [label]=\"'common.code' | translate\">\r\n            <a  [routerLink]=\"['seller-orders', order.id]\">{{ order.code }}</a>\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data *ngIf=\"getSeller(order) as seller\" [label]=\"'common.seller' | translate\">\r\n            {{ seller.name }}\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data *ngIf=\"getSeller(order) as seller\" [label]=\"'order.total' | translate\">\r\n            {{ order.totalWithTax | localeCurrency:order.currencyCode }}\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data [label]=\"'order.state' | translate\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </vdr-labeled-data>\r\n    </div>\r\n</div>\r\n", styles: [""], components: [{ type: i1.LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }], directives: [{ type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i4.TranslatePipe, "async": i4$1.AsyncPipe, "localeCurrency": i1.LocaleCurrencyPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: SellerOrdersCardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'vdr-seller-orders-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.seller-orders' | translate }}\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\" *ngFor=\"let order of sellerOrders$ | async\">\r\n\r\n        <vdr-labeled-data [label]=\"'common.code' | translate\">\r\n            <a  [routerLink]=\"['seller-orders', order.id]\">{{ order.code }}</a>\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data *ngIf=\"getSeller(order) as seller\" [label]=\"'common.seller' | translate\">\r\n            {{ seller.name }}\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data *ngIf=\"getSeller(order) as seller\" [label]=\"'order.total' | translate\">\r\n            {{ order.totalWithTax | localeCurrency:order.currencyCode }}\r\n        </vdr-labeled-data>\r\n        <vdr-labeled-data [label]=\"'order.state' | translate\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </vdr-labeled-data>\r\n    </div>\r\n</div>\r\n", styles: [""] }]
+        }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1.DataService }, { type: i1.ChannelService }]; }, propDecorators: { orderId: [{
+                type: Input
+            }] } });
+
 class OrderHistoryEntryHostComponent {
     constructor(componentFactoryResolver, historyEntryComponentService) {
         this.componentFactoryResolver = componentFactoryResolver;
@@ -2298,10 +2353,10 @@ class OrderDetailComponent extends BaseDetailComponent {
     }
 }
 OrderDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderDetailComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i1.ServerConfigService }, { token: i0.ChangeDetectorRef }, { token: i1.DataService }, { token: i1.NotificationService }, { token: i1.ModalService }, { token: OrderTransitionService }], target: i0.ɵɵFactoryTarget.Component });
-OrderDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: OrderDetailComponent, selector: "vdr-order-detail", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-align-items-center\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n            <vdr-order-state-label [state]=\"order.state\">\r\n                <button\r\n                    class=\"icon-button\"\r\n                    (click)=\"openStateDiagram()\"\r\n                    [title]=\"'order.order-state-diagram' | translate\"\r\n                >\r\n                    <clr-icon shape=\"list\"></clr-icon>\r\n                </button>\r\n            </vdr-order-state-label>\r\n        </div>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                (order.state === 'ArrangingPayment' || order.state === 'ArrangingAdditionalPayment') &&\r\n                (hasUnsettledModifications(order) || 0 < outstandingPaymentAmount(order))\r\n            \"\r\n            (click)=\"addManualPayment(order)\"\r\n        >\r\n            {{ 'order.add-payment-to-order' | translate }}\r\n            ({{ outstandingPaymentAmount(order) | localeCurrency: order.currencyCode }})\r\n        </button>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                order.active === false &&\r\n                order.state !== 'ArrangingAdditionalPayment' &&\r\n                order.state !== 'ArrangingPayment' &&\r\n                0 < outstandingPaymentAmount(order)\r\n            \"\r\n            (click)=\"transitionToState('ArrangingAdditionalPayment')\"\r\n        >\r\n            {{ 'order.arrange-additional-payment' | translate }}\r\n        </button>\r\n        <button class=\"btn btn-primary\" (click)=\"fulfillOrder()\" [disabled]=\"!canAddFulfillment(order)\">\r\n            {{ 'order.fulfill-order' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngIf=\"order.nextStates.includes('Modifying')\">\r\n                    <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"transitionToModifying()\">\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'order.modify-order' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                </ng-container>\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn\"\r\n                    vdrDropdownItem\r\n                    *ngIf=\"order.nextStates.includes('Cancelled')\"\r\n                    (click)=\"cancelOrRefund(order)\"\r\n                >\r\n                    <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                    <ng-container *ngIf=\"orderHasSettledPayments(order); else cancelOnly\">\r\n                        {{ 'order.refund-and-cancel-order' | translate }}\r\n                    </ng-container>\r\n                    <ng-template #cancelOnly>\r\n                        {{ 'order.cancel-order' | translate }}\r\n                    </ng-template>\r\n                </button>\r\n\r\n                <ng-container *ngIf=\"(nextStates$ | async)?.length\">\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        *ngFor=\"let nextState of nextStates$ | async\"\r\n                        type=\"button\"\r\n                        class=\"btn\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionToState(nextState)\"\r\n                    >\r\n                        <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                        {{\r\n                            'order.transition-to-state'\r\n                                | translate: { state: (nextState | stateI18nToken | translate) }\r\n                        }}\r\n                    </button>\r\n                </ng-container>\r\n                <div class=\"dropdown-divider\"></div>\r\n                <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"manuallyTransitionToState(order)\">\r\n                    <clr-icon shape=\"step-forward-2\" class=\"is-warning\"></clr-icon>\r\n                    {{ 'order.manually-transition-to-state' | translate }}\r\n                </button>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col-lg-8\">\r\n            <vdr-order-table\r\n                [order]=\"order\"\r\n                [orderLineCustomFields]=\"orderLineCustomFields\"\r\n            ></vdr-order-table>\r\n            <h4>{{ 'order.tax-summary' | translate }}</h4>\r\n            <table class=\"table\">\r\n                <thead>\r\n                    <tr>\r\n                        <th>{{ 'common.description' | translate }}</th>\r\n                        <th>{{ 'order.tax-rate' | translate }}</th>\r\n                        <th>{{ 'order.tax-base' | translate }}</th>\r\n                        <th>{{ 'order.tax-total' | translate }}</th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <tr *ngFor=\"let row of order.taxSummary\">\r\n                        <td>{{ row.description }}</td>\r\n                        <td>{{ row.taxRate / 100 | percent }}</td>\r\n                        <td>{{ row.taxBase | localeCurrency: order.currencyCode }}</td>\r\n                        <td>{{ row.taxTotal | localeCurrency: order.currencyCode }}</td>\r\n                    </tr>\r\n                </tbody>\r\n            </table>\r\n\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"order-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n\r\n            <vdr-order-history\r\n                [order]=\"order\"\r\n                [history]=\"history$ | async\"\r\n                (addNote)=\"addNote($event)\"\r\n                (updateNote)=\"updateNote($event)\"\r\n                (deleteNote)=\"deleteNote($event)\"\r\n            ></vdr-order-history>\r\n        </div>\r\n        <div class=\"clr-col-lg-4 order-cards\">\r\n            <vdr-order-custom-fields-card\r\n                [customFieldsConfig]=\"customFields\"\r\n                [customFieldValues]=\"order.customFields\"\r\n                (updateClick)=\"updateCustomFields($event)\"\r\n            ></vdr-order-custom-fields-card>\r\n            <div class=\"card\">\r\n                <div class=\"card-header\">\r\n                    {{ 'order.customer' | translate }}\r\n                </div>\r\n                <div class=\"card-block\">\r\n                    <div class=\"card-text\">\r\n                        <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.shippingAddress).length\">\r\n                            {{ 'order.shipping-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.shippingAddress\"></vdr-formatted-address>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.billingAddress).length\">\r\n                            {{ 'order.billing-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.billingAddress\"></vdr-formatted-address>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *ngIf=\"order.payments && order.payments.length\">\r\n                <vdr-order-payment-card\r\n                    *ngFor=\"let payment of order.payments\"\r\n                    [currencyCode]=\"order.currencyCode\"\r\n                    [payment]=\"payment\"\r\n                    (settlePayment)=\"settlePayment($event)\"\r\n                    (transitionPaymentState)=\"transitionPaymentState($event)\"\r\n                    (settleRefund)=\"settleRefund($event)\"\r\n                ></vdr-order-payment-card>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let fulfillment of order.fulfillments\">\r\n                <vdr-fulfillment-card\r\n                    [fulfillment]=\"fulfillment\"\r\n                    [order]=\"order\"\r\n                    (transitionState)=\"transitionFulfillment(fulfillment.id, $event)\"\r\n                ></vdr-fulfillment-card>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".shipping-address{list-style-type:none;line-height:1.3em}.order-cards h6{margin-top:6px;color:var(--color-text-200)}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { type: OrderTableComponent, selector: "vdr-order-table", inputs: ["order", "orderLineCustomFields", "isDraft"], outputs: ["adjust", "remove"] }, { type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { type: OrderHistoryComponent, selector: "vdr-order-history", inputs: ["order", "history"], outputs: ["addNote", "updateNote", "deleteNote"] }, { type: OrderCustomFieldsCardComponent, selector: "vdr-order-custom-fields-card", inputs: ["customFieldsConfig", "customFieldValues"], outputs: ["updateClick"] }, { type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { type: i1.FormattedAddressComponent, selector: "vdr-formatted-address", inputs: ["address"] }, { type: OrderPaymentCardComponent, selector: "vdr-order-payment-card", inputs: ["payment", "currencyCode"], outputs: ["settlePayment", "transitionPaymentState", "settleRefund"] }, { type: FulfillmentCardComponent, selector: "vdr-fulfillment-card", inputs: ["fulfillment", "order"], outputs: ["transitionState"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i4.TranslatePipe, "localeCurrency": i1.LocaleCurrencyPipe, "stateI18nToken": i1.StateI18nTokenPipe, "percent": i4$1.PercentPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+OrderDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: OrderDetailComponent, selector: "vdr-order-detail", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-align-items-center\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n            <vdr-order-state-label [state]=\"order.state\">\r\n                <button\r\n                    class=\"icon-button\"\r\n                    (click)=\"openStateDiagram()\"\r\n                    [title]=\"'order.order-state-diagram' | translate\"\r\n                >\r\n                    <clr-icon shape=\"list\"></clr-icon>\r\n                </button>\r\n            </vdr-order-state-label>\r\n        </div>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n            order.type !== 'Aggregate' &&\r\n                (order.state === 'ArrangingPayment' || order.state === 'ArrangingAdditionalPayment') &&\r\n                (hasUnsettledModifications(order) || 0 < outstandingPaymentAmount(order))\r\n            \"\r\n            (click)=\"addManualPayment(order)\"\r\n        >\r\n            {{ 'order.add-payment-to-order' | translate }}\r\n            ({{ outstandingPaymentAmount(order) | localeCurrency: order.currencyCode }})\r\n        </button>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                order.type !== 'Aggregate' &&\r\n                order.active === false &&\r\n                order.state !== 'ArrangingAdditionalPayment' &&\r\n                order.state !== 'ArrangingPayment' &&\r\n                0 < outstandingPaymentAmount(order)\r\n            \"\r\n            (click)=\"transitionToState('ArrangingAdditionalPayment')\"\r\n        >\r\n            {{ 'order.arrange-additional-payment' | translate }}\r\n        </button>\r\n        <button *ngIf=\"order.type !== 'Aggregate'\" class=\"btn btn-primary\" (click)=\"fulfillOrder()\" [disabled]=\"!canAddFulfillment(order)\">\r\n            {{ 'order.fulfill-order' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngIf=\"order.type !== 'Aggregate' && order.nextStates.includes('Modifying')\">\r\n                    <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"transitionToModifying()\">\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'order.modify-order' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                </ng-container>\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn\"\r\n                    vdrDropdownItem\r\n                    *ngIf=\"order.type !== 'Aggregate' && order.nextStates.includes('Cancelled')\"\r\n                    (click)=\"cancelOrRefund(order)\"\r\n                >\r\n                    <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                    <ng-container *ngIf=\"orderHasSettledPayments(order); else cancelOnly\">\r\n                        {{ 'order.refund-and-cancel-order' | translate }}\r\n                    </ng-container>\r\n                    <ng-template #cancelOnly>\r\n                        {{ 'order.cancel-order' | translate }}\r\n                    </ng-template>\r\n                </button>\r\n\r\n                <ng-container *ngIf=\"(nextStates$ | async)?.length\">\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        *ngFor=\"let nextState of nextStates$ | async\"\r\n                        type=\"button\"\r\n                        class=\"btn\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionToState(nextState)\"\r\n                    >\r\n                        <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                        {{\r\n                            'order.transition-to-state'\r\n                                | translate: { state: (nextState | stateI18nToken | translate) }\r\n                        }}\r\n                    </button>\r\n                </ng-container>\r\n                <div class=\"dropdown-divider\"></div>\r\n                <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"manuallyTransitionToState(order)\">\r\n                    <clr-icon shape=\"step-forward-2\" class=\"is-warning\"></clr-icon>\r\n                    {{ 'order.manually-transition-to-state' | translate }}\r\n                </button>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col-lg-8\">\r\n            <vdr-seller-orders-card\r\n                *ngIf=\"order.sellerOrders.length\"\r\n                [orderId]=\"order.id\"\r\n            ></vdr-seller-orders-card>\r\n            <vdr-order-table\r\n                [order]=\"order\"\r\n                [orderLineCustomFields]=\"orderLineCustomFields\"\r\n            ></vdr-order-table>\r\n            <h4>{{ 'order.tax-summary' | translate }}</h4>\r\n            <table class=\"table\">\r\n                <thead>\r\n                    <tr>\r\n                        <th>{{ 'common.description' | translate }}</th>\r\n                        <th>{{ 'order.tax-rate' | translate }}</th>\r\n                        <th>{{ 'order.tax-base' | translate }}</th>\r\n                        <th>{{ 'order.tax-total' | translate }}</th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <tr *ngFor=\"let row of order.taxSummary\">\r\n                        <td>{{ row.description }}</td>\r\n                        <td>{{ row.taxRate / 100 | percent }}</td>\r\n                        <td>{{ row.taxBase | localeCurrency: order.currencyCode }}</td>\r\n                        <td>{{ row.taxTotal | localeCurrency: order.currencyCode }}</td>\r\n                    </tr>\r\n                </tbody>\r\n            </table>\r\n\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"order-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n\r\n            <vdr-order-history\r\n                [order]=\"order\"\r\n                [history]=\"history$ | async\"\r\n                (addNote)=\"addNote($event)\"\r\n                (updateNote)=\"updateNote($event)\"\r\n                (deleteNote)=\"deleteNote($event)\"\r\n            ></vdr-order-history>\r\n        </div>\r\n        <div class=\"clr-col-lg-4 order-cards\">\r\n            <vdr-order-custom-fields-card\r\n                [customFieldsConfig]=\"customFields\"\r\n                [customFieldValues]=\"order.customFields\"\r\n                (updateClick)=\"updateCustomFields($event)\"\r\n            ></vdr-order-custom-fields-card>\r\n            <div class=\"card\">\r\n                <div class=\"card-header\">\r\n                    {{ 'order.customer' | translate }}\r\n                </div>\r\n                <div class=\"card-block\">\r\n                    <div class=\"card-text\">\r\n                        <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.shippingAddress).length\">\r\n                            {{ 'order.shipping-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.shippingAddress\"></vdr-formatted-address>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.billingAddress).length\">\r\n                            {{ 'order.billing-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.billingAddress\"></vdr-formatted-address>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *ngIf=\"order.payments && order.payments.length\">\r\n                <vdr-order-payment-card\r\n                    *ngFor=\"let payment of order.payments\"\r\n                    [currencyCode]=\"order.currencyCode\"\r\n                    [payment]=\"payment\"\r\n                    (settlePayment)=\"settlePayment($event)\"\r\n                    (transitionPaymentState)=\"transitionPaymentState($event)\"\r\n                    (settleRefund)=\"settleRefund($event)\"\r\n                ></vdr-order-payment-card>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let fulfillment of order.fulfillments\">\r\n                <vdr-fulfillment-card\r\n                    [fulfillment]=\"fulfillment\"\r\n                    [order]=\"order\"\r\n                    (transitionState)=\"transitionFulfillment(fulfillment.id, $event)\"\r\n                ></vdr-fulfillment-card>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".shipping-address{list-style-type:none;line-height:1.3em}.order-cards h6{margin-top:6px;color:var(--color-text-200)}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { type: SellerOrdersCardComponent, selector: "vdr-seller-orders-card", inputs: ["orderId"] }, { type: OrderTableComponent, selector: "vdr-order-table", inputs: ["order", "orderLineCustomFields", "isDraft"], outputs: ["adjust", "remove"] }, { type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { type: OrderHistoryComponent, selector: "vdr-order-history", inputs: ["order", "history"], outputs: ["addNote", "updateNote", "deleteNote"] }, { type: OrderCustomFieldsCardComponent, selector: "vdr-order-custom-fields-card", inputs: ["customFieldsConfig", "customFieldValues"], outputs: ["updateClick"] }, { type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { type: i1.FormattedAddressComponent, selector: "vdr-formatted-address", inputs: ["address"] }, { type: OrderPaymentCardComponent, selector: "vdr-order-payment-card", inputs: ["payment", "currencyCode"], outputs: ["settlePayment", "transitionPaymentState", "settleRefund"] }, { type: FulfillmentCardComponent, selector: "vdr-fulfillment-card", inputs: ["fulfillment", "order"], outputs: ["transitionState"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i4.TranslatePipe, "localeCurrency": i1.LocaleCurrencyPipe, "stateI18nToken": i1.StateI18nTokenPipe, "percent": i4$1.PercentPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-order-detail', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-align-items-center\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n            <vdr-order-state-label [state]=\"order.state\">\r\n                <button\r\n                    class=\"icon-button\"\r\n                    (click)=\"openStateDiagram()\"\r\n                    [title]=\"'order.order-state-diagram' | translate\"\r\n                >\r\n                    <clr-icon shape=\"list\"></clr-icon>\r\n                </button>\r\n            </vdr-order-state-label>\r\n        </div>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                (order.state === 'ArrangingPayment' || order.state === 'ArrangingAdditionalPayment') &&\r\n                (hasUnsettledModifications(order) || 0 < outstandingPaymentAmount(order))\r\n            \"\r\n            (click)=\"addManualPayment(order)\"\r\n        >\r\n            {{ 'order.add-payment-to-order' | translate }}\r\n            ({{ outstandingPaymentAmount(order) | localeCurrency: order.currencyCode }})\r\n        </button>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                order.active === false &&\r\n                order.state !== 'ArrangingAdditionalPayment' &&\r\n                order.state !== 'ArrangingPayment' &&\r\n                0 < outstandingPaymentAmount(order)\r\n            \"\r\n            (click)=\"transitionToState('ArrangingAdditionalPayment')\"\r\n        >\r\n            {{ 'order.arrange-additional-payment' | translate }}\r\n        </button>\r\n        <button class=\"btn btn-primary\" (click)=\"fulfillOrder()\" [disabled]=\"!canAddFulfillment(order)\">\r\n            {{ 'order.fulfill-order' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngIf=\"order.nextStates.includes('Modifying')\">\r\n                    <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"transitionToModifying()\">\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'order.modify-order' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                </ng-container>\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn\"\r\n                    vdrDropdownItem\r\n                    *ngIf=\"order.nextStates.includes('Cancelled')\"\r\n                    (click)=\"cancelOrRefund(order)\"\r\n                >\r\n                    <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                    <ng-container *ngIf=\"orderHasSettledPayments(order); else cancelOnly\">\r\n                        {{ 'order.refund-and-cancel-order' | translate }}\r\n                    </ng-container>\r\n                    <ng-template #cancelOnly>\r\n                        {{ 'order.cancel-order' | translate }}\r\n                    </ng-template>\r\n                </button>\r\n\r\n                <ng-container *ngIf=\"(nextStates$ | async)?.length\">\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        *ngFor=\"let nextState of nextStates$ | async\"\r\n                        type=\"button\"\r\n                        class=\"btn\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionToState(nextState)\"\r\n                    >\r\n                        <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                        {{\r\n                            'order.transition-to-state'\r\n                                | translate: { state: (nextState | stateI18nToken | translate) }\r\n                        }}\r\n                    </button>\r\n                </ng-container>\r\n                <div class=\"dropdown-divider\"></div>\r\n                <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"manuallyTransitionToState(order)\">\r\n                    <clr-icon shape=\"step-forward-2\" class=\"is-warning\"></clr-icon>\r\n                    {{ 'order.manually-transition-to-state' | translate }}\r\n                </button>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col-lg-8\">\r\n            <vdr-order-table\r\n                [order]=\"order\"\r\n                [orderLineCustomFields]=\"orderLineCustomFields\"\r\n            ></vdr-order-table>\r\n            <h4>{{ 'order.tax-summary' | translate }}</h4>\r\n            <table class=\"table\">\r\n                <thead>\r\n                    <tr>\r\n                        <th>{{ 'common.description' | translate }}</th>\r\n                        <th>{{ 'order.tax-rate' | translate }}</th>\r\n                        <th>{{ 'order.tax-base' | translate }}</th>\r\n                        <th>{{ 'order.tax-total' | translate }}</th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <tr *ngFor=\"let row of order.taxSummary\">\r\n                        <td>{{ row.description }}</td>\r\n                        <td>{{ row.taxRate / 100 | percent }}</td>\r\n                        <td>{{ row.taxBase | localeCurrency: order.currencyCode }}</td>\r\n                        <td>{{ row.taxTotal | localeCurrency: order.currencyCode }}</td>\r\n                    </tr>\r\n                </tbody>\r\n            </table>\r\n\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"order-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n\r\n            <vdr-order-history\r\n                [order]=\"order\"\r\n                [history]=\"history$ | async\"\r\n                (addNote)=\"addNote($event)\"\r\n                (updateNote)=\"updateNote($event)\"\r\n                (deleteNote)=\"deleteNote($event)\"\r\n            ></vdr-order-history>\r\n        </div>\r\n        <div class=\"clr-col-lg-4 order-cards\">\r\n            <vdr-order-custom-fields-card\r\n                [customFieldsConfig]=\"customFields\"\r\n                [customFieldValues]=\"order.customFields\"\r\n                (updateClick)=\"updateCustomFields($event)\"\r\n            ></vdr-order-custom-fields-card>\r\n            <div class=\"card\">\r\n                <div class=\"card-header\">\r\n                    {{ 'order.customer' | translate }}\r\n                </div>\r\n                <div class=\"card-block\">\r\n                    <div class=\"card-text\">\r\n                        <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.shippingAddress).length\">\r\n                            {{ 'order.shipping-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.shippingAddress\"></vdr-formatted-address>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.billingAddress).length\">\r\n                            {{ 'order.billing-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.billingAddress\"></vdr-formatted-address>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *ngIf=\"order.payments && order.payments.length\">\r\n                <vdr-order-payment-card\r\n                    *ngFor=\"let payment of order.payments\"\r\n                    [currencyCode]=\"order.currencyCode\"\r\n                    [payment]=\"payment\"\r\n                    (settlePayment)=\"settlePayment($event)\"\r\n                    (transitionPaymentState)=\"transitionPaymentState($event)\"\r\n                    (settleRefund)=\"settleRefund($event)\"\r\n                ></vdr-order-payment-card>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let fulfillment of order.fulfillments\">\r\n                <vdr-fulfillment-card\r\n                    [fulfillment]=\"fulfillment\"\r\n                    [order]=\"order\"\r\n                    (transitionState)=\"transitionFulfillment(fulfillment.id, $event)\"\r\n                ></vdr-fulfillment-card>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".shipping-address{list-style-type:none;line-height:1.3em}.order-cards h6{margin-top:6px;color:var(--color-text-200)}\n"] }]
+            args: [{ selector: 'vdr-order-detail', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-align-items-center\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n            <vdr-order-state-label [state]=\"order.state\">\r\n                <button\r\n                    class=\"icon-button\"\r\n                    (click)=\"openStateDiagram()\"\r\n                    [title]=\"'order.order-state-diagram' | translate\"\r\n                >\r\n                    <clr-icon shape=\"list\"></clr-icon>\r\n                </button>\r\n            </vdr-order-state-label>\r\n        </div>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n            order.type !== 'Aggregate' &&\r\n                (order.state === 'ArrangingPayment' || order.state === 'ArrangingAdditionalPayment') &&\r\n                (hasUnsettledModifications(order) || 0 < outstandingPaymentAmount(order))\r\n            \"\r\n            (click)=\"addManualPayment(order)\"\r\n        >\r\n            {{ 'order.add-payment-to-order' | translate }}\r\n            ({{ outstandingPaymentAmount(order) | localeCurrency: order.currencyCode }})\r\n        </button>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"\r\n                order.type !== 'Aggregate' &&\r\n                order.active === false &&\r\n                order.state !== 'ArrangingAdditionalPayment' &&\r\n                order.state !== 'ArrangingPayment' &&\r\n                0 < outstandingPaymentAmount(order)\r\n            \"\r\n            (click)=\"transitionToState('ArrangingAdditionalPayment')\"\r\n        >\r\n            {{ 'order.arrange-additional-payment' | translate }}\r\n        </button>\r\n        <button *ngIf=\"order.type !== 'Aggregate'\" class=\"btn btn-primary\" (click)=\"fulfillOrder()\" [disabled]=\"!canAddFulfillment(order)\">\r\n            {{ 'order.fulfill-order' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngIf=\"order.type !== 'Aggregate' && order.nextStates.includes('Modifying')\">\r\n                    <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"transitionToModifying()\">\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'order.modify-order' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                </ng-container>\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"btn\"\r\n                    vdrDropdownItem\r\n                    *ngIf=\"order.type !== 'Aggregate' && order.nextStates.includes('Cancelled')\"\r\n                    (click)=\"cancelOrRefund(order)\"\r\n                >\r\n                    <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                    <ng-container *ngIf=\"orderHasSettledPayments(order); else cancelOnly\">\r\n                        {{ 'order.refund-and-cancel-order' | translate }}\r\n                    </ng-container>\r\n                    <ng-template #cancelOnly>\r\n                        {{ 'order.cancel-order' | translate }}\r\n                    </ng-template>\r\n                </button>\r\n\r\n                <ng-container *ngIf=\"(nextStates$ | async)?.length\">\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        *ngFor=\"let nextState of nextStates$ | async\"\r\n                        type=\"button\"\r\n                        class=\"btn\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionToState(nextState)\"\r\n                    >\r\n                        <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                        {{\r\n                            'order.transition-to-state'\r\n                                | translate: { state: (nextState | stateI18nToken | translate) }\r\n                        }}\r\n                    </button>\r\n                </ng-container>\r\n                <div class=\"dropdown-divider\"></div>\r\n                <button type=\"button\" class=\"btn\" vdrDropdownItem (click)=\"manuallyTransitionToState(order)\">\r\n                    <clr-icon shape=\"step-forward-2\" class=\"is-warning\"></clr-icon>\r\n                    {{ 'order.manually-transition-to-state' | translate }}\r\n                </button>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col-lg-8\">\r\n            <vdr-seller-orders-card\r\n                *ngIf=\"order.sellerOrders.length\"\r\n                [orderId]=\"order.id\"\r\n            ></vdr-seller-orders-card>\r\n            <vdr-order-table\r\n                [order]=\"order\"\r\n                [orderLineCustomFields]=\"orderLineCustomFields\"\r\n            ></vdr-order-table>\r\n            <h4>{{ 'order.tax-summary' | translate }}</h4>\r\n            <table class=\"table\">\r\n                <thead>\r\n                    <tr>\r\n                        <th>{{ 'common.description' | translate }}</th>\r\n                        <th>{{ 'order.tax-rate' | translate }}</th>\r\n                        <th>{{ 'order.tax-base' | translate }}</th>\r\n                        <th>{{ 'order.tax-total' | translate }}</th>\r\n                    </tr>\r\n                </thead>\r\n                <tbody>\r\n                    <tr *ngFor=\"let row of order.taxSummary\">\r\n                        <td>{{ row.description }}</td>\r\n                        <td>{{ row.taxRate / 100 | percent }}</td>\r\n                        <td>{{ row.taxBase | localeCurrency: order.currencyCode }}</td>\r\n                        <td>{{ row.taxTotal | localeCurrency: order.currencyCode }}</td>\r\n                    </tr>\r\n                </tbody>\r\n            </table>\r\n\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"order-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n\r\n            <vdr-order-history\r\n                [order]=\"order\"\r\n                [history]=\"history$ | async\"\r\n                (addNote)=\"addNote($event)\"\r\n                (updateNote)=\"updateNote($event)\"\r\n                (deleteNote)=\"deleteNote($event)\"\r\n            ></vdr-order-history>\r\n        </div>\r\n        <div class=\"clr-col-lg-4 order-cards\">\r\n            <vdr-order-custom-fields-card\r\n                [customFieldsConfig]=\"customFields\"\r\n                [customFieldValues]=\"order.customFields\"\r\n                (updateClick)=\"updateCustomFields($event)\"\r\n            ></vdr-order-custom-fields-card>\r\n            <div class=\"card\">\r\n                <div class=\"card-header\">\r\n                    {{ 'order.customer' | translate }}\r\n                </div>\r\n                <div class=\"card-block\">\r\n                    <div class=\"card-text\">\r\n                        <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.shippingAddress).length\">\r\n                            {{ 'order.shipping-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.shippingAddress\"></vdr-formatted-address>\r\n                        <h6 *ngIf=\"getOrderAddressLines(order.billingAddress).length\">\r\n                            {{ 'order.billing-address' | translate }}\r\n                        </h6>\r\n                        <vdr-formatted-address [address]=\"order.billingAddress\"></vdr-formatted-address>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *ngIf=\"order.payments && order.payments.length\">\r\n                <vdr-order-payment-card\r\n                    *ngFor=\"let payment of order.payments\"\r\n                    [currencyCode]=\"order.currencyCode\"\r\n                    [payment]=\"payment\"\r\n                    (settlePayment)=\"settlePayment($event)\"\r\n                    (transitionPaymentState)=\"transitionPaymentState($event)\"\r\n                    (settleRefund)=\"settleRefund($event)\"\r\n                ></vdr-order-payment-card>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let fulfillment of order.fulfillments\">\r\n                <vdr-fulfillment-card\r\n                    [fulfillment]=\"fulfillment\"\r\n                    [order]=\"order\"\r\n                    (transitionState)=\"transitionFulfillment(fulfillment.id, $event)\"\r\n                ></vdr-fulfillment-card>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".shipping-address{list-style-type:none;line-height:1.3em}.order-cards h6{margin-top:6px;color:var(--color-text-200)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i1.ServerConfigService }, { type: i0.ChangeDetectorRef }, { type: i1.DataService }, { type: i1.NotificationService }, { type: i1.ModalService }, { type: OrderTransitionService }]; } });
 
 var OrderEditResultType;
@@ -2704,12 +2759,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i1.ServerConfigService }, { type: i0.ChangeDetectorRef }, { type: i1.DataService }, { type: i1.NotificationService }, { type: i1.ModalService }, { type: OrderTransitionService }]; } });
 
 class OrderListComponent extends BaseListComponent {
-    constructor(serverConfigService, dataService, localStorageService, router, route) {
+    constructor(serverConfigService, dataService, localStorageService, channelService, router, route) {
         var _a;
         super(router, route);
         this.serverConfigService = serverConfigService;
         this.dataService = dataService;
         this.localStorageService = localStorageService;
+        this.channelService = channelService;
         this.searchControl = new FormControl('');
         this.searchOrderCodeControl = new FormControl('');
         this.searchLastNameControl = new FormControl('');
@@ -2756,6 +2812,7 @@ class OrderListComponent extends BaseListComponent {
             },
         ];
         this.canCreateDraftOrder = false;
+        this.activeChannelIsDefaultChannel = false;
         super.setQueryFn(
         // tslint:disable-next-line:no-shadowed-variable
         (take, skip) => this.dataService.order.getOrders({ take, skip }).refetchOnChannelChange(), data => data.orders, 
@@ -2777,8 +2834,9 @@ class OrderListComponent extends BaseListComponent {
         super.ngOnInit();
         this.activePreset$ = this.route.queryParamMap.pipe(map(qpm => qpm.get('filter') || 'open'), distinctUntilChanged());
         const searchTerms$ = merge(this.searchControl.valueChanges).pipe(filter(value => 2 < value.length || value.length === 0), debounceTime(250));
-        merge(searchTerms$, this.route.queryParamMap)
-            .pipe(takeUntil(this.destroy$))
+        const isDefaultChannel$ = this.channelService.defaultChannelIsActive$.pipe(tap(isDefault => (this.activeChannelIsDefaultChannel = isDefault)));
+        merge(searchTerms$, isDefaultChannel$, this.route.queryParamMap)
+            .pipe(debounceTime(50), takeUntil(this.destroy$))
             .subscribe(val => {
             this.refresh();
         });
@@ -2856,6 +2914,11 @@ class OrderListComponent extends BaseListComponent {
                 };
             }
         }
+        if (this.activeChannelIsDefaultChannel) {
+            filter = Object.assign(Object.assign({}, (filter !== null && filter !== void 0 ? filter : {})), { type: {
+                    notEq: OrderType.Seller,
+                } });
+        }
         if (searchTerm) {
             filter = {
                 customerLastName: {
@@ -2891,12 +2954,12 @@ class OrderListComponent extends BaseListComponent {
         }
     }
 }
-OrderListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderListComponent, deps: [{ token: i1.ServerConfigService }, { token: i1.DataService }, { token: i1.LocalStorageService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-OrderListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: OrderListComponent, selector: "vdr-order-list", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"search-form\">\r\n            <div class=\"filter-presets btn-group btn-outline-primary\" *ngIf=\"activePreset$ | async as activePreset\">\r\n                <button\r\n                    class=\"btn\"\r\n                    *ngFor=\"let preset of filterPresets\"\r\n                    [class.btn-primary]=\"activePreset === preset.name\"\r\n                    (click)=\"selectFilterPreset(preset.name)\"\r\n                >\r\n                    {{ preset.label | translate }}\r\n                </button>\r\n                <button\r\n                    class=\"btn\"\r\n                    [class.btn-primary]=\"activePreset === 'custom'\"\r\n                    (click)=\"selectFilterPreset('custom')\"\r\n                >\r\n                    {{ 'order.filter-custom' | translate }}\r\n                    <clr-icon shape=\"angle down\"></clr-icon>\r\n                </button>\r\n            </div>\r\n            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"searchControl\"\r\n                [placeholder]=\"'order.search-by-order-filters' | translate\"\r\n                class=\"search-input\"\r\n            />\r\n        </div>\r\n        <div class=\"custom-filters\" [class.expanded]=\"(activePreset$ | async) === 'custom'\">\r\n            <form [formGroup]=\"customFilterForm\">\r\n                <div class=\"flex align-center\">\r\n                    <ng-select\r\n                        [items]=\"orderStates\"\r\n                        appendTo=\"body\"\r\n                        [addTag]=\"false\"\r\n                        [multiple]=\"true\"\r\n                        formControlName=\"states\"\r\n                        [placeholder]=\"'state.all-orders' | translate\"\r\n                        [clearable]=\"true\"\r\n                        [searchable]=\"false\"\r\n                    >\r\n                        <ng-template ng-option-tmp let-item=\"item\">{{\r\n                            item | stateI18nToken | translate\r\n                        }}</ng-template>\r\n                        <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n                            <span class=\"ng-value-label\"> {{ item | stateI18nToken | translate }}</span>\r\n                            <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\"\r\n                                >\u00D7</span\r\n                            >\r\n                        </ng-template>\r\n                    </ng-select>\r\n                    <button\r\n                        class=\"btn btn-secondary\"\r\n                        [disabled]=\"customFilterForm.pristine\"\r\n                        (click)=\"applyCustomFilters()\"\r\n                    >\r\n                        {{ 'order.apply-filters' | translate }}\r\n                        <clr-icon shape=\"filter\"></clr-icon>\r\n                    </button>\r\n                </div>\r\n                <div class=\"flex\">\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-start' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtStart\"></vdr-datetime-picker>\r\n                    </div>\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-end' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtEnd\"></vdr-datetime-picker>\r\n                    </div>\r\n                </div>\r\n            </form>\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n        <ng-container *ngIf=\"canCreateDraftOrder\">\r\n            <a class=\"btn btn-primary mt1\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-draft-order' | translate }}\r\n            </a>\r\n        </ng-container>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.customer' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.state' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.total' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.placed-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.shipping' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-order=\"item\">\r\n        <td class=\"left align-middle\">{{ order.code }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </td>\r\n        <td class=\"left align-middle\">{{ order.totalWithTax | localeCurrency: order.currencyCode }}</td>\r\n        <td class=\"left align-middle\">{{ order.updatedAt | timeAgo }}</td>\r\n        <td class=\"left align-middle\">{{ order.orderPlacedAt | localeDate: 'medium' }}</td>\r\n        <td class=\"left align-middle\">{{ getShippingNames(order) }}</td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"shopping-cart\"\r\n                [label]=\"'common.open' | translate\"\r\n                [linkTo]=\"\r\n                    order.state === 'Modifying'\r\n                        ? ['./', order.id, 'modify']\r\n                        : order.state === 'Draft'\r\n                        ? ['./draft', order.id]\r\n                        : ['./', order.id]\r\n                \"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { type: i1.DatetimePickerComponent, selector: "vdr-datetime-picker", inputs: ["yearRange", "weekStartDay", "timeGranularityInterval", "min", "max", "readonly"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DataTableComponent, selector: "vdr-data-table", inputs: ["items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "selectionManager", "allSelected", "isRowSelectedFn"], outputs: ["pageChange", "itemsPerPageChange", "allSelectChange", "rowSelectChange"] }, { type: i1.DataTableColumnComponent, selector: "vdr-dt-column", inputs: ["expand"] }, { type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { type: i1.TableRowActionComponent, selector: "vdr-table-row-action", inputs: ["linkTo", "label", "iconShape", "disabled"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { type: i3.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { type: i3$2.ClrLabel, selector: "label", inputs: ["for"] }, { type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i4.TranslatePipe, "stateI18nToken": i1.StateI18nTokenPipe, "localeCurrency": i1.LocaleCurrencyPipe, "timeAgo": i1.TimeAgoPipe, "localeDate": i1.LocaleDatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+OrderListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderListComponent, deps: [{ token: i1.ServerConfigService }, { token: i1.DataService }, { token: i1.LocalStorageService }, { token: i1.ChannelService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+OrderListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: OrderListComponent, selector: "vdr-order-list", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"search-form\">\r\n            <div class=\"filter-presets btn-group btn-outline-primary\" *ngIf=\"activePreset$ | async as activePreset\">\r\n                <button\r\n                    class=\"btn\"\r\n                    *ngFor=\"let preset of filterPresets\"\r\n                    [class.btn-primary]=\"activePreset === preset.name\"\r\n                    (click)=\"selectFilterPreset(preset.name)\"\r\n                >\r\n                    {{ preset.label | translate }}\r\n                </button>\r\n                <button\r\n                    class=\"btn\"\r\n                    [class.btn-primary]=\"activePreset === 'custom'\"\r\n                    (click)=\"selectFilterPreset('custom')\"\r\n                >\r\n                    {{ 'order.filter-custom' | translate }}\r\n                    <clr-icon shape=\"angle down\"></clr-icon>\r\n                </button>\r\n            </div>\r\n            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"searchControl\"\r\n                [placeholder]=\"'order.search-by-order-filters' | translate\"\r\n                class=\"search-input\"\r\n            />\r\n        </div>\r\n        <div class=\"custom-filters\" [class.expanded]=\"(activePreset$ | async) === 'custom'\">\r\n            <form [formGroup]=\"customFilterForm\">\r\n                <div class=\"flex align-center\">\r\n                    <ng-select\r\n                        [items]=\"orderStates\"\r\n                        appendTo=\"body\"\r\n                        [addTag]=\"false\"\r\n                        [multiple]=\"true\"\r\n                        formControlName=\"states\"\r\n                        [placeholder]=\"'state.all-orders' | translate\"\r\n                        [clearable]=\"true\"\r\n                        [searchable]=\"false\"\r\n                    >\r\n                        <ng-template ng-option-tmp let-item=\"item\">{{\r\n                            item | stateI18nToken | translate\r\n                        }}</ng-template>\r\n                        <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n                            <span class=\"ng-value-label\"> {{ item | stateI18nToken | translate }}</span>\r\n                            <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\"\r\n                                >\u00D7</span\r\n                            >\r\n                        </ng-template>\r\n                    </ng-select>\r\n                    <button\r\n                        class=\"btn btn-secondary\"\r\n                        [disabled]=\"customFilterForm.pristine\"\r\n                        (click)=\"applyCustomFilters()\"\r\n                    >\r\n                        {{ 'order.apply-filters' | translate }}\r\n                        <clr-icon shape=\"filter\"></clr-icon>\r\n                    </button>\r\n                </div>\r\n                <div class=\"flex\">\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-start' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtStart\"></vdr-datetime-picker>\r\n                    </div>\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-end' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtEnd\"></vdr-datetime-picker>\r\n                    </div>\r\n                </div>\r\n            </form>\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n        <ng-container *ngIf=\"canCreateDraftOrder\">\r\n            <a class=\"btn btn-primary mt1\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-draft-order' | translate }}\r\n            </a>\r\n        </ng-container>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.customer' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.order-type' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.state' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.total' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.placed-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.shipping' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-order=\"item\">\r\n        <td class=\"left align-middle\">{{ order.code }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-chip>{{ order.type }}</vdr-chip>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </td>\r\n        <td class=\"left align-middle\">{{ order.totalWithTax | localeCurrency: order.currencyCode }}</td>\r\n        <td class=\"left align-middle\">{{ order.updatedAt | timeAgo }}</td>\r\n        <td class=\"left align-middle\">{{ order.orderPlacedAt | localeDate: 'medium' }}</td>\r\n        <td class=\"left align-middle\">{{ getShippingNames(order) }}</td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"shopping-cart\"\r\n                [label]=\"'common.open' | translate\"\r\n                [linkTo]=\"\r\n                    order.state === 'Modifying'\r\n                        ? ['./', order.id, 'modify']\r\n                        : order.state === 'Draft'\r\n                        ? ['./draft', order.id]\r\n                        : ['./', order.id]\r\n                \"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { type: i1.DatetimePickerComponent, selector: "vdr-datetime-picker", inputs: ["yearRange", "weekStartDay", "timeGranularityInterval", "min", "max", "readonly"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DataTableComponent, selector: "vdr-data-table", inputs: ["items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "selectionManager", "allSelected", "isRowSelectedFn"], outputs: ["pageChange", "itemsPerPageChange", "allSelectChange", "rowSelectChange"] }, { type: i1.DataTableColumnComponent, selector: "vdr-dt-column", inputs: ["expand"] }, { type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { type: i1.TableRowActionComponent, selector: "vdr-table-row-action", inputs: ["linkTo", "label", "iconShape", "disabled"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { type: i3.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { type: i3$2.ClrLabel, selector: "label", inputs: ["for"] }, { type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i4.TranslatePipe, "stateI18nToken": i1.StateI18nTokenPipe, "localeCurrency": i1.LocaleCurrencyPipe, "timeAgo": i1.TimeAgoPipe, "localeDate": i1.LocaleDatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-order-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"search-form\">\r\n            <div class=\"filter-presets btn-group btn-outline-primary\" *ngIf=\"activePreset$ | async as activePreset\">\r\n                <button\r\n                    class=\"btn\"\r\n                    *ngFor=\"let preset of filterPresets\"\r\n                    [class.btn-primary]=\"activePreset === preset.name\"\r\n                    (click)=\"selectFilterPreset(preset.name)\"\r\n                >\r\n                    {{ preset.label | translate }}\r\n                </button>\r\n                <button\r\n                    class=\"btn\"\r\n                    [class.btn-primary]=\"activePreset === 'custom'\"\r\n                    (click)=\"selectFilterPreset('custom')\"\r\n                >\r\n                    {{ 'order.filter-custom' | translate }}\r\n                    <clr-icon shape=\"angle down\"></clr-icon>\r\n                </button>\r\n            </div>\r\n            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"searchControl\"\r\n                [placeholder]=\"'order.search-by-order-filters' | translate\"\r\n                class=\"search-input\"\r\n            />\r\n        </div>\r\n        <div class=\"custom-filters\" [class.expanded]=\"(activePreset$ | async) === 'custom'\">\r\n            <form [formGroup]=\"customFilterForm\">\r\n                <div class=\"flex align-center\">\r\n                    <ng-select\r\n                        [items]=\"orderStates\"\r\n                        appendTo=\"body\"\r\n                        [addTag]=\"false\"\r\n                        [multiple]=\"true\"\r\n                        formControlName=\"states\"\r\n                        [placeholder]=\"'state.all-orders' | translate\"\r\n                        [clearable]=\"true\"\r\n                        [searchable]=\"false\"\r\n                    >\r\n                        <ng-template ng-option-tmp let-item=\"item\">{{\r\n                            item | stateI18nToken | translate\r\n                        }}</ng-template>\r\n                        <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n                            <span class=\"ng-value-label\"> {{ item | stateI18nToken | translate }}</span>\r\n                            <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\"\r\n                                >\u00D7</span\r\n                            >\r\n                        </ng-template>\r\n                    </ng-select>\r\n                    <button\r\n                        class=\"btn btn-secondary\"\r\n                        [disabled]=\"customFilterForm.pristine\"\r\n                        (click)=\"applyCustomFilters()\"\r\n                    >\r\n                        {{ 'order.apply-filters' | translate }}\r\n                        <clr-icon shape=\"filter\"></clr-icon>\r\n                    </button>\r\n                </div>\r\n                <div class=\"flex\">\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-start' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtStart\"></vdr-datetime-picker>\r\n                    </div>\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-end' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtEnd\"></vdr-datetime-picker>\r\n                    </div>\r\n                </div>\r\n            </form>\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n        <ng-container *ngIf=\"canCreateDraftOrder\">\r\n            <a class=\"btn btn-primary mt1\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-draft-order' | translate }}\r\n            </a>\r\n        </ng-container>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.customer' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.state' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.total' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.placed-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.shipping' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-order=\"item\">\r\n        <td class=\"left align-middle\">{{ order.code }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </td>\r\n        <td class=\"left align-middle\">{{ order.totalWithTax | localeCurrency: order.currencyCode }}</td>\r\n        <td class=\"left align-middle\">{{ order.updatedAt | timeAgo }}</td>\r\n        <td class=\"left align-middle\">{{ order.orderPlacedAt | localeDate: 'medium' }}</td>\r\n        <td class=\"left align-middle\">{{ getShippingNames(order) }}</td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"shopping-cart\"\r\n                [label]=\"'common.open' | translate\"\r\n                [linkTo]=\"\r\n                    order.state === 'Modifying'\r\n                        ? ['./', order.id, 'modify']\r\n                        : order.state === 'Draft'\r\n                        ? ['./draft', order.id]\r\n                        : ['./', order.id]\r\n                \"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.ServerConfigService }, { type: i1.DataService }, { type: i1.LocalStorageService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }]; } });
+            args: [{ selector: 'vdr-order-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"search-form\">\r\n            <div class=\"filter-presets btn-group btn-outline-primary\" *ngIf=\"activePreset$ | async as activePreset\">\r\n                <button\r\n                    class=\"btn\"\r\n                    *ngFor=\"let preset of filterPresets\"\r\n                    [class.btn-primary]=\"activePreset === preset.name\"\r\n                    (click)=\"selectFilterPreset(preset.name)\"\r\n                >\r\n                    {{ preset.label | translate }}\r\n                </button>\r\n                <button\r\n                    class=\"btn\"\r\n                    [class.btn-primary]=\"activePreset === 'custom'\"\r\n                    (click)=\"selectFilterPreset('custom')\"\r\n                >\r\n                    {{ 'order.filter-custom' | translate }}\r\n                    <clr-icon shape=\"angle down\"></clr-icon>\r\n                </button>\r\n            </div>\r\n            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"searchControl\"\r\n                [placeholder]=\"'order.search-by-order-filters' | translate\"\r\n                class=\"search-input\"\r\n            />\r\n        </div>\r\n        <div class=\"custom-filters\" [class.expanded]=\"(activePreset$ | async) === 'custom'\">\r\n            <form [formGroup]=\"customFilterForm\">\r\n                <div class=\"flex align-center\">\r\n                    <ng-select\r\n                        [items]=\"orderStates\"\r\n                        appendTo=\"body\"\r\n                        [addTag]=\"false\"\r\n                        [multiple]=\"true\"\r\n                        formControlName=\"states\"\r\n                        [placeholder]=\"'state.all-orders' | translate\"\r\n                        [clearable]=\"true\"\r\n                        [searchable]=\"false\"\r\n                    >\r\n                        <ng-template ng-option-tmp let-item=\"item\">{{\r\n                            item | stateI18nToken | translate\r\n                        }}</ng-template>\r\n                        <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n                            <span class=\"ng-value-label\"> {{ item | stateI18nToken | translate }}</span>\r\n                            <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\"\r\n                                >\u00D7</span\r\n                            >\r\n                        </ng-template>\r\n                    </ng-select>\r\n                    <button\r\n                        class=\"btn btn-secondary\"\r\n                        [disabled]=\"customFilterForm.pristine\"\r\n                        (click)=\"applyCustomFilters()\"\r\n                    >\r\n                        {{ 'order.apply-filters' | translate }}\r\n                        <clr-icon shape=\"filter\"></clr-icon>\r\n                    </button>\r\n                </div>\r\n                <div class=\"flex\">\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-start' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtStart\"></vdr-datetime-picker>\r\n                    </div>\r\n                    <div>\r\n                        <label>{{ 'order.placed-at-end' | translate }}</label>\r\n                        <vdr-datetime-picker formControlName=\"placedAtEnd\"></vdr-datetime-picker>\r\n                    </div>\r\n                </div>\r\n            </form>\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n        <ng-container *ngIf=\"canCreateDraftOrder\">\r\n            <a class=\"btn btn-primary mt1\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-draft-order' | translate }}\r\n            </a>\r\n        </ng-container>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.customer' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.order-type' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.state' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.total' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.placed-at' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'order.shipping' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-order=\"item\">\r\n        <td class=\"left align-middle\">{{ order.code }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-label [customer]=\"order.customer\"></vdr-customer-label>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-chip>{{ order.type }}</vdr-chip>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </td>\r\n        <td class=\"left align-middle\">{{ order.totalWithTax | localeCurrency: order.currencyCode }}</td>\r\n        <td class=\"left align-middle\">{{ order.updatedAt | timeAgo }}</td>\r\n        <td class=\"left align-middle\">{{ order.orderPlacedAt | localeDate: 'medium' }}</td>\r\n        <td class=\"left align-middle\">{{ getShippingNames(order) }}</td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"shopping-cart\"\r\n                [label]=\"'common.open' | translate\"\r\n                [linkTo]=\"\r\n                    order.state === 'Modifying'\r\n                        ? ['./', order.id, 'modify']\r\n                        : order.state === 'Draft'\r\n                        ? ['./draft', order.id]\r\n                        : ['./', order.id]\r\n                \"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.ServerConfigService }, { type: i1.DataService }, { type: i1.LocalStorageService }, { type: i1.ChannelService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }]; } });
 
 /**
  * Resolves the id from the path into a Customer entity.
@@ -2912,6 +2975,7 @@ class OrderResolver {
         // Complete the entity stream upon navigating away
         const navigateAway$ = this.router.events.pipe(filter(event => event instanceof ActivationStart));
         const stream = this.dataService.order
+            // tslint:disable-next-line:no-non-null-assertion
             .getOrder(id)
             .mapStream(data => data.order)
             .pipe(switchMap(order => {
@@ -3000,6 +3064,18 @@ const orderRoutes = [
             breadcrumb: orderBreadcrumb,
         },
     },
+    {
+        path: ':aggregateOrderId/seller-orders/:id',
+        component: OrderDetailComponent,
+        resolve: {
+            entity: OrderResolver,
+        },
+        canActivate: [OrderGuard],
+        canDeactivate: [CanDeactivateDetailGuard],
+        data: {
+            breadcrumb: orderBreadcrumb,
+        },
+    },
     {
         path: ':id/modify',
         component: OrderEditorComponent,
@@ -3013,13 +3089,40 @@ const orderRoutes = [
     },
 ];
 function orderBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.orders',
-        getName: order => order.code,
-        route: '',
-    });
+    return data.entity.pipe(map((entity) => {
+        if (entity.aggregateOrder) {
+            return [
+                {
+                    label: 'breadcrumb.orders',
+                    link: ['../'],
+                },
+                {
+                    label: entity.aggregateOrder.code,
+                    link: ['../', entity.aggregateOrder.id],
+                },
+                {
+                    label: marker('breadcrumb.seller-orders'),
+                    link: ['../', entity.aggregateOrder.id],
+                },
+                {
+                    label: entity.code,
+                    link: [entity.id],
+                },
+            ];
+        }
+        else {
+            return [
+                {
+                    label: 'breadcrumb.orders',
+                    link: ['../'],
+                },
+                {
+                    label: entity.code,
+                    link: [entity.id],
+                },
+            ];
+        }
+    }));
 }
 function modifyingOrderBreadcrumb(data, params) {
     return orderBreadcrumb(data, params).pipe(map((breadcrumbs) => {
@@ -3067,7 +3170,8 @@ OrderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
         SelectAddressDialogComponent,
         CouponCodeSelectorComponent,
         SelectShippingMethodDialogComponent,
-        OrderHistoryEntryHostComponent], imports: [SharedModule, i1$1.RouterModule] });
+        OrderHistoryEntryHostComponent,
+        SellerOrdersCardComponent], imports: [SharedModule, i1$1.RouterModule] });
 OrderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderModule, imports: [[SharedModule, RouterModule.forChild(orderRoutes)]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: OrderModule, decorators: [{
             type: NgModule,
@@ -3109,6 +3213,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
                         CouponCodeSelectorComponent,
                         SelectShippingMethodDialogComponent,
                         OrderHistoryEntryHostComponent,
+                        SellerOrdersCardComponent,
                     ],
                 }]
         }] });
@@ -3119,5 +3224,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AddManualPaymentDialogComponent, CancelOrderDialogComponent, CouponCodeSelectorComponent, DraftOrderDetailComponent, DraftOrderVariantSelectorComponent, FulfillOrderDialogComponent, FulfillmentCardComponent, FulfillmentDetailComponent, FulfillmentStateLabelComponent, GET_CUSTOMER_ADDRESSES, LineFulfillmentComponent, LineRefundsComponent, ModificationDetailComponent, NODE_HEIGHT, OrderCustomFieldsCardComponent, OrderDetailComponent, OrderEditResultType, OrderEditorComponent, OrderEditsPreviewDialogComponent, OrderGuard, OrderHistoryComponent, OrderHistoryEntryHostComponent, OrderListComponent, OrderModule, OrderPaymentCardComponent, OrderProcessEdgeComponent, OrderProcessGraphComponent, OrderProcessGraphDialogComponent, OrderProcessNodeComponent, OrderResolver, OrderStateSelectDialogComponent, OrderTableComponent, OrderTransitionService, PaymentDetailComponent, PaymentStateLabelComponent, RefundOrderDialogComponent, RefundStateLabelComponent, SelectAddressDialogComponent, SelectCustomerDialogComponent, SelectShippingMethodDialogComponent, SettleRefundDialogComponent, SimpleItemListComponent, modifyingOrderBreadcrumb, orderBreadcrumb, orderRoutes };
+export { AddManualPaymentDialogComponent, CancelOrderDialogComponent, CouponCodeSelectorComponent, DraftOrderDetailComponent, DraftOrderVariantSelectorComponent, FulfillOrderDialogComponent, FulfillmentCardComponent, FulfillmentDetailComponent, FulfillmentStateLabelComponent, GET_CUSTOMER_ADDRESSES, GET_SELLER_ORDERS, LineFulfillmentComponent, LineRefundsComponent, ModificationDetailComponent, NODE_HEIGHT, OrderCustomFieldsCardComponent, OrderDetailComponent, OrderEditResultType, OrderEditorComponent, OrderEditsPreviewDialogComponent, OrderGuard, OrderHistoryComponent, OrderHistoryEntryHostComponent, OrderListComponent, OrderModule, OrderPaymentCardComponent, OrderProcessEdgeComponent, OrderProcessGraphComponent, OrderProcessGraphDialogComponent, OrderProcessNodeComponent, OrderResolver, OrderStateSelectDialogComponent, OrderTableComponent, OrderTransitionService, PaymentDetailComponent, PaymentStateLabelComponent, RefundOrderDialogComponent, RefundStateLabelComponent, SelectAddressDialogComponent, SelectCustomerDialogComponent, SelectShippingMethodDialogComponent, SellerOrdersCardComponent, SettleRefundDialogComponent, SimpleItemListComponent, modifyingOrderBreadcrumb, orderBreadcrumb, orderRoutes };
 //# sourceMappingURL=vendure-admin-ui-order.mjs.map