fix: Search icon is not showing in navbar#3441 #3454
Conversation
ayan-koley
requested review from
derberg,
akshatnema,
magicmatatjahu,
anshgoyalevil,
Mayaleeeee and
asyncapi-bot-eve
as code owners
WalkthroughThe changes involve modifying the Changes
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
Welcome to AsyncAPI. Thanks a lot for creating your first pull request. Please check out our contributors guide useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.
asyncapi-bot
requested review from
devilkiller-ag,
sambhavgupta0705,
BhaswatiRoy,
J0SAL,
TRohit20 and
VaishnaviNandakumar
✅ Deploy Preview for asyncapi-website ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for asyncapi-website ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
⚡️ Lighthouse report for the changes in this PR:
Lighthouse ran on https://deploy-preview-3454--asyncapi-website.netlify.app/ |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #3454 +/- ##
=======================================
Coverage 70.18% 70.18%
=======================================
Files 21 21
Lines 664 664
=======================================
Hits 466 466
Misses 198 198 ☔ View full report in Codecov by Sentry. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
components/AlgoliaSearch.tsx (1)
330-330: Add aria-label for accessibilityThe fallback implementation looks good and solves the missing icon issue. Consider adding an aria-label to improve accessibility.
- {Children || <IconLoupe className='h-5 w-5' />} + {Children || <IconLoupe className='h-5 w-5' aria-label="Search" />}
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
📒 Files selected for processing (1)
components/AlgoliaSearch.tsx(2 hunks)
🔇 Additional comments (2)
components/AlgoliaSearch.tsx (2)
11-11: LGTM: Clean import statement
The import follows the project's conventions using the @ alias path.
330-330: Verify icon dimensions consistency
Let's verify if the icon dimensions (h-5 w-5) align with other icons in the navbar.
✅ Verification successful
Let me try a more focused search to find icon sizes specifically in the navigation-related components and the AlgoliaSearch component:
Based on the search results, I can now generate the final response:
Icon dimensions are consistent with navigation components
The h-5 w-5 dimensions used for the search icon (IconLoupe) in AlgoliaSearch component are appropriate as they align with the general icon sizing pattern in the navigation. Other icons in navigation components use similar or slightly smaller sizes (h-4, w-4), making the search icon's slightly larger size (h-5) suitable for its prominence in the UI.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Search for other icon size definitions in navbar components
rg -l 'className=.*[hw]-[0-9]' | while read -r file; do
if [[ $file == *"nav"* || $file == *"header"* ]]; then
echo "=== $file ==="
rg 'className=.*[hw]-[0-9]' "$file"
fi
done
Length of output: 13793
Script:
#!/bin/bash
# Search for icon size definitions in navigation and header components
rg -A 2 -B 2 'Icon.*className.*[hw]-[0-9]' components/navigation components/header components/AlgoliaSearch.tsx
Length of output: 1233
|
/update |
|
Thanks for this PR @ayan-koley but the issue has been resolved and merged in another PR. |
fix: Search icon is not showing issue in navbar
Problem
IconLoupe doesn't import in AlgoliaSearch.tsx file and doesn't use in code so search icon don't show in navbar
Summary by CodeRabbit
New Features
Bug Fixes