Skip to content

Commit

Permalink
Merge pull request #519 from mfts/feat/bulk
Browse files Browse the repository at this point in the history 
feat: add bulk upload to dataroom documents
  • Loading branch information
@mfts
mfts authored Jul 16, 2024
2 parents decb839 + 91020b0 commit ddd4e3e
Show file tree
Hide file tree
Showing 4 changed files with 92 additions and 160 deletions.
43 changes: 34 additions & 9 deletions components/documents/documents-list.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,14 @@ import { Skeleton } from "@/components/ui/skeleton";
import { UploadNotificationDrawer } from "@/components/upload-notification";
import UploadZone from "@/components/upload-zone";

import {
DataroomFolderDocument,
DataroomFolderWithCount,
} from "@/lib/swr/use-dataroom";
import { FolderWithCount } from "@/lib/swr/use-documents";
import { DocumentWithLinksAndLinkCountAndViewCount } from "@/lib/types";

import DataroomDocumentCard from "../datarooms/dataroom-document-card";
import DocumentCard from "./document-card";
import { EmptyDocuments } from "./empty-document";
import FolderCard from "./folder-card";
Expand All @@ -19,11 +24,16 @@ export function DocumentsList({
documents,
teamInfo,
folderPathName,
dataroomId,
}: {
folders: FolderWithCount[] | undefined;
documents: DocumentWithLinksAndLinkCountAndViewCount[] | undefined;
folders: FolderWithCount[] | DataroomFolderWithCount[] | undefined;
documents:
| DocumentWithLinksAndLinkCountAndViewCount[]
| DataroomFolderDocument[]
| undefined;
teamInfo: TeamContextType | null;
folderPathName?: string[];
dataroomId?: string;
}) {
const [uploads, setUploads] = useState<
{ fileName: string; progress: number; documentId?: string }[]
Expand Down Expand Up @@ -55,6 +65,7 @@ export function DocumentsList({
}}
setUploads={setUploads}
setRejectedFiles={setRejectedFiles}
dataroomId={dataroomId}
>
<ScrollArea
className="-m-2 h-[calc(100dvh-205px)] *:p-2"
Expand All @@ -70,6 +81,8 @@ export function DocumentsList({
key={folder.id}
folder={folder}
teamInfo={teamInfo}
isDataroom={dataroomId ? true : false}
dataroomId={dataroomId}
/>
);
})
Expand All @@ -95,13 +108,25 @@ export function DocumentsList({
<ul role="list" className="space-y-4">
{documents
? documents.map((document) => {
return (
<DocumentCard
key={document.id}
document={document}
teamInfo={teamInfo}
/>
);
if (dataroomId) {
return (
<DataroomDocumentCard
key={document.id}
document={document as DataroomFolderDocument}
teamInfo={teamInfo}
/>
);
} else {
return (
<DocumentCard
key={document.id}
document={
document as DocumentWithLinksAndLinkCountAndViewCount
}
teamInfo={teamInfo}
/>
);
}
})
: Array.from({ length: 3 }).map((_, i) => (
<li
Expand Down
43 changes: 43 additions & 0 deletions components/upload-zone.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,7 @@ export default function UploadZone({
folderPathName,
setUploads,
setRejectedFiles,
dataroomId,
}: {
children: React.ReactNode;
onUploadStart: (
Expand All @@ -88,6 +89,7 @@ export default function UploadZone({
React.SetStateAction<{ fileName: string; message: string }[]>
>;
folderPathName?: string;
dataroomId?: string;
}) {
const analytics = useAnalytics();
const { plan, loading } = usePlan();
Expand Down Expand Up @@ -186,6 +188,46 @@ export default function UploadZone({
);

const document = await response.json();

if (dataroomId) {
try {
const response = await fetch(
`/api/teams/${teamInfo?.currentTeam?.id}/datarooms/${dataroomId}/documents`,
{
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
documentId: document.id,
folderPathName: folderPathName,
}),
},
);

if (!response.ok) {
const { message } = await response.json();
console.error(
"An error occurred while adding document to the dataroom: ",
message,
);
return;
}

mutate(
`/api/teams/${teamInfo?.currentTeam?.id}/datarooms/${dataroomId}/documents`,
);
mutate(
`/api/teams/${teamInfo?.currentTeam?.id}/datarooms/${dataroomId}/folders/documents/${folderPathName}`,
);
} catch (error) {
console.error(
"An error occurred while adding document to the dataroom: ",
error,
);
}
}

// update progress to 100%
onUploadProgress(index, 100, document.id);

Expand All @@ -197,6 +239,7 @@ export default function UploadZone({
type: document.type,
teamId: teamInfo?.currentTeam?.id,
bulkupload: true,
dataroomId: dataroomId,
});

return document;
Expand Down
84 changes: 8 additions & 76 deletions pages/datarooms/[id]/documents/[...name].tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,28 +4,21 @@ import { useTeam } from "@/context/team-context";
import { FileIcon, FolderIcon, FolderPlusIcon, PlusIcon } from "lucide-react";

import { BreadcrumbComponent } from "@/components/datarooms/dataroom-breadcrumb";
import DataroomDocumentCard from "@/components/datarooms/dataroom-document-card";
import { DataroomHeader } from "@/components/datarooms/dataroom-header";
import { SidebarFolderTree } from "@/components/datarooms/folders";
import { AddDocumentModal } from "@/components/documents/add-document-modal";
import DocumentCard from "@/components/documents/document-card";
import { EmptyDocuments } from "@/components/documents/empty-document";
import FolderCard from "@/components/documents/folder-card";
import { DocumentsList } from "@/components/documents/documents-list";
import { AddFolderModal } from "@/components/folders/add-folder-modal";
import AppLayout from "@/components/layouts/app";
import { NavMenu } from "@/components/navigation-menu";
import Folder from "@/components/shared/icons/folder";
import { Button } from "@/components/ui/button";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { Separator } from "@/components/ui/separator";
import { Skeleton } from "@/components/ui/skeleton";

import {
useDataroom,
useDataroomFolderDocuments,
useDataroomFolders,
} from "@/lib/swr/use-dataroom";
import useDocuments, { useRootFolders } from "@/lib/swr/use-documents";

export default function Documents() {
const router = useRouter();
Expand Down Expand Up @@ -131,77 +124,16 @@ export default function Documents() {
</p>
) : null}
</section>
{/* Folders list */}
<ul role="list" className="space-y-4">
{folders
? folders.map((folder) => {
return (
<FolderCard
key={folder.id}
folder={folder}
teamInfo={teamInfo}
isDataroom={true}
dataroomId={dataroom?.id}
/>
);
})
: Array.from({ length: 3 }).map((_, i) => (
<li
key={i}
className="relative flex w-full items-center space-x-3 rounded-lg border px-4 py-5 sm:px-6 lg:px-6"
>
<Skeleton key={i} className="h-9 w-9" />
<div>
<Skeleton key={i} className="h-4 w-32" />
<Skeleton key={i + 1} className="mt-2 h-3 w-12" />
</div>
<Skeleton
key={i + 1}
className="absolute right-5 top-[50%] h-5 w-20 -translate-y-[50%] transform"
/>
</li>
))}
</ul>

{/* Documents list */}
<ul role="list" className="space-y-4">
{documents
? documents.map((document) => {
return (
<DataroomDocumentCard
key={document.id}
document={document}
teamInfo={teamInfo}
/>
);
})
: Array.from({ length: 3 }).map((_, i) => (
<li
key={i}
className="relative flex w-full items-center space-x-3 rounded-lg border px-4 py-5 sm:px-6 lg:px-6"
>
<Skeleton key={i} className="h-9 w-9" />
<div>
<Skeleton key={i} className="h-4 w-32" />
<Skeleton key={i + 1} className="mt-2 h-3 w-12" />
</div>
<Skeleton
key={i + 1}
className="absolute right-5 top-[50%] h-5 w-20 -translate-y-[50%] transform"
/>
</li>
))}
</ul>
<DocumentsList
documents={documents}
folders={folders}
teamInfo={teamInfo}
folderPathName={name}
dataroomId={dataroom?.id}
/>
</div>
</div>

<div className="space-y-4">
{documents && documents.length === 0 && (
<div className="flex items-center justify-center">
<EmptyDocuments />
</div>
)}
</div>
</div>
</AppLayout>
);
Expand Down
82 changes: 7 additions & 75 deletions pages/datarooms/[id]/documents/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,14 @@ import { useTeam } from "@/context/team-context";
import { FileIcon, FolderIcon, FolderPlusIcon, PlusIcon } from "lucide-react";

import { BreadcrumbComponent } from "@/components/datarooms/dataroom-breadcrumb";
import DataroomDocumentCard from "@/components/datarooms/dataroom-document-card";
import { DataroomHeader } from "@/components/datarooms/dataroom-header";
import { SidebarFolderTree } from "@/components/datarooms/folders";
import { AddDocumentModal } from "@/components/documents/add-document-modal";
import DocumentCard from "@/components/documents/document-card";
import { EmptyDocuments } from "@/components/documents/empty-document";
import FolderCard from "@/components/documents/folder-card";
import { DocumentsList } from "@/components/documents/documents-list";
import { AddFolderModal } from "@/components/folders/add-folder-modal";
import AppLayout from "@/components/layouts/app";
import { NavMenu } from "@/components/navigation-menu";
import Folder from "@/components/shared/icons/folder";
import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { Skeleton } from "@/components/ui/skeleton";

import {
useDataroom,
Expand Down Expand Up @@ -120,77 +114,15 @@ export default function Documents() {
</p>
) : null}
</section>
{/* Folders list */}
<ul role="list" className="space-y-4">
{folders
? folders.map((folder) => {
return (
<FolderCard
key={folder.id}
folder={folder}
teamInfo={teamInfo}
isDataroom={true}
dataroomId={dataroom?.id}
/>
);
})
: Array.from({ length: 3 }).map((_, i) => (
<li
key={i}
className="relative flex w-full items-center space-x-3 rounded-lg border px-4 py-5 sm:px-6 lg:px-6"
>
<Skeleton key={i} className="h-9 w-9" />
<div>
<Skeleton key={i} className="h-4 w-32" />
<Skeleton key={i + 1} className="mt-2 h-3 w-12" />
</div>
<Skeleton
key={i + 1}
className="absolute right-5 top-[50%] h-5 w-20 -translate-y-[50%] transform"
/>
</li>
))}
</ul>

{/* Documents list */}
<ul role="list" className="space-y-4">
{documents
? documents.map((document) => {
return (
<DataroomDocumentCard
key={document.id}
document={document}
teamInfo={teamInfo}
/>
);
})
: Array.from({ length: 3 }).map((_, i) => (
<li
key={i}
className="relative flex w-full items-center space-x-3 rounded-lg border px-4 py-5 sm:px-6 lg:px-6"
>
<Skeleton key={i} className="h-9 w-9" />
<div>
<Skeleton key={i} className="h-4 w-32" />
<Skeleton key={i + 1} className="mt-2 h-3 w-12" />
</div>
<Skeleton
key={i + 1}
className="absolute right-5 top-[50%] h-5 w-20 -translate-y-[50%] transform"
/>
</li>
))}
</ul>
<DocumentsList
documents={documents}
folders={folders}
teamInfo={teamInfo}
dataroomId={dataroom?.id}
/>
</div>
</div>

<div className="space-y-4">
{documents && documents.length === 0 && (
<div className="flex items-center justify-center">
<EmptyDocuments />
</div>
)}
</div>
</div>
</AppLayout>
);
Expand Down

0 comments on commit ddd4e3e

Please sign in to comment.