Add save and preview icons to lesson editor
- Save button now shows floppy disk icon (lucide Save) - New Preview button with eye icon opens lesson in student view (new tab) - Pass courseSlug through to LessonEditor for preview URL construction Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -16,7 +16,7 @@ export default async function LessonEditorPage({ params }: Props) {
|
|||||||
include: {
|
include: {
|
||||||
files: { orderBy: { createdAt: "asc" } },
|
files: { orderBy: { createdAt: "asc" } },
|
||||||
module: {
|
module: {
|
||||||
include: { course: { select: { title: true } } },
|
include: { course: { select: { title: true, slug: true } } },
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -47,6 +47,7 @@ export default async function LessonEditorPage({ params }: Props) {
|
|||||||
}}
|
}}
|
||||||
courseId={courseId}
|
courseId={courseId}
|
||||||
moduleId={moduleId}
|
moduleId={moduleId}
|
||||||
|
courseSlug={lesson.module.course.slug}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -6,6 +6,7 @@ import StarterKit from "@tiptap/starter-kit";
|
|||||||
import Image from "@tiptap/extension-image";
|
import Image from "@tiptap/extension-image";
|
||||||
import Link from "@tiptap/extension-link";
|
import Link from "@tiptap/extension-link";
|
||||||
import Placeholder from "@tiptap/extension-placeholder";
|
import Placeholder from "@tiptap/extension-placeholder";
|
||||||
|
import { Save, Eye } from "lucide-react";
|
||||||
import { saveLesson } from "@/app/admin/courses/[courseId]/modules/[moduleId]/lessons/[lessonId]/actions";
|
import { saveLesson } from "@/app/admin/courses/[courseId]/modules/[moduleId]/lessons/[lessonId]/actions";
|
||||||
|
|
||||||
interface LessonData {
|
interface LessonData {
|
||||||
@@ -20,10 +21,12 @@ export function LessonEditor({
|
|||||||
lesson,
|
lesson,
|
||||||
courseId,
|
courseId,
|
||||||
moduleId,
|
moduleId,
|
||||||
|
courseSlug,
|
||||||
}: {
|
}: {
|
||||||
lesson: LessonData;
|
lesson: LessonData;
|
||||||
courseId: string;
|
courseId: string;
|
||||||
moduleId: string;
|
moduleId: string;
|
||||||
|
courseSlug: string;
|
||||||
}) {
|
}) {
|
||||||
const [title, setTitle] = useState(lesson.title);
|
const [title, setTitle] = useState(lesson.title);
|
||||||
const [kinescopeId, setKinescopeId] = useState(lesson.kinescopeId);
|
const [kinescopeId, setKinescopeId] = useState(lesson.kinescopeId);
|
||||||
@@ -121,16 +124,30 @@ export function LessonEditor({
|
|||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<a
|
||||||
|
href={`/courses/${courseSlug}/lessons/${lesson.id}`}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="btn-aubade flex items-center gap-1.5 px-4 py-2 text-sm"
|
||||||
|
title="Просмотр как студент"
|
||||||
|
>
|
||||||
|
<Eye size={14} />
|
||||||
|
Просмотр
|
||||||
|
</a>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={handleSave}
|
onClick={handleSave}
|
||||||
disabled={pending || uploading}
|
disabled={pending || uploading}
|
||||||
className="btn-aubade btn-aubade-accent px-5 py-2 text-sm"
|
className="btn-aubade btn-aubade-accent flex items-center gap-1.5 px-4 py-2 text-sm"
|
||||||
style={{ opacity: pending || uploading ? 0.6 : 1 }}
|
style={{ opacity: pending || uploading ? 0.6 : 1 }}
|
||||||
|
title="Сохранить урок"
|
||||||
>
|
>
|
||||||
{pending ? "Сохранение..." : saved ? "✓ Сохранено" : "Сохранить урок"}
|
<Save size={14} />
|
||||||
|
{pending ? "Сохранение..." : saved ? "Сохранено" : "Сохранить"}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* Title */}
|
{/* Title */}
|
||||||
<div className="space-y-1">
|
<div className="space-y-1">
|
||||||
|
|||||||
Reference in New Issue
Block a user