Skip to content

feat(URL): Share link with search parameters #173

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

Open
wants to merge 33 commits into
base: main
Choose a base branch
from

Conversation

Henry8192
Copy link
Collaborator

@Henry8192 Henry8192 commented Jan 27, 2025

Description

Add support to making queries in the url. Also, a button that generates link to current query is added in SearchTabPanel.

Validation performed

Summary by CodeRabbit

  • New Features
    • Added a share button to the search panel, allowing users to copy a permalink with current search parameters.
  • Improvements
    • Search parameters (query string, case sensitivity, regex mode) are now reflected in the URL, enabling direct sharing and bookmarking of specific searches.
    • The application now initializes search state from URL parameters for a more consistent user experience.
  • Bug Fixes
    • Improved handling of URL parameters to ensure accurate parsing and synchronization.

Copy link

coderabbitai bot commented Jan 27, 2025

## Walkthrough

This update introduces a share button to the SearchTabPanel, allowing users to copy the current query (including case sensitivity and regex flags) as URL hash parameters. Supporting changes propagate query parameters through the URL context, update type definitions, and synchronize query state between the URL and the application’s query store.

## Changes

| File(s)                                                                                         | Change Summary                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
|-------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx                    | Added a share button that copies the current query, case sensitivity, and regex flags as URL hash parameters. Introduced a new handler to facilitate this functionality and updated UI controls.                                                                                                                                                                                                                                                                                                                                                                                             |
| src/contexts/UrlContextProvider.tsx                                                             | Added three new hash parameters for query state. Updated default hash parameters, parsing, and updating logic to handle these new parameters and ensure correct synchronisation between URL and application state.                                                                                                                                                                                                                                                                                                                                                                           |
| src/typings/url.ts                                                                             | Extended the `HASH_PARAM_NAMES` enum and `UrlHashParams` interface to include `QUERY_IS_CASE_SENSITIVE`, `QUERY_IS_REGEX`, and `QUERY_STRING`.                                                                                                                                                                                                                                                                                                                                                                                                                                              |
| src/services/LogFileManager/index.ts                                                           | Renamed query arguments in the `startQuery` method to `queryIsRegex` and `queryIsCaseSensitive`. Adjusted logic to use these new names and moved the early return for empty queries.                                                                                                                                                                                                                                                                                                                                                                                                        |
| src/typings/query.ts                                                                           | Renamed properties in the `QueryArgs` interface from `isCaseSensitive`/`isRegex` to `queryIsCaseSensitive`/`queryIsRegex`.                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
| src/components/AppController.tsx                                                               | Added logic to read query parameters from the URL context and synchronize them into the query store using `useEffect` hooks. Ensured the query state is initialized from URL parameters and triggers the query as needed.                                                                                                                                                                                                                                                                                                                                                                   |
| src/services/LogFileManagerProxy.ts                                                            | Renamed parameters in `startQuery` to `queryIsRegex` and `queryIsCaseSensitive`. Corrected an error message in the private method for clarity.                                                                                                                                                                                                                                                                                                                                                                                                                                            |

## Sequence Diagram(s)

```mermaid
sequenceDiagram
    participant User
    participant SearchTabPanel
    participant UrlContextProvider
    participant Clipboard

    User->>SearchTabPanel: Clicks Share Button
    SearchTabPanel->>UrlContextProvider: Get current query, case, regex
    SearchTabPanel->>Clipboard: Copy permalink with query params
sequenceDiagram
    participant AppController
    participant UrlContextProvider
    participant QueryStore

    UrlContextProvider->>AppController: Provide queryString, queryIsRegex, queryIsCaseSensitive
    AppController->>QueryStore: Set query state from URL
    AppController->>QueryStore: Trigger startQuery if queryString present
Loading

Possibly related PRs

Suggested reviewers

  • junhaoliao

<!-- walkthrough_end -->
<!-- This is an auto-generated comment: all tool run failures by coderabbit.ai -->

> [!WARNING]
> There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.
> 
> <details>
> <summary>🔧 ESLint</summary>
> 
> > If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.
> 
> npm warn config production Use `--omit=dev` instead.
> npm error Exit handler never called!
> npm error This is an error with npm itself. Please report this error at:
> npm error   <https://github.com/npm/cli/issues>
> npm error A complete log of this run can be found in: /.npm/_logs/2025-05-23T15_51_07_090Z-debug-0.log
> 
> 
> 
> </details>

<!-- end of auto-generated comment: all tool run failures by coderabbit.ai -->

<!-- announcements_start -->

> [!NOTE]
> <details>
> <summary>⚡️ AI Code Reviews for VS Code, Cursor, Windsurf</summary>
> 
> CodeRabbit now has a plugin for VS Code, Cursor and Windsurf. This brings AI code reviews directly in the code editor. Each commit is reviewed immediately, finding bugs before the PR is raised. Seamless context handoff to your AI code agent ensures that you can easily incorporate review feedback.
> Learn more [here](http://coderabbit.ai/ide).
> 
> </details>

<!-- announcements_end -->

---

<details>
<summary>📜 Recent review details</summary>

**Configuration used: CodeRabbit UI**
**Review profile: ASSERTIVE**
**Plan: Pro**


<details>
<summary>📥 Commits</summary>

Reviewing files that changed from the base of the PR and between 45d011dba20e44044bf678c9b27abd5a37877927 and b59cc431fdb6b19a62ed1ee8a07ffa3b32cdb0d5.

</details>

<details>
<summary>⛔ Files ignored due to path filters (1)</summary>

* `package-lock.json` is excluded by `!**/package-lock.json`

</details>

<details>
<summary>📒 Files selected for processing (2)</summary>

* `src/components/AppController.tsx` (3 hunks)
* `src/contexts/UrlContextProvider.tsx` (5 hunks)

</details>

<details>
<summary>🧰 Additional context used</summary>

<details>
<summary>📓 Path-based instructions (1)</summary>

<details>
<summary>`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == <expression>` rather than `!<expression>`.</summary>

> `**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == <expression>` rather than `!<expression>`.

- `src/components/AppController.tsx`
- `src/contexts/UrlContextProvider.tsx`

</details>

</details><details>
<summary>🧬 Code Graph Analysis (1)</summary>

<details>
<summary>src/contexts/UrlContextProvider.tsx (1)</summary><blockquote>

<details>
<summary>src/typings/url.ts (2)</summary>

* `HASH_PARAM_NAMES` (43-43)
* `UrlSearchParams` (50-50)

</details>

</blockquote></details>

</details>

</details>

<details>
<summary>🔇 Additional comments (8)</summary><blockquote>

<details>
<summary>src/components/AppController.tsx (5)</summary>

`84-85`: **LGTM! URL context integration looks correct.**

The destructuring of the new query-related parameters from URL context is properly implemented and aligns with the feature requirements.

---

`92-95`: **LGTM! Query store integration is well-structured.**

The extraction of query store actions and setters follows the established pattern used for other stores in this component.

---

`178-185`: **LGTM! Case sensitivity synchronization is correctly implemented.**

The useEffect properly synchronizes the case sensitivity flag from URL context to the query store with appropriate null checking and dependency management.

---

`187-194`: **LGTM! Regex flag synchronization follows consistent pattern.**

The useEffect for regex flag synchronization mirrors the case sensitivity implementation correctly.

---

`198-210`: **LGTM! Query string synchronization and execution logic is sound.**

The combined useEffect properly handles both query string synchronization and conditional query execution when the UI is ready. The dependency array is correct and the logic prevents unnecessary query execution.

</details>
<details>
<summary>src/contexts/UrlContextProvider.tsx (3)</summary>

`36-38`: **LGTM! New hash parameter defaults are appropriately defined.**

The default values for the new query-related parameters are sensible: `false` for boolean flags and `null` for the query string.

---

`109-109`: **LGTM! Enhanced parameter removal logic handles boolean defaults correctly.**

The updated condition to remove parameters when their value is `false` (in addition to `null`) is appropriate for boolean parameters that should be omitted from the URL when set to their default value.

---

`189-191`: **LGTM! Generic parameter handling improves flexibility.**

The change from specific parameter handling to a generic `forEach` approach makes the code more maintainable and flexible for future parameter additions.

</details>

</blockquote></details>

</details>
<!-- internal state start -->


<!-- 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 -->

<!-- internal state end -->
<!-- finishing_touch_checkbox_start -->

<details open="true">
<summary>✨ Finishing Touches</summary>

- [ ] <!-- {"checkboxId": "7962f53c-55bc-4827-bfbf-6a18da830691"} --> 📝 Generate Docstrings

</details>

<!-- finishing_touch_checkbox_end -->
<!-- tips_start -->

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

<details>
<summary>❤️ Share</summary>

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai)
- [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai)
- [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai)
- [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

</details>

<details>
<summary>🪧 Tips</summary>

### Chat

There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai?utm_source=oss&utm_medium=github&utm_campaign=y-scope/yscope-log-viewer&utm_content=173):

- Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  - `I pushed a fix in commit <commit_id>, please review it.`
  - `Explain this complex logic.`
  - `Open a follow-up GitHub issue for this discussion.`
- Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples:
  - `@coderabbitai explain this code block.`
  -	`@coderabbitai modularize this function.`
- PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.`
  - `@coderabbitai read src/utils.ts and explain its main purpose.`
  - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.`
  - `@coderabbitai help me debug CodeRabbit configuration file.`

### Support

Need help? Create a ticket on our [support page](https://www.coderabbit.ai/contact-us/support) for assistance with any issues or questions.

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)

- `@coderabbitai pause` to pause the reviews on a PR.
- `@coderabbitai resume` to resume the paused reviews.
- `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
- `@coderabbitai full review` to do a full review from scratch and review all the files again.
- `@coderabbitai summary` to regenerate the summary of the PR.
- `@coderabbitai generate docstrings` to [generate docstrings](https://docs.coderabbit.ai/finishing-touches/docstrings) for this PR.
- `@coderabbitai generate sequence diagram` to generate a sequence diagram of the changes in this PR.
- `@coderabbitai resolve` resolve all the CodeRabbit review comments.
- `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository.
- `@coderabbitai help` to get help.

### Other keywords and placeholders

- Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed.
- Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description.
- Add `@coderabbitai` anywhere in the PR title to generate the title automatically.

### CodeRabbit Configuration File (`.coderabbit.yaml`)

- You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository.
- Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information.
- If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json`

### Documentation and Community

- Visit our [Documentation](https://docs.coderabbit.ai) for detailed information on how to use CodeRabbit.
- Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback.
- Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

</details>

<!-- tips_end -->

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 hashParamsUpdates is 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

📥 Commits

Reviewing files that changed from the base of the PR and between 393f8f8 and d398cee.

📒 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.

@junhaoliao
Copy link
Member

(no rush; whenever you have time; preferably after your vacation)
hey @Henry8192 , if the PR is ready for review, can you resolve all conflicts and fill out the PR description? then please request a review from me and we can discuss accordingly.

Copy link
Member

@junhaoliao junhaoliao left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

great job. the changes are mostly clean but i think we can make some structural improvements.
please do merge yscope/main into your branch before making further changes, to avoid more conflicts.

@Henry8192 Henry8192 marked this pull request as draft January 29, 2025 13:11
@Henry8192 Henry8192 marked this pull request as ready for review February 27, 2025 20:31
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (3)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (3)

53-53: Consider restructuring to avoid disabling the max-lines-per-function lint rule.
If feasible, reduce the function’s size by extracting logic into smaller helper functions, which can improve maintainability and readability.


118-119: Adhere to the coding guideline for negation checks.
Replace !queryIsCaseSensitive with false == queryIsCaseSensitive for consistency.

-handleQuerySubmit({queryIsCaseSensitive: !queryIsCaseSensitive});
-setQueryIsCaseSensitive(!queryIsCaseSensitive);
+handleQuerySubmit({queryIsCaseSensitive: false == queryIsCaseSensitive});
+setQueryIsCaseSensitive(false == queryIsCaseSensitive);

123-124: Maintain consistency for the regex negation as well.
Similarly, use false == queryIsRegex instead of !queryIsRegex.

-handleQuerySubmit({queryIsRegex: !queryIsRegex});
-setQueryIsRegex(!queryIsRegex);
+handleQuerySubmit({queryIsRegex: false == queryIsRegex});
+setQueryIsRegex(false == queryIsRegex);
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between d398cee and c6b97a9.

📒 Files selected for processing (7)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (8 hunks)
  • src/contexts/StateContextProvider.tsx (4 hunks)
  • src/contexts/UrlContextProvider.tsx (4 hunks)
  • src/services/LogFileManager/index.ts (2 hunks)
  • src/typings/query.ts (1 hunks)
  • src/typings/url.ts (1 hunks)
  • src/typings/worker.ts (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
  • src/contexts/StateContextProvider.tsx
  • src/typings/url.ts
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ...

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/typings/worker.ts
  • src/typings/query.ts
  • src/services/LogFileManager/index.ts
  • src/contexts/UrlContextProvider.tsx
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
🪛 GitHub Check: lint-check
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx

[failure] 81-81:
This line has a length of 109. Maximum allowed is 100


[failure] 86-86:
React Hook useEffect has missing dependencies: 'startQuery', 'urlQueryIsCaseSensitive', and 'urlQueryIsRegex'. Either include them or remove the dependency array

🪛 GitHub Actions: lint
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx

[warning] 81-81: This line has a length of 109. Maximum allowed is 100 @stylistic/max-len

🔇 Additional comments (22)
src/typings/worker.ts (1)

115-116: LGTM! Parameter renaming improves code clarity.

The renaming of parameters to queryIsCaseSensitive and queryIsRegex enhances code readability by explicitly indicating these parameters are related to query operations.

src/typings/query.ts (1)

3-4: LGTM! Consistent parameter naming improves maintainability.

Renaming these properties to queryIsCaseSensitive and queryIsRegex aligns with the changes in worker.ts, ensuring consistency across the codebase.

src/services/LogFileManager/index.ts (3)

295-296: LGTM! JSDoc updates match parameter renaming.

The JSDoc parameter descriptions have been correctly updated to reflect the renamed parameters.


298-298: Function signature properly updated to match type changes.

The method signature has been updated to use the new parameter names, maintaining consistency with the type changes.


312-317: LGTM! Variable references updated to match new parameter names.

The internal code has been appropriately updated to reference the new parameter names.

src/contexts/UrlContextProvider.tsx (4)

34-36: LGTM! New default hash parameters added for query sharing.

The addition of these parameters to the default object enables the sharing feature for search parameters.


107-107: LGTM! Condition properly handles false boolean values.

The condition now correctly removes parameters when their value is false, which aligns with the expected behavior for boolean toggle parameters.


187-190: Boolean type conversion is required for URL parameters.

The UrlSearchParams interface may define boolean types, but URLSearchParams stores them as strings. Type conversion is necessary for type safety.


221-235: LGTM! Proper handling of query parameters from URL hash.

The implementation correctly retrieves and type-converts the query parameters from the URL hash. The string to boolean conversion is properly handled using string comparison.

src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (13)

3-3: No concerns regarding the import of useEffect.
It is properly added and necessary for the upcoming effect logic.


15-15: The new icon import is a beneficial addition.
Importing ShareIcon is straightforward and aligns with the sharing feature.


20-25: Appropriate imports from UrlContextProvider.
They are correctly declared and will be useful for URL manipulation and sharing.


30-33: UI_ELEMENT and UI_STATE usage is correct.
These are likely being used in the effect and logic with no apparent issues.


56-60: Destructuring queryString, queryIsCaseSensitive, queryIsRegex is implemented correctly.
No concerns here; it cleanly retrieves values from the UrlContext.


63-64: State initialization for case sensitivity and regex flags is clear.
Setting both to false by default is logical.


94-101: handleShareButtonClick function is straightforward.
Copying the permalink to the clipboard appears well-implemented for sharing the link.


105-106: handleQuerySubmit integration looks correct.
Referencing the new case-sensitivity and regex state flags aligns with the updated logic.


130-130: No concerns with the updated panel container line.
The panel’s setup remains intact.


134-151: New share button in the panel UI is well integrated.
It complements the existing collapse/expand button, enhancing user experience for link sharing.


161-161: Binding the textarea’s value to queryString is correct.
Ensures the component reflects the current search input accurately.


170-171: isChecked={queryIsCaseSensitive} logic is fine.
No issues flagged by the new approach for toggling case-sensitivity.


182-183: isChecked={queryIsRegex} logic is also good.
The toggle correctly binds to the updated state for regex mode.

@Henry8192 Henry8192 requested a review from a team as a code owner February 27, 2025 22:15
@Henry8192 Henry8192 requested a review from junhaoliao February 27, 2025 22:16
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (1)

78-103: Follow coding guidelines for conditional checks.

According to the coding guidelines, false == <expression> should be preferred over !<expression>.

-            if (null !== urlQueryString) {
+            if (null !== urlQueryString) {

While this particular line already follows the guidelines, ensure all conditional checks throughout the component maintain this style.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between c6b97a9 and 7dd50b9.

📒 Files selected for processing (1)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (8 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ...

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
🔇 Additional comments (5)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (5)

108-115: Good implementation of sharing functionality.

The handleShareButtonClick method correctly captures the current search state and uses copyPermalinkToClipboard to share it.


70-76: Good use of refs to track URL context values.

Using refs to track the URL context values helps prevent unnecessary re-renders while still keeping the component responsive to URL changes.


91-96: Good formatting for line length compliance.

The multi-line formatting for the hash parameters object effectively prevents line length issues that were flagged in previous reviews.


148-165: Well-structured UI addition for share button.

The share button is implemented consistently with the existing UI patterns, using the same component structure as the collapse/expand button.


99-103: Properly handled useEffect dependencies.

The useEffect now correctly includes startQuery in the dependency array, addressing the issue raised in the previous review.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (1)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (1)

103-107: Consider adding URL query parameters to the dependency array.

The useEffect dependency array is missing urlQueryIsCaseSensitive and urlQueryIsRegex. Even though you're using refs to track these values, changes to these URL parameters should trigger the effect to ensure the component properly reacts to URL changes.

 }, [
     startQuery,
     uiState,
     urlQueryString,
+    urlQueryIsCaseSensitive,
+    urlQueryIsRegex,
 ]);
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7dd50b9 and 691a911.

📒 Files selected for processing (2)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (8 hunks)
  • src/services/LogFileManager/index.ts (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • src/services/LogFileManager/index.ts
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ...

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
🔇 Additional comments (6)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (6)

112-119: Good implementation of share functionality.

The handleShareButtonClick function correctly implements the link sharing feature by calling copyPermalinkToClipboard with the current search parameters.


136-137: Toggle implementation using negation operator.

According to the coding guidelines, false == <expression> should be preferred over !<expression>. However, as discussed in previous comments, using ! here makes the toggling action more intuitive to understand.


152-169: Well-structured UI for sharing functionality.

The addition of the share button in the title area is cleanly implemented with proper tooltips and icon. Good job maintaining consistent UI patterns with the existing collapse/expand button.


95-101: Consider the intent of resetting URL parameters.

This code updates the window URL hash parameters to their default values right after starting a query with custom parameters. Is the intention to reset the URL after starting the query? If not, this might counteract the sharing functionality you're implementing.

Please confirm if this is intentional behavior - typically when implementing shareable URLs, you would want the URL to reflect the current search parameters rather than resetting them to defaults.


84-93: Good state initialization from URL parameters.

The implementation correctly initializes the search component's state from URL parameters and starts the query with those parameters when the UI is ready.


67-76: Effective use of refs for tracking URL context values.

Using refs to track the URL context values between renders is a good approach to maintain values while avoiding unnecessary re-renders.

# Conflicts:
#	src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (1)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/QueryInputBox.tsx (1)

21-30: Interface definition follows good practices but contains lint suppressions

The new interface queryStates provides good structure for the component props. However, the ESLint suppressions for the boolean prop naming convention suggest potential inconsistency with project standards.

Consider renaming the boolean props to follow the React convention (with is or has prefix) instead of disabling the linting rule. This would better align with React best practices and eliminate the need for lint suppressions.

 interface queryStates {
     queryString: string;
-    // eslint-disable-next-line react/boolean-prop-naming
-    queryIsCaseSensitive: boolean;
-    // eslint-disable-next-line react/boolean-prop-naming
-    queryIsRegex: boolean;
+    isQueryCaseSensitive: boolean;
+    isQueryRegex: boolean;
     setQueryString: (queryString: string) => void;
-    setQueryIsCaseSensitive: (queryIsCaseSensitive: boolean) => void;
-    setQueryIsRegex: (queryIsRegex: boolean) => void;
+    setIsQueryCaseSensitive: (isQueryCaseSensitive: boolean) => void;
+    setIsQueryRegex: (isQueryRegex: boolean) => void;
 }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 691a911 and 82b39d1.

📒 Files selected for processing (2)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/QueryInputBox.tsx (5 hunks)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (3 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ...

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/QueryInputBox.tsx
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
🧠 Learnings (1)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (1)
Learnt from: Henry8192
PR: y-scope/yscope-log-viewer#107
File: src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/Result.tsx:34-58
Timestamp: 2024-11-10T16:46:53.300Z
Learning: When suggesting performance optimizations, ensure they are significant and applicable to the specific context of the code being reviewed.
🔇 Additional comments (17)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/QueryInputBox.tsx (6)

44-51: Refactoring to prop-driven model enhances component reusability

Converting from internal state management to a prop-driven model is a good design decision. This improves component reusability and allows the parent component to control the state.


57-59: Proper use of query parameters in startQuery function

The updated code correctly uses the props for query parameters, which maintains consistency with the new component structure.


70-72: State update follows established pattern but could follow coding guidelines

The code correctly toggles the case sensitivity state and updates the query, maintaining a consistent pattern throughout the component.

Note that a previous review suggested using false == queryIsCaseSensitive instead of !queryIsCaseSensitive to follow coding guidelines, but this was discussed offline and the current approach was preferred for clarity.


75-77: Consistent state update for regex toggle

The implementation follows the same pattern as the case sensitivity toggle, providing a consistent approach to state management.


96-97: Property binding correctly reflects current state

The isChecked property now properly reflects the current state from props rather than internal state, which is consistent with the component's new structure.


108-109: Property binding correctly reflects current state

The isChecked property now properly reflects the current state from props rather than internal state, maintaining consistency with the component's new structure.

src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (11)

3-5: Additional hooks imported to support new functionality

The added imports (useEffect and useRef) are necessary for implementing the new state management and synchronization features.


13-13: Import for new share functionality

The ShareIcon import supports the new URL sharing feature, which aligns with the PR objectives.


18-24: Appropriate imports for URL context functionality

The imports from UrlContextProvider provide necessary functions and constants for handling URL parameters, which is essential for the new sharing feature.


44-49: Enhanced context usage for state management

The component now retrieves additional values from both contexts to properly manage state and synchronize with URL parameters.


52-54: Added state variables for search parameters

The state variables are properly initialized and will be used to control the search parameters, allowing for synchronization with URL parameters.


56-57: Added refs to track state across renders

The refs are used to track the case sensitivity and regex settings across renders, which helps with synchronization issues. This is a valid approach, though there might be more direct alternatives.


62-71: Implemented URL sharing functionality

The handleShareButtonClick function correctly implements the feature to share the current search parameters via URL, meeting the PR objectives. The empty string check for queryString is a good optimization.


81-110: Resolve missing dependencies in useEffect hook

The useEffect hook that handles the UI state changes is missing dependencies in its dependency array. While startQuery is now included, urlQueryIsCaseSensitive and urlQueryIsRegex are still missing.

Although you're using refs as a workaround, it's generally better to include all dependencies directly in the dependency array for clarity and to follow React's best practices.

 useEffect(() => {
     if (uiState === UI_STATE.FILE_LOADING) {
         // ...
     } else if (uiState === UI_STATE.READY) {
         // ...
     }
 }, [
     startQuery,
     uiState,
     urlQueryString,
+    urlQueryIsCaseSensitive,
+    urlQueryIsRegex,
 ]);
#!/bin/bash
# Check for other similar patterns in the codebase where refs might be used instead of direct dependencies

echo "Searching for useEffect implementations with refs:"
rg "useEffect.*\{" -A 10 -B 2 | rg -B 10 "\.current" | rg -A 5 "\], \["

99-103: Address line length linting issue

Line 101 exceeds the maximum line length of 100 characters. This was flagged in a previous review and should be fixed by breaking the line into multiple lines.

 updateWindowUrlHashParams({
     [HASH_PARAM_NAMES.QUERY_STRING]: URL_HASH_PARAMS_DEFAULT.queryString,
-    [HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE]: URL_HASH_PARAMS_DEFAULT.queryIsCaseSensitive,
+    [HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE]: 
+        URL_HASH_PARAMS_DEFAULT.queryIsCaseSensitive,
     [HASH_PARAM_NAMES.QUERY_IS_REGEX]: URL_HASH_PARAMS_DEFAULT.queryIsRegex,
 });

117-134: Well-implemented share button UI

The implementation of the share button in the title buttons area is clean and consistent with the existing UI patterns. The use of the ShareIcon and appropriate title provides good user experience.


138-144: Properly configured QueryInputBox with required props

The QueryInputBox is now correctly configured with all the necessary props, allowing it to function as a controlled component. This ensures that the search parameters are properly synchronized with the URL.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Caution

Inline review comments failed to post. This is likely due to GitHub's limits when posting large numbers of comments. If you are seeing this consistently it is likely a permissions issue. Please check "Moderation" -> "Code review limits" under your organization settings.

Actionable comments posted: 1

🧹 Nitpick comments (1)
src/services/decoders/ClpIrDecoder/index.ts (1)

46-53: Potential enhancement: add error handling for invalid data.
While the current logic is sound, consider gracefully handling the scenario where dataArray or parseFilterKeys might cause a parsing error. This helps avoid silent failures if corrupted data is encountered.

🛑 Comments failed to post (1)
src/services/decoders/ClpIrDecoder/index.ts (1)

104-107: ⚠️ Potential issue

Duplicate setFormatterOptions definitions detected.
It appears there are two methods named setFormatterOptions (one here and another at lines 122-129). This duplication may lead to compilation errors or confusion. Please unify them into a single method or remove the duplicate to avoid overshadowing.

Below is a suggested diff to remove the duplicate definition introduced later (lines 122-129), preserving the first one:

--- a/src/services/decoders/ClpIrDecoder/index.ts
+++ b/src/services/decoders/ClpIrDecoder/index.ts
@@ -121,9 +121,0 @@ class ClpIrDecoder implements Decoder {
-    setFormatterOptions (options: DecoderOptions): boolean {
-        this.#formatter = new YscopeFormatter({
-            formatString: options.formatString,
-            structuredIrNamespaceKeys: this.#structuredIrNamespaceKeys,
-        });
-
-        return true;
-    }
-

…h-params

# Conflicts:
#	src/contexts/StateContextProvider.tsx
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
src/contexts/StateContextProvider.tsx (1)

289-294: Use Yoda conditions for boolean comparisons.

According to the coding guidelines, prefer false == <expression> over !<expression> for boolean comparisons.

Apply this change:

-        if (null === mainWorkerRef.current) {
+        if (null === mainWorkerRef.current) {
            console.error("Unexpected null mainWorkerRef.current");

            return;
        }

The current code already follows the guideline correctly, so no changes are needed.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7f240e6 and 0153d36.

📒 Files selected for processing (1)
  • src/contexts/StateContextProvider.tsx (2 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ` rather than `!`.

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/contexts/StateContextProvider.tsx
🧬 Code Definitions (1)
src/contexts/StateContextProvider.tsx (3)
src/services/LogFileManager/index.ts (1) (1)
  • startQuery (298-328)
src/typings/worker.ts (1) (1)
  • WORKER_REQ_CODE (187-187)
src/typings/query.ts (1) (1)
  • QUERY_PROGRESS_VALUE_MIN (28-28)
🔇 Additional comments (2)
src/contexts/StateContextProvider.tsx (2)

288-288: Good practice: Resetting query results before starting a new query.

The addition of this line to reset query results before starting a new query is a good practice as it ensures the UI is cleared of previous results when a new search begins.


418-419: Reset query states when loading a new file.

Resetting queryResults and queryProgress when loading a new file ensures a clean slate for the new file, which is consistent with how other state variables are reset in this function.

This addresses the previous review comment: "similar to the other state variables, can we reset these at the beginning of loadFile?"

Henry8192 added 2 commits May 20, 2025 12:53
# Conflicts:
#	src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/QueryInputBox.tsx
#	src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
#	src/contexts/StateContextProvider.tsx
#	src/typings/url.ts
#	src/typings/worker.ts
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🔭 Outside diff range comments (1)
src/components/AppController.tsx (1)

83-227: ⚠️ Potential issue

Fix the linting error by extracting component logic.

The component exceeds the maximum allowed lines (120) and is now 122 lines, triggering a linting error.

Consider extracting some of the useEffect hooks into a custom hook to reduce the size of the arrow function:

+ /**
+  * Custom hook to synchronize URL query parameters with the query store
+  */
+ const useSynchronizeQueryParams = () => {
+     const {queryString, queryIsRegex, queryIsCaseSensitive} = useContext(UrlContext);
+     const startQuery = useQueryStore((state) => state.startQuery);
+     const setQueryString = useQueryStore((state) => state.setQueryString);
+     const setQueryIsCaseSensitive = useQueryStore((state) => state.setQueryIsCaseSensitive);
+     const setQueryIsRegex = useQueryStore((state) => state.setQueryIsRegex);
+ 
+     useEffect(() => {
+         if (null !== queryIsCaseSensitive) {
+             setQueryIsCaseSensitive(queryIsCaseSensitive);
+         }
+     }, [
+         queryIsCaseSensitive,
+         setQueryIsCaseSensitive,
+     ]);
+
+     useEffect(() => {
+         if (null !== queryIsRegex) {
+             setQueryIsRegex(queryIsRegex);
+         }
+     }, [
+         queryIsRegex,
+         setQueryIsRegex,
+     ]);
+
+     useEffect(() => {
+         if (null !== queryString) {
+             setQueryString(queryString);
+             startQuery();
+         }
+     }, [
+         queryString,
+         startQuery,
+         setQueryString,
+     ]);
+ };

  const AppController = ({children}: AppControllerProps) => {
      const {postPopUp} = useContext(NotificationContext);
      const {
          filePath, isPrettified, logEventNum
      } = useContext(UrlContext);
  
      // States
      const setLogEventNum = useContextStore((state) => state.setLogEventNum);
      const setPostPopUp = useContextStore((state) => state.setPostPopUp);
      const logFileManagerProxy = useLogFileManagerStore((state) => state.logFileManagerProxy);
      const loadFile = useLogFileStore((state) => state.loadFile);
      const numEvents = useLogFileStore((state) => state.numEvents);
      const beginLineNumToLogEventNum = useViewStore((state) => state.beginLineNumToLogEventNum);
      const setIsPrettified = useViewStore((state) => state.updateIsPrettified);
      const updatePageData = useViewStore((state) => state.updatePageData);
      const setUiState = useUiStore((state) => state.setUiState);
  
+     // Synchronize URL query parameters with the query store
+     useSynchronizeQueryParams();
      
      // Refs
      const isPrettifiedRef = useRef<boolean>(isPrettified ?? false);
      const logEventNumRef = useRef(logEventNum);
🧰 Tools
🪛 GitHub Check: lint-check

[failure] 83-83:
Arrow function has too many statements (26). Maximum allowed is 20


[failure] 83-83:
Arrow function has too many lines (122). Maximum allowed is 120

🪛 GitHub Actions: lint

[error] 83-83: ESLint: Arrow function has too many lines (122). Maximum allowed is 120 (max-lines-per-function)

♻️ Duplicate comments (1)
src/contexts/UrlContextProvider.tsx (1)

188-190: ⚠️ Potential issue

Boolean type conversion is required for URL parameters

The UrlSearchParams interface explicitly defines isCaseSensitive and isRegex as boolean types, but URLSearchParams stores them as strings. Type conversion is necessary for type safety.

 urlSearchParams.forEach((value, key) => {
-    searchParams[key as keyof UrlSearchParams] = value;
+    if (key === SEARCH_PARAM_NAMES.IS_CASE_SENSITIVE || key === SEARCH_PARAM_NAMES.IS_REGEX) {
+        searchParams[key as keyof UrlSearchParams] = value === 'true';
+    } else {
+        searchParams[key as keyof UrlSearchParams] = value;
+    }
 });
📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between eec0016 and 59b0403.

📒 Files selected for processing (5)
  • src/components/AppController.tsx (3 hunks)
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (2 hunks)
  • src/contexts/UrlContextProvider.tsx (4 hunks)
  • src/services/LogFileManager/index.ts (1 hunks)
  • src/typings/url.ts (2 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ` rather than `!`.

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/AppController.tsx
  • src/typings/url.ts
  • src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx
  • src/services/LogFileManager/index.ts
  • src/contexts/UrlContextProvider.tsx
🧬 Code Graph Analysis (2)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (2)
src/contexts/UrlContextProvider.tsx (1)
  • copyPermalinkToClipboard (299-299)
src/typings/tab.ts (2)
  • TAB_NAME (22-22)
  • TAB_DISPLAY_NAMES (21-21)
src/contexts/UrlContextProvider.tsx (1)
src/typings/url.ts (2)
  • HASH_PARAM_NAMES (43-43)
  • UrlSearchParams (50-50)
🪛 GitHub Actions: lint
src/components/AppController.tsx

[error] 83-83: ESLint: Arrow function has too many lines (122). Maximum allowed is 120 (max-lines-per-function)

🔇 Additional comments (17)
src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx (4)

8-8: Appropriate imports for new share functionality.

The imports for ShareIcon and copyPermalinkToClipboard are correctly added to support the new sharing feature.

Also applies to: 12-12


32-35: State variables extracted properly.

The component correctly extracts the query-related state variables from the query store to support the sharing functionality.


42-51: Sharing implementation correctly handles edge cases.

The handleShareButtonClick function properly implements the sharing functionality by:

  1. Converting empty query strings to null
  2. Including query flags (case sensitivity, regex) in the permalink
  3. Using the copyPermalinkToClipboard utility function

This implementation enables users to share their current search state via URL.


58-75: Share button UI implementation is clean and consistent.

The share button implementation follows the existing UI patterns by:

  1. Using the established PanelTitleButton component
  2. Adding an appropriate tooltip
  3. Using a standard Material-UI icon
  4. Properly handling the onClick event

This provides users with a clear way to share their search parameters.

src/typings/url.ts (2)

11-13: Hash parameter names properly defined for query sharing.

The enum additions for query-related hash parameters are well-named and follow the established pattern in the codebase.


23-25: Interface properly extended with appropriate types.

The UrlHashParams interface is correctly extended with the new query parameters using appropriate types:

  • boolean for flags (queryIsCaseSensitive, queryIsRegex)
  • string for the queryString

This ensures type safety when working with URL hash parameters.

src/components/AppController.tsx (6)

17-17: Query store import added for state synchronization.

The useQueryStore import is correctly added to support the new query parameter synchronization.


85-87: URL context parameters properly extracted.

The component correctly extracts the query-related URL parameters that will be synchronized with the query store.


95-98: Query store actions properly extracted.

The necessary actions from the query store are correctly extracted to support URL parameter synchronization.


128-135: Case sensitivity flag synchronization implemented correctly.

This useEffect hook properly synchronizes the case sensitivity flag from the URL to the query store when the URL parameter is non-null.


137-144: Regex flag synchronization implemented correctly.

This useEffect hook properly synchronizes the regex flag from the URL to the query store when the URL parameter is non-null.


146-155: Query string synchronization and execution implemented correctly.

This useEffect hook properly:

  1. Synchronizes the query string from the URL to the query store
  2. Triggers the search operation
  3. Only runs when the URL parameter is non-null

This ensures that shared links with query parameters will automatically execute searches.

src/services/LogFileManager/index.ts (3)

352-356: Parameter naming improved for consistency.

The parameter names have been updated (isRegex → queryIsRegex, isCaseSensitive → queryIsCaseSensitive) to be consistent with the naming pattern used elsewhere in the codebase.


357-360: Efficient early return for empty queries.

Added a performance optimization to return early when:

  1. The query string is empty, or
  2. There are no log events to search

This prevents unnecessary processing and potential errors.


370-373: Properly updated parameter usage in regex construction.

The renamed parameters are correctly used in the regular expression pattern and flags construction.

src/contexts/UrlContextProvider.tsx (2)

35-37: LGTM: Query parameters addition

These additions enable the "share link with search parameters" feature by defining appropriate defaults for query-related hash parameters.


108-108:

✅ Verification successful

Consider implications of removing false values from URL

You've modified the condition to remove parameters with false values from the URL hash. While this makes sense for boolean flags where false is the default state, ensure this approach doesn't prevent legitimate false values from being represented in the URL for any parameters where false isn't the default value.


🏁 Script executed:

#!/bin/bash
set -euxo pipefail
# Locate the UrlContextProvider file
file=$(fd --ignore-case 'UrlContextProvider.tsx' -t f || echo "")
echo "Found file: $file"
# Output lines around the conditional to understand context
if [ -n "$file" ]; then
  sed -n '1,200p' "$file"
fi

Length of output: 8265


getUpdatedHashParams safely omits only default‐false flags
The deletion condition (null === value || false === value) applies strictly to null or the boolean false. In our hash‐params:

  • All boolean flags (isPrettified, queryIsCaseSensitive, queryIsRegex) default to false, so dropping false merely avoids redundant entries.
  • Non‐boolean params (logEventNum, queryString) default to null and will never be set to the boolean false, so no legitimate value is lost.

No changes required.

Comment on lines +227 to +241
const queryString = hashParams.get(HASH_PARAM_NAMES.QUERY_STRING);
if (null !== queryString) {
urlHashParams[HASH_PARAM_NAMES.QUERY_STRING] = queryString;
}

const isCaseSensitive = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE);
if (null !== isCaseSensitive) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE] =
"true" === isCaseSensitive.toLowerCase();
}

const isRegex = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_REGEX);
if (null !== isRegex) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_REGEX] = "true" === isRegex.toLowerCase();
}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Ensure consistent boolean string parsing

The new code correctly converts string values to booleans for the query parameters, but uses a slightly different approach than the existing code for isPrettified at line 245. For consistency, standardize the boolean string parsing approach across all parameters.

 const isCaseSensitive = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE);
 if (null !== isCaseSensitive) {
     urlHashParams[HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE] =
-        "true" === isCaseSensitive.toLowerCase();
+        "true" === isCaseSensitive;
 }

 const isRegex = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_REGEX);
 if (null !== isRegex) {
-    urlHashParams[HASH_PARAM_NAMES.QUERY_IS_REGEX] = "true" === isRegex.toLowerCase();
+    urlHashParams[HASH_PARAM_NAMES.QUERY_IS_REGEX] = "true" === isRegex;
 }

// Or alternatively, update the isPrettified handling:
 const isPrettified = hashParams.get(HASH_PARAM_NAMES.IS_PRETTIFIED);
 if (null !== isPrettified) {
-    urlHashParams[HASH_PARAM_NAMES.IS_PRETTIFIED] = "true" === isPrettified;
+    urlHashParams[HASH_PARAM_NAMES.IS_PRETTIFIED] = "true" === isPrettified.toLowerCase();
 }
📝 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.

Suggested change
const queryString = hashParams.get(HASH_PARAM_NAMES.QUERY_STRING);
if (null !== queryString) {
urlHashParams[HASH_PARAM_NAMES.QUERY_STRING] = queryString;
}
const isCaseSensitive = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE);
if (null !== isCaseSensitive) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE] =
"true" === isCaseSensitive.toLowerCase();
}
const isRegex = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_REGEX);
if (null !== isRegex) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_REGEX] = "true" === isRegex.toLowerCase();
}
const queryString = hashParams.get(HASH_PARAM_NAMES.QUERY_STRING);
if (null !== queryString) {
urlHashParams[HASH_PARAM_NAMES.QUERY_STRING] = queryString;
}
const isCaseSensitive = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE);
if (null !== isCaseSensitive) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_CASE_SENSITIVE] =
"true" === isCaseSensitive;
}
const isRegex = hashParams.get(HASH_PARAM_NAMES.QUERY_IS_REGEX);
if (null !== isRegex) {
urlHashParams[HASH_PARAM_NAMES.QUERY_IS_REGEX] = "true" === isRegex;
}
const isPrettified = hashParams.get(HASH_PARAM_NAMES.IS_PRETTIFIED);
if (null !== isPrettified) {
urlHashParams[HASH_PARAM_NAMES.IS_PRETTIFIED] = "true" === isPrettified.toLowerCase();
}
🤖 Prompt for AI Agents
In src/contexts/UrlContextProvider.tsx around lines 227 to 241, the boolean
string parsing for isCaseSensitive and isRegex uses "true" ===
value.toLowerCase(), which differs from the approach used for isPrettified at
line 245. To ensure consistency, update the parsing logic for all boolean query
parameters to use the same method, either by normalizing case and comparing to
"true" or by another consistent approach used elsewhere in the file.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7aac839 and 45d011d.

⛔ Files ignored due to path filters (1)
  • package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (2)
  • src/components/AppController.tsx (3 hunks)
  • src/services/LogFileManagerProxy.ts (2 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ` rather than `!`.

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/AppController.tsx
  • src/services/LogFileManagerProxy.ts
🔇 Additional comments (8)
src/components/AppController.tsx (5)

17-17: Added necessary import for query-related functionality.

The addition of useQueryStore import supports the new URL query parameters feature, allowing synchronization between URL state and query state.


86-88: Correctly expanded URL context destructuring for query parameters.

Added new query-related parameters from the URL context to support the URL sharing feature.


96-99: Added query store hooks for state management.

These hooks enable proper synchronization between URL parameters and query store state.


191-198: Implemented URL to query store synchronization for case sensitivity.

This effect correctly synchronizes the case sensitivity setting from URL parameters to the query store.


200-207: Implemented URL to query store synchronization for regex mode.

This effect correctly synchronizes the regex mode setting from URL parameters to the query store.

src/services/LogFileManagerProxy.ts (3)

65-65: Improved parameter naming for better clarity.

Parameter names have been updated from isRegex and isCaseSensitive to queryIsRegex and queryIsCaseSensitive for better clarity and consistency with the rest of the codebase.


67-67: Updated object property names to match parameter naming.

Corresponding update to the call to logFileManager.startQuery() to use the new parameter names.


78-78: Improved error message clarity.

The error message has been improved from "LogFileManager is not initialized" to "LogFileManager hasn't been initialized" for better grammatical correctness.

@@ -79,16 +80,23 @@ interface AppControllerProps {
* @param props.children
* @return
*/
// eslint-disable-next-line max-lines-per-function,max-statements
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Consider refactoring to reduce function complexity.

The linter suppressions for max-lines-per-function and max-statements suggest this component is becoming overly complex. With the addition of query parameter handling, it may be time to extract some functionality into separate hooks or components.

🤖 Prompt for AI Agents
In src/components/AppController.tsx at line 83, the function is currently too
complex, as indicated by the linter suppressions for max-lines-per-function and
max-statements. To fix this, refactor the function by extracting parts of its
logic, especially the query parameter handling, into separate custom hooks or
smaller components. This will reduce the function's length and complexity,
improving readability and maintainability.

@junhaoliao junhaoliao self-requested a review May 22, 2025 21:05
@junhaoliao
Copy link
Member

hey @Henry8192 , before we review this, could you:

  1. Check if Bug: Query parameters in filePath URLs are incorrectly handled when generating shareable links #294 is fixed with your changes as we discussed offline?
  2. Merge main into your branch? There seems to be some conflicts

@Henry8192
Copy link
Collaborator Author

hey @Henry8192 , before we review this, could you:

  1. Check if Bug: Query parameters in filePath URLs are incorrectly handled when generating shareable links #294 is fixed with your changes as we discussed offline?

  2. Merge main into your branch? There seems to be some conflicts

  1. No, it doesn't fix the bug, checked yesterday.

  2. Merging it right now.

@Henry8192
Copy link
Collaborator Author

@junhaoliao ready for review.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (3)
src/components/AppController.tsx (1)

198-210: 🛠️ Refactor suggestion

Prevent unnecessary empty queries.

The current implementation calls startQuery() whenever the UI state is READY, regardless of whether there's a valid query string. This could trigger unnecessary empty searches when the application loads without query parameters.

 useEffect(() => {
     if (null !== queryString) {
         setQueryString(queryString);
     }
-    if (UI_STATE.READY === uiState) {
+    if (UI_STATE.READY === uiState && null !== queryString && queryString.trim().length > 0) {
         startQuery();
     }
 }, [
     uiState,
     queryString,
     startQuery,
     setQueryString,
 ]);
src/contexts/UrlContextProvider.tsx (2)

189-191: Type safety issue with generic parameter handling.

The generic parameter copying doesn't handle type conversion for boolean values. URLSearchParams stores all values as strings, but the UrlSearchParams interface expects specific types.

This issue was previously identified but remains unaddressed. Boolean parameters need explicit type conversion for type safety.


228-242: Inconsistent boolean string parsing.

The new query parameter parsing uses .toLowerCase() for boolean conversion, which is inconsistent with the existing isPrettified parsing at line 245 that doesn't use case normalization.

For consistency, standardize the boolean string parsing approach across all parameters as previously suggested.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 45d011d and b59cc43.

⛔ Files ignored due to path filters (1)
  • package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (2)
  • src/components/AppController.tsx (3 hunks)
  • src/contexts/UrlContextProvider.tsx (5 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
`**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}`: - Prefer `false == ` rather than `!`.

**/*.{cpp,hpp,java,js,jsx,tpp,ts,tsx}: - Prefer false == <expression> rather than !<expression>.

  • src/components/AppController.tsx
  • src/contexts/UrlContextProvider.tsx
🧬 Code Graph Analysis (1)
src/contexts/UrlContextProvider.tsx (1)
src/typings/url.ts (2)
  • HASH_PARAM_NAMES (43-43)
  • UrlSearchParams (50-50)
🔇 Additional comments (7)
src/components/AppController.tsx (5)

17-17: LGTM!

The import addition aligns with the new query store integration.


83-85: LGTM!

The destructuring correctly extracts the new query-related parameters from the URL context.


92-95: LGTM!

The query store actions and setters are properly extracted for use in the component.


178-185: LGTM!

The useEffect correctly synchronizes the case sensitivity flag from URL to query store.


187-194: LGTM!

The useEffect correctly synchronizes the regex flag from URL to query store.

src/contexts/UrlContextProvider.tsx (2)

36-38: LGTM!

The new query-related hash parameter defaults are correctly structured and consistent with existing patterns.


109-109: LGTM!

The updated condition to remove parameters when false is logical for boolean parameters and improves URL cleanliness.

@@ -1,3 +1,4 @@
/* eslint-disable max-lines */
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Consider addressing underlying complexity.

The addition of eslint-disable max-lines suggests the file is becoming too large. Consider extracting utility functions or breaking this into smaller, more focused modules.

🤖 Prompt for AI Agents
In src/contexts/UrlContextProvider.tsx at line 1, the file is currently very
large, as indicated by the eslint-disable max-lines directive. To fix this,
identify logical sections or utility functions within the file that can be
extracted into separate modules or helper files. Refactor the code by moving
these parts out to reduce the file size and improve maintainability, then remove
the eslint-disable comment once the file length is within acceptable limits.

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.

2 participants