intacct code prepend (#936)

* initial commit * intacct code perpend code changes * lint fix * imtacct code prepend save * code in export settings and mapping page * import settings payload fix * Payload fixes * Payload fixes * c1 fixes * lint fixes * payload fix * intacct import settings fixes * intacct advande settings fixes --------- Co-authored-by: Hrishabh Tiwari <[email protected]>
fylein · Sep 19, 2024 · ebabc15 · ebabc15
1 parent 181fd90
commit ebabc15
Show file tree

Hide file tree

Showing 12 changed files with 231 additions and 15 deletions.
diff --git a/src/app/core/models/intacct/intacct-configuration/import-settings.model.ts b/src/app/core/models/intacct/intacct-configuration/import-settings.model.ts
@@ -9,7 +9,8 @@ const emptyDestinationAttribute = { id: null, name: null };
 export type Configuration = {
     import_vendors_as_merchants: boolean,
     import_categories: boolean,
-    import_tax_codes: boolean
+    import_tax_codes: boolean,
+    import_code_fields: string[]
 }
 
 export type ImportSettingGeneralMapping = {
@@ -93,11 +94,22 @@ export class ImportSettings {
             isCategoryImportEnabled = filteredExpenseFieldArray.filter((field: MappingSetting) => field.source_field === 'CATEGORY' && field.import_to_fyle).length > 0 ? true : false;
         }
 
+        // Import_code_field value construction
+        const importCodeFields = importSettingsForm.value.importCodeFields;
+
+        const importCodeFieldArray = importCodeFields.filter((field: { import_code: any; }) => field.import_code).map((value: { source_field: any; }) => {
+            return value.source_field;
+        });
+
+        const finalimportCodeFieldArray: string[] = importSettingsForm.value.importCodeField.filter((value: string) => value!=='COST_CODE' && value !== 'COST_TYPE').concat(importCodeFieldArray);
+
+        // Actual Payload
         const importSettingPayload: ImportSettingPost = {
                 configurations: {
                     import_categories: isCategoryImportEnabled,
                     import_tax_codes: importSettingsForm.value.importTaxCodes ? importSettingsForm.value.importTaxCodes : false,
-                    import_vendors_as_merchants: importSettingsForm.value.importVendorAsMerchant ? importSettingsForm.value.importVendorAsMerchant : false
+                    import_vendors_as_merchants: importSettingsForm.value.importVendorAsMerchant ? importSettingsForm.value.importVendorAsMerchant : false,
+                    import_code_fields: finalimportCodeFieldArray
                 },
                 general_mappings: {
                     default_tax_code: importSettingsForm.value.importTaxCodes ? {

diff --git a/src/app/core/services/common/mapping.service.ts b/src/app/core/services/common/mapping.service.ts
@@ -180,7 +180,7 @@ export class MappingService {
     };
 
     if (value) {
-      if (appName && ([AppName.SAGE300, AppName.QBO] as string[]).includes(appName)) {
+      if (appName && ([AppName.SAGE300, AppName.QBO, AppName.INTACCT] as string[]).includes(appName)) {
         params.value = value;
       } else {
         params.value__icontains = value;

diff --git a/src/app/core/services/si/si-configuration/si-import-setting.service.ts b/src/app/core/services/si/si-configuration/si-import-setting.service.ts
@@ -22,4 +22,9 @@ export class SiImportSettingService {
   postImportSettings(importSettingsPayload: ImportSettingPost): Observable<ImportSettingGet> {
     return this.apiService.put(`/v2/workspaces/${this.workspaceService.getWorkspaceId()}/import_settings/`, importSettingsPayload);
   }
+
+  getImportCodeFieldConfig() {
+    const workspaceId = this.workspaceService.getWorkspaceId();
+    return this.apiService.get(`/v2/workspaces/${workspaceId}/import_settings/import_code_fields_config/`, {});
+  }
 }
diff --git a/...cct/intacct-main/intacct-mapping/intacct-base-mapping/intacct-base-mapping.component.html b/...cct/intacct-main/intacct-mapping/intacct-base-mapping/intacct-base-mapping.component.html
@@ -7,5 +7,6 @@
     [showAutoMapEmployee]="showAutoMapEmployee"
     [appName]="appName"
     [isCategoryMappingGeneric]="false"
+    [isMultiLineOption]="acceptedCodeField.includes(destinationField) && brandingConfig.brandId !== 'co' ? true : false"
     (triggerAutoMapEmployee)="triggerAutoMapEmployees()">
 </app-generic-mapping-v2>
diff --git a/...tacct/intacct-main/intacct-mapping/intacct-base-mapping/intacct-base-mapping.component.ts b/...tacct/intacct-main/intacct-mapping/intacct-base-mapping/intacct-base-mapping.component.ts
@@ -1,10 +1,11 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { forkJoin } from 'rxjs';
+import { brandingConfig } from 'src/app/branding/branding-config';
 import { IntacctConfiguration } from 'src/app/core/models/db/configuration.model';
 import { DestinationAttribute } from 'src/app/core/models/db/destination-attribute.model';
 import { MappingSetting } from 'src/app/core/models/db/mapping-setting.model';
-import { AccountingDisplayName, AccountingField, AppName, FyleField, IntacctCategoryDestination, IntacctCorporateCreditCardExpensesObject, IntacctReimbursableExpensesObject, ToastSeverity } from 'src/app/core/models/enum/enum.model';
+import { AccountingDisplayName, AccountingField, AppName, FyleField, IntacctCategoryDestination, IntacctCorporateCreditCardExpensesObject, IntacctReimbursableExpensesObject, MappingSourceField, SageIntacctField, ToastSeverity } from 'src/app/core/models/enum/enum.model';
 import { IntegrationsToastService } from 'src/app/core/services/common/integrations-toast.service';
 import { MappingService } from 'src/app/core/services/common/mapping.service';
 import { WorkspaceService } from 'src/app/core/services/common/workspace.service';
@@ -37,6 +38,10 @@ export class IntacctBaseMappingComponent implements OnInit {
 
   cccExpenseObject: IntacctCorporateCreditCardExpensesObject | null;
 
+  acceptedCodeField: string[] = [SageIntacctField.ACCOUNT, SageIntacctField.DEPARTMENT, MappingSourceField.PROJECT];
+
+  brandingConfig = brandingConfig;
+
   constructor(
     private route: ActivatedRoute,
     private mappingService: MappingService,

diff --git a/...intacct/intacct-shared/intacct-advanced-settings/intacct-advanced-settings.component.html b/...intacct/intacct-shared/intacct-advanced-settings/intacct-advanced-settings.component.html
@@ -167,12 +167,23 @@
                 <div class="tw-pt-2">
                   <p-dropdown appendTo="body" [options]="sageIntacctDepartments" optionLabel="value"
                   formControlName="defaultDepartment" placeholder="Select {{brandingContent.intacct.configuration.advancedSettings.department}}" [ngClass]="{'selectedItem': advancedSettingsForm.controls.defaultDepartment.value, 'filterDropdown': !advancedSettingsForm.controls.defaultDepartment.value, 'hideClearIcon': advancedSettingsForm.controls['defaultDepartment'].value}">
-                        <ng-template class="tw-flex tw-justify-between tw-items-center" pTemplate="selectedItem" let-item>
+                        <ng-template class="tw-flex tw-justify-between tw-items-center" let-value pTemplate="selectedItem">
                             <p>
-                                {{ item.value }}
+                                <span *ngIf="value?.code && brandingFeatureConfig.featureFlags.importSettings.allowImportCode">{{ value?.code }}: </span>
+                                {{ value?.value }} 
                             </p>
                             <app-svg-icon [svgSource]="'cross-medium'" (click)="removeFilter(advancedSettingsForm.controls.defaultDepartment)" [height]="'16px'" [width]="'16px'"></app-svg-icon>
                         </ng-template>
+                        <ng-template let-options pTemplate="item">
+                            <div #textElement
+                            [ngStyle]="{'white-space': 'nowrap', 'overflow': 'hidden', 'text-overflow': 'ellipsis', 'max-width': '16rem'}"
+                            [pTooltip]="isOverflowing(textElement, options)" tooltipPosition="top">
+                                <span>
+                                {{options.value}}
+                                </span>
+                                <p class="tw-text-text-muted tw-text-12-px">{{ options.code ? options.code : '--'}}</p>
+                            </div>
+                        </ng-template>
                     </p-dropdown>
                     <span *ngIf="brandingFeatureConfig.featureFlags.exportSettings.reimbursableExpenses" class="tw-pl-24-px">
                         <input formControlName="useEmployeeDepartment" type="checkbox" />

diff --git a/...s/intacct/intacct-shared/intacct-advanced-settings/intacct-advanced-settings.component.ts b/...s/intacct/intacct-shared/intacct-advanced-settings/intacct-advanced-settings.component.ts
@@ -19,6 +19,7 @@ import { environment } from 'src/environments/environment';
 import { AdvancedSettingsModel } from 'src/app/core/models/common/advanced-settings.model';
 import { SkipExportComponent } from 'src/app/shared/components/si/helper/skip-export/skip-export.component';
 import { SelectFormOption } from 'src/app/core/models/common/select-form-option.model';
+import { DestinationAttribute } from 'src/app/core/models/db/destination-attribute.model';
 
 @Component({
   selector: 'app-intacct-advanced-settings',
@@ -132,6 +133,10 @@ export class IntacctAdvancedSettingsComponent implements OnInit {
     this.router.navigate([`/integrations/intacct/onboarding/import_settings`]);
   }
 
+  isOverflowing(element: any, mapping: DestinationAttribute): string {
+    return element.offsetWidth < element.scrollWidth ? mapping.value : '';
+  }
+
   refreshDimensions(isRefresh: boolean) {
     this.mappingService.refreshSageIntacctDimensions().subscribe();
     this.mappingService.refreshFyleDimensions().subscribe();

diff --git a/...ons/intacct/intacct-shared/intacct-export-settings/intacct-export-settings.component.html b/...ons/intacct/intacct-shared/intacct-export-settings/intacct-export-settings.component.html
@@ -52,6 +52,7 @@
                                 [placeholder]="'Select GL account'"
                                 [formControllerName]="'glAccount'"
                                 [isAdvanceSearchEnabled]="true"
+                                [isMultiLineOption]="isMultiLineOption"
                                 (searchOptionsDropdown)="searchOptionsDropdown($event)"></app-configuration-select-field>
                             </div>
                             <div *ngIf="exportSettingsForm.value.reimbursableExportType===IntacctReimbursableExpensesObject.EXPENSE_REPORT">
@@ -163,6 +164,7 @@
                             [placeholder]="'Select expense payment type'"
                             [formControllerName]="'cccExpensePaymentType'"
                             [isAdvanceSearchEnabled]="true"
+                            [isMultiLineOption]="isMultiLineOption"
                             (searchOptionsDropdown)="searchOptionsDropdown($event)"></app-configuration-select-field>
                         </div>
                         <div *ngIf="exportSettingsForm.value.cccExportType===IntacctCorporateCreditCardExpensesObject.BILL">
@@ -195,6 +197,7 @@
                             [placeholder]="'Select GL account'"
                             [formControllerName]="'creditCard'"
                             [isAdvanceSearchEnabled]="true"
+                            [isMultiLineOption]="isMultiLineOption"
                             (searchOptionsDropdown)="searchOptionsDropdown($event)"></app-configuration-select-field>
                         </div>
                         <div *ngIf="exportSettingsForm.value.cccExportType === IntacctCorporateCreditCardExpensesObject.JOURNAL_ENTRY && brandingFeatureConfig.featureFlags.exportSettings.useMerchantInJournalLine">

diff --git a/...tions/intacct/intacct-shared/intacct-export-settings/intacct-export-settings.component.ts b/...tions/intacct/intacct-shared/intacct-export-settings/intacct-export-settings.component.ts
@@ -154,6 +154,8 @@ export class IntacctExportSettingsComponent implements OnInit {
 
   brandingContent = brandingContent;
 
+  isMultiLineOption: boolean;
+
   constructor(
     private router: Router,
     private exportSettingService: SiExportSettingService,
@@ -649,6 +651,7 @@ export class IntacctExportSettingsComponent implements OnInit {
       this.destinationOptions.CCC_EXPENSE_PAYMENT_TYPE = response[1].results.filter((attr: IntacctDestinationAttribute) => !attr.detail.is_reimbursable);
       this.destinationOptions.VENDOR = response[2].results;
       this.destinationOptions.CHARGE_CARD = response[3].results;
+      this.isMultiLineOption = brandingConfig.brandId !== 'co' ? true : false;
       this.getSettingsAndSetupForm();
 
     });

diff --git a/...ons/intacct/intacct-shared/intacct-import-settings/intacct-import-settings.component.html b/...ons/intacct/intacct-shared/intacct-import-settings/intacct-import-settings.component.html
@@ -43,7 +43,7 @@ <h5 class="!tw-text-text-muted tw-text-14-px tw-pt-8-px !tw-font-400 !tw-leading
                 <input type="text" class="tw-text-14-px tw-text-slightly-normal-text-color !tw-font-500 tw-w-300-px !tw-px-14-px !tw-py-10-px tw-border tw-border-solid !tw-border-separator tw-rounded-4-px" value="Category" disabled>
             </div>
             <div class="input-toggle-section tw-w-10-vw">
-                <p-inputSwitch formControlName="importCategories"></p-inputSwitch>
+                <p-inputSwitch formControlName="importCategories" (onChange)="addImportCodeField($event, intacctCategoryDestination)"></p-inputSwitch>
             </div>
         </div>
         <div class="tw-flex tw-pt-18-px">
@@ -132,7 +132,7 @@ <h5 class="!tw-text-text-muted tw-text-14-px tw-pt-8-px !tw-font-400 !tw-leading
 
                                     </ng-template>
                               </p-dropdown>
-                              <p *ngIf="expenseField.value.source_field && !expenseField.valid && !hasDuplicateOption(expenseField, i, 'source_field')" class="tw-text-alert-toast tw-text-12-px tw-pt-4-px tw-pl-14-px">
+                              <p *ngIf="expenseField.value.source_field && !expenseField.valid && !hasDuplicateOption(expenseField, i, 'source_field') || (!expenseField.value.source_field && expenseField.value.import_to_fyle)" class="tw-text-alert-toast tw-text-12-px tw-pt-4-px tw-pl-14-px">
                                 {{brandingConfig.brandName}} Fields should be unique
                                 </p>
                             </div>
@@ -195,6 +195,48 @@ <h5 class="!tw-text-text-muted tw-text-14-px tw-pt-8-px !tw-font-400 !tw-leading
                 </a>
             </div>
         </div>
+
+        <div class="tw-p-24-px" *ngIf="brandingFeatureConfig.featureFlags.importSettings.allowImportCode && this.importSettingsForm.get('importCodeFields')?.value.length > 0 ">
+            <div>
+                <div class="tw-p-24-px tw-bg-configuration-bg tw-border tw-border-separator tw-rounded-8-px tw-mb-24-px">
+                    <div>
+                        <h4 class="tw-text-16-px tw-text-normal-text-color tw-mb-8-px">
+                            Configure import method
+                        </h4>
+                        <p class="tw-text-14-px tw-text-text-muted">
+                            You have the option to import either just the names of your values or both names and code, based on how your employees identify these values.
+                        </p>
+                    </div>
+                    <div class="tw-pt-16-px">
+                        <app-configuration-info-label
+                            [infoText]="'This is a one-time setup and cannot be modified once the values are imported to Fyle.'">
+                        </app-configuration-info-label>
+                    </div>
+                </div>
+            </div>
+            <div formArrayName="importCodeFields">
+                <div *ngFor="let intacctImportCodeField of importCodeFieldGetter.controls; let i = index" [formGroupName]="i">
+                    <div *ngIf="intacctImportCodeConfig[intacctImportCodeField.value.source_field]">
+                        <app-configuration-select-field
+                            [appName]="appName"
+                            [form]="getFormGroup(intacctImportCodeField)"
+                            [isDisableTextRequired]="false"
+                            [options]="importCodeSelectorOptions[intacctImportCodeField.value.source_field]"
+                            [placeholder]="'Select how to import ' + helper.sentenseCaseConversion(intacctImportCodeField.value.source_field).toLowerCase()"
+                            [label]="'How to import the '+ helper.sentenseCaseConversion(getDestinationField(intacctImportCodeField.value.source_field)).toLowerCase() +' from ' + appName + '?'"
+                            [subLabel]="'You have the option to import either just the names of your '+ helper.sentenseCaseConversion(getDestinationField(intacctImportCodeField.value.source_field)).toLowerCase() +' or both the names and codes.'"
+                            [isMultiLineOption]="true"
+                            [isFieldMandatory]="true"
+                            [isimportSettings]="true"
+                            [customErrorMessage]="'Please select how the ' + helper.sentenseCaseConversion(intacctImportCodeField.value.source_field).toLowerCase() + ' should be imported'"
+                            [isDisabled]="!intacctImportCodeConfig[intacctImportCodeField.value.source_field]"
+                            [formControllerName]="'import_code'">
+                        </app-configuration-select-field>
+                    </div>
+                </div>
+            </div>
+        </div>
+
         <app-configuration-step-footer [ctaText] = "!saveInProgress ? (isOnboarding ? ConfigurationCtaText.SAVE_AND_CONTINUE : ConfigurationCtaText.SAVE) : ConfigurationCtaText.SAVING" (save)="save()" [isButtonDisabled]="!importSettingsForm.valid"></app-configuration-step-footer>    
     </form>
 </div>