Support .db or .csv/.tsv files being dragged and dropped onto the app (or app icon)

[simonw]

Would be useful as a shortcut for opening files.

https://www.electronjs.org/docs/api/app#event-open-file-macos suggests this may be possible through listening to the open-file event:

Emitted when the user wants to open a file with the application. The open-file event is usually emitted when the application is already open and the OS wants to reuse the application to open the file. open-file is also emitted when a file is dropped onto the dock and the application is not yet running. Make sure to listen for the open-file event very early in your application startup to handle this case (even before the ready event is emitted).

[simonw]

I tried adding this:

app.on("open-file", (event, path) => {
  console.log("open-file:", event, path)
});
// Directly before this line:
app.whenReady().then(() => {

But the icon in the Dock (at least when running in npm start dev mode) doesn't accept dropped files. There must be something special I need to do to tell macOS that this icon accepts dropped files, but I don't know what that is.

[simonw]

This might turn out to be part of the work on #54.

[simonw]

Maybe this will start working if I add the 'open-file' event handler and run a proper build of the application?

No, tried that and it didn't make the icon a drop target.

[simonw]

On Windows it sounds like dragging a file to the icon will work differently - it will call the application itself and pass that file path as process.argv argument: https://stackoverflow.com/questions/57900693/electron-drag-and-drop-a-file-on-the-icon

I only care about macOS for the moment though.

[simonw]

This might be the answer! electron/electron#4403 (comment)

Second, I added a CFBundleDocumentTypes section to Mac app's Info.plist and listed the acceptable file types. (See https://developer.apple.com/library/ios/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html )

[simonw]

From electron-userland/electron-builder#3732 (comment) it looks like you can add things to Info.plist by populating the "extendInfo" key used by electrion-builder: https://www.electron.build/configuration/mac

GitHub code search has some examples: https://github.com/search?l=JSON&q=extendInfo+CFBundleDocumentTypes&type=Code

These examples look useful:

• https://github.com/alanzchen/jupyter-desktop/blob/946ba54bc7bc9297a9ef7a8f620c34caedf27932/package.json
• https://github.com/karino2/electron-textdeck/blob/c9ef8e9a4bdb69924b14d50cad15b29a5bcc1be3/package.json
• https://github.com/heilerich/actualmoney/blob/1e008525c75b8b1569b3cc57176999d10b9a70ed/package.json

[simonw]

This worked:

diff --git a/package.json b/package.json
index 9aa3db1..7ee237e 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,16 @@
     "appId": "io.datasette.app",
     "mac": {
       "category": "public.app-category.developer-tools",
+      "extendInfo": {
+        "CFBundleDocumentTypes": [
+          {
+            "CFBundleTypeExtensions": [
+              "csv", "tsv", "db"
+            ],
+            "LSHandlerRank": "Alternate"
+          }
+        ]
+      },
       "hardenedRuntime" : true,
       "gatekeeperAssess": false,
       "entitlements": "build/entitlements.mac.plist",

[simonw]

From #88 (comment)

One remaining catch: once I add the CFBundleDocumentTypes configuration from #40 it will be possible to drag a CSV or DB file onto the Datasette icon to launch the application and fire the event.

But... the current event code assumes that the server has already started up:

datasette-app/main.js

Lines 822 to 860 in 78b86be

	app.on("open-file", async (event, filepath) => {
	const first16 = await firstBytes(filepath, 16);
	if (first16.equals(SQLITE_HEADER)) {
	const response = await datasette.apiRequest("/-/open-database-file", {
	path: filepath,
	});
	const responseJson = await response.json();
	if (!responseJson.ok) {
	console.log(responseJson);
	dialog.showMessageBox({
	type: "error",
	message: "Error opening database file",
	detail: responseJson.error,
	});
	} else {
	setTimeout(() => {
	datasette.openPath(responseJson.path);
	});
	}
	return;
	}
	const response = await datasette.apiRequest("/-/open-csv-file", {
	path: filepath,
	});
	const responseJson = await response.json();
	if (!responseJson.ok) {
	console.log(responseJson);
	dialog.showMessageBox({
	type: "error",
	message: "Error opening CSV file",
	detail: responseJson.error,
	});
	} else {
	pathToOpen = responseJson.path;
	}
	setTimeout(() => {
	datasette.openPath(pathToOpen);
	});
	});

Need to handle the case where that event is fired before the server has had a chance to start.

[simonw]

After that last commit (and doing a proper application install) .db files on my computer are now showing the Datasette icon and double-clicking them opens them in Datasette!

(But only if Datasette is already open, I still need to fix it so the open-file event works if the server hasn't yet started).

Also .csv files are now showing Datasette in their "Open with" menu.

[mnckapilan]

Tangential to this issue but relevant to Windows (#71), Application Registration needs to be done on Windows in order for Datasette to be a viable .csv handler – and also for native recent files functionality in Windows Explorer to work.

Filed away for later when you look into Windows I guess.

[simonw]

Tested with this build https://github.com/simonw/datasette-app/actions/runs/1225528995 and while double-clicking a .db file or "Open in Datasette"-ing a CSV file did cause the Datasette application to open, the files were NOT attached once it had started up.

With Datasette open double-clicking or using "Open in Datasette" did work.

[simonw]

The build from https://github.com/simonw/datasette-app/actions/runs/1225558655 works!