Skip to content

feat:Migrate content & data pages and components to TypeScript; add types, update...

SandhyaRani Bandaram requested to merge feature/sandhya-typescript-migration into teams

What does this MR do?

This merge request migrates key content and data pages, as well as their associated components, from JavaScript to TypeScript, adding type safety, improving UI layouts, and ensuring consistency with Tailwind CSS.

Pages updated:

  • Projects.js → Projects.tsx
  • LLMProjects.js → LLMProjects.tsx
  • Roadmap.js → Roadmap.tsx
  • News.js → News.tsx
  • NewsDetail.js → NewsDetail.tsx

Components updated:

  • RoadmapSection.js → RoadmapSection.tsx
  • SummerCard.js → SummerCard.tsx
  • BlockCard.js → BlockCard.tsx

Problem / Motivation

  • Existing JS pages lacked type safety, increasing the chance of runtime errors.
  • Some layouts and responsive designs were inconsistent.
  • There was a need for modernized, maintainable code with improved readability and standardization.

Implementation Notes

  • TypeScript Migration: Defined strict types for Project, News, and RoadmapItem. Added proper interfaces and props for components.
  • UI / CSS Improvements: Refined spacing, responsive grids, and card layouts using Tailwind CSS.
  • Linting & Formatting: Removed unused variables, fixed missing dependencies, and formatted code consistently.
  • Backward Compatibility: No breaking changes; components maintain previous functionality.

How to Test

  1. Pull this branch:

git fetch origin
git checkout feature/sandhya-typescript-migration

  1. Install dependencies:

npm install

  1. Run the dev server:

npm start

  1. Test the pages locally:
    • /projects → Projects page renders properly
    • /llm-projects → LLM Projects page displays correctly
    • /roadmap → Timeline and milestone cards render without errors
    • /news and /news/:slug → News list and detail pages show content correctly
  2. Verify components like RoadmapSection, SummerCard, and BlockCard render without runtime errors.

Checklist

  • Feature is documented (README or relevant docs)
    • Code is clean, readable, and follows project style
    • No breaking changes
    • Tests (manual verification) performed; pages render correctly
    • All migrated components use TypeScript props and type safety

Related Issues or Discussions

#10 (closed)

Merge request reports

Loading