Migrate all Javascript code to Typescript (#2)

* Migrate all Javascript code to Typescript

* Update function signature

* Bump version

* Clean code

Author: lilac

.gitignore

@@ -1,4 +1,5 @@
 control-compiled.js
+example/main-bundle.js
 .cache/
 dist/
 # Logs

control.d.ts

@@ -1,20 +1,21 @@
-import { ipcRenderer } from 'electron';
+import { WebPreferences, ipcRenderer } from 'electron';
+import { type TabID } from './index.js';
 
 // Used in Renderer process
 
 /**
  * Tell browser view to load url
  * @param {string} url
  */
-const sendEnterURL = url => ipcRenderer.send('url-enter', url);
+const sendEnterURL = (url: string) => ipcRenderer.send('url-enter', url);
 
 /**
  * Tell browser view url in address bar changed
  * @param {string} url
  */
-const sendChangeURL = url => ipcRenderer.send('url-change', url);
+const sendChangeURL = (url: string) => ipcRenderer.send('url-change', url);
 
-const sendAct = actName => {
+const sendAct = (actName: string) => {
   ipcRenderer.send('act', actName);
 };
 
@@ -38,20 +39,20 @@ const sendStop = () => sendAct('stop');
  * Tell browser view to close tab
  * @param {TabID} id
  */
-const sendCloseTab = id => ipcRenderer.send('close-tab', id);
+const sendCloseTab = (id: TabID) => ipcRenderer.send('close-tab', id);
 
 /**
  * Create a new tab
  * @param {string} [url]
  * @param {object} [references]
  */
-const sendNewTab = (url, references) => ipcRenderer.send('new-tab', url, references);
+const sendNewTab = (url?: string, references?: WebPreferences) => ipcRenderer.send('new-tab', url, references);
 
 /**
  * Tell browser view to switch to specified tab
  * @param {TabID} id
  */
-const sendSwitchTab = id => ipcRenderer.send('switch-tab', id);
+const sendSwitchTab = (id: TabID) => ipcRenderer.send('switch-tab', id);
 
 export default {
   sendEnterURL, // sendEnterURL(url) to load url

control.js renamed to control.ts

@@ -5,7 +5,7 @@ import { fileURLToPath } from 'url';
 
 const __dirname = fileURLToPath(new URL('.', import.meta.url));
 
-let browser;
+let browser: BrowserLikeWindow | null;
 
 function createWindow() {
   browser = new BrowserLikeWindow({

example/main.js renamed to example/main.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
 import { createRoot } from 'react-dom/client';
 import { ipcRenderer } from 'electron';
 import cx from 'classnames';
-import useConnect from '../../useConnect';
-import action from '../../control';
+import useConnect from '../../useConnect.js';
+
+import action from '../../control.js';
+import type { TabID } from '../../index.js';
 
 const IconLoading = () => (
   <svg
@@ -97,12 +97,12 @@ function Control() {
 
   const { url, canGoForward, canGoBack, isLoading } = tabs[activeID] || {};
 
-  const onUrlChange = e => {
+  const onUrlChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     // Sync to tab config
     const v = e.target.value;
     action.sendChangeURL(v);
   };
-  const onPressEnter = e => {
+  const onPressEnter = (e: React.KeyboardEvent<HTMLInputElement>) => {
     if (e.keyCode !== 13) return;
     const v = e.currentTarget.value.trim();
     if (!v) return;
@@ -113,14 +113,14 @@ function Control() {
     }
     action.sendEnterURL(href);
   };
-  const close = (e, id) => {
+  const close = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, id: any) => {
     e.stopPropagation();
     action.sendCloseTab(id);
   };
   const newTab = () => {
     action.sendNewTab();
   };
-  const switchTab = id => {
+  const switchTab = (id: TabID) => {
     action.sendSwitchTab(id);
   };
 
@@ -184,5 +184,5 @@ function Control() {
 }
 
 const container = document.getElementById('app');
-const root = createRoot(container);
+const root = createRoot(container!);
 root.render(<Control />);