Skip to content

Commit

Permalink
feat(admin-ui): Add support for translatable PaymentMethods
Browse files Browse the repository at this point in the history 
Relates to #1184
  • Loading branch information
@michaelbromley
michaelbromley committed Feb 23, 2023
1 parent 2a4b3bc commit 06efc50
Show file tree
Hide file tree
Showing 6 changed files with 108 additions and 43 deletions.
35 changes: 26 additions & 9 deletions packages/admin-ui/src/lib/core/src/common/generated-types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -745,10 +745,9 @@ export type CreatePaymentMethodInput = {
checker?: InputMaybe<ConfigurableOperationInput>;
code: Scalars['String'];
customFields?: InputMaybe<Scalars['JSON']>;
description?: InputMaybe<Scalars['String']>;
enabled: Scalars['Boolean'];
handler: ConfigurableOperationInput;
name: Scalars['String'];
translations: Array<PaymentMethodTranslationInput>;
};

export type CreateProductInput = {
Expand Down Expand Up @@ -3884,6 +3883,7 @@ export type PaymentMethod = Node & {
handler: ConfigurableOperation;
id: Scalars['ID'];
name: Scalars['String'];
translations: Array<PaymentMethodTranslation>;
updatedAt: Scalars['DateTime'];
};

Expand Down Expand Up @@ -3946,6 +3946,24 @@ export type PaymentMethodSortParameter = {
updatedAt?: InputMaybe<SortOrder>;
};

export type PaymentMethodTranslation = {
__typename?: 'PaymentMethodTranslation';
createdAt: Scalars['DateTime'];
description: Scalars['String'];
id: Scalars['ID'];
languageCode: LanguageCode;
name: Scalars['String'];
updatedAt: Scalars['DateTime'];
};

export type PaymentMethodTranslationInput = {
customFields?: InputMaybe<Scalars['JSON']>;
description?: InputMaybe<Scalars['String']>;
id?: InputMaybe<Scalars['ID']>;
languageCode: LanguageCode;
name?: InputMaybe<Scalars['String']>;
};

/** Returned if an attempting to refund a Payment against OrderLines from a different Order */
export type PaymentOrderMismatchError = ErrorResult & {
__typename?: 'PaymentOrderMismatchError';
Expand Down Expand Up @@ -5804,11 +5822,10 @@ export type UpdatePaymentMethodInput = {
checker?: InputMaybe<ConfigurableOperationInput>;
code?: InputMaybe<Scalars['String']>;
customFields?: InputMaybe<Scalars['JSON']>;
description?: InputMaybe<Scalars['String']>;
enabled?: InputMaybe<Scalars['Boolean']>;
handler?: InputMaybe<ConfigurableOperationInput>;
id: Scalars['ID'];
name?: InputMaybe<Scalars['String']>;
translations?: InputMaybe<Array<PaymentMethodTranslationInput>>;
};

export type UpdateProductInput = {
Expand Down Expand Up @@ -7362,14 +7379,14 @@ export type DeleteChannelMutationVariables = Exact<{

export type DeleteChannelMutation = { deleteChannel: { __typename?: 'DeletionResponse', result: DeletionResult, message?: string | null } };

export type PaymentMethodFragment = { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } };
export type PaymentMethodFragment = { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, translations: Array<{ __typename?: 'PaymentMethodTranslation', id: string, languageCode: LanguageCode, name: string, description: string }>, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } };

export type GetPaymentMethodListQueryVariables = Exact<{
options: PaymentMethodListOptions;
}>;


export type GetPaymentMethodListQuery = { paymentMethods: { __typename?: 'PaymentMethodList', totalItems: number, items: Array<{ __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } }> } };
export type GetPaymentMethodListQuery = { paymentMethods: { __typename?: 'PaymentMethodList', totalItems: number, items: Array<{ __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, translations: Array<{ __typename?: 'PaymentMethodTranslation', id: string, languageCode: LanguageCode, name: string, description: string }>, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } }> } };

export type GetPaymentMethodOperationsQueryVariables = Exact<{ [key: string]: never; }>;

Expand All @@ -7381,21 +7398,21 @@ export type GetPaymentMethodQueryVariables = Exact<{
}>;


export type GetPaymentMethodQuery = { paymentMethod?: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } | null };
export type GetPaymentMethodQuery = { paymentMethod?: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, translations: Array<{ __typename?: 'PaymentMethodTranslation', id: string, languageCode: LanguageCode, name: string, description: string }>, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } | null };

export type CreatePaymentMethodMutationVariables = Exact<{
input: CreatePaymentMethodInput;
}>;


export type CreatePaymentMethodMutation = { createPaymentMethod: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } };
export type CreatePaymentMethodMutation = { createPaymentMethod: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, translations: Array<{ __typename?: 'PaymentMethodTranslation', id: string, languageCode: LanguageCode, name: string, description: string }>, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } };

export type UpdatePaymentMethodMutationVariables = Exact<{
input: UpdatePaymentMethodInput;
}>;


export type UpdatePaymentMethodMutation = { updatePaymentMethod: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } };
export type UpdatePaymentMethodMutation = { updatePaymentMethod: { __typename?: 'PaymentMethod', id: string, createdAt: any, updatedAt: any, name: string, code: string, description: string, enabled: boolean, translations: Array<{ __typename?: 'PaymentMethodTranslation', id: string, languageCode: LanguageCode, name: string, description: string }>, checker?: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } | null, handler: { __typename?: 'ConfigurableOperation', code: string, args: Array<{ __typename?: 'ConfigArg', name: string, value: string }> } } };

export type DeletePaymentMethodMutationVariables = Exact<{
id: Scalars['ID'];
Expand Down
6 changes: 6 additions & 0 deletions packages/admin-ui/src/lib/core/src/data/definitions/settings-definitions.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -469,6 +469,12 @@ export const PAYMENT_METHOD_FRAGMENT = gql`
code
description
enabled
translations {
id
languageCode
name
description
}
checker {
...ConfigurableOperation
}
Expand Down
12 changes: 10 additions & 2 deletions packages/admin-ui/src/lib/core/src/data/providers/settings-data.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -389,7 +389,7 @@ export class SettingsDataService {
Codegen.CreatePaymentMethodMutation,
Codegen.CreatePaymentMethodMutationVariables
>(CREATE_PAYMENT_METHOD, {
input,
input: pick(input, ['code', 'checker', 'handler', 'enabled', 'translations', 'customFields']),
});
}

Expand All @@ -398,7 +398,15 @@ export class SettingsDataService {
Codegen.UpdatePaymentMethodMutation,
Codegen.UpdatePaymentMethodMutationVariables
>(UPDATE_PAYMENT_METHOD, {
input,
input: pick(input, [
'id',
'code',
'checker',
'handler',
'enabled',
'translations',
'customFields',
]),
});
}

Expand Down
6 changes: 6 additions & 0 deletions ...rc/lib/settings/src/components/payment-method-detail/payment-method-detail.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@
<vdr-action-bar>
<vdr-ab-left>
<vdr-entity-info [entity]="entity$ | async"></vdr-entity-info>
<vdr-language-selector
[disabled]="isNew$ | async"
[availableLanguageCodes]="availableLanguages$ | async"
[currentLanguageCode]="languageCode$ | async"
(languageCodeChange)="setLanguage($event)"
></vdr-language-selector>
</vdr-ab-left>

<vdr-ab-right>
Expand Down
91 changes: 59 additions & 32 deletions .../src/lib/settings/src/components/payment-method-detail/payment-method-detail.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,21 @@ import {
configurableDefinitionToInstance,
ConfigurableOperation,
ConfigurableOperationDefinition,
CreateFacetInput,
CreatePaymentMethodInput,
createUpdatedTranslatable,
CustomFieldConfig,
DataService,
FacetWithValuesFragment,
findTranslation,
getConfigArgValue,
LanguageCode,
NotificationService,
PaymentMethodFragment,
Permission,
ServerConfigService,
toConfigurableOperationInput,
UpdateFacetInput,
UpdatePaymentMethodInput,
} from '@vendure/admin-ui/core';
import { normalizeString } from '@vendure/common/lib/normalize-string';
Expand Down Expand Up @@ -145,22 +151,17 @@ export class PaymentMethodDetailComponent
if (!selectedHandler) {
return;
}
this.entity$
combineLatest(this.entity$, this.languageCode$)
.pipe(
take(1),
mergeMap(({ id }) => {
const formValue = this.detailForm.value;
const input: CreatePaymentMethodInput = {
name: formValue.name,
code: formValue.code,
description: formValue.description,
enabled: formValue.enabled,
checker: selectedChecker
? toConfigurableOperationInput(selectedChecker, formValue.checker)
: null,
handler: toConfigurableOperationInput(selectedHandler, formValue.handler),
customFields: formValue.customFields,
};
mergeMap(([paymentMethod, languageCode]) => {
const input = this.getUpdatedPaymentMethod(
paymentMethod,
this.detailForm,
languageCode,
selectedHandler,
selectedChecker,
) as CreatePaymentMethodInput;
return this.dataService.settings.createPaymentMethod(input);
}),
)
Expand All @@ -187,23 +188,17 @@ export class PaymentMethodDetailComponent
if (!selectedHandler) {
return;
}
this.entity$
combineLatest(this.entity$, this.languageCode$)
.pipe(
take(1),
mergeMap(({ id }) => {
const formValue = this.detailForm.value;
const input: UpdatePaymentMethodInput = {
id,
name: formValue.name,
code: formValue.code,
description: formValue.description,
enabled: formValue.enabled,
checker: selectedChecker
? toConfigurableOperationInput(selectedChecker, formValue.checker)
: null,
handler: toConfigurableOperationInput(selectedHandler, formValue.handler),
customFields: formValue.customFields,
};
mergeMap(([paymentMethod, languageCode]) => {
const input = this.getUpdatedPaymentMethod(
paymentMethod,
this.detailForm,
languageCode,
selectedHandler,
selectedChecker,
) as UpdatePaymentMethodInput;
return this.dataService.settings.updatePaymentMethod(input);
}),
)
Expand All @@ -223,11 +218,43 @@ export class PaymentMethodDetailComponent
);
}

protected setFormValues(paymentMethod: PaymentMethodFragment): void {
/**
* Given a facet and the value of the detailForm, this method creates an updated copy of the facet which
* can then be persisted to the API.
*/
private getUpdatedPaymentMethod(
paymentMethod: PaymentMethodFragment,
formGroup: FormGroup,
languageCode: LanguageCode,
selectedHandler: ConfigurableOperation,
selectedChecker?: ConfigurableOperation | null,
): UpdatePaymentMethodInput | CreatePaymentMethodInput {
const input = createUpdatedTranslatable({
translatable: paymentMethod,
updatedFields: formGroup.value,
customFieldConfig: this.customFields,
languageCode,
defaultTranslation: {
languageCode,
name: paymentMethod.name || '',
description: paymentMethod.description || '',
},
});
return {
...input,
checker: selectedChecker
? toConfigurableOperationInput(selectedChecker, formGroup.value.checker)
: null,
handler: toConfigurableOperationInput(selectedHandler, formGroup.value.handler),
};
}

protected setFormValues(paymentMethod: PaymentMethodFragment, languageCode: LanguageCode): void {
const currentTranslation = findTranslation(paymentMethod, languageCode);
this.detailForm.patchValue({
name: paymentMethod.name,
name: currentTranslation?.name,
code: paymentMethod.code,
description: paymentMethod.description,
description: currentTranslation?.description,
enabled: paymentMethod.enabled,
checker: paymentMethod.checker || {},
handler: paymentMethod.handler || {},
Expand Down
1 change: 1 addition & 0 deletions packages/admin-ui/src/lib/settings/src/providers/routing/payment-method-resolver.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export class PaymentMethodResolver extends BaseEntityResolver<PaymentMethodFragm
enabled: true,
checker: undefined as any,
handler: undefined as any,
translations: [],
},
id => dataService.settings.getPaymentMethod(id).mapStream(data => data.paymentMethod),
);
Expand Down

0 comments on commit 06efc50

Please sign in to comment.