feat: implement youtube backend and partial front

This commit is contained in:
swve 2023-05-14 15:02:09 +00:00
parent cdd1ca46d3
commit 77d4f5fa1c
6 changed files with 51 additions and 20 deletions

View file

@ -9,7 +9,7 @@ import VideoModal from "./NewActivityModal/Video";
import Image from "next/image";
import DocumentPdfModal from "./NewActivityModal/DocumentPdf";
function NewActivityModal({ closeModal, submitActivity, submitFileActivity, chapterId }: any) {
function NewActivityModal({ closeModal, submitActivity, submitFileActivity, submitExternalVideo, chapterId }: any) {
const [selectedView, setSelectedView] = useState("home");
@ -43,7 +43,8 @@ function NewActivityModal({ closeModal, submitActivity, submitFileActivity, chap
)}
{selectedView === "video" && (
<VideoModal submitFileActivity={submitFileActivity} chapterId={chapterId} />
<VideoModal submitFileActivity={submitFileActivity} submitExternalVideo={submitExternalVideo}
chapterId={chapterId} />
)}
{selectedView === "documentpdf" && (

View file

@ -4,7 +4,14 @@ import * as Form from '@radix-ui/react-form';
import BarLoader from "react-spinners/BarLoader";
import { Youtube } from "lucide-react";
function VideoModal({ submitFileActivity, chapterId }: any) {
interface ExternalVideoObject {
name: string,
type: string,
uri: string
}
function VideoModal({ submitFileActivity, submitExternalVideo, chapterId }: any) {
const [video, setVideo] = React.useState(null) as any;
const [isSubmitting, setIsSubmitting] = useState(false);
const [name, setName] = React.useState("");
@ -26,15 +33,21 @@ function VideoModal({ submitFileActivity, chapterId }: any) {
const handleSubmit = async (e: any) => {
e.preventDefault();
setIsSubmitting(true);
if (selectedView === "file") {
let status = await submitFileActivity(video, "video", { name, type: "video" }, chapterId);
setIsSubmitting(false);
setIsSubmitting(false);
}
if (selectedView === "youtube") {
let status = await submitFileActivity(video, "video", { name, type: "video" }, chapterId);
setIsSubmitting(false);
let external_video_object: ExternalVideoObject = {
name,
type: "youtube",
uri: youtubeUrl
}
let status = await submitExternalVideo(external_video_object, 'activity' ,chapterId);
setIsSubmitting(false);
}
};
/* TODO : implement some sort of progress bar for file uploads, it is not possible yet because i'm not using axios.
@ -69,7 +82,6 @@ function VideoModal({ submitFileActivity, chapterId }: any) {
</FormField>
</div>)}
{selectedView === "youtube" && (
<div className="p-4 justify-center m-auto align-middle">
<FormField name="video-activity-file">
<Flex css={{ alignItems: 'baseline', justifyContent: 'space-between' }}>