Skip to content

Conversation

@shubhmjain30
Copy link
Collaborator

@shubhmjain30 shubhmjain30 commented Dec 15, 2025

Description

This PR consolidates multiple platform improvements across onboarding, admin features, infrastructure, and content management:

Onboarding System Refactor

  • Skippable steps: Added ability to skip optional onboarding steps based on org metadata
  • E-signature integration: Enhanced support for multiple providers (Karza, Android) with provider-specific handling
  • Session storage: Migrated step status management to session storage for better reliability
  • Type safety: Replaced magic numbers with typed constants (STEP_STATUS, STEP_IDS)
  • Passbook upload: Added support for passbook image upload in onboarding flow
  • Profile refresh: Initialize onboarding with agent profile refresh to ensure data consistency

Admin Features

  • Query Center: Added "Raise Query" button with auto-focus on large screens
  • Landing Page Editor: Replaced LandingPageConfig with enhanced LandingPageEditor
  • Network Table: Improved filtering and removed deprecated components (NetworkFilter, SortAndFilterMobile)

About/Diagnostics

  • New About page accessible from MyAccountCard
  • TroubleshootTab with storage diagnostics (localStorage, sessionStorage, cookies)
  • Device and browser information display

CMS Enhancements

  • Migrated to latest Puck CMS version
  • Added extractTextContent utility for parsing nested React elements
  • Enhanced Section, FeatureList, Flex, Hero, Stats components
  • Improved LoginWidget configuration

Infrastructure

  • CI/CD: Added SonarQube and CodeQL workflows for code quality and security scanning
  • Security: Added CSP media-src directive for audio/video support
  • Version management: Added version bump check workflow

Bug Fixes

  • Fixed BottomAppBar blocking clicks when hidden (z-index issue after scroll)
  • Handle undefined interaction_list and role_tx_list in transaction processing
  • Fixed infinite loop in onboarding initialization
  • Corrected file upload behavior on account verification failure

Code Quality

  • Removed deprecated dynamic pricing feature flags
  • Standardized naming: merchant types → applicant types
  • Added comprehensive unit tests for onboarding, About components, and text utilities
  • Updated test mocks for better type safety

Dependencies

  • Updated @ekoindia/oaas-widget: 4.3.1 → 4.3.7
  • Bumped version to 4.40.0

Motivation and Context

These changes address multiple production issues and feature requests:

  • Onboarding steps needed flexibility for different org configurations
  • E-signature integration was brittle across providers
  • Admins lacked diagnostic tools for troubleshooting user issues
  • CMS components needed modernization for better content management
  • Code quality tooling was missing from CI/CD pipeline

How Has This Been Tested?

  • Unit tests added for all new functionality (onboarding steps, About components, text utilities)
  • Manual testing of onboarding flows with different org metadata configurations
  • E-signature integration tested on Android and web platforms
  • Admin features tested across different user roles and permissions
  • CMS components validated in landing page editor

Screenshots (if appropriate):

N/A

Types of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)
  • Documentation Update (if none of the other choices apply)

🚨 Checklist:

  • Make sure you are requesting to pull your topic/feature/bugfix branch (right side). Don't request your master!
  • Make sure you are making a pull request against our dev branch (left side). Also, you should start your branch off our dev branch.
  • Your code follows the code style of this project.
  • Your change requires a change to the documentation.
  • You have updated the documentation accordingly.
  • You have read the Contributing Guide.
  • You have self-reviewed your code.
  • You have added unit-tests that prove my fix is effective or that my feature works.
  • Lint and unit-tests pass locally with your changes.
  • You have added necessary comments for complex logic.
  • Any dependent changes have been merged and published in downstream modules.

Further comments

This PR consolidates work from multiple development branches. Key architectural decisions:

  1. Session storage for onboarding: Chose session storage over localStorage to avoid cross-tab state conflicts
  2. Typed constants: Replaced magic numbers to improve maintainability and catch type errors at compile time
  3. CMS migration: Latest Puck version provides better component composition and reduced bundle size

🙏 Thank you!

Thank you for contributing to this project. We appreciate your time and effort. 🎉


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

manustays and others added 30 commits November 6, 2025 12:28
- Update react-complex-tree from 2.4.5 to 2.6.1.
- Reorder check-updates script in package.json for consistency.
- Remove unused dependencies from package-lock.json to reduce bloat.
- Introduce extractTextContent to extract text from various React node types,
  including strings, numbers, arrays, and React elements. This utility enhances
  text handling capabilities within the application, making it easier to work
  with dynamic content.
- Introduce comprehensive unit tests for various text formatting utilities
  including limitText, getFirstWord, capitalize, toKebabCase, nullRemover,
  numberRemover, getInitials, and extractTextContent.
- These tests ensure the correctness of the utility functions and improve
  maintainability by providing a safety net for future changes.
- Updated SectionProps to accept ReactNode for title and desc, allowing
  more flexible content types.
- Integrated extractTextContent utility in Section and FeatureList to
  ensure proper text extraction from title and description props.
- Made title and description fields in FeatureList and Hero editable,
  improving user interaction and content management.
- Clean up onboarding steps by removing unused and deprecated entries.
- This helps maintain clarity and reduces potential confusion in the codebase.
- Introduce comprehensive tests for the onboarding steps, ensuring
  unique IDs, applicable roles, and backward compatibility of the role
  field. This enhances the reliability of the onboarding process by
  validating the core functionalities.
- Additionally, refactor the getStepsForUserType function to return
  the master list of steps for all user types, improving the overall
  structure and maintainability of the code.
- Fixed a typo in the documentation for the Section component, changing
  "decription" to "description" for clarity and accuracy.
- Simplified the `filterOnboardingStepsByRoles` function by removing
  the legacy role field checks, focusing solely on the applicableRoles
  array for filtering. This enhances code clarity and maintains
  backward compatibility through existing role structures.
- Introduced constants for onboarding step IDs and API response status
  to improve code readability and maintainability. This change replaces
  hardcoded values with descriptive constants across the onboarding
  components and hooks, ensuring consistency and reducing the risk of
  errors.
- This change updates the @ekoindia/oaas-widget package to the latest
  version, ensuring compatibility and access to the latest features and
  bug fixes.
- Updated the constant names from MERCHANT_TYPES to APPLICANT_TYPES
  to better reflect their purpose in the onboarding process.
- Adjusted references in the visibleAgentTypes and getBaseRoleData
  functions to ensure consistency across the codebase.
- Introduce filtering for disabled and skippable steps based on org
  metadata, improving the onboarding experience by allowing dynamic
  step management.
- Update the step configuration logic to apply these filters, ensuring
  that the onboarding process reflects the current organizational
  settings.
…ndling

- Introduced functions to create a step lookup map and extract step
  configuration from organization metadata. This allows for improved
  performance and clarity in determining which onboarding steps are
  disabled or skippable based on user type.
- Updated master onboarding steps to use uppercase naming conventions
  for consistency and clarity.
- Refactor onboarding steps to use uppercase naming conventions for
  consistency and clarity. The steps for Aadhaar consent, confirmation
  of Aadhaar number, and OTP confirmation have been modified to improve
  readability and maintainability.
- Enhance the step filtering mechanism by introducing visibility
  filtering as the first step in the process. This ensures that
  invisible steps are excluded before applying role-based and
  disabled steps filtering.
- The changes improve the clarity and efficiency of the onboarding
  steps configuration, ensuring users only see relevant steps.
- Introduced a new method to handle skipping of onboarding steps, allowing
  users to bypass certain steps in the onboarding process. This enhances
  user experience by providing flexibility in navigation.
- Updated the onboarding state management to include a new action for
  updating step status, including the newly defined SKIPPED status.
- Implement logic to update step status when a step is skipped, ensuring
  the stepper data reflects the current state accurately.
- Adjust the flow to handle the next step after skipping, improving user
  experience by maintaining the correct progression through onboarding.
- Note: refreshAgentProfile is intentionally not called to prevent
  unintended state resets during the onboarding process.
- Updated descriptions for various onboarding steps to provide clearer
  instructions and improve user understanding. This includes details on
  document uploads, consent verification, and account setup processes.
- These enhancements aim to streamline the onboarding experience and
  reduce user confusion during the verification stages.
- Add state management for onboarding initialization to ensure that
  the onboarding steps are determined only after the agent profile
  has been refreshed. This improves the reliability of the onboarding
  flow by preventing premature step determination.
- Update the e-signature integration logic to support both Karza and
  Leegality as agreement providers. This allows for greater flexibility
  in handling e-signature requests based on the provider specified.
- Refactor onboarding step status updates to utilize session storage
  for persistence across page refreshes. This includes saving and
  loading step states based on user identifiers, ensuring that
  completed and skipped steps are preserved.
- Improve the initialization logic to only set steps when valid user
  details are available, enhancing the onboarding experience.
- This update includes bug fixes and improvements from the previous
  version, ensuring better stability and performance of the application.
- Introduce functionality to handle passbook image uploads as part of
  the onboarding steps. This includes updating the file upload data
  structure and implementing the necessary logic to process the
  uploaded file.
- This enhancement allows users to add their bank account details
  more seamlessly during onboarding.
- Refactor the updateStepStatus function to utilize the ONBOARDING_STEP_STATUS
  constant for setting the step status instead of a hardcoded value. This
  enhances code readability and maintainability by ensuring consistent use
  of status values throughout the onboarding process.
- Update tests to ensure that onboarding steps correctly reflect
  skippability based on the isRequired property.
- Modify existing tests to use consistent naming for steps, improving
  clarity and maintainability.
- Update the updateStepStatus function to enforce type safety by
  specifying parameter types. This improves code clarity and
  reduces potential runtime errors.
- Refactor step status updates to use constants for better
  maintainability and readability.
- Replace hardcoded status values for completed and skipped steps
  with constants from ONBOARDING_STEP_STATUS. This improves code
  readability and maintainability by reducing magic numbers.
- Update the dependency array in the useEffect hook to ensure that
  the effect correctly responds to changes in the booklet key function.
  This prevents potential stale closures and ensures the latest function
  is used when the component re-renders.
- Modify the dependency array in the useEffect hook to include
  refreshAgentProfile. This ensures that the onboarding process
  initializes correctly when the refresh function changes,
  improving the component's responsiveness to user data updates.
- Changed the title from "KYC & Verification Tools" to "KYC & Verification"
  to align with the overall branding and improve clarity for users.
- Introduced an `iconStyle` prop to both `InfoTile` and `InfoTileGrid`
  components, allowing users to choose between "avatar" and "square"
  styles for icons. This enhances the visual flexibility of the tiles.
- Default icon style is set to "avatar" for backward compatibility.
- Introduced org_token as a parameter in sendOtpRequest, GoogleButtonContent,
  SocialVerify, and VerifyOtp components to enhance the login process.
- This change allows for better handling of organization-specific details
  during authentication, improving the overall user experience.
- Updated the GOOGLELOGIN endpoint from "/authentication/wlc-login" to
  "/authentication/google-login" to ensure proper authentication flow
  with Google services.
…ration

- Introduced a client_secret field for the google login configuration,
  which must be set on the server side. This enhances security by
  ensuring sensitive credentials are not exposed on the client side.
- Introduce a new custom hook, useNetworkState, that provides
  information about the user's network status, including online
  status, effective connection type, and downlink speed.
- This hook listens for network events and updates the state
  accordingly, enhancing the application's ability to respond
  to changes in network conditions.
- Update the getFormErrorMessage function to destructure the type and
  message from the errors object directly. This change ensures that
  custom error messages are prioritized over default error type messages,
  enhancing the clarity of feedback provided to users.
- Integrate useNetworkState hook to track online status and connection
  type within the TroubleshootTab component.
- Update diagnostic data to include network information, improving
  overall diagnostics and user feedback.
- Add networkStatus property to NetworkState interface to provide
  detailed information about the current network status.
- Update getConnectionState function to calculate networkStatus based
  on effectiveType and navigator's online status.
- Modify the regex patterns for phone number validation to allow
  numbers starting with 5-9 instead of 6-9. This change ensures
  compliance with updated requirements for valid phone numbers.
… digits

- Modified the regex patterns for phone number validation to ensure
  that numbers start with digits between 6 and 9, improving the
  accuracy of input validation for phone numbers.
- Updated the export statement for useNetworkState to a named export
  instead of a default export. This change improves consistency in
  how hooks are exported and allows for better tree-shaking in
  bundlers.
- Introduce a NetworkStatusIcon component that displays the current
  network status in the navbar. It shows a tooltip for offline or slow
  connections, enhancing user awareness of their connectivity.
- This feature improves the user experience by providing immediate
  feedback on network conditions.
- Update the getUserTypeLabel function to return an empty string when
  user_type_id is -1, which represents a New/Unknown User during
  onboarding. This improves clarity and prevents unintended label
  returns for new users.
- Introduce an environment label that displays "DEV" or "UAT" based on
  the current environment. This label is shown only in non-production
  environments to help developers identify the current context.
- The label is styled to be visually distinct and positioned in the
  navbar for easy visibility.
- Added required validations for address fields to ensure user input
  is complete and accurate.
- Improved postal code validation to enforce a 6-digit numeric format
  and added error messages for better user guidance.
- Updated city field to require only letters and spaces, enhancing
  data integrity.
- Introduce internal state management for formatted and unformatted
  values in numeric input mode.
- Implement auto-adjustment of maxLength to accommodate formatting
  spaces.
- Sync display value with controlled value prop for numeric inputs,
  improving user experience and input accuracy.
…ling

- Refactor input handling in Login and SocialVerify components to accept
  unformatted mobile numbers directly, improving user experience.
- Adjust validation rules to require exactly 10 digits for mobile numbers,
  ensuring consistency across components.
- Enhance onChange handlers to manage input more effectively, allowing for
  better state management and user feedback.
- Added tests to verify the formatting of numeric input values with
  spaces and ensure unformatted values are dispatched correctly via
  onChange and onEnter events.
- Improved coverage for controlled mode and partial input handling
  scenarios, ensuring the Input component behaves as expected.
- Refactor the Form component to improve handling of numeric and mobile
  inputs by utilizing the Controller from react-hook-form for better
  integration with form validation and state management.
- Update parameter handling to ensure proper value assignment and
  visibility conditions for form fields.
- Refactor the AddAgentForm component to ensure the mobile number input
  adheres to stricter validation rules, including length and pattern checks.
- Update the parameter type for the mobile number to ensure it is treated
  as a mobile input, enhancing user experience and data integrity.
- Introduced support for OTP input fields in the Form component.
- This enhancement allows for better user experience during verification
  processes by integrating an OtpInput component.
- The onEnter function is now passed to handle Enter key events for OTP
  submission.
- Adjust the margin of the ActionButtonGroup component to improve
  spacing and visual hierarchy within the form layout. This enhances
  the overall user interface and ensures better usability.
- Update parameter type for OTP input to ensure correct validation.
- Adjust minimum length for OTP to 4 digits and update regex pattern.
- Improve error handling for OTP verification, providing clearer feedback
  based on response status.
- Add margin to ActionButtonGroup for better UI spacing.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants