diff --git a/src/screens/manga/MangaExtensions.tsx b/src/screens/manga/MangaExtensions.tsx
index c5dbc13a..cbc708a2 100644
--- a/src/screens/manga/MangaExtensions.tsx
+++ b/src/screens/manga/MangaExtensions.tsx
@@ -7,6 +7,8 @@
import React, { useContext, useEffect, useState } from 'react';
import { fromEvent } from 'file-selector';
+import IconButton from '@material-ui/core/IconButton';
+import AddIcon from '@material-ui/icons/Add';
import ExtensionCard from 'components/manga/ExtensionCard';
import NavbarContext from 'context/NavbarContext';
import client from 'util/client';
@@ -56,11 +58,20 @@ export default function MangaExtensions() {
useEffect(() => {
setTitle('Extensions');
setAction(
- ,
+ <>
+ document.getElementById('external-extension-file')?.click()
+ }
+ >
+
+
+
+ >,
);
}, [shownLangs]);
@@ -85,11 +96,15 @@ export default function MangaExtensions() {
const [toasts, makeToast] = makeToaster(useState([]));
- const submitExtension = (file: File) => {
+ const submitExternalExtension = (file: File) => {
if (file.name.toLowerCase().endsWith('apk')) {
const formData = new FormData();
formData.append('file', file);
+ // empty the input
+ // @ts-ignore
+ document.getElementById('external-extension-file').value = null;
+
makeToast('Installing Extension File....', 'info');
client.post('/api/v1/extension/install',
formData, { headers: { 'Content-Type': 'multipart/form-data' } })
@@ -107,7 +122,7 @@ export default function MangaExtensions() {
e.preventDefault();
const files = await fromEvent(e);
- submitExtension(files[0] as File);
+ submitExternalExtension(files[0] as File);
};
const dragOverHandler = (e: Event) => {
@@ -118,9 +133,17 @@ export default function MangaExtensions() {
document.addEventListener('drop', dropHandler);
document.addEventListener('dragover', dragOverHandler);
+ const changeHandler = async (evt: Event) => {
+ const files = await fromEvent(evt);
+ submitExternalExtension(files[0] as File);
+ };
+ const input = document.getElementById('external-extension-file');
+ input?.addEventListener('change', changeHandler);
+
return () => {
document.removeEventListener('drop', dropHandler);
document.removeEventListener('dragover', dragOverHandler);
+ input?.removeEventListener('change', changeHandler);
};
}, []);
@@ -131,6 +154,11 @@ export default function MangaExtensions() {
return (
<>
{toasts}
+
{
Object.entries(extensions).map(([lang, list]) => (
((groupsToShow.indexOf(lang) !== -1 && (list as []).length > 0)