Beautiful twitter testimonials on Home page #126 added #128
Conversation
|
@sanwalsulehri is attempting to deploy a commit to the tweakcn OSS program Team on Vercel. A member of the Team first needs to authorize it. |
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the WalkthroughA new Changes
Poem
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page 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)
Other keywords and placeholders
CodeRabbit Configuration 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: 3
🧹 Nitpick comments (3)
components/home/testimonials.tsx (3)
10-58: Consider moving testimonial data to a separate configuration file.The hard-coded testimonial data makes the component less maintainable and reusable. Consider extracting this to a separate configuration file or data source.
+// testimonials.config.ts +export const testimonialsData = [ + { + image: man1.src, + name: "Sanwal Sulehri", + tag: "sanwalakram12", + description: "Playing around with @tweakcn suddenly made me feeling inspired to launch that side project." + }, + // ... rest of testimonials +]; // testimonials.tsx +import { testimonialsData } from './testimonials.config'; -const testimonials = [ - // ... hard-coded data -]; +const testimonials = testimonialsData;
70-73: Follow consistent naming conventions.The variable
_itemVariantuses an underscore prefix which is unconventional for React components. Consider using a more descriptive name.-const _itemVariant = { +const itemVariant = { hidden: { opacity: 0, y: 20 }, show: { opacity: 1, y: 0 }, }; // Update usage - variants={_itemVariant} + variants={itemVariant}
117-127: Consider adding loading states for images.The current implementation doesn't handle image loading states, which could cause layout shift during loading.
{testimonial.image ? ( <img src={testimonial.image} alt={testimonial.name} className="h-12 w-12 rounded-full object-cover" + loading="lazy" + onError={(e) => { + e.currentTarget.style.display = 'none'; + // Show fallback + }} /> ) : (
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (7)
assets/girl1.pngis excluded by!**/*.pngassets/girl2.pngis excluded by!**/*.pngassets/girl3.pngis excluded by!**/*.pngassets/man1.pngis excluded by!**/*.pngassets/man2.pngis excluded by!**/*.pngassets/reviewer.pngis excluded by!**/*.pngpackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (3)
app/page.tsx(2 hunks)components/home/testimonials.tsx(1 hunks)package.json(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
app/page.tsx (1)
components/home/testimonials.tsx (1)
Testimonials(75-145)
🪛 Biome (1.9.4)
components/home/testimonials.tsx
[error] 135-135: Avoid passing content using the dangerouslySetInnerHTML prop.
Setting content using code can expose users to cross-site scripting (XSS) attacks
(lint/security/noDangerouslySetInnerHtml)
🔇 Additional comments (1)
app/page.tsx (1)
10-10: Clean integration of the Testimonials component.The component is properly imported and well-positioned in the page flow between Roadmap and FAQ sections.
Also applies to: 45-45
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
components/home/testimonials.tsx (2)
13-50: Consider extracting testimonials data to a separate file.The testimonials data is well-structured, but for better organization and maintainability, consider moving it to a separate data file (e.g.,
data/testimonials.ts).+// Create data/testimonials.ts +export const testimonials = [ + // ... testimonials data +]; -// Testimonials Data -const testimonials = [ - // ... testimonials data moved to separate file -]; +import { testimonials } from '@/data/testimonials';
172-204: Clean implementation with minor optimization opportunity.The main component structure is well-organized with appropriate animations and responsive design. Consider memoizing the MarqueeRow components to prevent unnecessary re-renders.
+import { memo } from 'react'; +const MemoizedMarqueeRow = memo(MarqueeRow); {/* 🚀 Two Marquee Rows */} <div className="flex flex-col gap-y-0"> - <MarqueeRow items={testimonials} reverse={false} /> - <MarqueeRow items={testimonials} reverse={true} /> + <MemoizedMarqueeRow items={testimonials} reverse={false} /> + <MemoizedMarqueeRow items={testimonials} reverse={true} /> </div>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
components/home/testimonials.tsx(1 hunks)
🔇 Additional comments (1)
components/home/testimonials.tsx (1)
137-165: Well-implemented testimonial cards with good accessibility.The card rendering is well-structured with proper image fallbacks, semantic HTML, and accessible alt text. The removal of
dangerouslySetInnerHTML(as noted in past comments) improves security.
|
Won't be able to merge it this week. Next week :) |
|
Ok no problem ! |
|
i think you wanna change something in UI feel free to ask me but plz merge this!!!!!! |
|
Haven't gotten around to hunting for good tweets yet :( |
|
This week - for sure |
* Beautiful twitter testimonials on Home page #126 added (#128) * Beautiful twitter testimonials on Home page #126 added * Beautiful twitter testimonials on Home page #126 added * Beautiful twitter testimonials on Home page #126 added * Beautiful twitter testimonials on Home page #126 added --------- Co-authored-by: sanwalsulehri <[email protected]> Co-authored-by: Sahaj Jain <[email protected]> * feat: Add real testimonial tweets * add testimonials to pricing page * use avatar --------- Co-authored-by: Sanwal Sulehrii <[email protected]> Co-authored-by: sanwalsulehri <[email protected]>
3 participants
Summary by CodeRabbit