feat(core): Allow customField ui components to be specified in config

Relates to #415
vendure-ecommerce · Nov 25, 2021 · e22e006 · e22e006
1 parent 7552fae
commit e22e006
Show file tree

Hide file tree

Showing 14 changed files with 110 additions and 18 deletions.
diff --git a/packages/asset-server-plugin/e2e/graphql/generated-e2e-asset-server-plugin-types.ts b/packages/asset-server-plugin/e2e/graphql/generated-e2e-asset-server-plugin-types.ts
@@ -268,6 +268,7 @@ export type BooleanCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type BooleanOperators = {
@@ -1108,6 +1109,7 @@ export type CustomField = {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type CustomFieldConfig =
@@ -1284,6 +1286,7 @@ export type DateTimeCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['String']>;
     max?: Maybe<Scalars['String']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type DeleteAssetInput = {
@@ -1496,6 +1499,7 @@ export type FloatCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Float']>;
     max?: Maybe<Scalars['Float']>;
     step?: Maybe<Scalars['Float']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type FulfillOrderInput = {
@@ -1647,6 +1651,7 @@ export type IntCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Int']>;
     max?: Maybe<Scalars['Int']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 /** Returned if the user authentication credentials are not valid */
@@ -2097,6 +2102,7 @@ export type LocaleStringCustomFieldConfig = CustomField & {
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type LocalizedString = {
@@ -4075,6 +4081,7 @@ export type RelationCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     entity: Scalars['String'];
     scalarFields: Array<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type Release = Node &
@@ -4410,6 +4417,7 @@ export type StringCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
     options?: Maybe<Array<StringFieldOption>>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type StringFieldOption = {
@@ -4589,6 +4597,7 @@ export type TextCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type TransitionFulfillmentToStateResult = Fulfillment | FulfillmentStateTransitionError;

diff --git a/packages/common/src/generated-shop-types.ts b/packages/common/src/generated-shop-types.ts
@@ -127,6 +127,7 @@ export type BooleanCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type BooleanOperators = {
@@ -712,6 +713,7 @@ export type CustomField = {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type CustomFieldConfig =
@@ -827,6 +829,7 @@ export type DateTimeCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['String']>;
     max?: Maybe<Scalars['String']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type DeletionResponse = {
@@ -1009,6 +1012,7 @@ export type FloatCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Float']>;
     max?: Maybe<Scalars['Float']>;
     step?: Maybe<Scalars['Float']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type Fulfillment = Node & {
@@ -1153,6 +1157,7 @@ export type IntCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Int']>;
     max?: Maybe<Scalars['Int']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 /** Returned if the user authentication credentials are not valid */
@@ -1501,6 +1506,7 @@ export type LocaleStringCustomFieldConfig = CustomField & {
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type LocalizedString = {
@@ -2678,6 +2684,7 @@ export type RelationCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     entity: Scalars['String'];
     scalarFields: Array<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type RemoveOrderItemsResult = Order | OrderModificationError;
@@ -2865,6 +2872,7 @@ export type StringCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
     options?: Maybe<Array<StringFieldOption>>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type StringFieldOption = {
@@ -2962,6 +2970,7 @@ export type TextCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type TransitionOrderToStateResult = Order | OrderStateTransitionError;

diff --git a/packages/common/src/generated-types.ts b/packages/common/src/generated-types.ts
@@ -270,6 +270,7 @@ export type BooleanCustomFieldConfig = CustomField & {
   readonly?: Maybe<Scalars['Boolean']>;
   internal?: Maybe<Scalars['Boolean']>;
   nullable?: Maybe<Scalars['Boolean']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type BooleanOperators = {
@@ -1124,6 +1125,7 @@ export type CustomField = {
   readonly?: Maybe<Scalars['Boolean']>;
   internal?: Maybe<Scalars['Boolean']>;
   nullable?: Maybe<Scalars['Boolean']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type CustomFieldConfig = StringCustomFieldConfig | LocaleStringCustomFieldConfig | IntCustomFieldConfig | FloatCustomFieldConfig | BooleanCustomFieldConfig | DateTimeCustomFieldConfig | RelationCustomFieldConfig | TextCustomFieldConfig;
@@ -1302,6 +1304,7 @@ export type DateTimeCustomFieldConfig = CustomField & {
   min?: Maybe<Scalars['String']>;
   max?: Maybe<Scalars['String']>;
   step?: Maybe<Scalars['Int']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type DeleteAssetInput = {
@@ -1525,6 +1528,7 @@ export type FloatCustomFieldConfig = CustomField & {
   min?: Maybe<Scalars['Float']>;
   max?: Maybe<Scalars['Float']>;
   step?: Maybe<Scalars['Float']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type FulfillOrderInput = {
@@ -1685,6 +1689,7 @@ export type IntCustomFieldConfig = CustomField & {
   min?: Maybe<Scalars['Int']>;
   max?: Maybe<Scalars['Int']>;
   step?: Maybe<Scalars['Int']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 /** Returned if the user authentication credentials are not valid */
@@ -2145,6 +2150,7 @@ export type LocaleStringCustomFieldConfig = CustomField & {
   internal?: Maybe<Scalars['Boolean']>;
   nullable?: Maybe<Scalars['Boolean']>;
   pattern?: Maybe<Scalars['String']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type LocalizedString = {
@@ -4308,6 +4314,7 @@ export type RelationCustomFieldConfig = CustomField & {
   nullable?: Maybe<Scalars['Boolean']>;
   entity: Scalars['String'];
   scalarFields: Array<Scalars['String']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type Release = Node & StockMovement & {
@@ -4655,6 +4662,7 @@ export type StringCustomFieldConfig = CustomField & {
   nullable?: Maybe<Scalars['Boolean']>;
   pattern?: Maybe<Scalars['String']>;
   options?: Maybe<Array<StringFieldOption>>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type StringFieldOption = {
@@ -4846,6 +4854,7 @@ export type TextCustomFieldConfig = CustomField & {
   readonly?: Maybe<Scalars['Boolean']>;
   internal?: Maybe<Scalars['Boolean']>;
   nullable?: Maybe<Scalars['Boolean']>;
+  ui?: Maybe<Scalars['JSON']>;
 };
 
 export type TransitionFulfillmentToStateResult = Fulfillment | FulfillmentStateTransitionError;

diff --git a/packages/common/src/shared-types.ts b/packages/common/src/shared-types.ts
@@ -170,6 +170,20 @@ type DefaultFormConfigHash = {
 
 export type DefaultFormComponentConfig<T extends DefaultFormComponentId> = DefaultFormConfigHash[T];
 
+export type UiComponentConfig =
+    | ({ component: 'number-form-input' } & DefaultFormComponentConfig<'number-form-input'>)
+    | ({ component: 'date-form-input' } & DefaultFormComponentConfig<'date-form-input'>)
+    | ({ component: 'select-form-input' } & DefaultFormComponentConfig<'select-form-input'>)
+    | ({ component: 'text-form-input' } & DefaultFormComponentConfig<'text-form-input'>)
+    | ({ component: 'boolean-form-input' } & DefaultFormComponentConfig<'boolean-form-input'>)
+    | ({ component: 'currency-form-input' } & DefaultFormComponentConfig<'currency-form-input'>)
+    | ({ component: 'facet-value-form-input' } & DefaultFormComponentConfig<'facet-value-form-input'>)
+    | ({
+          component: 'product-selector-form-input';
+      } & DefaultFormComponentConfig<'product-selector-form-input'>)
+    | ({ component: 'customer-group-form-input' } & DefaultFormComponentConfig<'customer-group-form-input'>)
+    | { component: string; [prop: string]: any };
+
 export type CustomFieldsObject = { [key: string]: any };
 
 /**

diff --git a/packages/core/e2e/graphql/generated-e2e-admin-types.ts b/packages/core/e2e/graphql/generated-e2e-admin-types.ts
@@ -268,6 +268,7 @@ export type BooleanCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type BooleanOperators = {
@@ -1108,6 +1109,7 @@ export type CustomField = {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type CustomFieldConfig =
@@ -1284,6 +1286,7 @@ export type DateTimeCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['String']>;
     max?: Maybe<Scalars['String']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type DeleteAssetInput = {
@@ -1496,6 +1499,7 @@ export type FloatCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Float']>;
     max?: Maybe<Scalars['Float']>;
     step?: Maybe<Scalars['Float']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type FulfillOrderInput = {
@@ -1647,6 +1651,7 @@ export type IntCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Int']>;
     max?: Maybe<Scalars['Int']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 /** Returned if the user authentication credentials are not valid */
@@ -2097,6 +2102,7 @@ export type LocaleStringCustomFieldConfig = CustomField & {
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type LocalizedString = {
@@ -4075,6 +4081,7 @@ export type RelationCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     entity: Scalars['String'];
     scalarFields: Array<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type Release = Node &
@@ -4410,6 +4417,7 @@ export type StringCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
     options?: Maybe<Array<StringFieldOption>>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type StringFieldOption = {
@@ -4589,6 +4597,7 @@ export type TextCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type TransitionFulfillmentToStateResult = Fulfillment | FulfillmentStateTransitionError;

diff --git a/packages/core/e2e/graphql/generated-e2e-shop-types.ts b/packages/core/e2e/graphql/generated-e2e-shop-types.ts
@@ -120,6 +120,7 @@ export type BooleanCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type BooleanOperators = {
@@ -686,6 +687,7 @@ export type CustomField = {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type CustomFieldConfig =
@@ -797,6 +799,7 @@ export type DateTimeCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['String']>;
     max?: Maybe<Scalars['String']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type DeletionResponse = {
@@ -969,6 +972,7 @@ export type FloatCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Float']>;
     max?: Maybe<Scalars['Float']>;
     step?: Maybe<Scalars['Float']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type Fulfillment = Node & {
@@ -1104,6 +1108,7 @@ export type IntCustomFieldConfig = CustomField & {
     min?: Maybe<Scalars['Int']>;
     max?: Maybe<Scalars['Int']>;
     step?: Maybe<Scalars['Int']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 /** Returned if the user authentication credentials are not valid */
@@ -1450,6 +1455,7 @@ export type LocaleStringCustomFieldConfig = CustomField & {
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type LocalizedString = {
@@ -2587,6 +2593,7 @@ export type RelationCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     entity: Scalars['String'];
     scalarFields: Array<Scalars['String']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type RemoveOrderItemsResult = Order | OrderModificationError;
@@ -2761,6 +2768,7 @@ export type StringCustomFieldConfig = CustomField & {
     nullable?: Maybe<Scalars['Boolean']>;
     pattern?: Maybe<Scalars['String']>;
     options?: Maybe<Array<StringFieldOption>>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type StringFieldOption = {
@@ -2848,6 +2856,7 @@ export type TextCustomFieldConfig = CustomField & {
     readonly?: Maybe<Scalars['Boolean']>;
     internal?: Maybe<Scalars['Boolean']>;
     nullable?: Maybe<Scalars['Boolean']>;
+    ui?: Maybe<Scalars['JSON']>;
 };
 
 export type TransitionOrderToStateResult = Order | OrderStateTransitionError;