refresh code button
fix side bar height
based on the route dashboard link should modify
role based authorization for all the routes
inbox and help
remove ai button in course creation page
auto refresh for pdf addition
space occupied should be calculated
remove swal in knowledge button
back button for course creation page in knowledge base
confirmation msg while deleting an activity along with an option not to ask again.
new mcq should have an option to generate the options
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";
import { Plus, TrashIcon } from "lucide-react";
import { QuizActivity } from "./activity-templates/QuizActivity";
import { useState } from "react";
import { PageHeading } from "@/components/PageHeading";
import { Breadcrumb, BreadcrumbItem, BreadcrumbList, BreadcrumbSeparator } from
"@/components/ui/breadcrumb";
export function ActivityShell({ selectedActivityType, setGenerateClicked }:
{ selectedActivityType: string, setGenerateClicked:
React.Dispatch<React.SetStateAction<boolean>> }) {
const [markdownData, setMarkdownData] = useState("");
const [mcqQuestions, setMcqQuestions] = useState([
{
question: "What is the capital of France?",
optionA: "Paris",
optionB: "London",
optionC: "Berlin",
optionD: "Delhi",
explanation: "Because, they chose that",
},
{
question: "How many alphabets are present in english?",
optionA: "1",
optionB: "2",
optionC: "3",
optionD: "26",
explanation: "Because, they chose that",
},
]);
const addMcqQuestion = () => {
setMcqQuestions([
...mcqQuestions,
{
question: "",
optionA: "",
optionB: "",
optionC: "",
optionD: "",
explanation: "",
},
]);
};
const deleteMcqQuestion = (index: number) => {
const updatedQuestions = [...mcqQuestions];
updatedQuestions.splice(index, 1);
setMcqQuestions(updatedQuestions);
};
const handleAddActivity = () => {
setGenerateClicked(false);
};
// const handleSave = (updatedMarkdown: string) => {
// Send the updated markdown to the backend
// console.log("Updated Markdown:", updatedMarkdown);
// Example: axios.post('/api/save-markdown', { markdown:
updatedMarkdown });
// };
return (
<div className="flex flex-col w-10/12 max-h-screen bg-background p-6 gap-6
text-foreground">
<div className="space-y-4">
<div>
<PageHeading text="Create Activity" />
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem>
<Button onClick={() => setGenerateClicked(false)}
variant={"link"}>
Chapter 1
</Button>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
{selectedActivityType || "Activity"}
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
</div>
<div className="space-y-2">
<Label htmlFor="title">Title</Label>
<Input disabled={true} value={selectedActivityType} id="title"
placeholder="Enter activity title" />
</div>
<div className="space-y-2">
<Label htmlFor="description">Description</Label>
<Textarea id="description" placeholder="Enter activity
description" />
</div>
<div className="space-y-2">
<Label htmlFor="description">Activity Content</Label>
</div>
{
selectedActivityType === "Quiz" ? <QuizActivity />
: (
<div className="space-y-4">
{mcqQuestions.map((question, index) => (
<div key={index} className="border rounded-md
p-4 space-y-4">
<div className="space-y-2">
<Label htmlFor={`question-$
{index}`}>Question</Label>
<Input
id={`question-${index}`}
value={question.question}
onChange={(e) => {
const updatedQuestions =
[...mcqQuestions];
updatedQuestions[index].question = e.target.value;
setMcqQuestions(updatedQuestions);
}}
/>
</div>
<div className="flex justify-end">
<Button variant="ghost" size="icon"
onClick={() => deleteMcqQuestion(index)}>
<TrashIcon className="w-5 h-5" />
<span className="sr-only">Delete
question</span>
</Button>
</div>
</div>
))}
<div>
<Button onClick={addMcqQuestion}>Add
Question</Button>
</div>
</div>
)
}
</div>
<div className="flex justify-center gap-4">
<Button onClick={() => handleAddActivity()} size={"lg"}>
Add
<Plus className="ml-2 w-5 h-5" />
</Button>
</div>
</div>
);
}
