-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: qbd connector setup UI changes #1060
feat: qbd connector setup UI changes #1060
Conversation
Caution Review failedThe pull request is closed. WalkthroughThe pull request introduces several changes across multiple files, primarily focusing on type renaming, the addition of new enums and types, and enhancements to various components related to the QBD Direct onboarding process. Key modifications include renaming the Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Warning Rate limit exceeded@ashwin1111 has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 21 minutes and 38 seconds before requesting another review. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
@@ -0,0 +1,5 @@ | |||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
pls add new icon in svg component too and add relevant c1 icon as well
@@ -0,0 +1,5 @@ | |||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
pls add new icon in svg component too and add relevant c1 icon as well
* feat: Qbd direct connection data sync UI changes * input made required
src/assets/icons/eye-medium.svg
Outdated
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
texted over slack
* feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 10
🧹 Outside diff range and nitpick comments (22)
src/app/shared/components/configuration/configuration-info-label/configuration-info-label.component.html (1)
3-5
: Consider enhancing accessibility for the info icon.The info icon could benefit from additional accessibility attributes to improve screen reader support.
<div *ngIf="showIcon"> - <app-svg-icon [svgSource]="'info-circle-fill-medium'" [width]="'20px'" [height]="'20px'" [styleClasses]="'tw-text-info'"></app-svg-icon> + <app-svg-icon + [svgSource]="'info-circle-fill-medium'" + [width]="'20px'" + [height]="'20px'" + [styleClasses]="'tw-text-info'" + role="img" + aria-label="Information"> + </app-svg-icon> </div>src/app/shared/components/configuration/configuration-info-label/configuration-info-label.component.ts (1)
12-12
: LGTM! Consider adding JSDoc for the new input property.The new input property follows Angular best practices and maintains backward compatibility with its default value. To improve maintainability, consider adding JSDoc documentation.
+ /** + * Controls the visibility of the info icon + * @default true + */ @Input() showIcon: boolean = true;src/app/core/models/common/helper.model.ts (2)
Line range hint
17-19
: Consider addressing the "temporary hack" commentThe comment indicates this is a temporary solution. Let's properly track and address this technical debt.
Would you like me to create a GitHub issue to track the removal of this temporary hack and propose a more maintainable solution?
Line range hint
17-19
: Refactor the complex conditional for better maintainabilityThe long conditional checking multiple field names could be simplified for better readability and maintenance.
Consider refactoring like this:
- if (controllerName !== 'accountsPayable' && controllerName !== 'defaultCCCAccount' && controllerName !== 'bankAccount' && controllerName !== 'creditCardAccount' && controllerName !== 'defaultCreditCardVendor' && controllerName !== 'nameInJournalEntry' && controllerName !== 'exportScheduleFrequency') { + const preserveValueFields = [ + 'accountsPayable', + 'defaultCCCAccount', + 'bankAccount', + 'creditCardAccount', + 'defaultCreditCardVendor', + 'nameInJournalEntry', + 'exportScheduleFrequency' + ]; + + if (!preserveValueFields.includes(controllerName)) { form.controls[controllerName].setValue(null); }src/app/shared/components/input/chechbox-button/chechbox-button.component.ts (1)
Line range hint
1-33
: Fix typo in component name and related filesThe word "Checkbox" is misspelled as "Chechbox" throughout the component. Consider fixing this spelling for better maintainability and consistency.
This would involve:
- Renaming the component file from
chechbox-button
tocheckbox-button
- Updating the component selector from
app-chechbox-button
toapp-checkbox-button
- Updating the class name from
ChechboxButtonComponent
toCheckboxButtonComponent
- Updating any references to this component in other files
Would you like me to help create a follow-up issue to track these changes?
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.ts (3)
14-15
: Consider adding lifecycle interface documentationAdding a brief comment describing the component's lifecycle responsibilities would improve maintainability.
+/** + * QBD Direct Data Sync Component + * Handles the synchronization UI for QuickBooks Desktop integration + * Lifecycle: Initializes field length on component initialization + */ export class QbdDirectDataSyncComponent implements OnInit {
16-20
: Add type safety to EventEmitterThe
continueClick
EventEmitter should specify its emission type for better type safety.-@Output() continueClick = new EventEmitter(); +@Output() continueClick = new EventEmitter<void>();
30-32
: Improve type safety of getKeys methodThe
getKeys
method usesany
type which could be more specific. Consider using a generic type parameter.-getKeys(obj: any): string[] { +getKeys<T extends object>(obj: T): Array<keyof T> { return Object.keys(obj) as Array<keyof T>; }src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-download-file/qbd-direct-download-file.component.ts (3)
Line range hint
17-24
: Add JSDoc comments to document input propertiesWhile the input properties are well-named, adding JSDoc comments would improve maintainability by documenting their purpose and expected values.
Example improvement:
+ /** + * Controls the loading state of the component + */ @Input({required: true}) isLoading: boolean; + /** + * Determines if the download link should be displayed + */ @Input({required: true}) showDownloadLink: boolean;
26-32
: Enhance type safety and documentation for EventEmittersThe output events should specify their emitted value types and include documentation about when they're emitted.
Example improvement:
- @Output() nextStep = new EventEmitter(); + /** + * Emitted when the user proceeds to the next step in the setup process + */ + @Output() nextStep = new EventEmitter<void>(); - @Output() downloadClick = new EventEmitter(); + /** + * Emitted when the user clicks the download button + */ + @Output() downloadClick = new EventEmitter<void>();
Line range hint
1-54
: Consider implementing a state management serviceGiven this component's role in the QBD connector setup flow, consider extracting the state management logic into a dedicated service. This would:
- Centralize the setup state management
- Make the flow more maintainable
- Enable better state persistence
- Facilitate easier testing
Example service structure:
@Injectable({providedIn: 'root'}) export class QbdSetupStateService { private state = new BehaviorSubject<QbdSetupState>({...}); updateDownloadStatus(status: boolean): void { this.state.next({...this.state.value, downloadComplete: status}); } // Other state management methods }src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.html (4)
5-7
: Consider making the step number dynamicThe step number is currently hardcoded as "3". Consider making it dynamic through a component property to maintain flexibility if the workflow steps change.
- 3 + {{stepNumber}}
14-14
: Fix spacing in the ngClass expressionThere's a missing space after the minus operator in
fieldLength-1
.-[ngClass]=" i < fieldLength-1 ? 'tw-border-b tw-border-b-divider-border-color' : '' " +[ngClass]=" i < fieldLength - 1 ? 'tw-border-b tw-border-b-divider-border-color' : '' "
20-22
: Enhance loading state accessibilityAdd aria-label to the loading icon for better screen reader support.
- <div class="spin-icon tw-text-text-tertiary tw-font-400 tw-text-14-px"> + <div class="spin-icon tw-text-text-tertiary tw-font-400 tw-text-14-px" [attr.aria-label]="'Loading ' + field"> <app-svg-icon *ngIf="qbdFields[field] === null" [svgSource]="'arrow-rotate-sync'" [width]="'14px'" [height]="'14px'" [isTextColorAllowed]="true" [styleClasses]="'tw-text-icon-tertiary'"></app-svg-icon> </div>
27-27
: Consider moving the info text to a constant or translation fileThe long information text should be moved to a constant or translation file for better maintainability and potential localization.
Example implementation:
// In your constants file or translation file export const QBD_SYNC_INFO_TEXT = 'The values displayed here are synced from QuickBooks Desktop to Fyle. If you notice discrepancies in the synced values, you can continue onboarding; the sync will refresh automatically in 5 minutes to capture any missed values.';Then in the template:
-[infoText]="'The values displayed here are synced from QuickBooks Desktop to Fyle. If you notice discrepancies in the synced values, you can continue onboarding; the sync will refresh automatically in 5 minutes to capture any missed values.'" +[infoText]="QBD_SYNC_INFO_TEXT"src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts (1)
68-70
: Enhance password visibility securityConsider adding auto-hide functionality for better security.
Here's an improved implementation with auto-hide:
+private hidePasswordTimeout: any; + -showPassword(isPasswordVisible: boolean) { +showPassword(isPasswordVisible: boolean): void { this.isPasswordShown = isPasswordVisible; + if (isPasswordVisible) { + // Auto-hide password after 30 seconds + this.hidePasswordTimeout = setTimeout(() => { + this.isPasswordShown = false; + }, 30000); + } else { + if (this.hidePasswordTimeout) { + clearTimeout(this.hidePasswordTimeout); + } + } } + +// Add to component's OnDestroy +ngOnDestroy(): void { + if (this.hidePasswordTimeout) { + clearTimeout(this.hidePasswordTimeout); + } +}src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.html (2)
31-33
: Fix typo in component selector name.The component selector
app-chechbox-button
has a typo (missing 'k'). This should beapp-checkbox-button
.- <app-chechbox-button + <app-checkbox-button [checkedText]="'Done'" [unCheckedText]="'Mark as done'"
Line range hint
6-6
: Consider standardizing utility class usage.The template uses a mix of utility classes with different prefixes (
tw-
for Tailwind). Consider establishing a consistent pattern for utility classes to improve maintainability.For example:
- Shadow classes:
tw-shadow-app-card
vstw-shadow-shadow-level-1
- Spacing classes:
tw-mx-120-px
vstw-mx-60-px
Consider creating a design system documentation that standardizes these utility classes across the application.
src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.ts (1)
67-71
: Enhance robustness of the updateConnectorStatus method.Consider these improvements for better maintainability and safety:
- Add bounds checking for the array access
- Make the completion check more maintainable
Here's a suggested implementation:
updateConnectorStatus(status: CheckBoxUpdate): void { - this.preRequisitesteps[status.id-1].state = status.value ? QBDPreRequisiteState.COMPLETE : QBDPreRequisiteState.INCOMPLETE; - if (this.preRequisitesteps[0].state === QBDPreRequisiteState.COMPLETE && this.preRequisitesteps[1].state === QBDPreRequisiteState.COMPLETE) { - this.isContinueDisabled = false; - } + const index = status.id - 1; + if (index >= 0 && index < this.preRequisitesteps.length) { + this.preRequisitesteps[index].state = status.value ? QBDPreRequisiteState.COMPLETE : QBDPreRequisiteState.INCOMPLETE; + this.isContinueDisabled = !this.preRequisitesteps.every(step => step.state === QBDPreRequisiteState.COMPLETE); + } }src/app/integrations/qbd-direct/qbd-direct.component.ts (1)
Line range hint
67-78
: Consider enhancing error handling and type safety.While the workspace setup implementation is solid, consider these improvements:
- Add error handling for navigation failures
- Add type guards for workspace state validation
- Consider adding loading state handling for navigation
Here's a suggested implementation:
private storeWorkspaceAndNavigate(workspace: QbdDirectWorkspace): void { this.workspace = workspace; this.storageService.set('workspaceId', this.workspace.id); this.storageService.set('onboarding-state', this.workspace.onboarding_state); this.qbdDirectHelperService.importAttribuites(false); this.isLoading = false; - this.navigate(); + try { + // Validate workspace state before navigation + if (!Object.values(QbdDirectOnboardingState).includes(this.workspace.onboarding_state)) { + throw new Error(`Invalid onboarding state: ${this.workspace.onboarding_state}`); + } + this.navigate(); + } catch (error) { + console.error('Navigation failed:', error); + // Handle navigation failure (e.g., show user feedback) + } }src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.html (2)
5-7
: Consider making the step number configurableThe step number "2" is hardcoded in the template. Consider making it a configurable input property to improve maintainability and reusability of the component.
-<div class="tw-w-20-px tw-h-20-px tw-rounded-sm tw-bg-bg-secondary tw-text-white tw-text-14-px tw-font-500 tw-text-center tw-mr-8-px"> - 2 -</div> +<div class="tw-w-20-px tw-h-20-px tw-rounded-sm tw-bg-bg-secondary tw-text-white tw-text-14-px tw-font-500 tw-text-center tw-mr-8-px"> + {{stepNumber}} +</div>
49-50
: Add user feedback for copy operationThe clipboard copy operation should provide visual feedback to indicate success.
Consider adding a toast notification or temporary success indicator when the password is copied.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
⛔ Files ignored due to path filters (9)
src/assets/icons/co/grv-lock.svg
is excluded by!**/*.svg
src/assets/icons/co/grv-show-hide-medium.svg
is excluded by!**/*.svg
src/assets/icons/co/grv-show-medium.svg
is excluded by!**/*.svg
src/assets/icons/co/grv-upload.svg
is excluded by!**/*.svg
src/assets/icons/eye-medium.svg
is excluded by!**/*.svg
src/assets/icons/eye-slash-medium.svg
is excluded by!**/*.svg
src/assets/icons/lock.svg
is excluded by!**/*.svg
src/assets/icons/upload.svg
is excluded by!**/*.svg
src/assets/sprites/sprite.svg
is excluded by!**/*.svg
📒 Files selected for processing (21)
src/app/core/models/common/helper.model.ts
(1 hunks)src/app/core/models/enum/enum.model.ts
(1 hunks)src/app/core/models/qbd-direct/qbd-direct-configuration/qbd-direct-connector.model.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-connector/qbd-direct-onboarding-connector.component.html
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.html
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.ts
(2 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.html
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.scss
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.spec.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-download-file/qbd-direct-download-file.component.ts
(2 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.html
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.scss
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.spec.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-shared.module.ts
(1 hunks)src/app/integrations/qbd-direct/qbd-direct.component.ts
(1 hunks)src/app/shared/components/configuration/configuration-info-label/configuration-info-label.component.html
(1 hunks)src/app/shared/components/configuration/configuration-info-label/configuration-info-label.component.ts
(1 hunks)src/app/shared/components/core/svg-icon/svg-icon.component.ts
(1 hunks)src/app/shared/components/input/chechbox-button/chechbox-button.component.ts
(2 hunks)
✅ Files skipped from review due to trivial changes (5)
- src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-connector/qbd-direct-onboarding-connector.component.html
- src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.scss
- src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.spec.ts
- src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.scss
- src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.spec.ts
🔇 Additional comments (19)
src/app/shared/components/configuration/configuration-info-label/configuration-info-label.component.html (1)
3-5
: LGTM! Clean implementation of conditional icon rendering.
The conditional rendering using *ngIf and the SVG icon implementation are well structured and follow Angular best practices.
src/app/core/models/qbd-direct/qbd-direct-configuration/qbd-direct-connector.model.ts (1)
28-30
: Add JSDoc documentation for the new SyncDataType.
Consider adding documentation to explain the purpose and usage of this type, especially since it's used for sync data handling in QbdDirectDataSyncComponent.
+/**
+ * Type representing the sync data mapping for QBD Direct sync.
+ * Keys represent field identifiers and values represent their sync status or count.
+ */
export type SyncDataType = {
[key: string]: number | null;
};
Let's verify the usage of this type:
✅ Verification successful
Let me check the actual usage of this type in the component to ensure the documentation suggestion is appropriate and verify if there are any issues.
Let me check the template to understand how the sync data is displayed and used.
Documentation suggestion for SyncDataType is appropriate and verified
The suggested JSDoc documentation is accurate and helpful as the type is used in QbdDirectDataSyncComponent to:
- Display sync status for QuickBooks Desktop fields
- Show numeric counts when synced (number) or loading indicator when pending (null)
- Render field names as keys in a list format
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Check how SyncDataType is being used across the codebase
# Expected: Find references in QbdDirectDataSyncComponent and related files
# Search for direct references to SyncDataType
rg "SyncDataType" --type ts
# Search for the component where this type is used
rg "QbdDirectDataSyncComponent" --type ts
Length of output: 2126
Script:
#!/bin/bash
# Get the implementation details of QbdDirectDataSyncComponent
cat src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.ts
Length of output: 1199
Script:
#!/bin/bash
# Get the template implementation
cat src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.html
Length of output: 2260
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-shared.module.ts (2)
5-6
: LGTM! Well-organized module structure following modern Angular practices.
The module is properly organized with clear separation of concerns and follows modern Angular patterns for sharing components.
Also applies to: 13-15, 18-20
13-15
: Verify standalone configuration of imported components.
The components appear to be used as standalone components (present in imports array). Let's verify their configuration.
Also applies to: 18-20
✅ Verification successful
Components are correctly configured as standalone
The verification confirms that all three components in question (QbdDirectDownloadFileComponent
, QbdDirectSetupConnectionComponent
, and QbdDirectDataSyncComponent
) are properly configured as standalone components with the standalone: true
property in their decorators. Each component also has appropriate imports configured.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify standalone component configuration in the imported components
# Check if the components are properly configured as standalone
ast-grep --pattern 'Component({
$$$
standalone: true,
$$$
})' src/app/integrations/qbd-direct/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts src/app/integrations/qbd-direct/qbd-direct-data-sync/qbd-direct-data-sync.component.ts src/app/integrations/qbd-direct/qbd-direct-download-file/qbd-direct-download-file.component.ts
# If not found as standalone, check if they are regular components that should be declared
rg -l "Component\({" src/app/integrations/qbd-direct/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts src/app/integrations/qbd-direct/qbd-direct-data-sync/qbd-direct-data-sync.component.ts src/app/integrations/qbd-direct/qbd-direct-download-file/qbd-direct-download-file.component.ts
Length of output: 1170
Script:
#!/bin/bash
# Let's first find the correct paths using fd
fd -t f "qbd-direct.*component.ts$"
# Then let's check their configuration
rg -U "Component\(\{[^}]+\}\)" -g "*qbd-direct*component.ts"
Length of output: 28178
src/app/core/models/common/helper.model.ts (1)
3-6
: LGTM! Type rename follows TypeScript conventions
The rename from checkBoxEmit
to CheckBoxUpdate
follows proper TypeScript naming conventions using PascalCase for type definitions.
src/app/shared/components/input/chechbox-button/chechbox-button.component.ts (1)
5-5
: LGTM! Type changes look good.
The update from checkBoxEmit
to CheckBoxUpdate
type is properly implemented and maintains type safety.
Also applies to: 22-22
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.ts (2)
1-13
: LGTM: Component setup follows Angular best practices
The standalone component configuration with proper module imports and file references is well-structured.
22-24
: LGTM: Properties are well-typed and properly structured
Good practice using an enum for configuration CTA text and handling initialization in lifecycle hook.
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-download-file/qbd-direct-download-file.component.ts (2)
Line range hint 1-15
: LGTM! Component setup follows Angular best practices
The component is properly configured as standalone with all necessary imports and dependencies.
39-51
: Consider adding state validation before event emission
The event-emitting methods could benefit from state validation to ensure the component is in a valid state before emitting events.
For example, verify that:
continueToNextStep
should check if all required conditions are metonDownloadClick
should verify if download is availableonRetryClick
should check if retry is possible
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-data-sync/qbd-direct-data-sync.component.html (1)
1-33
: Well-structured implementation with good UX considerations
The template implements a clean and user-friendly interface for QBD data sync with proper loading states, error handling, and clear user guidance. The use of Tailwind CSS classes maintains consistent styling, and the component structure is well-organized.
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts (1)
1-16
: LGTM! Component setup follows Angular best practices
The component is properly configured as a standalone component with appropriate imports and metadata.
src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.html (1)
32-32
: LGTM! Verify the event handler implementation.
The event handler change from qbdWebConnectorStatus
to updateConnectorStatus
looks good, as it better reflects its purpose of updating the connector status.
✅ Verification successful
Event handler implementation verified and working correctly
The updateConnectorStatus
method is properly implemented in the component:
- Accepts a
CheckBoxUpdate
type parameter - Updates the pre-requisite step state based on checkbox value
- Enables/disables continue button based on completion status of both steps
- Correctly bound to the checkbox component's event emitter
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify the implementation of updateConnectorStatus method
# and ensure it properly handles the CheckBoxUpdate type
# Search for the component class implementation
ast-grep --pattern 'class QbdDirectOnboardingPreRequisiteComponent {
$$$
updateConnectorStatus($_) {
$$$
}
$$$
}'
Length of output: 127
Script:
#!/bin/bash
# Let's try a different approach to find the component implementation
# First, let's locate the component file
fd "qbd-direct-onboarding-pre-requisite.component.ts" --type f
# Then let's use ripgrep to search for the method implementation
# with surrounding context for better understanding
rg "updateConnectorStatus" -A 5 -B 5
Length of output: 4279
src/app/shared/components/core/svg-icon/svg-icon.component.ts (1)
59-63
: LGTM! Verify SVG assets availability.
The new icon mappings are well-structured and follow existing naming conventions. The additions align with the QBD connector setup UI requirements.
Let's verify that all the new SVG assets exist:
✅ Verification successful
All SVG assets are present and correctly placed
All the new icon mappings have corresponding SVG files in the src/assets/icons/co/
directory:
- grv-chevron-last-medium.svg
- grv-upload.svg
- grv-lock.svg
- grv-show-hide-medium.svg
- grv-show-medium.svg
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Check if the new SVG icons exist in the assets directory
# Common locations for SVG assets in Angular projects
for icon in "grv-chevron-last-medium" "grv-upload" "grv-lock" "grv-show-hide-medium" "grv-show-medium"; do
echo "Searching for $icon..."
fd -e svg "$icon" src/assets
done
Length of output: 1298
src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-pre-requisite/qbd-direct-onboarding-pre-requisite.component.ts (2)
7-10
: LGTM! Import changes are appropriate.
The imports correctly reflect the component's dependencies and the type rename from checkBoxEmit
to CheckBoxUpdate
.
63-65
: LGTM! Constructor properly simplified.
Good cleanup of unused service dependencies while retaining necessary ones for navigation.
src/app/integrations/qbd-direct/qbd-direct.component.ts (2)
44-44
: LGTM! Path condition correctly updated for QBD integration.
The path condition has been properly updated to check for the QBD direct integration route.
47-47
: Verify route consistency with Angular routing configuration.
The pre-requisite route has been updated, but we should verify this matches the defined routes in the Angular routing module.
✅ Verification successful
Route configuration is consistent with the state mapping
The route path /integrations/qbd_direct/onboarding/pre_requisite
in the QBD Direct component's state mapping correctly aligns with the configured route in the onboarding routing module. The route is properly mapped to the QbdDirectOnboardingPreRequisiteComponent.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify route definition in routing modules
# Expected: Find matching route definition for '/integrations/qbd_direct/onboarding/pre_requisite'
# Search for route definitions in routing modules
rg -t ts "path.*['\"]integrations/qbd_direct/onboarding/pre_requisite['\"]" --glob "*routing*.ts"
# Search for any components that might be associated with this route
rg -t ts "pre_requisite.component" --glob "*.ts"
Length of output: 152
Script:
#!/bin/bash
# Let's try a broader search to find routing configurations and components
# Search for any routes related to qbd_direct
rg -t ts "path.*['\"].*qbd.*direct.*['\"]" --glob "*routing*.ts" -A 2
# Search for any QBD-related components
rg -t ts "QbdDirect.*Component" --glob "*.ts"
# Search for the specific enum value to understand the routing structure
rg -t ts "QbdDirectOnboardingState" -A 5
Length of output: 60863
Script:
#!/bin/bash
# Let's check the routing configuration for the pre-requisite component
rg -t ts "path.*['\"]pre_requisite['\"]" src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-routing.module.ts -A 2
Length of output: 245
src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.html (1)
98-100
: LGTM!
The footer implementation is clean and follows good practices:
- Uses configuration enum for button text
- Properly handles button state
- Clear event handling
import { CommonModule } from '@angular/common'; | ||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; | ||
import { ConfigurationCta } from 'src/app/core/models/enum/enum.model'; | ||
import { SyncDataType } from 'src/app/core/models/qbd-direct/qbd-direct-configuration/qbd-direct-connector.model'; | ||
import { SharedModule } from 'src/app/shared/shared.module'; | ||
|
||
@Component({ | ||
selector: 'app-qbd-direct-data-sync', | ||
standalone: true, | ||
imports: [], | ||
imports: [CommonModule, SharedModule], | ||
templateUrl: './qbd-direct-data-sync.component.html', | ||
styleUrl: './qbd-direct-data-sync.component.scss' | ||
}) | ||
export class QbdDirectDataSyncComponent { | ||
export class QbdDirectDataSyncComponent implements OnInit { | ||
|
||
@Input({required: true}) qbdFields: SyncDataType; | ||
|
||
@Input({required: true}) isCTAEnabled: boolean; | ||
|
||
@Output() continueClick = new EventEmitter(); | ||
|
||
fieldLength: number; | ||
|
||
ConfigurationCtaText = ConfigurationCta; | ||
|
||
onContinueClick() { | ||
this.continueClick.emit(); | ||
} | ||
|
||
getKeys(obj: any): string[] { | ||
return Object.keys(obj); | ||
} | ||
|
||
ngOnInit() { | ||
this.fieldLength = Object.keys(this.qbdFields).length; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Codebase verification
Based on the verification results, I can now provide the final response:
Component integration appears incomplete
The QbdDirectDataSyncComponent is currently commented out in the onboarding connector template, and there's no evidence of proper data flow for the required SyncDataType input. This suggests the integration is not fully implemented yet.
qbd-direct-onboarding-connector.component.html
: Component usage is commented out- No binding found for the required
qbdFields
input property - No binding found for the required
isCTAEnabled
input property
🔗 Analysis chain
Verify integration with QBD setup flow
Since this component is part of the QBD connector setup UI changes, let's verify its integration points.
Let me analyze the results and generate one more verification script to complete the analysis.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Check for component usage and related QBD setup components
echo "Checking component usage in QBD setup flow..."
rg -l "app-qbd-direct-data-sync"
echo "Checking related QBD components..."
fd -e ts -e html . | rg "qbd-direct"
echo "Checking SyncDataType usage..."
rg "SyncDataType" -A 3
Length of output: 14267
Script:
#!/bin/bash
# Check the usage of QbdDirectDataSyncComponent in the onboarding connector
echo "Checking QbdDirectDataSyncComponent usage in onboarding connector..."
cat src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-connector/qbd-direct-onboarding-connector.component.html
# Check if SyncDataType is properly passed
echo -e "\nChecking SyncDataType data flow..."
rg "qbdFields" -A 3 src/app/integrations/qbd-direct/qbd-direct-onboarding/qbd-direct-onboarding-connector/
Length of output: 687
templateUrl: './qbd-direct-setup-connection.component.html', | ||
styleUrl: './qbd-direct-setup-connection.component.scss' | ||
}) | ||
export class QbdDirectSetupConnectionComponent { | ||
|
||
@Input({required: true}) password: string = '098765'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Remove hardcoded password value
The default password value '098765' should not be hardcoded in the component. This could pose a security risk if accidentally used in production.
Apply this diff to remove the default value:
-@Input({required: true}) password: string = '098765';
+@Input({required: true}) password: string;
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
@Input({required: true}) password: string = '098765'; | |
@Input({required: true}) password: string; |
onClipboardCopy() { | ||
const selBox = document.createElement('textarea'); | ||
selBox.value = this.password; | ||
document.body.appendChild(selBox); | ||
selBox.select(); | ||
selBox.click(); | ||
document.execCommand('copy'); | ||
|
||
this.messageService.add({ | ||
severity: 'success', | ||
summary: 'Password copied to clipboard' | ||
}); | ||
|
||
document.body.removeChild(selBox); | ||
event?.stopPropagation(); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Modernize clipboard implementation and add error handling
The current implementation has several issues:
- Uses deprecated
document.execCommand('copy')
- Lacks error handling
- Potential memory leak if error occurs
- Missing type for event parameter
Consider this modern implementation using the Clipboard API:
-onClipboardCopy() {
- const selBox = document.createElement('textarea');
- selBox.value = this.password;
- document.body.appendChild(selBox);
- selBox.select();
- selBox.click();
- document.execCommand('copy');
-
+async onClipboardCopy(event?: Event) {
+ try {
+ await navigator.clipboard.writeText(this.password);
this.messageService.add({
severity: 'success',
summary: 'Password copied to clipboard'
});
-
- document.body.removeChild(selBox);
- event?.stopPropagation();
+ } catch (error) {
+ this.messageService.add({
+ severity: 'error',
+ summary: 'Failed to copy password'
+ });
+ } finally {
+ event?.stopPropagation();
}
}
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
onClipboardCopy() { | |
const selBox = document.createElement('textarea'); | |
selBox.value = this.password; | |
document.body.appendChild(selBox); | |
selBox.select(); | |
selBox.click(); | |
document.execCommand('copy'); | |
this.messageService.add({ | |
severity: 'success', | |
summary: 'Password copied to clipboard' | |
}); | |
document.body.removeChild(selBox); | |
event?.stopPropagation(); | |
} | |
async onClipboardCopy(event?: Event) { | |
try { | |
await navigator.clipboard.writeText(this.password); | |
this.messageService.add({ | |
severity: 'success', | |
summary: 'Password copied to clipboard' | |
}); | |
} catch (error) { | |
this.messageService.add({ | |
severity: 'error', | |
summary: 'Failed to copy password' | |
}); | |
} finally { | |
event?.stopPropagation(); | |
} | |
} |
|
||
@Input({required: true}) isLoading: boolean; | ||
|
||
@Input({required: true}) connectionStatus: QBDConnectionStatus; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Codebase verification
Template handles connection status incompletely
The template only handles two cases of QBDConnectionStatus:
- SUCCESS: Used in
connectionStatus === qbdConnectionStatus.SUCCESS
conditions - Default case: All other statuses are treated the same way
However, the enum defines three states:
- SUCCESS
- INCORRECT_COMPANY_PATH
- IN_CORRECT_PASSWORD
The template should show specific error messages for INCORRECT_COMPANY_PATH and IN_CORRECT_PASSWORD states to guide users appropriately.
🔗 Analysis chain
Verify handling of all connection status cases
Ensure that the template handles all possible QBDConnectionStatus enum values appropriately.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify QBDConnectionStatus enum usage in template
# Find the enum definition
echo "Checking QBDConnectionStatus enum definition:"
rg -A 10 "export enum QBDConnectionStatus"
# Find template usage
echo "Checking template usage of QBDConnectionStatus:"
rg -A 5 "QBDConnectionStatus\." "src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.html"
Length of output: 758
Script:
#!/bin/bash
# Let's check the template file content directly to see how connection status is used
echo "Checking template content:"
cat "src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.html"
# Let's also check the component's TypeScript file for any connection status handling
echo -e "\nChecking component implementation:"
cat "src/app/integrations/qbd-direct/qbd-direct-shared/qbd-direct-setup-connection/qbd-direct-setup-connection.component.ts"
Length of output: 9705
continueToNextStep(): void{ | ||
this.saveInProgress = true; | ||
this.workspaceService.updateWorkspaceOnboardingState({onboarding_state: QbdDirectOnboardingState.CONNECTION}).subscribe((workspaceResponse: QbdDirectWorkspace) => { | ||
this.workspaceService.setOnboardingState(workspaceResponse.onboarding_state); | ||
this.saveInProgress = false; | ||
this.router.navigate([`/integrations/qbd_direct/onboarding/connector`]); | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Add error handling to continueToNextStep method.
The method should handle potential errors and ensure the saveInProgress flag is properly reset.
Here's a suggested implementation:
continueToNextStep(): void {
this.saveInProgress = true;
- this.workspaceService.updateWorkspaceOnboardingState({onboarding_state: QbdDirectOnboardingState.CONNECTION}).subscribe((workspaceResponse: QbdDirectWorkspace) => {
- this.workspaceService.setOnboardingState(workspaceResponse.onboarding_state);
- this.saveInProgress = false;
- this.router.navigate([`/integrations/qbd_direct/onboarding/connector`]);
- });
+ this.workspaceService.updateWorkspaceOnboardingState({onboarding_state: QbdDirectOnboardingState.CONNECTION}).subscribe({
+ next: (workspaceResponse: QbdDirectWorkspace) => {
+ this.workspaceService.setOnboardingState(workspaceResponse.onboarding_state);
+ this.router.navigate(['/integrations/qbd_direct/onboarding/connector']);
+ },
+ error: (error: any) => {
+ console.error('Failed to update workspace state:', error);
+ // Consider adding error notification here
+ },
+ complete: () => {
+ this.saveInProgress = false;
+ }
+ });
}
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
continueToNextStep(): void{ | |
this.saveInProgress = true; | |
this.workspaceService.updateWorkspaceOnboardingState({onboarding_state: QbdDirectOnboardingState.CONNECTION}).subscribe((workspaceResponse: QbdDirectWorkspace) => { | |
this.workspaceService.setOnboardingState(workspaceResponse.onboarding_state); | |
this.saveInProgress = false; | |
this.router.navigate([`/integrations/qbd_direct/onboarding/connector`]); | |
}); | |
continueToNextStep(): void{ | |
this.saveInProgress = true; | |
this.workspaceService.updateWorkspaceOnboardingState({onboarding_state: QbdDirectOnboardingState.CONNECTION}).subscribe({ | |
next: (workspaceResponse: QbdDirectWorkspace) => { | |
this.workspaceService.setOnboardingState(workspaceResponse.onboarding_state); | |
this.router.navigate(['/integrations/qbd_direct/onboarding/connector']); | |
}, | |
error: (error: any) => { | |
console.error('Failed to update workspace state:', error); | |
// Consider adding error notification here | |
}, | |
complete: () => { | |
this.saveInProgress = false; | |
} | |
}); |
state: QBDPreRequisiteState.INCOMPLETE | ||
}, | ||
{ | ||
id: 2, | ||
label: 'Keep your Quickbooks company file open', | ||
caption: 'Make sure the QuickBooks Company you want to connect to Fyle is open during the integration setup.', | ||
externalLink: 'https://qbd.com', | ||
iconName: 'expand', | ||
state: QBDPreRequisiteState.INCOMPLETE // INCOMPLETE | ||
state: QBDPreRequisiteState.INCOMPLETE |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Codebase verification
Update the QuickBooks Web Connector download URL
The hardcoded URL 'https://qbd.com' should be replaced with the official Intuit QuickBooks Web Connector download URL: 'https://downloads.quickbooks.com/qbwc/QuickBooksWebConnectorInstaller.exe'
🔗 Analysis chain
Update the placeholder QuickBooks Web Connector download URL.
The external link 'https://qbd.com' appears to be a placeholder. Please update it with the correct QuickBooks Web Connector download URL.
Let's verify if this URL is used elsewhere:
Let me search for the correct QuickBooks Web Connector download URL in the codebase:
Let me search for any configuration files or constants that might contain the correct URL:
Based on the search results, I found that there are help articles related to QuickBooks Desktop integration in the codebase. Let me check the specific article URL for the Web Connector download:
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Search for hardcoded QBD URLs to ensure consistency
rg -i "https://qbd.com" --type ts --type html
Length of output: 401
Script:
#!/bin/bash
# Search for any QuickBooks Web Connector related URLs
rg -i "quickbooks.*web.*connector|qbwc" --type ts --type html -A 2
Length of output: 2963
Script:
#!/bin/bash
# Search for configuration files and constants related to QuickBooks
fd -e ts -e json "config|constant" --exec rg -i "quickbooks|qbwc|intuit" {} -C 2
Length of output: 34115
Script:
#!/bin/bash
# Search for the actual QuickBooks Web Connector download URL in help articles
rg -i "quickbooks.*web.*connector.*download|qbwc.*download" --type-add 'md:*.{md,mdx}' --type md
Length of output: 98
<app-chechbox-button | ||
[checkedText]="'Done'" | ||
[unCheckedText]="'Mark as done'" | ||
[id]="0" | ||
(checkBoxUpdated)="onDoneClick($event)"> | ||
</app-chechbox-button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fix component name typo
The component name contains a typo: "chechbox" should be "checkbox".
-<app-chechbox-button
+<app-checkbox-button
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
<app-chechbox-button | |
[checkedText]="'Done'" | |
[unCheckedText]="'Mark as done'" | |
[id]="0" | |
(checkBoxUpdated)="onDoneClick($event)"> | |
</app-chechbox-button> | |
<app-checkbox-button | |
[checkedText]="'Done'" | |
[unCheckedText]="'Mark as done'" | |
[id]="0" | |
(checkBoxUpdated)="onDoneClick($event)"> | |
</app-checkbox-button> |
<p *ngIf="!isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">****{{password.slice(4)}}</p> | ||
<p *ngIf="isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">{{password}}</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Enhance password security and handling
The current password visibility implementation has potential security concerns:
- The password is directly exposed in the DOM when shown
- The
slice(4)
operation assumes password length ≥ 4 characters
Consider using a more secure approach for password masking and handling.
-<p *ngIf="!isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">****{{password.slice(4)}}</p>
-<p *ngIf="isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">{{password}}</p>
+<p class="tw-text-16-px tw-text-text-tertiary tw-font-400">
+ {{isPasswordShown ? password : password?.replace(/./g, '*')}}
+</p>
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
<p *ngIf="!isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">****{{password.slice(4)}}</p> | |
<p *ngIf="isPasswordShown" class="tw-text-16-px tw-text-text-tertiary tw-font-400">{{password}}</p> | |
<p class="tw-text-16-px tw-text-text-tertiary tw-font-400"> | |
{{isPasswordShown ? password : password?.replace(/./g, '*')}} | |
</p> |
<div class="tw-rounded-border-radius-2xl"> | ||
<p-card> | ||
<div class="tw-flex tw-justify-center"> | ||
<iframe width="427" height="259" src="https://www.youtube.com/embed/2oYdc8KcQnk" frameborder="0"></iframe> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Enhance iframe security and responsiveness
The YouTube video iframe needs security improvements and responsive sizing:
- Add
loading="lazy"
for performance - Add
title
for accessibility - Add
allow
attribute to control features - Make dimensions responsive
-<iframe width="427" height="259" src="https://www.youtube.com/embed/2oYdc8KcQnk" frameborder="0"></iframe>
+<iframe
+ class="tw-w-full tw-aspect-video"
+ src="https://www.youtube.com/embed/2oYdc8KcQnk"
+ title="QuickBooks Web Connector Setup Guide"
+ loading="lazy"
+ allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+ frameborder="0">
+</iframe>
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
<iframe width="427" height="259" src="https://www.youtube.com/embed/2oYdc8KcQnk" frameborder="0"></iframe> | |
<iframe | |
class="tw-w-full tw-aspect-video" | |
src="https://www.youtube.com/embed/2oYdc8KcQnk" | |
title="QuickBooks Web Connector Setup Guide" | |
loading="lazy" | |
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" | |
frameborder="0"> | |
</iframe> |
export enum QBDConnectionStatus { | ||
SUCCESS = 'SUCCESS', | ||
INCORRECT_COMPANY_PATH = 'INCORRECT_COMPANY_PATH', | ||
IN_CORRECT_PASSWORD = 'IN_CORRECT_PASSWORD' | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Fix inconsistent naming in enum value.
The enum value IN_CORRECT_PASSWORD
uses inconsistent word separation compared to INCORRECT_COMPANY_PATH
. Both represent incorrect states but use different patterns.
Apply this diff to maintain consistent naming:
export enum QBDConnectionStatus {
SUCCESS = 'SUCCESS',
INCORRECT_COMPANY_PATH = 'INCORRECT_COMPANY_PATH',
- IN_CORRECT_PASSWORD = 'IN_CORRECT_PASSWORD'
+ INCORRECT_PASSWORD = 'INCORRECT_PASSWORD'
}
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
export enum QBDConnectionStatus { | |
SUCCESS = 'SUCCESS', | |
INCORRECT_COMPANY_PATH = 'INCORRECT_COMPANY_PATH', | |
IN_CORRECT_PASSWORD = 'IN_CORRECT_PASSWORD' | |
} | |
export enum QBDConnectionStatus { | |
SUCCESS = 'SUCCESS', | |
INCORRECT_COMPANY_PATH = 'INCORRECT_COMPANY_PATH', | |
INCORRECT_PASSWORD = 'INCORRECT_PASSWORD' | |
} |
|
* feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]>
d1140bb
into
qbd-direct-onboarding-download-file-UI
* feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]>
* feat: qbd-direct-onboarding-pre-requisite implementation * styling changes * unit test fix * step footer contentt fix * pre requisite Ui updation * PR comments fix * PR comments fix * feat: Download qwd file UI changes (#1059) * feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]>
* feat: qbd direct onboarding landing page * feat: qbd-direct-onboarding-pre-requisite implementation * PR comments fix * PR fix * updateWorkspaceOnboardingState service return type update * qbd direct logo update * feat: qbd-direct onboarding prerequisite UI implementation (#1058) * feat: qbd-direct-onboarding-pre-requisite implementation * styling changes * unit test fix * step footer contentt fix * pre requisite Ui updation * PR comments fix * PR comments fix * feat: Download qwd file UI changes (#1059) * feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]>
* feat: onboarding basic setup * feat: qbd direct onboarding landing page (#1056) * feat: qbd direct onboarding landing page * feat: qbd-direct-onboarding-pre-requisite implementation * PR comments fix * PR fix * updateWorkspaceOnboardingState service return type update * qbd direct logo update * feat: qbd-direct onboarding prerequisite UI implementation (#1058) * feat: qbd-direct-onboarding-pre-requisite implementation * styling changes * unit test fix * step footer contentt fix * pre requisite Ui updation * PR comments fix * PR comments fix * feat: Download qwd file UI changes (#1059) * feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]>
* feat: checkbox button creation * PR comments fix * feat: onboarding basic setup (#1055) * feat: onboarding basic setup * feat: qbd direct onboarding landing page (#1056) * feat: qbd direct onboarding landing page * feat: qbd-direct-onboarding-pre-requisite implementation * PR comments fix * PR fix * updateWorkspaceOnboardingState service return type update * qbd direct logo update * feat: qbd-direct onboarding prerequisite UI implementation (#1058) * feat: qbd-direct-onboarding-pre-requisite implementation * styling changes * unit test fix * step footer contentt fix * pre requisite Ui updation * PR comments fix * PR comments fix * feat: Download qwd file UI changes (#1059) * feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]>
* fead: folder creation * PR comments fix * feat: Qbd checkbox button creation (#1054) * feat: checkbox button creation * PR comments fix * feat: onboarding basic setup (#1055) * feat: onboarding basic setup * feat: qbd direct onboarding landing page (#1056) * feat: qbd direct onboarding landing page * feat: qbd-direct-onboarding-pre-requisite implementation * PR comments fix * PR fix * updateWorkspaceOnboardingState service return type update * qbd direct logo update * feat: qbd-direct onboarding prerequisite UI implementation (#1058) * feat: qbd-direct-onboarding-pre-requisite implementation * styling changes * unit test fix * step footer contentt fix * pre requisite Ui updation * PR comments fix * PR comments fix * feat: Download qwd file UI changes (#1059) * feat: Download qwd file UI changes * download file Ui updation * download file Ui updation * download file Ui updation * download file Ui updation * feat: qbd connector setup UI changes (#1060) * feat: qbd connector setup UI changes * Merge branch qbd-direct-onboarding-download-file-UI into qbd-direct-step-connector-UI * feat: Qbd direct connection data sync UI changes (#1061) * feat: Qbd direct connection data sync UI changes * input made required * svg update * feat: qbd direct pre requisite ts changes (#1062) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes (#1063) * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes (#1064) * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes (#1065) * PR comment fix * PR comment fix * Qbd direct connector data sync up ts (#1070) * feat: qbd direct pre requisite ts changes * feat: qbd direct pre requisite ts changes * feat: qbd direct connector download file ts changes * feat: qbd direct connector setup connector ts changes * feat: qbd direct connector data sync up ts changes * feat: QBD direct main connection page business logic (#1066) * feat: QBD direct main connection page business logic * onboarding connection ts changes * onboarding connection ts changes --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> --------- Co-authored-by: ashwin1111 <[email protected]> * checkbox button fix * QA fixes * qa fixes * qa fixes * fix: qbd direct export settings onboarding changes and content changes (#1082) * qbd direct export settings onboarding changes and content changes * fix: qbd direct import settings onboarding changes and content changes (#1083) * qbd direct import settings onboarding changes and content changes * qbd direct advanced settings onboarding changes and content changes (#1084) * QA fixes * QBD direct bug fixes * QBD direct bug fixes * JE changes in export settings and mapping * PR comments fix --------- Co-authored-by: ashwin1111 <[email protected]>
Description
feat: qbd connector setup UI changes
Clickup
https://app.clickup.com/t/86cwzcemx
Summary by CodeRabbit
Release Notes
New Features
Improvements
Bug Fixes
Style Updates
Chores