From d7221d79bcaa0cadf5efe36bbf6077fcbac8cb02 Mon Sep 17 00:00:00 2001
From: tiddlygit-test <linonetwo012@gmail.com>
Date: Fri, 5 Feb 2021 00:57:34 +0800
Subject: [PATCH] refactor: Find In Page

---
 src/components/main/find-in-page.tsx       | 26 +++++-----
 src/components/main/workspace-selector.tsx | 12 +++--
 src/listeners/index.ts                     |  4 +-
 src/services/windows/index.ts              | 55 +++++++++++-----------
 src/services/windows/interface.ts          |  4 ++
 5 files changed, 54 insertions(+), 47 deletions(-)

diff --git a/src/components/main/find-in-page.tsx b/src/components/main/find-in-page.tsx
index 0a25dfef..03035808 100644
--- a/src/components/main/find-in-page.tsx
+++ b/src/components/main/find-in-page.tsx
@@ -4,7 +4,7 @@ import TextField from '@material-ui/core/TextField';
 import Typography from '@material-ui/core/Typography';
 import connectComponent from '../../helpers/connect-component';
 import { closeFindInPage, updateFindInPageText } from '../../state/find-in-page/actions';
-import { requestFindInPage, requestStopFindInPage } from '../../senders';
+
 const styles = (theme: any) => ({
   root: {
     background: theme.palette.background.default,
@@ -37,9 +37,7 @@ const FindInPage = (props: FindInPageProps) => {
   // Event handler utilizing useCallback ...
   // ... so that reference never changes.
   const handleOpenFindInPage = useCallback(() => {
-    // @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
     inputReference.current.focus();
-    // @ts-expect-error ts-migrate(2531) FIXME: Object is possibly 'null'.
     inputReference.current.select();
   }, [inputReference]);
   useEffect(() => {
@@ -74,20 +72,18 @@ const FindInPage = (props: FindInPageProps) => {
             const value = e.target.value;
             onUpdateFindInPageText(value);
             if (value.length > 0) {
-              requestFindInPage(value, true);
+              void window.service.window.findInPage(value, true);
             } else {
-              // @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
-              requestStopFindInPage();
+              void window.service.window.stopFindInPage();
             }
           }}
           onInput={(e) => {
             const value = (e.target as any).value;
             onUpdateFindInPageText(value);
             if (value.length > 0) {
-              requestFindInPage(value, true);
+              void window.service.window.findInPage(value, true);
             } else {
-              // @ts-expect-error ts-migrate(2554) FIXME: Expected 1 arguments, but got 0.
-              requestStopFindInPage();
+              void window.service.window.stopFindInPage();
             }
           }}
           onKeyDown={(e) => {
@@ -95,12 +91,12 @@ const FindInPage = (props: FindInPageProps) => {
               // Enter
               const value = (e.target as any).value;
               if (value.length > 0) {
-                requestFindInPage(value, true);
+                void window.service.window.findInPage(value, true);
               }
             }
             if ((e.keyCode || e.which) === 27) {
               // Escape
-              requestStopFindInPage(true);
+              void window.service.window.stopFindInPage(true);
               onCloseFindInPage();
             }
           }}
@@ -111,7 +107,7 @@ const FindInPage = (props: FindInPageProps) => {
         disabled={text.length < 1 || matches < 1}
         onClick={() => {
           if (text.length > 0) {
-            requestFindInPage(text, false);
+            void window.service.window.findInPage(text, false);
           }
         }}>
         Previous
@@ -121,7 +117,7 @@ const FindInPage = (props: FindInPageProps) => {
         disabled={text.length < 1 || matches < 1}
         onClick={() => {
           if (text.length > 0) {
-            requestFindInPage(text, true);
+            void window.service.window.findInPage(text, true);
           }
         }}>
         Next
@@ -131,7 +127,7 @@ const FindInPage = (props: FindInPageProps) => {
         disabled={text.length < 1}
         onClick={() => {
           if (text.length > 0) {
-            requestFindInPage(text, true);
+            void window.service.window.findInPage(text, true);
           }
         }}>
         Find
@@ -139,7 +135,7 @@ const FindInPage = (props: FindInPageProps) => {
       <Button
         size="small"
         onClick={() => {
-          requestStopFindInPage(true);
+          void window.service.window.stopFindInPage(true);
           onCloseFindInPage();
         }}>
         Close
diff --git a/src/components/main/workspace-selector.tsx b/src/components/main/workspace-selector.tsx
index d6f63210..cd6134e3 100644
--- a/src/components/main/workspace-selector.tsx
+++ b/src/components/main/workspace-selector.tsx
@@ -1,9 +1,9 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
 import Badge from '@material-ui/core/Badge';
 import connectComponent from '../../helpers/connect-component';
-import { getBaseName } from '../../senders';
+import { getBaseName } from '@/senders';
 // @ts-expect-error ts-migrate(2307) FIXME: Cannot find module '../../images/default-icon.png'... Remove this comment to see the full error message
 import defaultIcon from '../../images/default-icon.png';
 const styles = (theme: any) => ({
@@ -113,7 +113,13 @@ function WorkspaceSelector({
   workspaceName,
 }: Props) {
   const { t } = useTranslation();
-  const shortWorkspaceName = workspaceName ? getBaseName(workspaceName) : t('WorkspaceSelector.BadWorkspacePath');
+  const [shortWorkspaceName, shortWorkspaceNameSetter] = useState<string>(t('Loading'));
+  useEffect(() => {
+    void (async () => {
+      // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+      shortWorkspaceNameSetter(workspaceName ? await getBaseName(workspaceName) : t('WorkspaceSelector.BadWorkspacePath'));
+    });
+  }, []);
   return (
     <div
       role="button"
diff --git a/src/listeners/index.ts b/src/listeners/index.ts
index 1d149d54..613a1aed 100755
--- a/src/listeners/index.ts
+++ b/src/listeners/index.ts
@@ -15,7 +15,7 @@ import {
 import { closeFindInPage, openFindInPage, updateFindInPageMatches } from '../state/find-in-page/actions';
 import { updatePauseNotificationsInfo } from '../state/notifications/actions';
 import { updateUpdater } from '../state/updater/actions';
-import { getShouldUseDarkColors, requestFindInPage, signalOnlineStatusChanged } from '../senders';
+import { getShouldUseDarkColors, signalOnlineStatusChanged } from '../senders';
 
 const loadListeners = (store: any) => {
   const { ipcRenderer } = window.remote;
@@ -93,7 +93,7 @@ const loadListeners = (store: any) => {
   ipcRenderer.on('request-back-find-in-page', (_event: Electron.IpcRendererEvent, forward: any) => {
     const { open, text } = store.getState().findInPage;
     if (!open) return;
-    requestFindInPage(text, forward);
+    void window.service.window.findInPage(text, forward);
   });
 
   ipcRenderer.on('should-pause-notifications-changed', (_event: Electron.IpcRendererEvent, value: any) => {
diff --git a/src/services/windows/index.ts b/src/services/windows/index.ts
index 35f02fce..338c34ee 100644
--- a/src/services/windows/index.ts
+++ b/src/services/windows/index.ts
@@ -39,33 +39,6 @@ export class Window implements IWindowService {
   }
 
   initIPCHandlers(): void {
-    ipcMain.handle('request-find-in-page', (_event, text: string, forward?: boolean, windowName: WindowNames = WindowNames.main) => {
-      const mainWindow = this.get(windowName);
-      const contents = mainWindow?.getBrowserView()?.webContents;
-      if (contents !== undefined) {
-        contents.findInPage(text, {
-          forward,
-        });
-      }
-    });
-    ipcMain.handle('request-stop-find-in-page', (_event, close?: boolean, windowName: WindowNames = WindowNames.main) => {
-      const mainWindow = this.get(windowName);
-      const view = mainWindow?.getBrowserView();
-      // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
-      if (view) {
-        const contents = view.webContents;
-        if (contents !== undefined) {
-          contents.stopFindInPage('clearSelection');
-          contents.send('update-find-in-page-matches', 0, 0);
-          // adjust bounds to hide the gap for find in page
-          if (close === true && mainWindow !== undefined) {
-            const contentSize = mainWindow.getContentSize();
-            view.setBounds(getViewBounds(contentSize as [number, number]));
-          }
-        }
-      }
-    });
-
     ipcMain.handle('request-show-display-media-window', (_event: Electron.IpcMainInvokeEvent) => {
       const viewID = BrowserWindow.fromWebContents(_event.sender)?.id;
       if (viewID !== undefined) {
@@ -76,6 +49,34 @@ export class Window implements IWindowService {
     });
   }
 
+  public findInPage(text: string, forward?: boolean, windowName: WindowNames = WindowNames.main): void {
+    const mainWindow = this.get(windowName);
+    const contents = mainWindow?.getBrowserView()?.webContents;
+    if (contents !== undefined) {
+      contents.findInPage(text, {
+        forward,
+      });
+    }
+  }
+
+  public stopFindInPage(close?: boolean, windowName: WindowNames = WindowNames.main): void {
+    const mainWindow = this.get(windowName);
+    const view = mainWindow?.getBrowserView();
+    // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+    if (view) {
+      const contents = view.webContents;
+      if (contents !== undefined) {
+        contents.stopFindInPage('clearSelection');
+        contents.send('update-find-in-page-matches', 0, 0);
+        // adjust bounds to hide the gap for find in page
+        if (close === true && mainWindow !== undefined) {
+          const contentSize = mainWindow.getContentSize();
+          view.setBounds(getViewBounds(contentSize as [number, number]));
+        }
+      }
+    }
+  }
+
   public async requestShowRequireRestartDialog(): Promise<void> {
     const availableWindowToShowDialog = this.get(WindowNames.preferences) ?? this.get(WindowNames.main);
     if (availableWindowToShowDialog !== undefined) {
diff --git a/src/services/windows/interface.ts b/src/services/windows/interface.ts
index c3fdf4ef..bb5f1bfe 100644
--- a/src/services/windows/interface.ts
+++ b/src/services/windows/interface.ts
@@ -20,6 +20,8 @@ export interface IWindowService {
   goForward(windowName: WindowNames): void;
   reload(windowName: WindowNames): void;
   showMessageBox(message: Electron.MessageBoxOptions['message'], type?: Electron.MessageBoxOptions['type']): void;
+  findInPage(text: string, forward?: boolean | undefined, windowName?: WindowNames): void;
+  stopFindInPage(close?: boolean | undefined, windowName?: WindowNames): void;
 }
 export const WindowServiceIPCDescriptor = {
   channel: WindowChannel.name,
@@ -37,5 +39,7 @@ export const WindowServiceIPCDescriptor = {
     goForward: ProxyPropertyType.Function,
     reload: ProxyPropertyType.Function,
     showMessageBox: ProxyPropertyType.Function,
+    findInPage: ProxyPropertyType.Function,
+    stopFindInPage: ProxyPropertyType.Function,
   },
 };