Skip to content

Comments

Feat: search table tip#1449

Merged
AStaroverov merged 4 commits intomainfrom
feat/search-table-tip
Feb 20, 2026
Merged

Feat: search table tip#1449
AStaroverov merged 4 commits intomainfrom
feat/search-table-tip

Conversation

@AStaroverov
Copy link
Contributor

No description provided.

@changeset-bot
Copy link

changeset-bot bot commented Feb 20, 2026

🦋 Changeset detected

Latest commit: afb69c9

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 8 packages
Name Type
@milaboratories/milaboratories.ui-examples.ui Patch
@milaboratories/uikit Patch
@platforma-sdk/ui-vue Patch
@milaboratories/milaboratories.ui-examples Patch
@milaboratories/milaboratories.monetization-test.ui Patch
@milaboratories/milaboratories.pool-explorer.ui Patch
@milaboratories/milaboratories.monetization-test Patch
@milaboratories/milaboratories.pool-explorer Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello @AStaroverov, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly improves the usability of search functionalities by introducing a helper text feature to the PlSearchField component. This enhancement allows developers to provide contextual information or instructions directly within search fields, which is then immediately applied to the PlTableFastSearch component to guide users on its search mechanics. The underlying implementation of PlSearchField was also modernized for better Vue 3 compatibility.

Highlights

  • Enhanced PlSearchField Component: The PlSearchField component now supports a helper prop and a helper slot, allowing for additional descriptive text to be displayed, typically within a tooltip.
  • Improved Table Search Guidance: The PlTableFastSearch component has been updated to utilize the new helper slot in PlSearchField, providing detailed instructions and examples on how the table search functionality works.
  • Vue 3 Reactivity Modernization: The internal v-model implementation within PlSearchField was refactored to leverage Vue 3's defineModel macro, simplifying two-way data binding.
  • PlTooltip Integration: A PlTooltip component was integrated into PlSearchField to visually present the helper text when provided.
  • UI Example Update: The FormComponentsPage/Main.vue example page was updated to include a demonstration of the PlSearchField with its new helper text feature.
Changelog
  • etc/blocks/ui-examples/ui/src/pages/FormComponentsPage/Main.vue
    • Imported the PlSearchField component.
    • Added a new PlSearchField instance with helper text for demonstration purposes.
  • lib/ui/uikit/src/components/PlSearchField/PlSearchField.vue
    • Imported PlTooltip for displaying helper text.
    • Refactored the component to use defineModel for modelValue.
    • Added helper prop and helper slot to support descriptive text.
    • Integrated PlTooltip to render the helper content.
    • Updated computed properties and clear function to align with defineModel usage.
  • lib/ui/uikit/src/components/PlTooltip/PlTooltip.vue
    • Reordered import statements for uniqueId and tMap.
  • sdk/ui-vue/src/components/PlTableFastSearch/PlTableFastSearch.vue
    • Removed local state management (localValue, ref, watch, useDebounceFn) in favor of direct defineModel usage.
    • Updated PlSearchField to bind directly to model.
    • Added a comprehensive helper template within PlSearchField to explain table search behavior, including exact match rules, scope, and examples.
Activity
  • No specific activity has been recorded for this pull request yet.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

The pull request introduces a new PlSearchField component and integrates it into the FormComponentsPage. It also refactors the PlTableFastSearch component to use the new PlSearchField and adds helper text for search functionality. The changes improve the reusability of the search field and provide better user guidance for table searches.

const model = defineModel<string>({ required: true });

const props = defineProps<{
modelValue?: string;
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The modelValue prop is redundant since defineModel is being used. It should be removed to avoid confusion and potential conflicts.

  clearable?: boolean;

:disabled="disabled"
:placeholder="placeholder || 'Find...'"
v-model="model"
:disabled="props.disabled"
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The v-model binding should be to model directly, as value computed property is no longer needed with defineModel.

      v-model="model"

:placeholder="placeholder || 'Find...'"
v-model="model"
:disabled="props.disabled"
:placeholder="props.placeholder || 'Find...'"
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

When using props in the template, it's good practice to explicitly use props.disabled for clarity, even though it might work implicitly.

      :disabled="props.disabled"

v-model="model"
:disabled="props.disabled"
:placeholder="props.placeholder || 'Find...'"
type="text"
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

When using props in the template, it's good practice to explicitly use props.placeholder for clarity, even though it might work implicitly.

      :placeholder="props.placeholder || 'Find...'"

Comment on lines 3 to 4

const model = defineModel<string>({ required: true });
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The ref and useDebounceFn imports are no longer used after the refactoring. They should be removed to keep the code clean and avoid unused imports.

Comment on lines 6 to +22

<template>
<PlSearchField v-model="localValue" clearable placeholder="Search..." />
<PlSearchField v-model="model" clearable placeholder="Search...">
<template #helper>
<b>How table search works:</b>
<br />
<ul>
<li>
<b>Exact match only.</b><br />
No partials, wildcards, ranges, or regex.
</li>
<li>
<b>Scope:</b> Searches all visible columns. To include a column, make it visible in
Columns.
</li>
<li>
<b>Text columns:</b> Exact string equality. Characters must match exactly (including case,
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The localValue, emitDebounced, and watch logic is no longer needed. The defineModel function in PlSearchField handles the debouncing internally, making this code redundant. Removing it simplifies the component.

@codecov
Copy link

codecov bot commented Feb 20, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 53.63%. Comparing base (3e71add) to head (afb69c9).
⚠️ Report is 2 commits behind head on main.
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #1449   +/-   ##
=======================================
  Coverage   53.63%   53.63%           
=======================================
  Files         246      246           
  Lines       13662    13662           
  Branches     2812     2812           
=======================================
  Hits         7327     7327           
  Misses       5410     5410           
  Partials      925      925           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@AStaroverov AStaroverov added this pull request to the merge queue Feb 20, 2026
Merged via the queue into main with commit bc16fab Feb 20, 2026
17 checks passed
@AStaroverov AStaroverov deleted the feat/search-table-tip branch February 20, 2026 14:58
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