sij/anything-llm
1
0
Fork 0
mirror of https://github.com/Mintplex-Labs/anything-llm.git synced 2025-03-20 00:52:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions2

update uploader status containers for new theme

Browse source
This commit is contained in:
timothycarambat 2024-11-19 09:56:06 -08:00
parent 727d802779
commit 6de29cb241
2 changed files with 29 additions and 16 deletions
frontend/src/components/Modals/ManageWorkspace/Documents/UploadFile
FileUploadProgress
index.jsx
index.jsx

43
frontend/src/components/Modals/ManageWorkspace/Documents/UploadFile/FileUploadProgress/index.jsx
View file

@ -61,9 +61,9 @@ function FileUploadProgressComponent({
}
// Begin fadeout timer to clear uploader queue.
setTimeout(() => {
fadeOut(() => setTimeout(() => beginFadeOut(), 300));
}, 5000);
// setTimeout(() => {
// fadeOut(() => setTimeout(() => beginFadeOut(), 300));
// }, 5000);
}
!!file && !rejected && uploadFile();
}, []);
@ -73,16 +73,21 @@ function FileUploadProgressComponent({
<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`}
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-error/40 light:bg-error/30 light:border-solid light:border-error/40 border border-transparent`}
>
<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" />
<XCircle
color="var(--theme-bg-primary)"
className="w-6 h-6 stroke-white bg-error rounded-full p-1 w-full h-full"
/>
</div>
<div className="flex flex-col">
<p className="text-white text-xs font-medium">
<p className="text-white light:text-red-600 text-xs font-semibold">
{truncate(file.name, 30)}
</p>
<p className="text-red-400 text-xs font-medium">{reason}</p>
<p className="text-red-100 light:text-red-600 text-xs font-medium">
{reason || "this file failed to upload"}
</p>
</div>
</div>
);
@ -93,16 +98,21 @@ function FileUploadProgressComponent({
<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`}
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-error/40 light:bg-error/30 light:border-solid light:border-error/40 border border-transparent`}
>
<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" />
<XCircle
color="var(--theme-bg-primary)"
className="w-6 h-6 stroke-white bg-error rounded-full p-1 w-full h-full"
/>
</div>
<div className="flex flex-col">
<p className="text-white text-xs font-medium">
<p className="text-white light:text-red-600 text-xs font-semibold">
{truncate(file.name, 30)}
</p>
<p className="text-red-400 text-xs font-medium">{error}</p>
<p className="text-red-100 light:text-red-600 text-xs font-medium">
{reason || "this file failed to upload"}
</p>
</div>
</div>
);
@ -112,7 +122,7 @@ function FileUploadProgressComponent({
<div
className={`${
isFadingOut ? "file-upload-fadeout" : "file-upload"
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-white border border-white/40 shadow-md`}
} h-14 px-2 py-2 flex items-center gap-x-4 rounded-lg bg-zinc-800 light:border-solid light:border-theme-modal-border light:bg-theme-bg-sidebar border border-white/20 shadow-md`}
>
<div className="w-6 h-6 flex-shrink-0">
{status !== "complete" ? (
@ -120,14 +130,17 @@ function FileUploadProgressComponent({
<PreLoader size="6" />
</div>
) : (
<CheckCircle className="w-6 h-6 stroke-white bg-green-500 rounded-full p-1 w-full h-full" />
<CheckCircle
color="var(--theme-bg-primary)"
className="w-6 h-6 stroke-white bg-green-500 rounded-full p-1 w-full h-full"
/>
)}
</div>
<div className="flex flex-col">
<p className="text-white text-xs font-medium">
<p className="text-white light:text-theme-text-primary text-xs font-medium">
{truncate(file.name, 30)}
</p>
<p className="text-white/60 text-xs font-medium">
<p className="text-white/80 light:text-theme-text-secondary text-xs font-medium">
{humanFileSize(file.size)} | {milliToHms(timerMs)}
</p>
</div>

2
frontend/src/components/Modals/ManageWorkspace/Documents/UploadFile/index.jsx
View file

@ -142,7 +142,7 @@ export default function UploadFile({
<button
disabled={fetchingUrl}
type="submit"
className="disabled:bg-white/20 disabled:text-slate-300 disabled:border-slate-400 disabled:cursor-wait bg bg-transparent hover:bg-slate-200 hover:text-slate-800 w-auto border border-white text-sm text-white p-2.5 rounded-lg"
className="disabled:bg-white/20 disabled:text-slate-300 disabled:border-slate-400 disabled:cursor-wait bg bg-transparent hover:bg-slate-200 hover:text-slate-800 w-auto border border-white light:border-theme-modal-border text-sm text-white p-2.5 rounded-lg"
>
{fetchingUrl ? "Fetching..." : "Fetch website"}
</button>