1
0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-10-01 11:26:42 +02:00

AI Tutor - Explore page, sidebar better search (#8476)

* Add sidebar to ai-tutor

* wip

* wip

* Fix mistakes and refacctor

* AI landing page changes

* Update sidebar design

* wip

* wip

* Update AI tutor sidebar

* wip

* Add ai-course dropdown

* Update

* fix: ai chat window position

* Course explanation changes

* Update course

* Tutor sidebar changes

* Refactor staff picks and community

* Update UI for a course

* Improve pagination

* Implement pagination of ai tutor ai courses

* AI explore page with search

* Fix pagination of tutor

* Update tutor header design

* Responsiveness of AI

* Fork alert changes

* Responsiveness of actions

* Forking functionality changes

* Fork confirmation changes

* Add upgrade indicator in sidebar

* fix: ai course access

* fix: next lesson

* Add login to view functionality

* Add search to my picks

---------

Co-authored-by: Arik Chakma <arikchangma@gmail.com>
This commit is contained in:
Kamran Ahmed
2025-04-14 10:54:38 +01:00
committed by GitHub
parent d4a1180c4d
commit 823c31eac4
36 changed files with 1460 additions and 337 deletions

View File

@@ -5,18 +5,12 @@ import { AICourseActions } from './AICourseActions';
type AICourseCardProps = {
course: AICourseWithLessonCount;
showActions?: boolean;
showProgress?: boolean;
};
export function AICourseCard(props: AICourseCardProps) {
const { course } = props;
// Format date if available
const formattedDate = course.createdAt
? new Date(course.createdAt).toLocaleDateString('en-US', {
month: 'short',
day: 'numeric',
})
: null;
const { course, showActions = true, showProgress = true } = props;
// Map difficulty to color
const difficultyColor =
@@ -33,10 +27,10 @@ export function AICourseCard(props: AICourseCardProps) {
totalTopics > 0 ? Math.round((completedTopics / totalTopics) * 100) : 0;
return (
<div className="relative">
<div className="relative flex flex-grow flex-col">
<a
href={`/ai/${course.slug}`}
className="hover:border-gray-3 00 group relative flex w-full flex-col overflow-hidden rounded-lg border border-gray-200 bg-white p-4 text-left transition-all hover:bg-gray-50"
className="hover:border-gray-3 00 group relative flex h-full min-h-[140px] w-full flex-col overflow-hidden rounded-lg border border-gray-200 bg-white p-4 text-left transition-all hover:bg-gray-50"
>
<div className="flex items-center justify-between">
<span
@@ -56,7 +50,7 @@ export function AICourseCard(props: AICourseCardProps) {
<span>{totalTopics} lessons</span>
</div>
{totalTopics > 0 && (
{showProgress && totalTopics > 0 && (
<div className="flex items-center">
<div className="mr-2 h-1.5 w-16 overflow-hidden rounded-full bg-gray-200">
<div
@@ -72,8 +66,8 @@ export function AICourseCard(props: AICourseCardProps) {
</div>
</a>
{course.slug && (
<div className="absolute right-2 top-2">
{showActions && course.slug && (
<div className="absolute top-2 right-2">
<AICourseActions courseSlug={course.slug} />
</div>
)}