diff --git a/src/components/pages/Upload.tsx b/src/components/pages/Upload.tsx
index cd4db20..2d210e2 100644
--- a/src/components/pages/Upload.tsx
+++ b/src/components/pages/Upload.tsx
@@ -8,19 +8,21 @@ import Alert from 'components/Alert';
import { useStoreSelector } from 'lib/redux/store';
import CenteredBox from 'components/CenteredBox';
import copy from 'copy-to-clipboard';
+import Link from 'components/Link';
export default function Upload({ route }) {
const user = useStoreSelector(state => state.user);
- const [file, setFile] = useState(null);
+ const [files, setFiles] = useState([]);
const [loading, setLoading] = useState(false);
const [open, setOpen] = useState(false);
const [severity, setSeverity] = useState('success');
const [message, setMessage] = useState('Saved');
-
+ console.log(files);
const handleUpload = async () => {
const body = new FormData();
- body.append('file', file);
+
+ for (let i = 0; i !== files.length; ++i) body.append('file', files[i]);
setLoading(true);
const res = await fetch('/api/upload', {
@@ -34,8 +36,11 @@ export default function Upload({ route }) {
if (res.ok && json.error === undefined) {
setOpen(true);
setSeverity('success');
- setMessage(`Copied to clipboard! ${json.url}`);
+
+ //@ts-ignore
+ setMessage(<>Copied first image to clipboard!
{json.files.map(x => ({x}
))}>);
copy(json.url);
+ setFiles([]);
} else {
setOpen(true);
setSeverity('error');
@@ -50,7 +55,7 @@ export default function Upload({ route }) {
Upload file
- setFile(acceptedFiles[0])}>
+ setFiles([...files, ...acceptedFiles])}>
{({getRootProps, getInputProps}) => (
Drag an image or click to upload an image.
- {file && file.name}
+ {files.map(file => (
+ {file.name}
+ ))}
)}
diff --git a/src/lib/middleware/withZipline.ts b/src/lib/middleware/withZipline.ts
index b3c9baa..72707f0 100644
--- a/src/lib/middleware/withZipline.ts
+++ b/src/lib/middleware/withZipline.ts
@@ -30,7 +30,7 @@ export type NextApiReq = NextApiRequest & {
} | null | void>;
getCookie: (name: string) => string | null;
cleanCookie: (name: string) => void;
- file?: NextApiFile;
+ files?: NextApiFile[];
}
export type NextApiRes = NextApiResponse & {
diff --git a/src/pages/api/upload.ts b/src/pages/api/upload.ts
index 074f939..ce22543 100644
--- a/src/pages/api/upload.ts
+++ b/src/pages/api/upload.ts
@@ -20,33 +20,41 @@ async function handler(req: NextApiReq, res: NextApiRes) {
token: req.headers.authorization
}
});
+
+
if (!user) return res.forbid('authorization incorect');
- if (!req.file) return res.error('no file');
- if (req.file.size > zconfig.uploader[user.administrator ? 'admin_limit' : 'user_limit']) return res.error('file size too big');
+ if (!req.files) return res.error('no files');
+ if (req.files && req.files.length === 0) return res.error('no files');
- const ext = req.file.originalname.split('.').pop();
- if (zconfig.uploader.disabled_extentions.includes(ext)) return res.error('disabled extension recieved: ' + ext);
- const rand = randomChars(zconfig.uploader.length);
+ const files = [];
- let invis;
- const image = await prisma.image.create({
- data: {
- file: `${rand}.${ext}`,
- mimetype: req.file.mimetype,
- userId: user.id,
- embed: !!req.headers.embed
- }
- });
-
- if (req.headers.zws) invis = await createInvis(zconfig.uploader.length, image.id);
+ for (let i = 0; i !== req.files.length; ++i) {
+ const file = req.files[i];
+ if (file.size > zconfig.uploader[user.administrator ? 'admin_limit' : 'user_limit']) return res.error('file size too big');
- await writeFile(join(process.cwd(), zconfig.uploader.directory, image.file), req.file.buffer);
+ const ext = file.originalname.split('.').pop();
+ if (zconfig.uploader.disabled_extentions.includes(ext)) return res.error('disabled extension recieved: ' + ext);
+ const rand = randomChars(zconfig.uploader.length);
- Logger.get('image').info(`User ${user.username} (${user.id}) uploaded an image ${image.file} (${image.id})`);
+ let invis;
+ const image = await prisma.image.create({
+ data: {
+ file: `${rand}.${ext}`,
+ mimetype: file.mimetype,
+ userId: user.id,
+ embed: !!req.headers.embed
+ }
+ });
+
+ if (req.headers.zws) invis = await createInvis(zconfig.uploader.length, image.id);
- return res.json({
- url: `${zconfig.core.secure ? 'https' : 'http'}://${req.headers.host}${zconfig.uploader.route}/${invis ? invis.invis : image.file}`
- });
+ await writeFile(join(process.cwd(), zconfig.uploader.directory, image.file), file.buffer);
+ Logger.get('image').info(`User ${user.username} (${user.id}) uploaded an image ${image.file} (${image.id})`);
+ files.push(`${zconfig.core.secure ? 'https' : 'http'}://${req.headers.host}${zconfig.uploader.route}/${invis ? invis.invis : image.file}`);
+ }
+
+ // url will be deprecated soon
+ return res.json({ files, url: files[0] });
}
function run(middleware: any) {
@@ -60,7 +68,7 @@ function run(middleware: any) {
}
export default async function handlers(req, res) {
- await run(uploader.single('file'))(req, res);
+ await run(uploader.array('file'))(req, res);
return withZipline(handler)(req, res);
};