change path of files

src/components/select-item.jsx

@@ -13,7 +13,7 @@ const SelectorItem = ({ file, clickHandler }) => {
             <Card shadow="sm">
                 <Card.Section>
                     <Image
-                        src={"/api/file/"+file.id}
+                        src={"/api/files/"+file.id}
                         alt={file.name}
                         height={100}
                         fit="cover"

src/pages/files/add.jsx

@@ -27,15 +27,7 @@ const ModalAddFile = ({ opened, handler, addFiles }) => {
         const formData = new FormData();
         const CHUNK_SIZE = 1 * 1024 * 1024; // 1MB chunks
 
-        files.forEach((file, index) => {
+        files.forEach((file) => formData.append(`${file.name}`, file, file.name));
-            const totalChunks = Math.ceil(file.size / CHUNK_SIZE);
-
-            for (let chunkIndex = 0; chunkIndex < totalChunks; chunkIndex++) {
-                const start = chunkIndex * CHUNK_SIZE;
-                const end = Math.min(start + CHUNK_SIZE, file.size);
-                formData.append(`${files[index].name}`, file.slice(start, end), file.name);
-            }
-        });
 
         API.files
             .upload(formData)

src/pages/files/file-view.jsx

@@ -13,7 +13,7 @@ const FileView = ({ file, onSelect, onDelete, ...props }) => {
     return (
         <Card shadow="sm" padding="md" withBorder>
             <Card.Section>
-                <Image src={'/api/file/' + file?.id ?? ''} alt={file?.name ?? ''} withPlaceholder fit="contain" />
+                <Image src={'/api/files/' + file?.id ?? ''} alt={file?.name ?? ''} withPlaceholder fit="contain" />
             </Card.Section>
             <Text>{file?.name ?? 'File Name'}</Text>
             <Group position="center" grow>

src/pages/playlist/content.jsx

@@ -150,7 +150,7 @@ const Content = ({ form, playlistId, playlist }) => {
                         <Paper p="xs" radius="sm" shadow="sm" withBorder spacing="xs" style={{ width: '90%' }}>
                             <Flex direction="row" align="center" gap="lg" justify="flex-end">
                                 <Text>{form.getInputProps(`files.${index}.name`).value}</Text>
-                                <Image width={150} src={'/api/file/' + form.getInputProps(`files.${index}.id`).value} />
+                                <Image width={150} src={'/api/files/' + form.getInputProps(`files.${index}.id`).value} />
                                 <NumberInput
                                     required
                                     hideControls
@@ -177,7 +177,7 @@ const Content = ({ form, playlistId, playlist }) => {
                 <Paper p="xs" radius="sm" shadow="sm" withBorder spacing="xs" style={{ width: '90%' }}>
                     <Flex direction="row" align="center" gap="lg" justify="flex-end">
                         <Text>{form.getInputProps(`files.${index}.name`).value}</Text>
-                        <Image width={150} src={'/api/file/' + form.getInputProps(`files.${index}.id`).value} />
+                        <Image width={150} src={'/api/files/' + form.getInputProps(`files.${index}.id`).value} />
                         <Text>Display time: {parseTime(form.getInputProps(`files.${index}.seconds`).value)}</Text>
                     </Flex>
                 </Paper>

src/pages/playlists/index.jsx

@@ -8,7 +8,7 @@ import { Button } from '@mantine/core';
 import GrantAccess, { Perm } from '../../tools/grant-access';
 
 const Playlists = () => {
-    const [showCreate, setShowCreate] = useState(true);
+    const [showCreate, setShowCreate] = useState(false);
     const [showUpdate, setShowUpdate] = useState(false);
     const [, setItem] = useState({});
     const [page, setPage] = useState(0);