feat(URL): Share link with search parameters #173
Conversation
|
Important Review skippedDraft detected. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the WalkthroughThe pull request introduces enhanced functionality for search parameter management across multiple components. The changes primarily focus on expanding the URL context to include case sensitivity, regex options, and query string parameters. A new sharing feature is added to the Changes
Sequence DiagramsequenceDiagram
participant User
participant SearchTabPanel
participant UrlContext
participant Clipboard
User->>SearchTabPanel: Click Share Button
SearchTabPanel->>UrlContext: Retrieve current search params
UrlContext-->>SearchTabPanel: Return params
SearchTabPanel->>Clipboard: Copy permalink
Clipboard-->>User: Confirmation of copied URL
Possibly Related PRs
Suggested Reviewers
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 (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (1)
80-86: Consider omitting the empty object parameter.The empty object passed as
hashParamsUpdatesis unnecessary.const handleShareButtonClick = () => { copyPermalinkToClipboard({ queryString: queryString, isCaseSensitive: getIsCaseSensitive(queryOptions), isRegex: getIsRegex(queryOptions), - }, {}); + }); };src/contexts/StateContextProvider.tsx (1)
459-468: Simplify the search parameter condition.The condition is complex and could be simplified. Also, consider moving the URL parameter reset to a cleanup function.
useEffect(() => { - if (URL_SEARCH_PARAMS_DEFAULT.queryString !== queryString && URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive !== isCaseSensitive && URL_SEARCH_PARAMS_DEFAULT.isRegex !== isRegex) { + const hasSearchParams = queryString !== URL_SEARCH_PARAMS_DEFAULT.queryString || + isCaseSensitive !== URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive || + isRegex !== URL_SEARCH_PARAMS_DEFAULT.isRegex; + + if (hasSearchParams) { startQuery({queryString, isCaseSensitive, isRegex}); } - updateWindowUrlSearchParams({ - [SEARCH_PARAM_NAMES.QUERY_STRING]: URL_SEARCH_PARAMS_DEFAULT.queryString, - [SEARCH_PARAM_NAMES.IS_CASE_SENSITIVE]: URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive, - [SEARCH_PARAM_NAMES.IS_REGEX]: URL_SEARCH_PARAMS_DEFAULT.isRegex, - }); + + return () => { + updateWindowUrlSearchParams({ + [SEARCH_PARAM_NAMES.QUERY_STRING]: URL_SEARCH_PARAMS_DEFAULT.queryString, + [SEARCH_PARAM_NAMES.IS_CASE_SENSITIVE]: URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive, + [SEARCH_PARAM_NAMES.IS_REGEX]: URL_SEARCH_PARAMS_DEFAULT.isRegex, + }); + }; }, [isFileLoaded]);
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx(4 hunks)src/contexts/StateContextProvider.tsx(4 hunks)src/contexts/UrlContextProvider.tsx(2 hunks)src/typings/url.ts(2 hunks)
🧰 Additional context used
📓 Path-based instructions (4)
src/contexts/UrlContextProvider.tsx (1)
Pattern **/*.{cpp,hpp,java,js,jsx,ts,tsx}: - Prefer false == <expression> rather than !<expression>.
src/typings/url.ts (1)
Pattern **/*.{cpp,hpp,java,js,jsx,ts,tsx}: - Prefer false == <expression> rather than !<expression>.
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (1)
Pattern **/*.{cpp,hpp,java,js,jsx,ts,tsx}: - Prefer false == <expression> rather than !<expression>.
src/contexts/StateContextProvider.tsx (1)
Pattern **/*.{cpp,hpp,java,js,jsx,ts,tsx}: - Prefer false == <expression> rather than !<expression>.
🔇 Additional comments (9)
src/typings/url.ts (2)
6-8: LGTM! The new search parameter names are well-defined.The added enum values follow consistent naming conventions and use appropriate camelCase for URL parameters.
17-19: LGTM! The interface properties are well-typed.The added properties use appropriate types and maintain type safety through computed property names.
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (3)
16-16: LGTM! The imports support the new sharing functionality.The added imports are necessary and well-organized.
Also applies to: 21-24
72-72: LGTM! The URL context integration is well-implemented.The context usage and state initialization follow React best practices with proper null handling.
Also applies to: 75-75
131-136: LGTM! The share button UI is well-integrated.The button follows consistent patterns and provides clear user feedback through the tooltip.
src/contexts/UrlContextProvider.tsx (1)
27-29: LGTM! The default parameters are consistently defined.The new search parameters follow the established pattern and ordering.
src/contexts/StateContextProvider.tsx (3)
249-249: LGTM! The URL context usage is complete.All necessary search parameters are extracted in a consistent order.
254-255: LGTM! The file loading state is well-managed.The state is properly initialized and updated in the file info handler.
Also applies to: 309-309
424-425: LGTM! The query state reset is appropriate.Query results and progress are properly reset when loading a new file.
|
(no rush; whenever you have time; preferably after your vacation) |
| if (URL_SEARCH_PARAMS_DEFAULT.queryString !== queryString && URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive !== isCaseSensitive && URL_SEARCH_PARAMS_DEFAULT.isRegex !== isRegex) { | ||
| startQuery({queryString, isCaseSensitive, isRegex}); | ||
| } | ||
| updateWindowUrlSearchParams({ | ||
| [SEARCH_PARAM_NAMES.QUERY_STRING]: URL_SEARCH_PARAMS_DEFAULT.queryString, | ||
| [SEARCH_PARAM_NAMES.IS_CASE_SENSITIVE]: URL_SEARCH_PARAMS_DEFAULT.isCaseSensitive, | ||
| [SEARCH_PARAM_NAMES.IS_REGEX]: URL_SEARCH_PARAMS_DEFAULT.isRegex, | ||
| }); | ||
| }, [isFileLoaded]); |
There was a problem hiding this comment.
I feel some of these handlings shall be done in the UrlContextProvider instead:
- Instead of expecting
queryString,isCaseSensitiveandisRegexfrom the URL search parameters, can we expectqueryParams.queryString,queryParams.isCaseSensitiveandqueryParams.isRegexinstead? - Shall we assume both
queryParams.isCaseSensitiveandqueryParams.isRegexare false when they are absent in the URL? i.e., shall we consider making those parameters optional? - I think the onus to clear the query parameters shall be on the UrlContextProvider rather than the StateContextProvider.
- Then instead of exposing state variables
queryString,isCaseSensitiveandisRegexdirectly from the UrlContextProvider, can we expose a single objectqueryParams? That way in the StateContextProvider code, we can simply check ifqueryParamsis null.
Description
Validation performed
Summary by CodeRabbit
Release Notes
New Features
Improvements
Technical Updates
The update introduces more flexible search functionality and improved user experience for sharing search settings.