feat(admin-ui): Support new API for ProductVariant.trackInventory

packages/admin-ui/i18n-coverage.json

@@ -1,41 +1,41 @@
 {
-  "generatedOn": "2020-10-05T10:27:57.372Z",
-  "lastCommit": "30dc63957a149d7175935cb31047cd46016b73bc",
+  "generatedOn": "2020-10-16T14:52:59.320Z",
+  "lastCommit": "ee39263e9928dda664ad137e7e26248a8593b2a9",
   "translationStatus": {
     "de": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 609,
-      "percentage": 91
+      "percentage": 90
     },
     "en": {
-      "tokenCount": 672,
-      "translatedCount": 672,
+      "tokenCount": 677,
+      "translatedCount": 675,
       "percentage": 100
     },
     "es": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 466,
       "percentage": 69
     },
     "pl": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 564,
-      "percentage": 84
+      "percentage": 83
     },
     "pt_BR": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 655,
       "percentage": 97
     },
     "zh_Hans": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 548,
-      "percentage": 82
+      "percentage": 81
     },
     "zh_Hant": {
-      "tokenCount": 672,
+      "tokenCount": 677,
       "translatedCount": 548,
-      "percentage": 82
+      "percentage": 81
     }
   }
 }

packages/admin-ui/src/lib/catalog/src/components/product-detail/product-detail.component.ts

@@ -11,6 +11,7 @@ import {
     DataService,
     FacetWithValues,
     flattenFacetValues,
+    GlobalFlag,
     IGNORE_CAN_DEACTIVATE_GUARD,
     LanguageCode,
     ModalService,
@@ -59,7 +60,7 @@ export interface VariantFormValue {
     priceWithTax: number;
     taxCategoryId: string;
     stockOnHand: number;
-    trackInventory: boolean;
+    trackInventory: GlobalFlag;
     facetValueIds: string[];
     customFields?: any;
 }
@@ -75,7 +76,8 @@ export interface SelectedAssets {
     styleUrls: ['./product-detail.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class ProductDetailComponent extends BaseDetailComponent<ProductWithVariants.Fragment>
+export class ProductDetailComponent
+    extends BaseDetailComponent<ProductWithVariants.Fragment>
     implements OnInit, OnDestroy {
     activeTab$: Observable<TabName>;
     product$: Observable<ProductWithVariants.Fragment>;

packages/admin-ui/src/lib/catalog/src/components/product-variants-list/product-variants-list.component.html

@@ -1,7 +1,7 @@
 <div class="variants-list">
     <div
         class="variant-container card"
-        *ngFor="let variant of variants | paginate: pagination; trackBy:trackById, let i = index"
+        *ngFor="let variant of variants | paginate: pagination; trackBy: trackById; let i = index"
         [class.disabled]="!formGroupMap.get(variant.id)?.get('enabled')?.value"
     >
         <ng-container *ngIf="formGroupMap.get(variant.id) as formGroup" [formGroup]="formGroup">
@@ -103,16 +103,25 @@
                                         [readonly]="!('UpdateCatalog' | hasPermission)"
                                     />
                                 </clr-input-container>
-                                <clr-checkbox-wrapper class="track-inventory-toggle">
-                                    <input
-                                        type="checkbox"
-                                        clrCheckbox
-                                        name="trackInventory"
-                                        formControlName="trackInventory"
-                                        [vdrDisabled]="!('UpdateCatalog' | hasPermission)"
-                                    />
-                                    <label>{{ 'catalog.track-inventory' | translate }}</label>
-                                </clr-checkbox-wrapper>
+                                <clr-select-container *vdrIfPermissions="'UpdateCatalog'">
+                                    <label
+                                        >{{ 'catalog.track-inventory' | translate }}
+                                        <vdr-help-tooltip
+                                            [content]="'catalog.track-inventory-info' | translate"
+                                        ></vdr-help-tooltip>
+                                    </label>
+                                    <select clrSelect name="options" formControlName="trackInventory">
+                                        <option [value]="GlobalFlag.TRUE">
+                                            {{ 'catalog.track-inventory-true' | translate }}
+                                        </option>
+                                        <option [value]="GlobalFlag.FALSE">
+                                            {{ 'catalog.track-inventory-false' | translate }}
+                                        </option>
+                                        <option [value]="GlobalFlag.INHERIT">
+                                            {{ 'catalog.track-inventory-inherit' | translate }}
+                                        </option>
+                                    </select>
+                                </clr-select-container>
                             </div>
                         </div>
                         <div class="custom-fields">

packages/admin-ui/src/lib/catalog/src/components/product-variants-list/product-variants-list.component.ts

@@ -16,6 +16,7 @@ import {
     FacetValue,
     FacetWithValues,
     flattenFacetValues,
+    GlobalFlag,
     LanguageCode,
     ModalService,
     ProductOptionFragment,
@@ -62,6 +63,7 @@ export class ProductVariantsListComponent implements OnChanges, OnInit, OnDestro
         itemsPerPage: 10,
     };
     formGroupMap = new Map<string, FormGroup>();
+    GlobalFlag = GlobalFlag;
     private facetValues: FacetValue.Fragment[];
     private subscription: Subscription;
 

packages/admin-ui/src/lib/core/src/common/generated-types.ts

@@ -1636,7 +1636,7 @@ export type ProductVariant = Node & {
   __typename?: 'ProductVariant';
   enabled: Scalars['Boolean'];
   stockOnHand: Scalars['Int'];
-  trackInventory: Scalars['Boolean'];
+  trackInventory: GlobalFlag;
   stockMovements: StockMovementList;
   id: Scalars['ID'];
   product: Product;
@@ -1722,7 +1722,7 @@ export type CreateProductVariantInput = {
   featuredAssetId?: Maybe<Scalars['ID']>;
   assetIds?: Maybe<Array<Scalars['ID']>>;
   stockOnHand?: Maybe<Scalars['Int']>;
-  trackInventory?: Maybe<Scalars['Boolean']>;
+  trackInventory?: Maybe<GlobalFlag>;
   customFields?: Maybe<Scalars['JSON']>;
 };
 
@@ -1737,7 +1737,7 @@ export type UpdateProductVariantInput = {
   featuredAssetId?: Maybe<Scalars['ID']>;
   assetIds?: Maybe<Array<Scalars['ID']>>;
   stockOnHand?: Maybe<Scalars['Int']>;
-  trackInventory?: Maybe<Scalars['Boolean']>;
+  trackInventory?: Maybe<GlobalFlag>;
   customFields?: Maybe<Scalars['JSON']>;
 };
 
@@ -1900,6 +1900,12 @@ export type UpdateZoneInput = {
 
 
 
+export enum GlobalFlag {
+  TRUE = 'TRUE',
+  FALSE = 'FALSE',
+  INHERIT = 'INHERIT'
+}
+
 export enum AdjustmentType {
   TAX = 'TAX',
   PROMOTION = 'PROMOTION',
@@ -4044,7 +4050,7 @@ export type TaxRateSortParameter = {
 export type ProductVariantFilterParameter = {
   enabled?: Maybe<BooleanOperators>;
   stockOnHand?: Maybe<NumberOperators>;
-  trackInventory?: Maybe<BooleanOperators>;
+  trackInventory?: Maybe<StringOperators>;
   createdAt?: Maybe<DateOperators>;
   updatedAt?: Maybe<DateOperators>;
   languageCode?: Maybe<StringOperators>;

packages/admin-ui/src/lib/core/src/shared/components/help-tooltip/help-tooltip.component.html

@@ -0,0 +1,6 @@
+<clr-tooltip>
+    <clr-icon clrTooltipTrigger shape="help" size="14"></clr-icon>
+    <clr-tooltip-content clrPosition="top-left" clrSize="md" *clrIfOpen>
+        <span>{{ content }}</span>
+    </clr-tooltip-content>
+</clr-tooltip>

packages/admin-ui/src/lib/core/src/shared/components/help-tooltip/help-tooltip.component.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+
+@Component({
+    selector: 'vdr-help-tooltip',
+    templateUrl: './help-tooltip.component.html',
+    styleUrls: ['./help-tooltip.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HelpTooltipComponent {
+    @Input() content: string;
+}

packages/admin-ui/src/lib/core/src/shared/components/title-input/title-input.component.scss

@@ -18,6 +18,10 @@
         max-width: 100%;
     }
 
+    ::ng-deep .clr-input-wrapper {
+        max-width: 100% !important;
+    }
+
     .edit-icon {
         position: absolute;
         right: 8px;

packages/admin-ui/src/lib/core/src/shared/shared.module.ts

@@ -52,6 +52,7 @@ import { FormFieldControlDirective } from './components/form-field/form-field-co
 import { FormFieldComponent } from './components/form-field/form-field.component';
 import { FormItemComponent } from './components/form-item/form-item.component';
 import { FormattedAddressComponent } from './components/formatted-address/formatted-address.component';
+import { HelpTooltipComponent } from './components/help-tooltip/help-tooltip.component';
 import { HistoryEntryDetailComponent } from './components/history-entry-detail/history-entry-detail.component';
 import { ItemsPerPageControlsComponent } from './components/items-per-page-controls/items-per-page-controls.component';
 import { LabeledDataComponent } from './components/labeled-data/labeled-data.component';
@@ -188,6 +189,8 @@ const DECLARATIONS = [
     ProductSelectorFormInputComponent,
     OrderStateI18nTokenPipe,
     ProductSelectorComponent,
+    HelpTooltipComponent,
+    CustomerGroupFormInputComponent,
 ];
 
 const DYNAMIC_FORM_INPUTS = [
@@ -205,7 +208,7 @@ const DYNAMIC_FORM_INPUTS = [
 @NgModule({
     imports: [IMPORTS],
     exports: [...IMPORTS, ...DECLARATIONS, ...DYNAMIC_FORM_INPUTS],
-    declarations: [...DECLARATIONS, ...DYNAMIC_FORM_INPUTS, CustomerGroupFormInputComponent],
+    declarations: [...DECLARATIONS, ...DYNAMIC_FORM_INPUTS],
     providers: [
         // This needs to be shared, since lazy-loaded
         // modules have their own entryComponents which

packages/admin-ui/src/lib/settings/src/components/global-settings/global-settings.component.html

@@ -41,7 +41,10 @@
             formControlName="trackInventory"
             [vdrDisabled]="!('UpdateSettings' | hasPermission)"
         />
-        <label>{{ 'settings.track-inventory-default' | translate }}</label>
+        <label
+            >{{ 'settings.track-inventory-default' | translate }}
+            <vdr-help-tooltip [content]="'catalog.track-inventory-info' | translate"></vdr-help-tooltip>
+        </label>
     </clr-toggle-wrapper>
     <section formGroupName="customFields" *ngIf="customFields.length">
         <label>{{ 'common.custom-fields' | translate }}</label>

packages/admin-ui/src/lib/static/i18n-messages/de.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "Suche nach Produktname oder -code",
     "sku": "Artikelnummer",
     "slug": "Slug",
+    "slug-pattern-error": "",
     "stock-on-hand": "Bestand",
     "tax-category": "Steuerkategorie",
     "taxes": "Steuern",
     "track-inventory": "Bestand verfolgen",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "Produktoption aktualisieren",
     "values": "Werte",
     "variant": "Variante",

packages/admin-ui/src/lib/static/i18n-messages/en.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "Search by product name or code",
     "sku": "SKU",
     "slug": "Slug",
+    "slug-pattern-error": "",
     "stock-on-hand": "Stock",
     "tax-category": "Tax category",
     "taxes": "Taxes",
     "track-inventory": "Track inventory",
+    "track-inventory-false": "Do no track",
+    "track-inventory-info": "When tracked, product variant stock levels will be automatically adjusted when sold",
+    "track-inventory-inherit": "Inherit from global settings",
+    "track-inventory-true": "Track",
     "update-product-option": "Update product option",
     "values": "Values",
     "variant": "Variant",
@@ -701,4 +706,4 @@
     "job-result": "Job result",
     "job-state": "Job state"
   }
-}
+}

packages/admin-ui/src/lib/static/i18n-messages/es.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "Buscar por nombre o código de producto",
     "sku": "SKU",
     "slug": "Slug",
+    "slug-pattern-error": "",
     "stock-on-hand": "Inventario disponible",
     "tax-category": "Categoría de impuestos",
     "taxes": "Impuestos",
     "track-inventory": "",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "Actualizar opción",
     "values": "Valores",
     "variant": "Variantes",

packages/admin-ui/src/lib/static/i18n-messages/pl.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "Szukaj produktu po nazwie lub kodzie",
     "sku": "SKU",
     "slug": "Slug",
+    "slug-pattern-error": "",
     "stock-on-hand": "Stan magazynowy",
     "tax-category": "Kategoria podatkowa",
     "taxes": "Podatki",
     "track-inventory": "Śledź magazyn",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "Zaktualizuj opcje produktu",
     "values": "Wartości",
     "variant": "Warianty",

packages/admin-ui/src/lib/static/i18n-messages/pt_BR.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "Pesquisar por nome ou código do produto",
     "sku": "SKU",
     "slug": "Slug",
+    "slug-pattern-error": "",
     "stock-on-hand": "Estoque",
     "tax-category": "Categoria de impostos",
     "taxes": "Impostos",
     "track-inventory": "Rastrear inventário",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "Atualizar opção do produto",
     "values": "Valores",
     "variant": "Variação",

packages/admin-ui/src/lib/static/i18n-messages/zh_Hans.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "输入要搜索的商品名称或商品编码",
     "sku": "商品库存编码",
     "slug": "名称缩写",
+    "slug-pattern-error": "",
     "stock-on-hand": "库存",
     "tax-category": "税表分类",
     "taxes": "价格（含税）",
     "track-inventory": "跟踪库存",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "更新产品规格",
     "values": "值",
     "variant": "商品规格",

packages/admin-ui/src/lib/static/i18n-messages/zh_Hant.json

@@ -122,10 +122,15 @@
     "search-product-name-or-code": "輸入要搜索的商品名稱或商品編碼",
     "sku": "商品庫存編碼",
     "slug": "名稱缩写",
+    "slug-pattern-error": "",
     "stock-on-hand": "庫存",
     "tax-category": "税表分類",
     "taxes": "價格（連税）",
     "track-inventory": "跟踪庫存",
+    "track-inventory-false": "",
+    "track-inventory-info": "",
+    "track-inventory-inherit": "",
+    "track-inventory-true": "",
     "update-product-option": "更新產品規格",
     "values": "值",
     "variant": "商品規格",