Refactor web viewer into modular components and hooks#574
Closed
mehmetozguldev wants to merge 1 commit intomasterfrom
Closed
Refactor web viewer into modular components and hooks#574mehmetozguldev wants to merge 1 commit intomasterfrom
mehmetozguldev wants to merge 1 commit intomasterfrom
Conversation
… integration Refactor the 630-line monolithic web-viewer component into a proper feature module with dedicated hooks, stores, utils, types, and constants. Add persisted browsing history and bookmarks via Zustand store, a new tab page with search bar and recent sites, a browsing history panel with search and date grouping, responsive device preview with preset device dimensions, extended ACP protocol for AI-driven browser control, and a settings tab for configuring search engine, home page, and zoom level. https://claude.ai/code/session_01HEcZfBGVdoKJVNoMCM6eXc
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR significantly refactors the web viewer component by extracting logic into reusable hooks, custom stores, and separate UI components. The changes improve code organization, maintainability, and enable new features like browsing history, bookmarks, and responsive device preview modes.
Key Changes
Extracted Custom Hooks:
useWebviewLifecycle: Manages webview creation, destruction, and lifecycle eventsuseWebViewerNavigation: Handles URL navigation, history management, and back/forward functionalityuseWebViewerShortcuts: Centralizes keyboard shortcuts and zoom event handlingNew Zustand Store:
useWebViewerStore: Manages browsing history, bookmarks, device presets, search engine preferences, and responsive mode settingsComponent Extraction:
Toolbar: Extracted navigation controls, URL input, zoom controls, and utility buttonsDeviceToolbar: New component for responsive device preview with preset selection and custom dimensionsHistoryPanel: New dropdown panel showing browsing history with search and date groupingNewTabPage: New landing page for new tabs with search, recent sites, and bookmarksUtility Functions:
normalizeUrl: Standardizes URL input with protocol detectiongetSecurityInfo: Returns security status (HTTPS, localhost, etc.) with appropriate iconsextractHostname: Extracts hostname from URLs for display purposesType Definitions:
HistoryEntry,Bookmark,DevicePreset, andWebViewerNavigationStatetypesAI Integration:
navigate_web_viewer,go_back_web_viewer,go_forward_web_viewer, andset_viewportactionsSettings:
Benefits
Related Issues
Closes #
Checklist