发布

  • [OPIK-2848] [FE] Add Comet Debugger Mode with app version and connectivity status (#3982)

    frostbyte_neo 发布于 2025-11-10 15:20:37 +00:00

    • Add Comet Debugger Mode feature and related components
    • Introduced a new feature toggle for Comet Debugger Mode in the configuration and frontend.
    • Added useIsNetworkOnline hook to monitor network status.
    • Implemented AppNetworkStatus component to display network and server connection status.
    • Created UserMenuAppDebugInfoToggle for toggling debug info visibility in the user menu.
    • Updated layouts and components to integrate the new debug features, including NoUserMenu and AppDebugInfo.
    • Added comet.svg icon for visual representation.

    This commit enhances the debugging capabilities of the application, allowing developers to monitor backend connectivity and toggle debug information visibility.

    • Add Opik icon to AppDebugInfo component
    • Imported Opik icon as a React component in AppDebugInfo.
    • Updated the layout to include the icon alongside the OPIK VERSION text for improved visual representation.

    This change enhances the user interface by providing a clearer branding element in the debug information section.

    • Enhance Switch Component with Extra Small Size Variant
    • Added 'xs' size variant to the switch component for improved responsiveness.
    • Updated UserMenuAppDebugInfoToggle to utilize the new 'xs' size for the debug info switch, enhancing UI consistency.
    • Enhance AppNetworkStatus component with styled RTT display
    • Updated the RTT display in the AppNetworkStatus component to use a new class for improved styling, enhancing the visual appeal and consistency of the user interface.
    • Add cometDebuggerModeEnabled toggle to ServiceTogglesConfig
    • Introduced a new boolean field cometDebuggerModeEnabled in the ServiceTogglesConfig class to manage the debugger mode feature.
    • This addition enhances the configuration options available for service toggles, allowing for better control over debugging functionalities.
    • Update AppDebugInfo component to conditionally render OPIK version display
    • Modified the AppDebugInfo component to only display the OPIK version section if the APP_VERSION is defined, improving the component's robustness and preventing potential rendering issues when the version is not available.
    • Update end-to-end workflows and configuration for Comet Debugger Mode
    • Modified the end-to-end workflow files to include the TOGGLE_COMET_DEBUGGER_MODE_ENABLED environment variable during the build process.
    • Updated the config.yml to set the default value of cometDebuggerModeEnabled to true, enhancing the service toggles configuration.
    • Added the TOGGLE_COMET_DEBUGGER_MODE_ENABLED variable to the Docker Compose configuration, ensuring it is available in the deployment environment.
    • [OPIK-2848] Fix Tailwind CSS classnames order

    • Refactor UserMenu component to use logical AND for APP_VERSION check

    • Updated the UserMenu component to conditionally render the OPIK version section using a logical AND operator instead of a ternary operator, improving code readability and consistency.
    • Wrap CometIcon in a span within AppNetworkStatus component for improved layout consistency

    • Revision 2: Add keyboard shortcut for debugger mode and remove menu toggles

    • Add Meta/Ctrl + c + . keyboard shortcut to toggle debugger mode
    • Remove UserMenuAppDebugInfoToggle from UserMenu and NoUserMenu
    • Debugger mode now controlled exclusively via keyboard shortcut
    • Revision 2: Remove COMET_DEBUGGER_MODE from feature toggles

    • Revision 3: Revert to ThemeToggle and remove redundant empty line

    • Revision 4: Use absolute imports for ThemeToggle component

    • Revision 5: Remove redundant DebugStore and use simple localStorage state

    • Revision 2: Refactor AppDebugInfo to use react-hotkeys-hook and make available for all versions

    • Replace manual keyboard event handling with useHotkeys hook
    • Change hotkey to Cmd/Ctrl+Shift+. to avoid conflict with system copy command
    • Extract platform detection (isMac, modifierKey) to shared utils
    • Move AppDebugInfo and AppNetworkStatus from plugins/comet to components/shared
    • Update AppNetworkStatus to use generic 'backend server' terminology instead of 'Comet server'
    • Maintain same localStorage key (comet-debugger-mode) for consistency with EM
    • Revision 3: Move AppNetworkStatus to layout components

    • Revision 4: Move AppDebugInfo to layout components

    下载附件