Better IPC API declaration for TS

- Changed the preload script and global TS definitions to get APIs declare in
module `preload/ipc-api` automatically instead of writting the TS definitions
manually.

Author: iamWing

src/preload/ipc-api.ts

@@ -0,0 +1,9 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { ipcRenderer } from 'electron';
+
+/** Notify main the renderer is ready. */
+function rendererReady() {
+  ipcRenderer.send('renderer-ready');
+}
+
+export default { rendererReady };

src/preload/preload.ts

@@ -1,7 +1,5 @@
+import ipcAPI from '_preload/ipc-api';
 // eslint-disable-next-line import/no-extraneous-dependencies
-import { ipcRenderer, contextBridge } from 'electron';
+import { contextBridge } from 'electron';
 
-contextBridge.exposeInMainWorld('api', {
-  /** Notify main the renderer is ready. */
-  rendererReady: () => { ipcRenderer.send('renderer-ready'); },
-});
+contextBridge.exposeInMainWorld('ipcAPI', ipcAPI);

src/renderer/App.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 
 function App(): JSX.Element {
   React.useEffect(() => {
-    window.api?.rendererReady();
+    window.ipcAPI?.rendererReady();
   }, []);
 
   return (

src/types/global.d.ts

@@ -1,9 +1,7 @@
 declare global {
   interface Window {
     /** APIs for Electron IPC */
-    api?: {
-      rendererReady: () => void,
-    }
+    ipcAPI?: typeof import('_preload/ipc-api').default
   }
 }