feat: OSS programs added with data and ui #214
Conversation
|
@huamanraj is attempting to deploy a commit to the AJEET PRATAP SINGH's projects Team on Vercel. A member of the Team first needs to authorize it. |
WalkthroughAdds an OSS Programs feature: typed program data (~24 entries), data access helpers, browse and detail pages with search/tag UI, multiple UI components, markdown -> sanitized HTML rendering using marked + sanitize-html, new styles, sidebar route, and package.json dependency updates. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Browser
participant ListPage as /dashboard/oss-programs
participant UI as Components (SearchInput/TagFilter/Cards)
participant Data as Data Layer (programs/getAllPrograms)
participant DetailPage as /dashboard/oss-programs/[slug]
participant Markdown as marked + sanitize-html
User->>Browser: Navigate to /dashboard/oss-programs
Browser->>ListPage: render
ListPage->>Data: getAllPrograms(), getAllTags()
Data-->>ListPage: programs[], tags[]
ListPage->>UI: render search, tag filter, program cards
User->>UI: enter query / pick tags
UI->>ListPage: update state
ListPage-->>Browser: re-render filtered list
User->>Browser: click ProgramCard
Browser->>DetailPage: navigate /dashboard/oss-programs/{slug}
DetailPage->>Data: getProgramBySlug(slug)
Data-->>DetailPage: program (sections with bodyMarkdown)
loop per section
DetailPage->>Markdown: marked.parse(bodyMarkdown)
Markdown->>Markdown: sanitize-html (allow list)
Markdown-->>DetailPage: contentHtml
end
DetailPage-->>Browser: render header, metadata, sanitized sections
Browser-->>User: display program detail
Estimated code review effort🎯 4 (Complex) | ⏱️ ~40 minutes
Possibly related PRs
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 12
🧹 Nitpick comments (18)
apps/web/src/data/oss-programs/programs/cncf-mentorship.ts (1)
6-7: Improve the tagline and shortDescription.The current values ("Cloud Native Foundation.") are not descriptive compared to other program entries. Consider something more informative like the content in the first section's bodyMarkdown.
- tagline: "Cloud Native Foundation.", - shortDescription: "Cloud Native Foundation.", + tagline: "Mentorship program for cloud-native projects like Kubernetes and Prometheus.", + shortDescription: "Mentorship program for cloud-native projects like Kubernetes and Prometheus.",apps/web/src/data/oss-programs/programs/code-for-govtech.ts (2)
6-7: Consider a more descriptive tagline.The tagline "India govt tech projects." is quite terse. A more informative tagline would better convey the program's value.
- tagline: "India govt tech projects.", - shortDescription: "India govt tech projects.", + tagline: "Build open source digital public goods for government applications in India.", + shortDescription: "Build open source digital public goods for government applications in India.",
69-78: Application process content is generic.The application process section could provide more specific details about the C4GT DMP application, such as typical requirements, selection criteria, or links to resources.
apps/web/src/components/oss-programs/ProgramCard.tsx (1)
37-37: Add default export for the const arrow function.If refactoring to arrow function syntax, ensure the export is added:
+export default ProgramCard;apps/web/src/data/oss-programs/programs/24-pull-requests.ts (1)
6-7: Consider a more descriptive tagline.The tagline "December PR event." is quite brief compared to other programs. A more descriptive tagline could improve discoverability and user understanding in the programs list.
- tagline: "December PR event.", - shortDescription: "December PR event.", + tagline: "Give back to open source with 24 pull requests during December.", + shortDescription: "Give back to open source with 24 pull requests during December.",apps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.ts (1)
3-83: iiit kalyani winter of code program entry looks validthe data object satisfies
Programand sections read clearly; if you want to align with more descriptive entries, you could optionally expand the tagline/shortDescription beyond just the organizer name, but it’s fine as-is.apps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.ts (1)
3-84: build for bharat fellowship program data is structurally soundthe program object cleanly matches the
Programinterface and the sections give enough context; if desired, you could make the tagline/shortDescription a bit more descriptive than “bharat digital govt.” to match the detail level of other entries, but it’s not required.apps/web/src/components/oss-programs/ProgramHeader.tsx (2)
3-7: prefer type-only import for programsince
Programis only used as a type, you can switch to a type-only import for consistency with the data modules and slightly clearer intent.-import { Program } from "@/data/oss-programs/types"; +import type { Program } from "@/data/oss-programs/types";
14-18: align colors with the design token system (remove hardcoded hex and generic grays)the component uses raw hex values (
#9455f4) and generic tailwind colors (text-gray-400,from-white,border-gray-700, etc.), while the frontend guidelines forapps/web/src/componentssay to avoid hardcoded hex and prefer semantic classes fromdesign-tokens.ts(e.g.,text-text-primary,bg-surface-primary, brand-specific tokens). please refactor these color utilities to use the semantic tailwind classes backed by your design tokens (including the gradient and hover states), keeping behavior the same. as per coding guidelines.Also applies to: 21-25, 33-37
apps/web/src/data/oss-programs/programs/jgec-winter-of-code.ts (1)
16-18: optional copy tweak for stipend summary
stipendSummary: "No stipend certificates provided"reads a bit compressed; consider adding punctuation for clarity, for example:- stipendSummary: "No stipend certificates provided", + stipendSummary: "No stipend; certificates provided",purely a wording improvement; structure is fine.
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx (1)
12-66: filtering logic is solid; adjust styling to follow design tokensthe state +
useMemo-based filtering by name/tags andselectedTags.every(...)requirement all look correct and easy to follow.for styling, the root container uses a hardcoded hex color (
bg-[#1e1e1e]). per the app/web design guidelines, this should come from the design token system (e.g., abg-surface-*or equivalent semantic class) instead of a raw hex. same applies if more hex colors get added later around this page.apps/web/src/components/oss-programs/ProgramMetadata.tsx (1)
8-40: metadata rendering is clear; update colors to design-system tokensthe three-card layout for region, duration (with
"Flexible"fallback), and paid/unpaid reads well and uses theProgramtype correctly.styling-wise, the cards rely on hardcoded hex colors (
bg-[#252525],border-[#333], etc.). per the design guidelines forapps/web/src/**/*.{tsx,ts}, these should instead use semantic tailwind classes wired to your design tokens (e.g., surface and border tokens) so theming stays centralized. you can keep the structure and hover behavior while swapping to token-backed classes.apps/web/src/data/oss-programs/index.ts (1)
1-79: data aggregation helpers are correct; consider minor type/import cleanupsthe
programsarray correctly includes all the individual program exports, and:
getAllProgramsandgetAllTagsare simple and type-safe.getProgramBySluguses a straightforward.find.two optional tweaks you might consider:
- align with the “types last” import order by moving
import type { Program } from "./types";after the other local imports.- if you want stricter typing, change
getProgramBySlug(slug: string)to acceptslug: ProgramSlugwhile continuing to accept astringat the route level and validating/converting there.none of these are blockers for this pr.
apps/web/src/data/oss-programs/programs/european-summer-of-code.ts (1)
7-10: Consider differentiating tagline from shortDescription.Both fields contain identical text. The tagline typically serves as a brief hook, while shortDescription could provide slightly more context. This pattern appears across multiple program files and reduces the value of having separate fields.
apps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.ts (1)
6-9: Consider differentiating tagline from shortDescription.Both fields contain identical text. As with other program files, consider making the tagline more concise or the shortDescription more detailed to better utilize both fields.
apps/web/src/data/oss-programs/programs/redox-summer-of-code.ts (1)
7-10: Consider differentiating tagline from shortDescription.Both fields contain identical text, following the same pattern seen in other program files. Differentiating these would improve content quality across the catalog.
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (1)
35-40: Optimize markdown rendering by reusing JSDOM instance.Creating a new JSDOM window for each section is inefficient. Since
renderMarkdownis called for every section in the map (line 54), this creates multiple window instances unnecessarily.Apply this diff to reuse a single window instance:
+ const window = new JSDOM("").window; + const purify = DOMPurify(window); + const renderMarkdown = (markdown: string) => { const html = marked.parse(markdown) as string; - const window = new JSDOM("").window; - const purify = DOMPurify(window); return purify.sanitize(html); };apps/web/src/data/oss-programs/programs/apertre.ts (1)
6-7: Consider differentiating tagline from shortDescription.Both fields contain identical text (with the same grammatical issue). After fixing the grammar, consider making these fields distinct as suggested in other program files.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (44)
apps/web/package.json(2 hunks)apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/page.tsx(1 hunks)apps/web/src/components/dashboard/Sidebar.tsx(2 hunks)apps/web/src/components/oss-programs/ProgramCard.tsx(1 hunks)apps/web/src/components/oss-programs/ProgramHeader.tsx(1 hunks)apps/web/src/components/oss-programs/ProgramMetadata.tsx(1 hunks)apps/web/src/components/oss-programs/ProgramSection.tsx(1 hunks)apps/web/src/components/oss-programs/SearchInput.tsx(1 hunks)apps/web/src/components/oss-programs/TagFilter.tsx(1 hunks)apps/web/src/components/oss-programs/index.ts(1 hunks)apps/web/src/data/oss-programs/index.ts(1 hunks)apps/web/src/data/oss-programs/programs/24-pull-requests.ts(1 hunks)apps/web/src/data/oss-programs/programs/advent-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/apertre.ts(1 hunks)apps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.ts(1 hunks)apps/web/src/data/oss-programs/programs/cncf-mentorship.ts(1 hunks)apps/web/src/data/oss-programs/programs/code-for-govtech.ts(1 hunks)apps/web/src/data/oss-programs/programs/european-summer-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/fossasia-codeheat.ts(1 hunks)apps/web/src/data/oss-programs/programs/fossee-summer-fellowship.ts(1 hunks)apps/web/src/data/oss-programs/programs/girlscript-summer-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/girlscript-winter-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/github-campus-experts.ts(1 hunks)apps/web/src/data/oss-programs/programs/google-summer-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.ts(1 hunks)apps/web/src/data/oss-programs/programs/hacktoberfest.ts(1 hunks)apps/web/src/data/oss-programs/programs/igalia-coding-experience-program.ts(1 hunks)apps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/jgec-winter-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/linux-foundation-mentorship.ts(1 hunks)apps/web/src/data/oss-programs/programs/linux-kernel-mentorship.ts(1 hunks)apps/web/src/data/oss-programs/programs/mlh-fellowship.ts(1 hunks)apps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.ts(1 hunks)apps/web/src/data/oss-programs/programs/open-source-promotion-plan.ts(1 hunks)apps/web/src/data/oss-programs/programs/outreachy.ts(1 hunks)apps/web/src/data/oss-programs/programs/processing-foundation-fellowship.ts(1 hunks)apps/web/src/data/oss-programs/programs/redox-summer-of-code.ts(1 hunks)apps/web/src/data/oss-programs/programs/season-of-kde.ts(1 hunks)apps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts(1 hunks)apps/web/src/data/oss-programs/programs/summer-of-nix.ts(1 hunks)apps/web/src/data/oss-programs/types.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (11)
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx,js,jsx}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
apps/web/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
apps/web/src/**/*.{ts,tsx}: Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
NEVER use hardcoded hex values (e.g.,#5519f7) directly in components; ALWAYS reference colors from the design token system using Tailwind classes
Use semantic color names that describe purpose, not appearance
Usefont-sansfor standard UI text (Geist Sans) andfont-monofor code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale (0.25rem increments); for section padding use mobilep-4(1rem) and desktopp-[60px]
Use appropriate border radius: small elementsrounded-lg, mediumrounded-xl, largerounded-2xl, buttonsrounded-[16px]
Use animation durations: fastduration-100(0.1s), normalduration-300(0.3s), slowduration-600(0.6s)
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{tsx,ts}: Prefer functional components with TypeScript and use proper TypeScript types, avoidany
Extract reusable logic into custom hooks
Use descriptive prop names and define prop types using TypeScript interfaces or types
Prefer controlled components over uncontrolled
Use zustand for global state (located insrc/store/)
Use absolute imports from@/prefix when available
Include proper aria labels for accessibility
Ensure keyboard navigation works
Maintain proper heading hierarchy
Provide alt text for images
Avoid unnecessary re-renders
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (.cursorrules)
Organize imports: react → third-party → local components → utils → types
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx}: Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Memoize expensive computations
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
apps/web/src/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Optimize images using next/image
apps/web/src/**/*.{tsx,ts}: Use Zustand for global state, located insrc/store/
Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Optimize images using next/image
Memoize expensive computations
Define a type when defining const functions
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}
📄 CodeRabbit inference engine (.cursor/rules/general_rules.mdc)
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
apps/web/src/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/**/*.{tsx,ts,jsx,js}: Organize imports in order: React → third-party → local components → utils → types
Use absolute imports from@/prefix when available
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Always use Tailwind classes for styling HTML elements; avoid using CSS or style tags
Use descriptive variable and function names; name event functions with a 'handle' prefix (e.g., handleClick, handleKeyDown)
Use const with arrow functions instead of function declarations (e.g., 'const toggle = () =>')
Files:
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.tsapps/web/src/data/oss-programs/programs/outreachy.tsapps/web/src/components/oss-programs/index.tsapps/web/src/data/oss-programs/programs/open-source-promotion-plan.tsapps/web/src/data/oss-programs/programs/mlh-fellowship.tsapps/web/src/data/oss-programs/programs/github-campus-experts.tsapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/code-for-govtech.tsapps/web/src/data/oss-programs/programs/24-pull-requests.tsapps/web/src/data/oss-programs/programs/summer-of-nix.tsapps/web/src/data/oss-programs/programs/google-summer-of-code.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/data/oss-programs/types.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/data/oss-programs/programs/girlscript-summer-of-code.tsapps/web/src/data/oss-programs/programs/girlscript-winter-of-code.tsapps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.tsapps/web/src/data/oss-programs/programs/european-summer-of-code.tsapps/web/src/data/oss-programs/programs/advent-of-code.tsapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/redox-summer-of-code.tsapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/data/oss-programs/index.tsapps/web/src/data/oss-programs/programs/fossee-summer-fellowship.tsapps/web/src/data/oss-programs/programs/linux-kernel-mentorship.tsapps/web/src/app/(main)/dashboard/oss-programs/page.tsxapps/web/src/data/oss-programs/programs/season-of-kde.tsapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/data/oss-programs/programs/hacktoberfest.tsapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/data/oss-programs/programs/jgec-winter-of-code.tsapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.tsapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/data/oss-programs/programs/processing-foundation-fellowship.tsapps/web/src/data/oss-programs/programs/cncf-mentorship.tsapps/web/src/data/oss-programs/programs/linux-foundation-mentorship.tsapps/web/src/data/oss-programs/programs/fossasia-codeheat.tsapps/web/src/components/oss-programs/ProgramMetadata.tsxapps/web/src/data/oss-programs/programs/igalia-coding-experience-program.tsapps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.tsapps/web/src/data/oss-programs/programs/summer-of-bitcoin.ts
apps/web/src/components/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/components/**/*.{tsx,ts,jsx,js}: Never use hardcoded hex values directly in components; always reference colors from the design token system using Tailwind classes
Use semantic color names from the design token system that describe purpose, not appearance (e.g., bg-brand-purple, bg-surface-primary, text-text-primary)
Use font-sans for standard UI text (Geist Sans) and font-mono for code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale for section padding: p-4 (1rem) on mobile, p-[60px] on desktop
Use rounded-lg (0.5rem) for small elements, rounded-xl (1rem) for medium elements, rounded-2xl (1.5rem) for large elements, and rounded-[16px] for buttons
Use duration-100 (0.1s) for fast transitions, duration-300 (0.3s) for normal transitions, and duration-600 (0.6s) for slow transitions
Use available custom animations: animate-accordion-down, animate-accordion-up, animate-scrollRight, animate-scrollLeft, animate-customspin, animate-spin-slow, animate-spin-slow-reverse, animate-marquee, animate-marquee-vertical, animate-shine
Prefer functional components with TypeScript
Extract reusable logic into custom hooks
Prefer controlled components over uncontrolled
Include proper aria labels for accessibility
Ensure keyboard navigation works in interactive components
Maintain proper heading hierarchy in page components
Provide alt text for images
Use 'class:' instead of the ternary operator in class tags whenever possible
Implement accessibility features on interactive elements (e.g., tabindex='0', aria-label, onClick, onKeyDown)
Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
Files:
apps/web/src/components/oss-programs/index.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/components/oss-programs/ProgramMetadata.tsx
apps/web/src/components/**/*.{tsx,ts}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/components/**/*.{tsx,ts}: Use proper TypeScript types and avoid usinganytype
Use descriptive prop names and define prop types using TypeScript interfaces or types
Name components using PascalCase (e.g., UserProfile.tsx)
Files:
apps/web/src/components/oss-programs/index.tsapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/components/oss-programs/ProgramMetadata.tsx
**/*[A-Z]*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Use PascalCase for component file names (e.g.,
UserProfile.tsx)
Files:
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/ProgramHeader.tsxapps/web/src/components/oss-programs/TagFilter.tsxapps/web/src/components/dashboard/Sidebar.tsxapps/web/src/components/oss-programs/ProgramMetadata.tsx
🧠 Learnings (15)
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Remove unused imports
Applied to files:
apps/web/src/components/oss-programs/index.tsapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Organize imports in order: React → third-party → local components → utils → types
Applied to files:
apps/web/src/components/oss-programs/index.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : Organize imports: react → third-party → local components → utils → types
Applied to files:
apps/web/src/components/oss-programs/index.ts
📚 Learning: 2025-11-25T07:34:58.963Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/api/.cursor/rules/backend_rules.mdc:0-0
Timestamp: 2025-11-25T07:34:58.963Z
Learning: Export types from shared package for consistency across apps
Applied to files:
apps/web/src/components/oss-programs/index.ts
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Extract reusable logic into custom hooks
Applied to files:
apps/web/src/components/oss-programs/index.tsapps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Prefer functional components with TypeScript
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts} : Use descriptive prop names and define prop types using TypeScript interfaces or types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Include proper aria labels for accessibility
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsxapps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Maintain proper heading hierarchy in page components
Applied to files:
apps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/ProgramHeader.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Maintain proper heading hierarchy
Applied to files:
apps/web/src/components/oss-programs/ProgramSection.tsxapps/web/src/components/oss-programs/ProgramHeader.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Implement accessibility features on interactive elements (e.g., tabindex='0', aria-label, onClick, onKeyDown)
Applied to files:
apps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Include proper aria labels for accessibility
Applied to files:
apps/web/src/components/oss-programs/SearchInput.tsxapps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Prefer controlled components over uncontrolled
Applied to files:
apps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Use 'class:' instead of the ternary operator in class tags whenever possible
Applied to files:
apps/web/src/components/oss-programs/TagFilter.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*[Cc]omponent.{tsx,ts} : Keep components focused and single-responsibility
Applied to files:
apps/web/src/components/oss-programs/TagFilter.tsx
🧬 Code graph analysis (35)
apps/web/src/data/oss-programs/programs/google-summer-of-earth-engine.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/outreachy.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/open-source-promotion-plan.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/mlh-fellowship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/github-campus-experts.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/code-for-govtech.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/24-pull-requests.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/summer-of-nix.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/google-summer-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx (5)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)apps/web/src/data/oss-programs/index.ts (1)
programs(33-63)apps/web/src/components/oss-programs/SearchInput.tsx (1)
SearchInput(11-24)apps/web/src/components/oss-programs/TagFilter.tsx (1)
TagFilter(13-124)apps/web/src/components/oss-programs/ProgramCard.tsx (1)
ProgramCard(9-38)
apps/web/src/data/oss-programs/types.ts (1)
apps/web/src/components/oss-programs/ProgramSection.tsx (1)
ProgramSection(20-50)
apps/web/src/components/oss-programs/ProgramCard.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/girlscript-summer-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/girlscript-winter-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/build-for-bharat-fellowship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/european-summer-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/advent-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/apertre.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/redox-summer-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/components/oss-programs/ProgramSection.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
ProgramSection(43-48)
apps/web/src/data/oss-programs/programs/linux-kernel-mentorship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/app/(main)/dashboard/oss-programs/page.tsx (2)
apps/web/src/data/oss-programs/index.ts (3)
programs(33-63)getAllPrograms(65-67)getAllTags(73-79)apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx (1)
ProgramsList(12-68)
apps/web/src/data/oss-programs/programs/season-of-kde.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/components/oss-programs/SearchInput.tsx (2)
apps/web/src/components/ui/input.tsx (1)
props(6-18)apps/web/src/components/newsletters/NewsletterFilters.tsx (2)
NewsletterFilters(15-68)NewsletterFiltersProps(6-13)
apps/web/src/data/oss-programs/programs/hacktoberfest.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/components/oss-programs/ProgramHeader.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/jgec-winter-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/open-mainframe-project-mentorship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/processing-foundation-fellowship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/cncf-mentorship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/linux-foundation-mentorship.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/fossasia-codeheat.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/components/oss-programs/ProgramMetadata.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/igalia-coding-experience-program.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/iiit-kalyani-winter-of-code.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
🪛 ast-grep (0.40.0)
apps/web/src/components/oss-programs/ProgramSection.tsx
[warning] 45-45: Usage of dangerouslySetInnerHTML detected. This bypasses React's built-in XSS protection. Always sanitize HTML content using libraries like DOMPurify before injecting it into the DOM to prevent XSS attacks.
Context: dangerouslySetInnerHTML
Note: [CWE-79] Improper Neutralization of Input During Web Page Generation [REFERENCES]
- https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
- https://cwe.mitre.org/data/definitions/79.html
(react-unsafe-html-injection)
🪛 Biome (2.1.2)
apps/web/src/components/oss-programs/ProgramSection.tsx
[error] 46-46: Avoid passing content using the dangerouslySetInnerHTML prop.
Setting content using code can expose users to cross-site scripting (XSS) attacks
(lint/security/noDangerouslySetInnerHtml)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css
Show resolved
Hide resolved
apps/web/src/data/oss-programs/programs/github-campus-experts.ts
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (5)
apps/web/src/data/oss-programs/programs/hacktoberfest.ts (1)
3-85: copy and metadata look good; consider tweakingtimelineSummarywordingthe structure lines up with the
Programinterface and the copy is clear and informative. one tiny nit:timelineSummary: "October month"reads a bit awkwardly; something like"Runs every October"or"Runs during October each year"would be smoother while conveying the same info.apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (4)
1-7: reorder imports to match shared conventionto stay consistent with the repo rules, put third‑party imports (next, marked, dompurify, jsdom) before local modules (
@/data/...,@/components/...), e.g.:import { notFound } from "next/navigation"; import { marked } from "marked"; import DOMPurify from "dompurify"; import { JSDOM } from "jsdom"; import { getProgramBySlug, getAllPrograms } from "@/data/oss-programs"; import { ProgramHeader, ProgramMetadata, ProgramSection } from "@/components/oss-programs"; import "./program-styles.css";as per coding guidelines, imports should be ordered react → third‑party → local components/utils/types.
18-24: treatparamsas a plain object and drop the unnecessaryawaitnext.js app router passes
paramssynchronously; typing it as aPromiseand awaiting it adds noise without benefit. you can simplify the signature and implementation:-export default async function ProgramPage({ - params, -}: { - params: Promise<{ slug: string }>; -}) { - const { slug } = await params; +type ProgramPageProps = { + params: { slug: string }; +}; + +export default function ProgramPage({ params }: ProgramPageProps) { + const { slug } = params;this also lets you remove
asyncfrom the component since everything else is synchronous.please double‑check against the current next.js app router
PagePropsdocs for your version to confirm the expectedparamstype.
30-40: avoid reconfiguringmarkedand recreating jsdom/dompurify for every sectionright now
marked.setOptionsruns on every request andrenderMarkdowncreates a newJSDOMwindow and dompurify instance for each section. you can configure once and reuse to reduce per‑request work:-import { marked } from "marked"; -import DOMPurify from "dompurify"; -import { JSDOM } from "jsdom"; +import { marked } from "marked"; +import createDOMPurify from "dompurify"; +import { JSDOM } from "jsdom"; @@ -export default async function ProgramPage({ +marked.setOptions({ + gfm: true, + breaks: true, +}); + +const window = new JSDOM("").window; +const domPurify = createDOMPurify(window); + +const renderMarkdown = (markdown: string) => { + const html = marked.parse(markdown) as string; + return domPurify.sanitize(html); +}; + +export default function ProgramPage({ params, -}: { - params: Promise<{ slug: string }>; -}) { - const { slug } = await params; +}: ProgramPageProps) { + const { slug } = params; @@ - marked.setOptions({ - gfm: true, - breaks: true, - }); - - const renderMarkdown = (markdown: string) => { - const html = marked.parse(markdown) as string; - const window = new JSDOM("").window; - const purify = DOMPurify(window); - return purify.sanitize(html); - };this keeps configuration and sanitizer creation at module scope while still running only on the server.
please confirm against the current
marked,dompurify, andjsdomdocs for your versions to ensure the import style and usage remain correct.
42-59: replace hardcoded hex background with a design‑token tailwind class
bg-[#1e1e1e]hardcodes a color; the frontend rules say colors should come from the design token system via tailwind classes. consider something along the lines of:- <main className="min-h-screen w-full bg-[#1e1e1e] text-white overflow-x-hidden"> + <main className="min-h-screen w-full bg-dashboard-background text-white overflow-x-hidden">using whatever semantic background class (
bg-dashboard-background,bg-surface, etc.) is defined indesign-tokens.ts/tailwind.config.ts.as per coding guidelines, avoid raw hex colors in components and use semantic token‑based classes instead.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (8)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css(1 hunks)apps/web/src/components/oss-programs/SearchInput.tsx(1 hunks)apps/web/src/components/oss-programs/TagFilter.tsx(1 hunks)apps/web/src/data/oss-programs/programs/apertre.ts(1 hunks)apps/web/src/data/oss-programs/programs/github-campus-experts.ts(1 hunks)apps/web/src/data/oss-programs/programs/hacktoberfest.ts(1 hunks)apps/web/src/data/oss-programs/types.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (5)
- apps/web/src/data/oss-programs/programs/github-campus-experts.ts
- apps/web/src/components/oss-programs/TagFilter.tsx
- apps/web/src/components/oss-programs/SearchInput.tsx
- apps/web/src/data/oss-programs/types.ts
- apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css
🧰 Additional context used
📓 Path-based instructions (8)
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx,js,jsx}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
apps/web/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
apps/web/src/**/*.{ts,tsx}: Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
NEVER use hardcoded hex values (e.g.,#5519f7) directly in components; ALWAYS reference colors from the design token system using Tailwind classes
Use semantic color names that describe purpose, not appearance
Usefont-sansfor standard UI text (Geist Sans) andfont-monofor code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale (0.25rem increments); for section padding use mobilep-4(1rem) and desktopp-[60px]
Use appropriate border radius: small elementsrounded-lg, mediumrounded-xl, largerounded-2xl, buttonsrounded-[16px]
Use animation durations: fastduration-100(0.1s), normalduration-300(0.3s), slowduration-600(0.6s)
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{tsx,ts}: Prefer functional components with TypeScript and use proper TypeScript types, avoidany
Extract reusable logic into custom hooks
Use descriptive prop names and define prop types using TypeScript interfaces or types
Prefer controlled components over uncontrolled
Use zustand for global state (located insrc/store/)
Use absolute imports from@/prefix when available
Include proper aria labels for accessibility
Ensure keyboard navigation works
Maintain proper heading hierarchy
Provide alt text for images
Avoid unnecessary re-renders
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (.cursorrules)
Organize imports: react → third-party → local components → utils → types
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx}: Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Memoize expensive computations
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
apps/web/src/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Optimize images using next/image
apps/web/src/**/*.{tsx,ts}: Use Zustand for global state, located insrc/store/
Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Optimize images using next/image
Memoize expensive computations
Define a type when defining const functions
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}
📄 CodeRabbit inference engine (.cursor/rules/general_rules.mdc)
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
apps/web/src/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/**/*.{tsx,ts,jsx,js}: Organize imports in order: React → third-party → local components → utils → types
Use absolute imports from@/prefix when available
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Always use Tailwind classes for styling HTML elements; avoid using CSS or style tags
Use descriptive variable and function names; name event functions with a 'handle' prefix (e.g., handleClick, handleKeyDown)
Use const with arrow functions instead of function declarations (e.g., 'const toggle = () =>')
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/data/oss-programs/programs/apertre.tsapps/web/src/data/oss-programs/programs/hacktoberfest.ts
🧠 Learnings (10)
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Maintain proper heading hierarchy in page components
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : Organize imports: react → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts} : Use dynamic imports for code splitting when appropriate
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Avoid unnecessary comments; code should be self-documenting when possible
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Organize imports in order: React → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Maintain proper heading hierarchy
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
🧬 Code graph analysis (3)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (6)
apps/web/src/app/(main)/dashboard/oss-programs/page.tsx (1)
revalidate(4-4)apps/web/src/data/oss-programs/index.ts (3)
programs(33-63)getAllPrograms(65-67)getProgramBySlug(69-71)apps/web/src/components/oss-programs/ProgramHeader.tsx (1)
ProgramHeader(9-44)apps/web/src/components/oss-programs/ProgramMetadata.tsx (1)
ProgramMetadata(8-42)apps/web/src/data/oss-programs/types.ts (1)
ProgramSection(43-48)apps/web/src/components/oss-programs/ProgramSection.tsx (1)
ProgramSection(20-50)
apps/web/src/data/oss-programs/programs/apertre.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/data/oss-programs/programs/hacktoberfest.ts (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
@huamanraj can you pls check the mobile responsiveness of the ui of 
|
|
@huamanraj the also all the cards of programs are going inside the right side of screen. pls make this part a bit more clear. have some space between the description and pls keep all the dotes in it of the same color - purple |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (2)
1-7: normalize import order and reconsider css usageto match the repo guidelines, it would be good to:
- order imports as: react (if any) → third‑party (
next/navigation,marked,sanitize-html) → local (@/data/...,@/components/...), with the css import last.- double‑check whether
./program-styles.cssis truly global/prose/timeline styling; if it’s only component‑level layout/visuals, prefer tailwind utility classes instead so styling lives in the design‑tokenized tailwind layer.as per coding guidelines, imports should be ordered and tailwind should be preferred over raw css where possible.
29-76: tighten up markdown helper typing and configuration placementthe markdown pipeline looks solid (gfm + sanitize‑html with explicit allowlists), but you can make it clearer and a bit more efficient by:
- moving
marked.setOptions({ gfm: true, breaks: true })to module scope so it’s configured once instead of on every render.- giving
renderMarkdownan explicit function type and, optionally, lifting it to module scope as a pure helper.for example:
marked.setOptions({ gfm: true, breaks: true, }); type RenderMarkdown = (markdown: string) => string; const renderMarkdown: RenderMarkdown = (markdown) => { const html = marked.parse(markdown) as string; return sanitizeHtml(html, { // existing options... }); };then call
renderMarkdown(section.bodyMarkdown)from the component as you already do.as per coding guidelines, defining explicit types for const functions improves readability and makes reuse/testing easier.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (2)
apps/web/package.json(2 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/web/package.json
🧰 Additional context used
📓 Path-based instructions (8)
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx,js,jsx}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
apps/web/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
apps/web/src/**/*.{ts,tsx}: Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
NEVER use hardcoded hex values (e.g.,#5519f7) directly in components; ALWAYS reference colors from the design token system using Tailwind classes
Use semantic color names that describe purpose, not appearance
Usefont-sansfor standard UI text (Geist Sans) andfont-monofor code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale (0.25rem increments); for section padding use mobilep-4(1rem) and desktopp-[60px]
Use appropriate border radius: small elementsrounded-lg, mediumrounded-xl, largerounded-2xl, buttonsrounded-[16px]
Use animation durations: fastduration-100(0.1s), normalduration-300(0.3s), slowduration-600(0.6s)
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{tsx,ts}: Prefer functional components with TypeScript and use proper TypeScript types, avoidany
Extract reusable logic into custom hooks
Use descriptive prop names and define prop types using TypeScript interfaces or types
Prefer controlled components over uncontrolled
Use zustand for global state (located insrc/store/)
Use absolute imports from@/prefix when available
Include proper aria labels for accessibility
Ensure keyboard navigation works
Maintain proper heading hierarchy
Provide alt text for images
Avoid unnecessary re-renders
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (.cursorrules)
Organize imports: react → third-party → local components → utils → types
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx}: Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Memoize expensive computations
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
apps/web/src/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Optimize images using next/image
apps/web/src/**/*.{tsx,ts}: Use Zustand for global state, located insrc/store/
Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Optimize images using next/image
Memoize expensive computations
Define a type when defining const functions
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}
📄 CodeRabbit inference engine (.cursor/rules/general_rules.mdc)
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
apps/web/src/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/**/*.{tsx,ts,jsx,js}: Organize imports in order: React → third-party → local components → utils → types
Use absolute imports from@/prefix when available
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Always use Tailwind classes for styling HTML elements; avoid using CSS or style tags
Use descriptive variable and function names; name event functions with a 'handle' prefix (e.g., handleClick, handleKeyDown)
Use const with arrow functions instead of function declarations (e.g., 'const toggle = () =>')
Files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
🧠 Learnings (10)
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Maintain proper heading hierarchy in page components
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : Organize imports: react → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts} : Use dynamic imports for code splitting when appropriate
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Avoid unnecessary comments; code should be self-documenting when possible
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Organize imports in order: React → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Maintain proper heading hierarchy
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
🧬 Code graph analysis (1)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (5)
apps/web/src/data/oss-programs/index.ts (3)
programs(33-63)getAllPrograms(65-67)getProgramBySlug(69-71)apps/web/src/components/oss-programs/ProgramHeader.tsx (1)
ProgramHeader(9-44)apps/web/src/components/oss-programs/ProgramMetadata.tsx (1)
ProgramMetadata(8-42)apps/web/src/data/oss-programs/types.ts (1)
ProgramSection(43-48)apps/web/src/components/oss-programs/ProgramSection.tsx (1)
ProgramSection(20-50)
🔇 Additional comments (2)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (2)
10-15: static params generation looks goodusing
getAllPrograms()and mapping to{ slug: program.slug }is a straightforward way to drive static generation for all programs; no issues here.
17-23: fixparamstyping and remove unnecessaryawait
paramsis typed as aPromiseand then awaited, but in next app router it’s passed as a plain object ({ params: { slug } }). this makes the type misleading even though runtime still works.you can simplify the signature and destructuring like this:
-export default async function ProgramPage({ - params, -}: { - params: Promise<{ slug: string }>; -}) { - const { slug } = await params; +export default async function ProgramPage({ + params: { slug }, +}: { + params: { slug: string }; +}) {(if you don’t plan to
awaitanything else here, you can also dropasyncfrom the function.)as per coding guidelines, keeping accurate types for route params avoids confusion and makes the api surface clearer.
Likely an incorrect or invalid review comment.
|
fixed it @apsinghdev 
|
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (3)
apps/web/src/components/oss-programs/ProgramCard.tsx (1)
1-40: align ProgramCard with design tokens, component style, and accessibility guidelinesthis component still uses hardcoded hex colors and a function declaration despite the repo guidelines and the prior review on this file.
- replace all hex-based classes with semantic classes from the design system (e.g.
bg-dash-surface,border-dash-border,hover:border-brand-purple/50,hover:bg-dash-hover,text-text-primary,group-hover:text-brand-purple-light,group-hover:text-brand-purple). please double-check exact token names indesign-tokens.ts/tailwind.config.ts. as per coding guidelines / retrieved learnings.- refactor to a const arrow component with an explicit type, e.g.:
-import Link from "next/link"; -import { ChevronRight } from "lucide-react"; -import { Program } from "@/data/oss-programs/types"; - -interface ProgramCardProps { - program: Program; -} - -export default function ProgramCard({ program }: ProgramCardProps) { +import Link from "next/link"; +import { ChevronRight } from "lucide-react"; +import { Program } from "@/data/oss-programs/types"; +import type { FC } from "react"; + +interface ProgramCardProps { + program: Program; +} + +const ProgramCard: FC<ProgramCardProps> = ({ program }) => { return ( <Link href={`/dashboard/oss-programs/${program.slug}`} - className="group block w-full" + className="group block w-full" + aria-label={`open ${program.name} oss program`} > - <div className="w-full bg-[#252525] border border-[#333] rounded-xl px-4 py-3 md:px-5 md:py-4 hover:border-[#9455f4]/50 hover:bg-[#2a2a2a] transition-all duration-200 flex items-center justify-between gap-3 md:gap-4 overflow-hidden"> + <div className="w-full bg-dash-surface border border-dash-border rounded-xl px-4 py-3 md:px-5 md:py-4 hover:border-brand-purple/50 hover:bg-dash-hover transition-all duration-200 flex items-center justify-between gap-3 md:gap-4 overflow-hidden"> <div className="flex-1 min-w-0"> - <h2 className="text-sm md:text-base font-semibold text-white group-hover:text-[#dcb8ff] transition-colors truncate"> + <h2 className="text-sm md:text-base font-semibold text-text-primary group-hover:text-brand-purple-light transition-colors truncate"> {program.name} </h2> ... - <div className="flex-shrink-0 text-gray-500 group-hover:text-[#9455f4] transition-all duration-200 group-hover:translate-x-1"> + <div className="flex-shrink-0 text-gray-500 group-hover:text-brand-purple transition-all duration-200 group-hover:translate-x-1"> <ChevronRight className="w-4 h-4 md:w-5 md:h-5" /> </div> </div> </Link> - ); -} + ); +}; + +export default ProgramCard;this will bring the card in line with the design system, typing, and accessibility requirements.
apps/web/src/components/oss-programs/ProgramSection.tsx (2)
1-18: import react types and tighten section id typing
getSectionIconusesReact.ReactNodebut there is no react type import; this will fail type-checking. prefer a type-only import andReactNode:-import { Info, User, Calendar, Rocket, FileText } from "lucide-react"; +import type { ReactNode } from "react"; +import { Info, User, Calendar, Rocket, FileText } from "lucide-react"; -const getSectionIcon = (sectionId: string) => { - const icons: Record<string, React.ReactNode> = { +const getSectionIcon = (sectionId: string) => { + const icons: Record<string, ReactNode> = {
- since
ProgramSection.idis aProgramSectionIdunion intypes.ts, consider using that instead of plainstringinProgramSectionPropsandgetSectionIconfor better safety.
26-52: replace hardcoded hex tailwind colors and document sanitized html contract
- several classes still embed raw hex colors (
bg-[#9455f4]/15,text-[#9455f4],prose-a:text-[#9455f4],prose-code:text-[#dcb8ff],prose-code:bg-[#252525],prose-pre:bg-[#252525],prose-pre:border-[#333],prose-blockquote:border-[#9455f4]). per the design‑token rules forapps/web/src/**/*.{tsx,ts}, these should be mapped to semantic tailwind utility classes backed bydesign-tokens.ts/tailwind.config.ts(e.g.,text-brand-purple,bg-surface-muted,border-dash-border, etc.) instead of inline hex.dangerouslySetInnerHTMLis fine here becausecontentHtmlis being sanitized in[slug]/page.tsxusingsanitize-html. it would help to clearly treat that as a contract (e.g., short comment/type-level note whererenderMarkdownis defined) so future call sites don’t accidentally pass unsanitized html.
🧹 Nitpick comments (2)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css (2)
1-137: use css vars consistently and confirmtheme()is processed
- nice job centralizing colors into
:rootvars and using them throughout the list, checklist, and timeline styles; this also makes it easy to keep all the dots purple viavar(--color-primary).- there are a couple of remaining raw hex uses (
border-color: #333in the checklist hover state andborder-left: 2px solid #333in the timeline). since you already have--color-text-primary, consider switching those tovar(--color-text-primary)for consistency.background: theme('colors.dash.base');relies on tailwind’stheme()helper being applied in your postcss pipeline. if this file isn’t processed by tailwind, that value will be invalid at runtime; in that case, swap to a css variable or a resolved token value.
140-165: section spacing and text color look good, but consider tokenizing#e5e5e5the extra top margin on
.what-section h3andh4cleanly adds space before “duration / stipend / extra notes” blocks and should address the spacing feedback. to keep colors aligned with the design system, you might also move#e5e5e5into a named css variable (or a design-token–backed utility) instead of hardcoding it here.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (7)
apps/web/package.json(1 hunks)apps/web/src/app/(main)/dashboard/layout.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx(1 hunks)apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css(1 hunks)apps/web/src/components/oss-programs/ProgramCard.tsx(1 hunks)apps/web/src/components/oss-programs/ProgramSection.tsx(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/web/package.json
- apps/web/src/app/(main)/dashboard/oss-programs/ProgramsList.tsx
🧰 Additional context used
📓 Path-based instructions (11)
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx,js,jsx}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
apps/web/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
apps/web/src/**/*.{ts,tsx}: Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
NEVER use hardcoded hex values (e.g.,#5519f7) directly in components; ALWAYS reference colors from the design token system using Tailwind classes
Use semantic color names that describe purpose, not appearance
Usefont-sansfor standard UI text (Geist Sans) andfont-monofor code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale (0.25rem increments); for section padding use mobilep-4(1rem) and desktopp-[60px]
Use appropriate border radius: small elementsrounded-lg, mediumrounded-xl, largerounded-2xl, buttonsrounded-[16px]
Use animation durations: fastduration-100(0.1s), normalduration-300(0.3s), slowduration-600(0.6s)
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{tsx,ts}: Prefer functional components with TypeScript and use proper TypeScript types, avoidany
Extract reusable logic into custom hooks
Use descriptive prop names and define prop types using TypeScript interfaces or types
Prefer controlled components over uncontrolled
Use zustand for global state (located insrc/store/)
Use absolute imports from@/prefix when available
Include proper aria labels for accessibility
Ensure keyboard navigation works
Maintain proper heading hierarchy
Provide alt text for images
Avoid unnecessary re-renders
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (.cursorrules)
Organize imports: react → third-party → local components → utils → types
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
**/*[A-Z]*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Use PascalCase for component file names (e.g.,
UserProfile.tsx)
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx}: Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Memoize expensive computations
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
apps/web/src/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursorrules)
Optimize images using next/image
apps/web/src/**/*.{tsx,ts}: Use Zustand for global state, located insrc/store/
Use PascalCase for types and interfaces with descriptive names
Use dynamic imports for code splitting when appropriate
Optimize images using next/image
Memoize expensive computations
Define a type when defining const functions
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}
📄 CodeRabbit inference engine (.cursor/rules/general_rules.mdc)
**/*.{js,jsx,ts,tsx,py,java,go,rb,php}: Always use lowercase when writing comments
Avoid unnecessary comments; code should be self-documenting when possible
Use comments to explain 'why', not 'what'
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
apps/web/src/components/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/components/**/*.{tsx,ts,jsx,js}: Never use hardcoded hex values directly in components; always reference colors from the design token system using Tailwind classes
Use semantic color names from the design token system that describe purpose, not appearance (e.g., bg-brand-purple, bg-surface-primary, text-text-primary)
Use font-sans for standard UI text (Geist Sans) and font-mono for code, technical content, or monospace needs (DM Mono)
Follow Tailwind's spacing scale for section padding: p-4 (1rem) on mobile, p-[60px] on desktop
Use rounded-lg (0.5rem) for small elements, rounded-xl (1rem) for medium elements, rounded-2xl (1.5rem) for large elements, and rounded-[16px] for buttons
Use duration-100 (0.1s) for fast transitions, duration-300 (0.3s) for normal transitions, and duration-600 (0.6s) for slow transitions
Use available custom animations: animate-accordion-down, animate-accordion-up, animate-scrollRight, animate-scrollLeft, animate-customspin, animate-spin-slow, animate-spin-slow-reverse, animate-marquee, animate-marquee-vertical, animate-shine
Prefer functional components with TypeScript
Extract reusable logic into custom hooks
Prefer controlled components over uncontrolled
Include proper aria labels for accessibility
Ensure keyboard navigation works in interactive components
Maintain proper heading hierarchy in page components
Provide alt text for images
Use 'class:' instead of the ternary operator in class tags whenever possible
Implement accessibility features on interactive elements (e.g., tabindex='0', aria-label, onClick, onKeyDown)
Always follow the design system defined inapps/web/src/lib/design-tokens.tsandapps/web/tailwind.config.ts
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
apps/web/src/components/**/*.{tsx,ts}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/components/**/*.{tsx,ts}: Use proper TypeScript types and avoid usinganytype
Use descriptive prop names and define prop types using TypeScript interfaces or types
Name components using PascalCase (e.g., UserProfile.tsx)
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
apps/web/src/**/*.{tsx,ts,jsx,js}
📄 CodeRabbit inference engine (apps/web/.cursor/rules/frontend_rules.mdc)
apps/web/src/**/*.{tsx,ts,jsx,js}: Organize imports in order: React → third-party → local components → utils → types
Use absolute imports from@/prefix when available
Remove unused imports
Use UPPER_SNAKE_CASE for constants
Use camelCase for functions and variables
Always use Tailwind classes for styling HTML elements; avoid using CSS or style tags
Use descriptive variable and function names; name event functions with a 'handle' prefix (e.g., handleClick, handleKeyDown)
Use const with arrow functions instead of function declarations (e.g., 'const toggle = () =>')
Files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
🧠 Learnings (25)
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts} : Use descriptive prop names and define prop types using TypeScript interfaces or types
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Never use hardcoded hex values directly in components; always reference colors from the design token system using Tailwind classes
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to apps/web/src/**/*.{ts,tsx} : NEVER use hardcoded hex values (e.g., `#5519f7`) directly in components; ALWAYS reference colors from the design token system using Tailwind classes
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Use semantic color names from the design token system that describe purpose, not appearance (e.g., bg-brand-purple, bg-surface-primary, text-text-primary)
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Always follow the design system defined in `apps/web/src/lib/design-tokens.ts` and `apps/web/tailwind.config.ts`
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Use 'class:' instead of the ternary operator in class tags whenever possible
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to apps/web/src/**/*.{ts,tsx} : Use semantic color names that describe purpose, not appearance
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to apps/web/src/**/*.{ts,tsx} : Always follow the design system defined in `apps/web/src/lib/design-tokens.ts` and `apps/web/tailwind.config.ts`
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Use const with arrow functions instead of function declarations (e.g., 'const toggle = () =>')
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Always use Tailwind classes for styling HTML elements; avoid using CSS or style tags
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.cssapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Include proper aria labels for accessibility
Applied to files:
apps/web/src/components/oss-programs/ProgramCard.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to apps/web/src/**/*.{ts,tsx} : Follow Tailwind's spacing scale (0.25rem increments); for section padding use mobile `p-4` (1rem) and desktop `p-[60px]`
Applied to files:
apps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Follow Tailwind's spacing scale for section padding: p-4 (1rem) on mobile, p-[60px] on desktop
Applied to files:
apps/web/src/app/(main)/dashboard/layout.tsxapps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Maintain proper heading hierarchy in page components
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Remove unused imports
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : Organize imports: react → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Use absolute imports from `@/` prefix when available
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts} : Use dynamic imports for code splitting when appropriate
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Avoid unnecessary comments; code should be self-documenting when possible
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/**/*.{tsx,ts,jsx,js} : Organize imports in order: React → third-party → local components → utils → types
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:34:30.460Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.460Z
Learning: Applies to **/*.{tsx,ts} : Maintain proper heading hierarchy
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsxapps/web/src/components/oss-programs/ProgramSection.tsx
📚 Learning: 2025-11-25T07:34:30.459Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: .cursorrules:0-0
Timestamp: 2025-11-25T07:34:30.459Z
Learning: Applies to apps/web/src/**/*.{ts,tsx} : Use appropriate border radius: small elements `rounded-lg`, medium `rounded-xl`, large `rounded-2xl`, buttons `rounded-[16px]`
Applied to files:
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx
📚 Learning: 2025-11-25T07:35:19.051Z
Learnt from: CR
Repo: apsinghdev/opensox PR: 0
File: apps/web/.cursor/rules/frontend_rules.mdc:0-0
Timestamp: 2025-11-25T07:35:19.051Z
Learning: Applies to apps/web/src/components/**/*.{tsx,ts,jsx,js} : Prefer functional components with TypeScript
Applied to files:
apps/web/src/components/oss-programs/ProgramSection.tsx
🧬 Code graph analysis (3)
apps/web/src/components/oss-programs/ProgramCard.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
Program(50-76)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (5)
apps/web/src/data/oss-programs/index.ts (3)
programs(33-63)getAllPrograms(65-67)getProgramBySlug(69-71)apps/web/src/components/oss-programs/ProgramHeader.tsx (1)
ProgramHeader(9-44)apps/web/src/components/oss-programs/ProgramMetadata.tsx (1)
ProgramMetadata(8-42)apps/web/src/components/oss-programs/ProgramSection.tsx (1)
ProgramSection(20-55)apps/web/src/data/oss-programs/types.ts (1)
ProgramSection(43-48)
apps/web/src/components/oss-programs/ProgramSection.tsx (1)
apps/web/src/data/oss-programs/types.ts (1)
ProgramSection(43-48)
🪛 ast-grep (0.40.0)
apps/web/src/components/oss-programs/ProgramSection.tsx
[warning] 50-50: Usage of dangerouslySetInnerHTML detected. This bypasses React's built-in XSS protection. Always sanitize HTML content using libraries like DOMPurify before injecting it into the DOM to prevent XSS attacks.
Context: dangerouslySetInnerHTML
Note: [CWE-79] Improper Neutralization of Input During Web Page Generation [REFERENCES]
- https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml
- https://cwe.mitre.org/data/definitions/79.html
(react-unsafe-html-injection)
🪛 Biome (2.1.2)
apps/web/src/app/(main)/dashboard/oss-programs/[slug]/program-styles.css
[error] 122-122: Unexpected unknown function: theme
Use a known function instead.
See MDN web docs for more details.
(lint/correctness/noUnknownFunction)
[error] 136-136: Unexpected unknown function: theme
Use a known function instead.
See MDN web docs for more details.
(lint/correctness/noUnknownFunction)
apps/web/src/components/oss-programs/ProgramSection.tsx
[error] 51-51: 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 (3)
apps/web/src/app/(main)/dashboard/layout.tsx (1)
19-47: switching fromw-screentow-fullis a good fix for overflowusing
w-fullkeeps the dashboard constrained to its parent and should help prevent horizontal scroll/overflow issues on smaller viewports while preserving the rest of the layout.apps/web/src/app/(main)/dashboard/oss-programs/[slug]/page.tsx (2)
33-99: markdown → sanitized html pipeline and layout look solid
- configuring
markedwith gfm + breaks and then passing the rendered html throughsanitize-htmlwith explicitallowedTags,allowedAttributes, andallowedSchemesis a good pattern and mitigates thedangerouslySetInnerHTMLxss concerns inProgramSection.revalidate = 3600is reasonable for this mostly-static content.- the main container uses semantic tailwind tokens (
bg-dash-base, no inline hex) and a responsive layout (max-w-6xl mx-auto px-4 md:px-8 py-8 md:py-12) that should behave well on mobile while keeping content centered.please double-check in the browser that long markdown content (wide tables/code blocks) scrolls horizontally as expected inside
.program-contentwithout causing page-level horizontal overflow.
21-27: fixparamstyping to match next.js app router
ProgramPagecurrently types props as{ params: Promise<{ slug: string }> }and thenawaitsparams. in the app router,paramsis a plain object, not a promise, so the idiomatic signature is:export default async function ProgramPage({ params, }: { params: { slug: string }; }) { const { slug } = params; // ... }your current code works at runtime because
awaiton a non-promise is a no-op, but correcting the type will better align with next’s expectations and avoid confusion.⛔ Skipped due to learnings
Learnt from: CR Repo: apsinghdev/opensox PR: 0 File: .cursorrules:0-0 Timestamp: 2025-11-25T07:34:30.460Z Learning: Applies to **/*.{tsx,ts} : Use descriptive prop names and define prop types using TypeScript interfaces or typesLearnt from: CR Repo: apsinghdev/opensox PR: 0 File: apps/web/.cursor/rules/frontend_rules.mdc:0-0 Timestamp: 2025-11-25T07:35:19.051Z Learning: Applies to apps/web/src/components/**/*.{tsx,ts} : Use descriptive prop names and define prop types using TypeScript interfaces or typesLearnt from: CR Repo: apsinghdev/opensox PR: 0 File: apps/web/.cursor/rules/frontend_rules.mdc:0-0 Timestamp: 2025-11-25T07:35:19.051Z Learning: Applies to apps/web/src/components/**/*.{tsx,ts} : Use proper TypeScript types and avoid using `any` typeLearnt from: CR Repo: apsinghdev/opensox PR: 0 File: .cursorrules:0-0 Timestamp: 2025-11-25T07:34:30.460Z Learning: Applies to **/*.{tsx,ts} : Prefer functional components with TypeScript and use proper TypeScript types, avoid `any`
2 participants
2025-11-25_13-44-58.mp4
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.