mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: update file uploader

This commit is contained in:
hanif salafi 2025-01-06 12:31:24 +07:00
parent 364d10a92c
commit e2193a8c9a
4 changed files with 18 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/[locale]/(protected)/contributor/agenda-setting/event-modal.tsx
View File

@ -47,7 +47,7 @@ import { saveAgendaSettings } from "@/service/agenda-setting/agenda-setting";
import { Checkbox } from "@/components/ui/checkbox"; import { Checkbox } from "@/components/ui/checkbox";
import { getUserLevelForAssignments } from "@/service/task"; import { getUserLevelForAssignments } from "@/service/task";
import { AudioRecorder } from "react-audio-voice-recorder"; import { AudioRecorder } from "react-audio-voice-recorder";
import FileUploaderMultiple from "@/components/form/shared/file-uploaded"; import FileUploader from "@/components/form/shared/file-uploader";
import { Upload } from "tus-js-client"; import { Upload } from "tus-js-client";
const schema = z.object({ const schema = z.object({
@ -665,7 +665,7 @@ const EventModal = ({
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<Label>Video</Label> <Label>Video</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"mp4/*": [], "mp4/*": [],
"mov/*": [], "mov/*": [],
@ -677,7 +677,7 @@ const EventModal = ({
</div> </div>
<div> <div>
<Label>Foto</Label> <Label>Foto</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"image/*": [], "image/*": [],
}} }}
@ -688,7 +688,7 @@ const EventModal = ({
</div> </div>
<div> <div>
<Label>Teks</Label> <Label>Teks</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"pdf/*": [], "pdf/*": [],
}} }}
@ -708,7 +708,7 @@ const EventModal = ({
downloadOnSavePress={true} downloadOnSavePress={true}
downloadFileExtension="webm" downloadFileExtension="webm"
/> />
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"mp3/*": [], "mp3/*": [],
"wav/*": [], "wav/*": [],

5
components/form/content/image-form.tsx
View File

@ -922,7 +922,10 @@ export default function FormImage() {
// onChange={onChange} // onChange={onChange}
// className="dark:text-black" // className="dark:text-black"
// /> // />
<CustomEditor onChange={onChange} initialData={articleBody || value} /> <CustomEditor
onChange={onChange}
initialData={articleBody || value}
/>
)} )}
/> />
{errors.description?.message && ( {errors.description?.message && (

7
components/form/shared/file-uploaded.tsx → components/form/shared/file-uploader.tsx
View File

@ -10,15 +10,16 @@ interface FileWithPreview extends File {
preview: string; preview: string;
} }
interface FileUploaderMultipleProps { interface FileUploaderProps {
onDrop: (files: FileWithPreview[]) => void; onDrop: (files: FileWithPreview[]) => void;
accept: Accept; accept: Accept;
maxSize: number; maxSize: number;
label: string; label: string;
className?: string; className?: string;
isMultiple?: boolean;
} }
const FileUploaderMultiple = ({ onDrop, accept, maxSize, label, className = "", }: FileUploaderMultipleProps) => { const FileUploader = ({ onDrop, accept, maxSize, label, className = "", isMultiple = true }: FileUploaderProps) => {
const [files, setFiles] = useState<FileWithPreview[]>([]); const [files, setFiles] = useState<FileWithPreview[]>([]);
const { getRootProps, getInputProps } = useDropzone({ const { getRootProps, getInputProps } = useDropzone({
@ -124,4 +125,4 @@ const FileUploaderMultiple = ({ onDrop, accept, maxSize, label, className = "",
} }
export default FileUploaderMultiple; export default FileUploader;

10
components/form/task/task-form.tsx
View File

@ -34,7 +34,7 @@ import {
} from "@/components/ui/dialog"; } from "@/components/ui/dialog";
import { ChevronDown, ChevronUp } from "lucide-react"; import { ChevronDown, ChevronUp } from "lucide-react";
import { AudioRecorder } from "react-audio-voice-recorder"; import { AudioRecorder } from "react-audio-voice-recorder";
import FileUploaderMultiple from "@/components/form/shared/file-uploaded"; import FileUploader from "@/components/form/shared/file-uploader";
import { Upload } from "tus-js-client"; import { Upload } from "tus-js-client";
import { error } from "@/config/swal"; import { error } from "@/config/swal";
@ -709,7 +709,7 @@ export default function FormTask() {
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<Label>Video</Label> <Label>Video</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"mp4/*": [], "mp4/*": [],
"mov/*": [], "mov/*": [],
@ -721,7 +721,7 @@ export default function FormTask() {
</div> </div>
<div> <div>
<Label>Foto</Label> <Label>Foto</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"image/*": [], "image/*": [],
}} }}
@ -732,7 +732,7 @@ export default function FormTask() {
</div> </div>
<div> <div>
<Label>Teks</Label> <Label>Teks</Label>
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"pdf/*": [], "pdf/*": [],
}} }}
@ -752,7 +752,7 @@ export default function FormTask() {
downloadOnSavePress={true} downloadOnSavePress={true}
downloadFileExtension="webm" downloadFileExtension="webm"
/> />
<FileUploaderMultiple <FileUploader
accept={{ accept={{
"mp3/*": [], "mp3/*": [],
"wav/*": [], "wav/*": [],