fix: XYNE-153 added tootltip message when kb is created

[Ravishekhar7870]

Testing

tested locally

Summary by CodeRabbit

• New Features

  • Upload button now shows contextual tooltips (enter collection name, uploading in progress, add files).
  • Button disables automatically when the collection name is missing, an upload is in progress, or no files are selected to prevent accidental actions.

• Style

  • Tooltips can accept custom styling to ensure a more consistent look across the interface.

[gemini-code-assist]

Summary of Changes

Hello @Ravishekhar7870, I'm Gemini Code Assist¹! 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 enhances the user experience in the file upload component by adding dynamic tooltip messages to the 'UPLOAD ITEMS' button. These tooltips provide immediate feedback and guidance to users regarding the button's disabled state, clarifying the necessary steps to proceed with file uploads. The change also includes a minor enhancement to the SmartTooltip component for better styling control.

Highlights

• Contextual Tooltips for Upload Button: Implemented dynamic tooltip messages for the 'UPLOAD ITEMS' button in the file upload component, providing users with clear reasons why the button might be disabled.
• Improved User Guidance: The tooltip messages guide users by indicating when they need to enter a collection name, add files, or if files are currently uploading.
• SmartTooltip Component Enhancement: The SmartTooltip component now accepts a className prop, allowing for more flexible styling and layout adjustments when wrapping other elements.

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

[coderabbitai]

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Walkthrough

Adds contextual tooltips and disabled-state logic to the collection file upload button, adds an optional className prop to SmartTooltip, and bumps @xyne/vespa-ts from 1.1.4 to 1.1.5 in server/package.json. No new exports introduced.

Changes

Cohort / File(s)	Summary
Upload button UX frontend/src/components/ClFileUpload.tsx	Replaces static button rendering with logic that computes isDisabled and tooltipContent (based on collectionName, isUploading, and file presence); conditionally wraps the Button with SmartTooltip when a tooltip is needed.
SmartTooltip enhancement frontend/src/components/ui/smart-tooltip.tsx	Adds optional className?: string to SmartTooltipProps and forwards it to the root wrapper div; no other behavior changes.
Dependency bump server/package.json	Bumps dependency @xyne/vespa-ts from 1.1.4 to 1.1.5; no other package.json changes.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  participant U as User
  participant CL as ClFileUpload
  participant ST as SmartTooltip

  U->>CL: Render upload UI
  CL->>CL: Compute isDisabled, tooltipContent
  alt tooltipContent exists
    CL->>ST: Render SmartTooltip(with className) wrapping Button
    U-->>ST: Hover
    ST-->>U: Show tooltip (contextual message)
  else no tooltip
    CL-->>U: Render Button only
  end

  U->>CL: Click Button
  alt isDisabled
    CL-->>U: No action
  else enabled
    CL->>CL: Open file picker / start upload
  end

Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• feat(knowledgemanagment): make global state for uploading in kb #986: Modifies frontend/src/components/ClFileUpload.tsx and touches tooltip/button behavior — closely related to the upload UX changes.
• feat:smart-tooltip #850: Introduced SmartTooltip; relevant because this PR extends its props and usage.
• fix(vespa): update vespa package #1060: Also bumps @xyne/vespa-ts in server/package.json; directly related to the dependency update.

Suggested reviewers

• zereraz
• shivamashtikar
• kalpadhwaryu
• junaid-shirur
• devesh-juspay

Poem

I nibble keys and polish code,
A tooltip hops where help is owed.
"Name it first," it softly sings,
Then files may dance with tiny springs.
I twitch my whiskers—upload time! 🐇✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Title Check	⚠️ Warning	The pull request title is misleading and contains a typo: it refers to adding a tooltip message when a “kb” is created, but the changes actually introduce a contextual tooltip on the collection file upload button and extend SmartTooltip with a className prop (and include a dependency bump), so it does not accurately summarize the main changeset.	Rename the title to clearly reflect the primary changes, for example: “feat: add contextual tooltip to collection file upload button and support className in SmartTooltip.”

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/kbTooltip

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between f8232da and a859284.

📒 Files selected for processing (1)

• server/package.json (1 hunks)

🔇 Additional comments (1)

server/package.json (1)

81-81: Patch bump looks good

Patch upgrade to @xyne/vespa-ts@1.1.5 is fine; no issues spotted.

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[gemini-code-assist]

Code Review

This pull request adds a tooltip to the upload button, which provides helpful context to the user when the button is disabled. The implementation is functionally correct. My review includes one suggestion for the ClFileUpload.tsx component to improve the code's readability and maintainability by refactoring the conditional rendering logic for the upload button.

[coderabbitai]

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 132d4e4 and f8232da.

📒 Files selected for processing (2)

• frontend/src/components/ClFileUpload.tsx (3 hunks)
• frontend/src/components/ui/smart-tooltip.tsx (2 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

frontend/src/components/ClFileUpload.tsx (1)

frontend/src/components/ui/smart-tooltip.tsx (1)

• SmartTooltip (11-99)