rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add chapter title edition

Browse source
This commit is contained in:
swve 2023-10-05 23:00:57 +02:00
parent 3dc5d760f9
commit b6f535080a
3 changed files with 48 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

43
front/components/Pages/CourseEdit/Draggables/Chapter.tsx
View file

@ -2,10 +2,39 @@ import React from "react";
import styled from "styled-components";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
import Activity from "./Activity";
import { Folders, Hexagon, MoreVertical, PlusSquare, Sparkle, Sparkles, Trash, Trash2, X } from "lucide-react";
import { Folders, Hexagon, MoreVertical, Pencil, PlusSquare, Save, Sparkle, Sparkles, Trash, Trash2, X } from "lucide-react";
import ConfirmationModal from "@components/StyledElements/ConfirmationModal/ConfirmationModal";
import { useRouter } from "next/navigation";
import { updateChapter } from "@services/courses/chapters";
import { mutate } from "swr";
import { getAPIUrl } from "@services/config/config";
import { revalidateTags } from "@services/utils/ts/requests";
interface ModifiedChapterInterface {
chapterId: string;
chapterName: string;
}
function Chapter(props: any) {
const router = useRouter();
const [modifiedChapter, setModifiedChapter] = React.useState<ModifiedChapterInterface | undefined>(undefined);
const [selectedChapter, setSelectedChapter] = React.useState<string | undefined>(undefined);
async function updateChapterName(chapterId: string) {
if (modifiedChapter?.chapterId === chapterId) {
setSelectedChapter(undefined);
let modifiedChapterCopy = {
name: modifiedChapter.chapterName,
description: '',
activities: props.info.list.chapter.activityIds,
}
await updateChapter(chapterId, modifiedChapterCopy)
await mutate(`${getAPIUrl()}chapters/meta/course_${props.courseid}`)
await revalidateTags(['courses'], props.orgslug)
router.refresh();
}
}
return (
<Draggable key={props.info.list.chapter.id} draggableId={props.info.list.chapter.id} index={props.index}>
{(provided, snapshot) => (
@ -23,7 +52,17 @@ function Chapter(props: any) {
<Hexagon strokeWidth={3} size={16} className="text-neutral-600 " />
</div>
<p className="text-neutral-700 first-letter:uppercase">{props.info.list.chapter.name}</p>
<div className="flex space-x-2 items-center">
{selectedChapter === props.info.list.chapter.id ?
(<div className="chapter-modification-zone bg-neutral-100 py-1 px-4 rounded-lg space-x-3">
<input type="text" className="bg-transparent outline-none text-sm text-neutral-700" placeholder="Chapter name" value={modifiedChapter?.chapterName} onChange={(e) => setModifiedChapter({ chapterId: props.info.list.chapter.id, chapterName: e.target.value })} />
<button onClick={() => updateChapterName(props.info.list.chapter.id)} className="bg-transparent text-neutral-700 hover:cursor-pointer hover:text-neutral-900">
<Save size={15} onClick={() => updateChapterName(props.info.list.chapter.id)} />
</button>
</div>) : (<p className="text-neutral-700 first-letter:uppercase">{props.info.list.chapter.name}</p>)}
<Pencil size={15} className="text-neutral-600 hover:cursor-pointer" onClick={() => setSelectedChapter(props.info.list.chapter.id)} />
</div>
</div>
<MoreVertical size={15} className="text-gray-300" />
<ConfirmationModal

2
front/components/Security/AuthProvider.tsx
View file

@ -27,7 +27,7 @@ const AuthProvider = ({ children }: any) => {
async function checkRefreshToken() {
deleteCookie("access_token_cookie");
//deleteCookie("access_token_cookie");
let data = await getNewAccessTokenUsingRefreshToken();
if (data) {
return data.access_token;

6
front/services/courses/chapters.ts
View file

@ -21,6 +21,12 @@ export async function updateChaptersMetadata(course_id: any, data: any) {
return res;
}
export async function updateChapter(coursechapter_id: any, data: any) {
const result: any = await fetch(`${getAPIUrl()}chapters/${coursechapter_id}`, RequestBody("PUT", data, null));
const res = await errorHandling(result);
return res;
}
export async function createChapter(data: any, course_id: any) {
const result: any = await fetch(`${getAPIUrl()}chapters/?course_id=course_${course_id}`, RequestBody("POST", data, null));
const res = await errorHandling(result);