Merge branch 'master' of github.com:Mintplex-Labs/anything-llm

This commit is contained in:
timothycarambat 2024-04-27 12:39:54 -07:00
commit 551c1ab2b2
4 changed files with 93 additions and 13 deletions

View File

@ -261,8 +261,8 @@ function Directory({
)}
</div>
{amountSelected !== 0 && (
<div className="absolute bottom-[12px] left-0 right-0 flex justify-center">
<div className="mx-auto bg-white/40 rounded-lg py-1 px-2">
<div className="absolute bottom-[12px] left-0 right-0 flex justify-center pointer-events-none">
<div className="mx-auto bg-white/40 rounded-lg py-1 px-2 pointer-events-auto">
<div className="flex flex-row items-center gap-x-2">
<button
onClick={moveToWorkspace}

View File

@ -7,7 +7,9 @@ import PreLoader from "../../../../../Preloader";
function FileUploadProgressComponent({
slug,
uuid,
file,
setFiles,
rejected = false,
reason = null,
onUploadSuccess,
@ -18,6 +20,19 @@ function FileUploadProgressComponent({
const [timerMs, setTimerMs] = useState(10);
const [status, setStatus] = useState("pending");
const [error, setError] = useState("");
const [isFadingOut, setIsFadingOut] = useState(false);
const fadeOut = (cb) => {
setIsFadingOut(true);
cb?.();
};
const beginFadeOut = () => {
setIsFadingOut(false);
setFiles((prev) => {
return prev.filter((item) => item.uid !== uuid);
});
};
useEffect(() => {
async function uploadFile() {
@ -44,13 +59,22 @@ function FileUploadProgressComponent({
clearInterval(timer);
onUploadSuccess();
}
// Begin fadeout timer to clear uploader queue.
setTimeout(() => {
fadeOut(() => setTimeout(() => beginFadeOut(), 300));
}, 5000);
}
!!file && !rejected && uploadFile();
}, []);
if (rejected) {
return (
<div className="h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40">
<div
className={`${
isFadingOut ? "file-upload-fadeout" : "file-upload"
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40`}
>
<div className="w-6 h-6 flex-shrink-0">
<XCircle className="w-6 h-6 stroke-white bg-red-500 rounded-full p-1 w-full h-full" />
</div>
@ -66,7 +90,11 @@ function FileUploadProgressComponent({
if (status === "failed") {
return (
<div className="h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40 overflow-y-auto">
<div
className={`${
isFadingOut ? "file-upload-fadeout" : "file-upload"
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40 overflow-y-auto`}
>
<div className="w-6 h-6 flex-shrink-0">
<XCircle className="w-6 h-6 stroke-white bg-red-500 rounded-full p-1 w-full h-full" />
</div>
@ -81,7 +109,11 @@ function FileUploadProgressComponent({
}
return (
<div className="h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40">
<div
className={`${
isFadingOut ? "file-upload-fadeout" : "file-upload"
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white/5 border border-white/40`}
>
<div className="w-6 h-6 flex-shrink-0">
{status !== "complete" ? (
<div className="flex items-center justify-center">

View File

@ -6,6 +6,7 @@ import { useDropzone } from "react-dropzone";
import { v4 } from "uuid";
import FileUploadProgress from "./FileUploadProgress";
import Workspace from "../../../../../models/workspace";
import debounce from "lodash.debounce";
export default function UploadFile({
workspace,
@ -39,14 +40,9 @@ export default function UploadFile({
setFetchingUrl(false);
};
const handleUploadSuccess = () => {
fetchKeys(true);
showToast("File uploaded successfully", "success", { clear: true });
};
const handleUploadError = (message) => {
showToast(`Error uploading file: ${message}`, "error");
};
// Don't spam fetchKeys, wait 1s between calls at least.
const handleUploadSuccess = debounce(() => fetchKeys(true), 1000);
const handleUploadError = (_msg) => null; // stubbed.
const onDrop = async (acceptedFiles, rejections) => {
const newAccepted = acceptedFiles.map((file) => {
@ -115,6 +111,8 @@ export default function UploadFile({
<FileUploadProgress
key={file.uid}
file={file.file}
uuid={file.uid}
setFiles={setFiles}
slug={workspace.slug}
rejected={file?.rejected}
reason={file?.reason}

View File

@ -692,3 +692,53 @@ does not extend the close button beyond the viewport. */
.text-tremor-content {
padding-bottom: 10px;
}
.file-upload {
-webkit-animation: fadein 0.3s linear forwards;
animation: fadein 0.3s linear forwards;
}
.file-upload-fadeout {
-webkit-animation: fadeout 0.3s linear forwards;
animation: fadeout 0.3s linear forwards;
}
@-webkit-keyframes fadein {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadein {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fadeout {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeout {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}