feat: integrate Shepherd tour with custom styling #348
Conversation
|
@sneha-4-22 is attempting to deploy a commit to the Sanchit Bajaj's projects Team on Vercel. A member of the Team first needs to authorize it. |
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
Great job, @sneha-4-22! 🎉 Thank you for submitting your pull request. Your contribution is valuable and we appreciate your efforts to improve our project. Keep being the part of the community!
'We will promptly review your changes and offer feedback. Keep up the excellent work!
Kindly remember to check our Contributing Guidelines'
WalkthroughThe recent changes introduce a guided tour feature to the platform using Shepherd.js. This enhancement includes the addition of a Changes
Sequence Diagram(s) (Beta)sequenceDiagram
participant User
participant Navbar
participant Shepherd
User->>Navbar: Click "Start Tour" button
Navbar->>Shepherd: Call startTour function
Shepherd->>User: Display guided tour steps
Assessment against linked issues
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 as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (2)
package.jsonis excluded by!**/*.jsonyarn.lockis excluded by!**/*.lock,!**/*.lock
Files selected for processing (3)
- src/components/core/navbar/index.tsx (5 hunks)
- src/components/core/navbar/styles.css (1 hunks)
- src/components/core/themeButton/index.tsx (2 hunks)
Files skipped from review due to trivial changes (1)
- src/components/core/navbar/styles.css
Additional context used
Biome
src/components/core/themeButton/index.tsx
[error] 20-20: Provide an explicit type prop for the button element.
[error] 30-33: Provide an explicit type prop for the button element.
[error] 38-41: Provide an explicit type prop for the button element.
src/components/core/navbar/index.tsx
[error] 187-187: Unexpected any. Specify a different type.
[error] 191-191: The computed expression can be simplified without the use of a string literal.
[error] 207-207: Unexpected any. Specify a different type.
[error] 336-336: Do not use template literals if interpolation and special-character handling are not needed.
[error] 414-414: Change to an optional chain.
[error] 299-305: Provide an explicit type prop for the button element.
[error] 312-316: Provide an explicit type prop for the button element.
[error] 342-346: Provide an explicit type prop for the button element.
[error] 381-387: Provide an explicit type prop for the button element.
There was a problem hiding this comment.
Hi @sneha-4-22, Please do all the changes suggested by me and Coderabbit
Sanchitbajaj02
added
⭐ enhancement
There was a problem hiding this comment.
Actionable comments posted: 1
Outside diff range and nitpick comments (1)
src/components/core/themeButton/index.tsx (1)
Line range hint
20-20: Ensure to add an explicit type attribute to the button to prevent unintended form submissions.- <button className="px-2 py-2 md:flex fixed md:static block md:top-0 md:m-0 top-1 m-2 rounded-full hover:bg-primary-light hover:scale-105 bg-primary text-white"> + <button type="button" className="px-2 py-2 md:flex fixed md:static block md:top-0 md:m-0 top-1 m-2 rounded-full hover:bg-primary-light hover:scale-105 bg-primary text-white">Apply this change to all buttons within the component to maintain consistency and prevent issues in forms.
Also applies to: 30-33, 38-41
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (4)
- src/components/core/navbar/index.tsx (5 hunks)
- src/components/core/themeButton/index.tsx (1 hunks)
- src/components/core/utils/startTour.tsx (1 hunks)
- src/components/core/utils/styles.css (1 hunks)
Files skipped from review due to trivial changes (1)
- src/components/core/utils/styles.css
Additional context used
Biome
src/components/core/themeButton/index.tsx
[error] 20-20: Provide an explicit type prop for the button element.
[error] 30-33: Provide an explicit type prop for the button element.
[error] 38-41: Provide an explicit type prop for the button element.
src/components/core/navbar/index.tsx
[error] 29-29: Unexpected any. Specify a different type.
[error] 33-33: The computed expression can be simplified without the use of a string literal.
[error] 49-49: Unexpected any. Specify a different type.
[error] 178-178: Do not use template literals if interpolation and special-character handling are not needed.
[error] 256-256: Change to an optional chain.
[error] 141-146: Provide an explicit type prop for the button element.
[error] 154-157: Provide an explicit type prop for the button element.
[error] 184-187: Provide an explicit type prop for the button element.
[error] 223-228: Provide an explicit type prop for the button element.
Additional comments not posted (1)
src/components/core/utils/startTour.tsx (1)
1-158: The implementation of thestartTourfunction looks comprehensive and well-structured.The function correctly sets up a guided tour with multiple steps, ensuring a smooth user experience. The use of Shepherd.js is appropriate for the task, and the customizations seem to align with the project's styling requirements.
There was a problem hiding this comment.
Actionable comments posted: 0
Outside diff range and nitpick comments (3)
src/components/core/navbar/index.tsx (3)
Line range hint
29-29: Specify a more precise type instead ofanyfor the Redux state.Consider using a defined interface or type for the state to enhance type safety and maintainability.
Line range hint
33-33: Simplify the computed expression by removing the unnecessary string literal.- const userIdFromCookies: string = cookies["userId"]; + const userIdFromCookies: string = cookies.userId;
Line range hint
178-178: Avoid using template literals when not necessary.- <span className={`flex items-center git`}> + <span className="flex items-center git">
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- src/components/core/navbar/index.tsx (5 hunks)
Additional context used
Biome
src/components/core/navbar/index.tsx
[error] 29-29: Unexpected any. Specify a different type.
[error] 33-33: The computed expression can be simplified without the use of a string literal.
[error] 49-49: Unexpected any. Specify a different type.
[error] 178-178: Do not use template literals if interpolation and special-character handling are not needed.
[error] 256-256: Change to an optional chain.
[error] 141-146: Provide an explicit type prop for the button element.
[error] 184-187: Provide an explicit type prop for the button element.
[error] 223-228: Provide an explicit type prop for the button element.
Additional comments not posted (2)
src/components/core/navbar/index.tsx (2)
21-22: LGTM! Import statement forstartTouris correctly added.
154-159: The "Start Tour" button is correctly implemented with thetype="button"attribute to prevent unintended form submissions. Good job addressing previous feedback.
Related Issue
fixes: #347
Description
Untitled.video.-.Made.with.Clipchamp.10.mp4
Summary by CodeRabbit
New Features
Style
Documentation