From ea5c526a77b6fcd59c0b5e2cdc1b3b77b861f65a Mon Sep 17 00:00:00 2001
From: Myles Scolnick <myles@marimo.io>
Date: Mon, 11 Nov 2024 21:55:34 -0500
Subject: [PATCH] improvement: add download to File Explorer (#2843)

Download a file from the file explorer
---
 .../editor/file-tree/file-explorer.tsx         | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/frontend/src/components/editor/file-tree/file-explorer.tsx b/frontend/src/components/editor/file-tree/file-explorer.tsx
index 9a91f514c01..9590b2b12da 100644
--- a/frontend/src/components/editor/file-tree/file-explorer.tsx
+++ b/frontend/src/components/editor/file-tree/file-explorer.tsx
@@ -30,6 +30,7 @@ import {
   Trash2Icon,
   UploadIcon,
   ViewIcon,
+  DownloadIcon,
 } from "lucide-react";
 import type { FileInfo } from "@/core/network/types";
 import {
@@ -64,6 +65,8 @@ import type { RequestingTree } from "./requesting-tree";
 import type { FilePath } from "@/utils/paths";
 import useEvent from "react-use-event-hook";
 import { copyToClipboard } from "@/utils/copy";
+import { sendFileDetails } from "@/core/network/requests";
+import { downloadBlob } from "@/utils/download";
 
 const RequestingTreeContext = React.createContext<RequestingTree | null>(null);
 
@@ -492,6 +495,21 @@ const Node = ({ node, style, dragHandle }: NodeRendererProps<FileInfo>) => {
           </>
         )}
         <DropdownMenuSeparator />
+        {!node.data.isDirectory && (
+          <>
+            <DropdownMenuItem
+              onSelect={async () => {
+                const details = await sendFileDetails({ path: node.data.path });
+                const contents = details.contents || "";
+                downloadBlob(new Blob([contents]), node.data.name);
+              }}
+            >
+              <DownloadIcon {...iconProps} />
+              Download
+            </DropdownMenuItem>
+            <DropdownMenuSeparator />
+          </>
+        )}
         <DropdownMenuItem onSelect={handleDeleteFile} variant="danger">
           <Trash2Icon {...iconProps} />
           Delete