API: add abstract open_file method, implement open_file

pkgs/webview-ui/app/src/api.ts

@@ -12,11 +12,12 @@ export type SuccessData<T extends OperationNames> = Extract<
   { status: "success" }
 >;
 
+export type ClanOperations = {
+  [K in OperationNames]: (str: string) => void;
+};
 declare global {
   interface Window {
-    clan: {
-      [K in OperationNames]: (str: string) => void;
-    };
+    clan: ClanOperations;
     webkit: {
       messageHandlers: {
         gtk: {
@@ -29,6 +30,8 @@ declare global {
     };
   }
 }
+// Make sure window.webkit is defined although the type is not correctly filled yet.
+window.clan = {} as ClanOperations;
 
 function createFunctions<K extends OperationNames>(
   operationName: K
@@ -84,4 +87,11 @@ operationNames.forEach((opName) => {
   pyApi[name] = createFunctions(name);
 });
 
+pyApi.open_file.receive((r) => {
+  const { status } = r;
+  if (status === "error") return console.error(r.errors);
+  console.log(r.data);
+  alert(r.data);
+});
+
 export { pyApi };

pkgs/webview-ui/app/src/index.tsx

@@ -34,6 +34,6 @@ if (import.meta.env.DEV) {
     },
   };
 }
-
+postMessage;
 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
 render(() => <App />, root!);

pkgs/webview-ui/app/src/routes/machines/view.tsx

@@ -48,7 +48,12 @@ export const MachineListView: Component = () => {
         <button
           class="btn btn-ghost"
           onClick={() =>
-            pyApi.get_directory.dispatch({ current_path: "/home/" })
+            pyApi.open_file.dispatch({
+              file_request: {
+                title: "Open Clan",
+                mode: "select_folder",
+              },
+            })
           }
         >
           <span class="material-icons ">folder_open</span>