Merge branch 'master' into hulk-deployment-ga

.github/workflows/qa_deployment.yml

@@ -38,7 +38,7 @@ jobs:
       - name: Update Image Tag
         run: |
           NEW_TAG="v$(git rev-parse --short HEAD)"
-          cd ${{ vars.STAGING_DEPLOY_REPO }}/${{ vars.C1_STAGING_DEPLOY_DIR }}/integrations
+          cd ${{ vars.STAGING_DEPLOY_REPO }}/${{ vars.C1_STAGING_DEPLOY_DIR }}/qa/integrations
           kustomize edit set image docker.io/${{ secrets.DOCKERHUB_USERNAME }}/fyle_integrations-app=docker.io/${{ secrets.DOCKERHUB_USERNAME }}/fyle_integrations-app:$NEW_TAG
 
       - name: Commit and push changes

src/app/branding/branding-config.ts

@@ -1,3 +1,4 @@
+import { disconnect } from 'process';
 import { BrandingConfiguration } from '../core/models/branding/branding-configuration.model';
 import { ContentConfiguration } from '../core/models/branding/content-configuration.model';
 import { DemoVideo } from '../core/models/branding/demo-video.model';
@@ -17,6 +18,7 @@ const featureConfigs: FeatureConfiguration = {
         exposeC1Apps: false,
         isBackgroundColorAllowed: false,
         isAsterikAllowed: true,
+        allowIntacctHelperDoc: true,
         featureFlags: {
             cloneSettings: true,
             mapEmployees: true,
@@ -48,6 +50,9 @@ const featureConfigs: FeatureConfiguration = {
             },
             mappings: {
                 employeeMapping: true
+            },
+            dashboard: {
+                disconnectButton: true
             }
         }
     },
@@ -58,6 +63,7 @@ const featureConfigs: FeatureConfiguration = {
         exposeC1Apps: true,
         isBackgroundColorAllowed: true,
         isAsterikAllowed: false,
+        allowIntacctHelperDoc: false,
         featureFlags: {
             cloneSettings: false,
             mapEmployees: false,
@@ -89,6 +95,9 @@ const featureConfigs: FeatureConfiguration = {
             },
             mappings: {
                 employeeMapping: false
+            },
+            dashboard: {
+                disconnectButton: false
             }
         }
     }

src/app/branding/c1-contents-config.ts

@@ -111,6 +111,7 @@ export const c1Contents = {
                     creditCardExportTypeSubLabel: 'Choose how transactions are exported to Xero.',
                     expenseState: '',
                     creditCardExpenseSubLabel: '',
+                    cccExpenseBankAccountLabel: 'Which bank account should the bank transactions post to?',
                     cccExpenseStateSubLabel: 'You can choose to only export expenses when they\'ve been labeled approved or closed. '
                 },
                 stepSubLabel: 'Configure how and when expenses from expense management can be exported to Xero.',
@@ -239,7 +240,7 @@ export const c1Contents = {
     },
     configuration: {
         connector: {
-            stepName: 'Connect to Quickbooks Online'
+            stepName: 'Connect to QuickBooks Online'
         },
         employeeSetting: {
             stepName: 'Map employees'
@@ -298,12 +299,12 @@ export const c1Contents = {
             memoStructureLabel: 'Set the line-item description field in QuickBooks Online',
             automationSubLabel: 'Automate exports and data syncs.',
             scheduleSubLabel: 'Set up a schedule to automate the export of expenses from expense management to QuickBooks Online.',
-            frequencySubLabel: 'Set how often your expenses will be exported to Quickbooks Online.',
+            frequencySubLabel: 'Set how often your expenses will be exported to QuickBooks Online.',
             otherPreferencesLabel: 'Other preferences',
-            otherPreferencesSubLabel: 'Create new records in Quickbooks Online if no vendor record is found or the accounting period is closed.',
+            otherPreferencesSubLabel: 'Create new records in QuickBooks Online if no vendor record is found or the accounting period is closed.',
             accountingPeriodLabel: 'Post entries in the current open accounting period.',
             accountingPeriodSubLabel: 'If the accounting period is closed, the expenses will be exported with a date stamp for the first day of the current open accounting period',
-            autoCreateMerchantsAsVendorsSubLabel: 'Automatically create a new vendor in Quickbooks Online if an added merchant doesn\'t have a corresponding match.',
+            autoCreateMerchantsAsVendorsSubLabel: 'Automatically create a new vendor in QuickBooks Online if an added merchant doesn\'t have a corresponding match.',
             customizeSectionSubLAbel: 'Customize the data that you\'d like to export from expense management to QuickBooks Online by choosing which data points need to be exported.',
             memoStructureSubLabel: 'Choose from a list of available data points that you\'d like to export to the description field in QuickBooks Online.',
             previewDescriptionFieldLabel: 'Preview of the description field'

src/app/branding/fyle-contents-config.ts

@@ -111,6 +111,7 @@ export const fyleContents = {
                     creditCardExportTypeSubLabel: '',
                     expenseState: '',
                     creditCardExpenseSubLabel: '',
+                    cccExpenseBankAccountLabel: 'To which Bank Account should the Bank Transactions be posted to?',
                     cccExpenseStateSubLabel: 'You can export expenses either when they\'re awaiting payment after approval (Approved) or when the payment has been settled (Closed).'
                 },
                 cccExpenseStateLabel: 'At which state should the expenses be ready to export from ' + brandingConfig.brandName + '?',
@@ -239,7 +240,7 @@ export const fyleContents = {
     },
     configuration: {
         connector: {
-            stepName: 'Connect to Quickbooks Online'
+            stepName: 'Connect to QuickBooks Online'
         },
         employeeSetting: {
             stepName: 'Map Employees'

src/app/core/models/branding/content-configuration.model.ts

@@ -110,6 +110,7 @@ export type ContentConfiguration = {
                         expenseState: string;
                         creditCardExpenseSubLabel: string;
                         cccExpenseStateSubLabel: string;
+                        cccExpenseBankAccountLabel: string;
                     }
                 },
                 importSetting: {

src/app/core/models/branding/feature-configuration.model.ts

@@ -6,6 +6,7 @@ export type FeatureConfiguration = {
         exposeC1Apps: boolean;
         isBackgroundColorAllowed: boolean;
         isAsterikAllowed: boolean;
+        allowIntacctHelperDoc: boolean;
         featureFlags: {
             cloneSettings: boolean;
             mapEmployees: boolean;
@@ -37,6 +38,9 @@ export type FeatureConfiguration = {
             },
             mappings: {
                 employeeMapping: boolean;
+            },
+            dashboard: {
+                disconnectButton: boolean;
             }
         }
     }

src/app/core/models/db/error.model.ts

@@ -19,6 +19,7 @@ export interface Error {
   expense_attribute: ExpenseAttribute;
   expense_group: AccountingExport;
   type: AccountingErrorType;
+  article_link: string;
   is_resolved: boolean;
   error_title: string;
   error_detail: string;

src/app/core/models/intacct/db/error.model.ts

@@ -14,6 +14,7 @@ export type Error = {
   workspace_id: number;
   created_at: Date;
   updated_at: Date;
+  article_link: string;
 };
 
 export type GroupedErrors = {

src/app/core/models/qbo/qbo-configuration/qbo-advanced-setting.model.ts

@@ -60,11 +60,11 @@ export class QBOAdvancedSettingModel extends HelperUtility {
   static getPaymentSyncOptions(): SelectFormOption[] {
     return [
       {
-        label: `Export ${brandingConfig.brandName} ACH Payments to Quickbooks Online`,
+        label: `Export ${brandingConfig.brandName} ACH Payments to QuickBooks Online`,
         value: QBOPaymentSyncDirection.FYLE_TO_QBO
       },
       {
-        label: `Import Quickbooks Payments into ${brandingConfig.brandName}`,
+        label: `Import QuickBooks Payments into ${brandingConfig.brandName}`,
         value: QBOPaymentSyncDirection.QBO_TO_FYLE
       }
     ];

src/app/core/models/xero/xero-configuration/xero-export-settings.model.ts

@@ -62,7 +62,7 @@ export class XeroExportSettingModel {
   static getCreditCardExportTypes() {
     return [
       {
-        label: 'Bank Transaction',
+        label: 'Bank Transactions',
         value: XeroCorporateCreditCardExpensesObject.BANK_TRANSACTION
       }
     ];

src/app/core/services/qbo/qbo-core/qbo-helper.service.ts

@@ -31,4 +31,8 @@ export class QboHelperService {
   refreshQBODimensions(): Observable<{}> {
     return this.apiService.post(`/workspaces/${this.workspaceService.getWorkspaceId()}/qbo/refresh_dimensions/`, {});
   }
+
+  disconnect(): Observable<{}> {
+    return this.apiService.patch(`/workspaces/${this.workspaceService.getWorkspaceId()}/credentials/qbo/`, {});
+  }
 }

src/app/core/services/travelperk/travelperk.service.ts

@@ -111,6 +111,8 @@ export class TravelperkService {
   }
 
   getCategories(): Observable<TravelperkDestinationAttribuite[]> {
-    return this.apiService.get(`/orgs/${this.orgId}/categories/`,  {});
+    return this.apiService.get(`/orgs/${this.orgId}/categories/`,  {
+      attribute_type: 'CATEGORY'
+    });
   }
 }

src/app/integrations/intacct/intacct-shared/intacct-c1-import-settings/intacct-c1-import-settings.component.ts

@@ -254,7 +254,9 @@ export class IntacctC1ImportSettingsComponent implements OnInit {
     }));
 
     this.sageIntacctFields.push({ attribute_type: 'GENERAL_LEDGER_ACCOUNT', display_name: 'General Ledger Account', source_placeholder: '', is_dependent: false });
+    this.fyleFields.pop();
     this.fyleFields.push({ attribute_type: FyleField.CATEGORY, display_name: 'Category', source_placeholder: '', is_dependent: false });
+    this.fyleFields.push(this.customFieldOption[0]);
 
     // Handle only mapped fields
     this.sageIntacctFields.forEach((sageIntacctField) => {

src/app/integrations/qbo/qbo-main/qbo-main.component.html

@@ -1,5 +1,5 @@
 <div [ngClass]="{'tw-h-100-vh tw-bg-bg-tertiary-lighter tw-overflow-auto': brandingFeatureConfig.isBackgroundColorAllowed}">
-    <app-main-menu [modules]="modules" [activeItem]="modules[0]" [appName]="appName" [isDropdrownRequired]="false" (refreshDimensionClick)="refreshDimensions()" [isSyncVisible]="true"></app-main-menu>
+    <app-main-menu [modules]="modules" [activeItem]="modules[0]" [appName]="appName" [isDropdrownRequired]="false" (refreshDimensionClick)="refreshDimensions()" [isSyncVisible]="true" [isDisconnectRequired]="disconnectButton" (disconnectClick)="disconnect()"></app-main-menu>
     <div>
         <router-outlet></router-outlet>
     </div>

src/app/integrations/qbo/qbo-main/qbo-main.component.ts

@@ -27,20 +27,35 @@ export class QboMainComponent implements OnInit {
 
   activeModule: MenuItem;
 
+  isConnectionInProgress: boolean;
+
   readonly brandingFeatureConfig = brandingFeatureConfig;
 
+  readonly disconnectButton = brandingFeatureConfig.featureFlags.dashboard.disconnectButton;
+
   constructor(
     private accountingExportService: AccountingExportService,
     private qboHelperService: QboHelperService,
     private router: Router,
-    private toastServeice: IntegrationsToastService
+    private toastService: IntegrationsToastService
   ) { }
 
   refreshDimensions() {
     this.qboHelperService.refreshQBODimensions().subscribe();
     this.qboHelperService.refreshFyleDimensions().subscribe();
     this.accountingExportService.importExpensesFromFyle('v1').subscribe();
-    this.toastServeice.displayToastMessage(ToastSeverity.SUCCESS, 'Syncing data dimensions from QuickBooks Online');
+    this.toastService.displayToastMessage(ToastSeverity.SUCCESS, 'Syncing data dimensions from QuickBooks Online');
+  }
+
+  disconnect(): void {
+    if (!this.isConnectionInProgress) {
+      this.qboHelperService.disconnect().subscribe(() => {
+        this.isConnectionInProgress = false;
+        this.toastService.displayToastMessage(ToastSeverity.SUCCESS, 'Disconnected QuickBooks Online successfully');
+        this.router.navigate(['/integrations/qbo/onboarding/landing']);
+      });
+    }
+    this.isConnectionInProgress = true;
   }
 
   private setupPage() {

src/app/integrations/qbo/qbo-onboarding/qbo-onboarding-landing/qbo-onboarding-landing.component.html

@@ -1,6 +1,6 @@
 <div *ngIf="!isIncorrectQBOConnectedDialogVisible">
     <div>
-        <app-landing-page-header [showQBOButton]="true" [iconPath]="'assets/logos/qbo.svg'" [appName]="'QuickBooks Online'" [appDescription]="brandingContent.contentText" [isLoading]="false" [isIntegrationSetupInProgress]="false" [isIntegrationConnected]="false" [redirectLink]="redirectLink" (connectIntegration)="connectQbo()"></app-landing-page-header>
+        <app-landing-page-header [showQBOButton]="true" [iconPath]="'assets/logos/qbo.png'" [appName]="'QuickBooks Online'" [appDescription]="brandingContent.contentText" [isLoading]="false" [isIntegrationSetupInProgress]="false" [isIntegrationConnected]="false" [redirectLink]="redirectLink" (connectIntegration)="connectQbo()" [logoStyleClasses]="'tw-p-16-px'"></app-landing-page-header>
     </div>
     <div>
         <app-landing-page-body [headlineText]="brandingContent.guideHeaderText" [headerText]="'A quick guide to help you set up your QuickBooks Online integration.'" [embedVideo]="embedVideoLink" [embedImage]="'assets/co/coQBOLanding.svg'" [svgPath]="'assets/flow-charts/' + brandingConfig.brandId +'-qbo-data-flow.svg'" [appName]="appName"></app-landing-page-body>

src/app/integrations/xero/xero-onboarding/xero-onboarding-connector/xero-onboarding-connector.component.html

@@ -15,7 +15,7 @@
             <div class="tw-px-24-px">
                 <app-configuration-connector
                     [accountingAppTitle]="'Xero'"
-                    [subLabel]="'Select a tenant from Xero to continue'"
+                    [subLabel]="'Select a tenant from Xero to continue.'"
                     [placeholder]="'Select tenant'"
                     [accountingCompanyName]="xeroCompanyName"
                     [fyleOrgName]="fyleOrgName"

src/app/integrations/xero/xero-shared/xero-export-settings/xero-export-settings.component.html

@@ -138,7 +138,7 @@ <h5>
                             [isFieldMandatory]="true"
                             [mandatoryErrorListName]="'bank account'"
                             [subLabel]="brandingContent.corporateCard.cccExpenseBankAccountSubLabel"
-                            [label]="'To which Bank Account should the ' + (exportSettingForm.value.creditCardExportType | snakeCaseToSpaceCase | titlecase) + ' be posted to?'"
+                            [label]="brandingContent.corporateCard.cccExpenseBankAccountLabel"
                             [destinationAttributes]="bankAccounts"
                             [optionLabel]="'value'"
                             [iconPath]="'list'"

src/app/shared/components/dashboard/dashboard-error-section/dashboard-error-section.component.html

@@ -77,7 +77,16 @@ <h5 class="!tw-text-text-muted tw-text-14-px tw-pt-10-px !tw-font-400 !tw-leadin
                         <div class="inside-container">
                             <h4 class="tw-text-14-px !tw-font-500 tw-text-text-secondary tw-w-600-px">{{ error.error_title | snakeCaseToSpaceCase | titlecase }}</h4>
                             <div class="flex-wrapper">
-                                <h5 class="!tw-text-text-muted tw-text-12-px tw-pt-10-px !tw-font-400 !tw-leading-4 tw-w-600-px"><p>{{ error.error_detail }}</p>
+                                <h5 class="!tw-text-text-muted tw-text-12-px tw-pt-10-px !tw-font-400 !tw-leading-4 tw-w-600-px tw-flex tw-items-center tw-justify-start">
+                                    <p>{{ error.error_detail }}.
+                                        <a *ngIf="error.article_link && brandingFeatureConfig.allowIntacctHelperDoc" class=" tw-pr-4-px tw-text-link-primary tw-w-fit tw-cursor-pointer tw-inline-flex tw-items-center"
+                                            (click)="windowService.openInNewTab(error.article_link)">
+                                            {{ helper.sentenseCaseConversion('Read More') }}
+                                            <app-svg-icon *ngIf="brandingFeatureConfig.isIconsInsideButtonAllowed" [svgSource]="'open-in-new-tab'" [width]="'16px'" [height]="'16px'"
+                                                class="tw-text-link-primary tw-pl-2-px tw-w-fit">
+                                            </app-svg-icon>
+                                        </a>
+                                    </p>
                                 </h5>
                                 <div>
                                     <span type="button" (click)="showErrorDialog(error)" [ngClass]="[brandingConfig.brandId==='co' ? 'p-button primary-outline': 'p-button secondary-sm']">
@@ -98,7 +107,17 @@ <h5 class="!tw-text-text-muted tw-text-12-px tw-pt-10-px !tw-font-400 !tw-leadin
     <p-dialog [dismissableMask]="true" [modal]="true" [(visible)]="isAccountingErrorDialogVisible" [position]="'top-right'" [style]="{ width: 'fit-content', height: '100vh' }" [maximizable]="false" [draggable]="false" [resizable]="false" [breakpoints]="{ '960px': '75vw' }">
         <p-header>
             <p class="tw-text-text-primary tw-text-20-px tw-line-height-20">{{appName}} {{brandingContent.qboErrorDialogHeaderText}}</p>
-            <h3 class="dialog-sub-header">{{errorDetail}}</h3>
+            <h3 class="dialog-sub-header">
+                <p>{{ errorDetail }}.
+                    <a *ngIf="errorArticle && brandingFeatureConfig.allowIntacctHelperDoc" class=" tw-pr-4-px tw-text-link-primary tw-w-fit tw-cursor-pointer tw-inline-flex tw-items-center"
+                        (click)="windowService.openInNewTab(errorArticle)">
+                        {{ helper.sentenseCaseConversion('Read More') }}
+                        <app-svg-icon *ngIf="brandingFeatureConfig.isIconsInsideButtonAllowed" [svgSource]="'open-in-new-tab'" [width]="'16px'" [height]="'16px'"
+                            class="tw-text-link-primary tw-pl-2-px tw-w-fit">
+                        </app-svg-icon>
+                    </a>
+                </p>
+            </h3>
         </p-header>
         <app-dashboard-accounting-error-dialog  [isLoading]="isLoading" [errorExpenses]="errorExpenses"></app-dashboard-accounting-error-dialog>
     </p-dialog>

src/app/shared/components/dashboard/dashboard-error-section/dashboard-error-section.component.ts

@@ -1,6 +1,6 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { Observable, filter, forkJoin } from 'rxjs';
-import { brandingConfig, brandingContent } from 'src/app/branding/branding-config';
+import { brandingConfig, brandingContent, brandingFeatureConfig } from 'src/app/branding/branding-config';
 import { DestinationFieldMap } from 'src/app/core/models/db/dashboard.model';
 import { DestinationAttribute, GroupedDestinationAttribute } from 'src/app/core/models/db/destination-attribute.model';
 import { Error, AccountingGroupedErrors, AccountingGroupedErrorStat, ErrorModel, ErrorResponse } from 'src/app/core/models/db/error.model';
@@ -11,6 +11,8 @@ import { Expense } from 'src/app/core/models/intacct/db/expense.model';
 import { DashboardService } from 'src/app/core/services/common/dashboard.service';
 import { MappingService } from 'src/app/core/services/common/mapping.service';
 import { TrackingService } from 'src/app/core/services/integration/tracking.service';
+import { WindowService } from 'src/app/core/services/common/window.service';
+import { HelperService } from 'src/app/core/services/common/helper.service';
 
 @Component({
   selector: 'app-dashboard-error-section',
@@ -83,14 +85,22 @@ export class DashboardErrorSectionComponent implements OnInit {
 
   readonly brandingContentCommon = brandingContent.common;
 
+  readonly brandingFeatureConfig = brandingFeatureConfig;
+
   employeeFieldMapping: FyleField;
 
   displayName: string | undefined = undefined;
 
+  AppName = AppName;
+
+  errorArticle: string;
+
   constructor(
     private dashboardService: DashboardService,
     private mappingService: MappingService,
-    private trackingService: TrackingService
+    private trackingService: TrackingService,
+    public helper: HelperService,
+    public windowService: WindowService
   ) { }
 
   getSourceType() {
@@ -157,6 +167,7 @@ export class DashboardErrorSectionComponent implements OnInit {
   showErrorDialog(accountingError: Error) {
     this.isAccountingErrorDialogVisible = true;
     this.errorDetail = accountingError.error_detail;
+    this.errorArticle = accountingError.article_link;
     // @ts-ignore
     this.errorExpenses = accountingError[this.exportKey]?.expenses;
   }