From 2ce5c2f2b898469e3a51a09367bae9238231cd56 Mon Sep 17 00:00:00 2001
From: Munieru <20086673+munierujp@users.noreply.github.com>
Date: Sun, 22 May 2022 00:32:09 +0900
Subject: [PATCH] feat: add Yahoo! JAPAN as search engine (#236)

* empty commit

* Add TODO comments

* Add Yahoo! JAPAN

* Update styles
---
 README.md                                     |  1 +
 src/common/locales.ts                         |  3 +-
 src/common/search-engines.ts                  | 20 +++++++-
 src/locales/en.json.ts                        |  3 ++
 src/scripts/search-engines.ts                 |  2 +
 .../search-engines/yahoo-japan-desktop.ts     | 47 +++++++++++++++++++
 .../search-engines/yahoo-japan-mobile.ts      | 42 +++++++++++++++++
 src/scripts/search-engines/yahoo-japan.ts     | 15 ++++++
 8 files changed, 131 insertions(+), 2 deletions(-)
 create mode 100644 src/scripts/search-engines/yahoo-japan-desktop.ts
 create mode 100644 src/scripts/search-engines/yahoo-japan-mobile.ts
 create mode 100644 src/scripts/search-engines/yahoo-japan.ts

diff --git a/README.md b/README.md
index 97a95a9fa..83c58dde5 100644
--- a/README.md
+++ b/README.md
@@ -33,6 +33,7 @@ This extension is available in the below search engines.
 | Qwant (iOS)      | :heavy_check_mark: | :heavy_check_mark: | \*1                | :heavy_check_mark: |
 | Startpage        | :heavy_check_mark: |                    | :heavy_check_mark: | :heavy_check_mark: |
 | Startpage (iOS)  | :heavy_check_mark: |                    | :heavy_check_mark: | :heavy_check_mark: |
+| Yahoo! JAPAN     | :heavy_check_mark: |                    |                    |                    |
 
 \*1 Works only if you turn off "Always play videos on Qwant.com"
 
diff --git a/src/common/locales.ts b/src/common/locales.ts
index 31f6f220d..6a8ba2beb 100644
--- a/src/common/locales.ts
+++ b/src/common/locales.ts
@@ -127,7 +127,8 @@ export type MessageName =
   | 'searchEngines_duckduckgoName'
   | 'searchEngines_ecosiaName'
   | 'searchEngines_qwantName'
-  | 'searchEngines_startpageName';
+  | 'searchEngines_startpageName'
+  | 'searchEngines_yahooJapanName';
 
 export type MessageName1 =
   | 'error'
diff --git a/src/common/search-engines.ts b/src/common/search-engines.ts
index 955d33083..e0f40577c 100644
--- a/src/common/search-engines.ts
+++ b/src/common/search-engines.ts
@@ -1,6 +1,13 @@
 import { MessageName0 } from './locales';
 
-export type SearchEngineId = 'google' | 'bing' | 'duckduckgo' | 'ecosia' | 'qwant' | 'startpage';
+export type SearchEngineId =
+  | 'google'
+  | 'bing'
+  | 'duckduckgo'
+  | 'ecosia'
+  | 'qwant'
+  | 'startpage'
+  | 'yahooJapan';
 
 export type SearchEngine = {
   contentScripts: {
@@ -302,4 +309,15 @@ export const SEARCH_ENGINES: Readonly<Record<SearchEngineId, Readonly<SearchEngi
       name: 'searchEngines_startpageName',
     },
   },
+  yahooJapan: {
+    contentScripts: [
+      {
+        matches: ['https://search.yahoo.co.jp/search?*'],
+        runAt: 'document_idle',
+      },
+    ],
+    messageNames: {
+      name: 'searchEngines_yahooJapanName',
+    },
+  },
 };
diff --git a/src/locales/en.json.ts b/src/locales/en.json.ts
index 8d4d4d2da..01d3e28d7 100644
--- a/src/locales/en.json.ts
+++ b/src/locales/en.json.ts
@@ -401,4 +401,7 @@ exportAsMessages('_locales/en/messages.json', {
 
   // The localized name of Startpage.
   searchEngines_startpageName: 'Startpage.com',
+
+  // The localized name of Yahoo! JAPAN.
+  searchEngines_yahooJapanName: 'Yahoo! JAPAN',
 });
diff --git a/src/scripts/search-engines.ts b/src/scripts/search-engines.ts
index 5f00a53de..af6c28a60 100644
--- a/src/scripts/search-engines.ts
+++ b/src/scripts/search-engines.ts
@@ -4,6 +4,7 @@ import { ecosia } from './search-engines/ecosia';
 import { google } from './search-engines/google';
 import { qwant } from './search-engines/qwant';
 import { startpage } from './search-engines/startpage';
+import { yahooJapan } from './search-engines/yahoo-japan';
 import { SearchEngine, SearchEngineId } from './types';
 
 export const SEARCH_ENGINES: Readonly<Record<SearchEngineId, Readonly<SearchEngine>>> = {
@@ -13,4 +14,5 @@ export const SEARCH_ENGINES: Readonly<Record<SearchEngineId, Readonly<SearchEngi
   ecosia,
   qwant,
   startpage,
+  yahooJapan,
 };
diff --git a/src/scripts/search-engines/yahoo-japan-desktop.ts b/src/scripts/search-engines/yahoo-japan-desktop.ts
new file mode 100644
index 000000000..b843abaa5
--- /dev/null
+++ b/src/scripts/search-engines/yahoo-japan-desktop.ts
@@ -0,0 +1,47 @@
+import type { SerpHandler } from '../types';
+import { handleSerp } from './helpers';
+
+const webHandler = handleSerp({
+  globalStyle: {
+    '[data-ub-blocked="visible"]': {
+      backgroundColor: 'var(--ub-block-color, rgba(255, 192, 192, 0.5))',
+    },
+    '.ub-button': {
+      color: 'var(--ub-link-color, var(--color-link, #000d99))',
+      textDecoration: 'underline',
+    },
+    '.ub-button:hover': {
+      color: '#cc3434',
+    },
+  },
+  controlHandlers: [
+    {
+      target: '.Hits__item',
+      style: {
+        color: '#666',
+        marginLeft: '8px',
+      },
+    },
+  ],
+  entryHandlers: [
+    {
+      target: '.sw-CardBase',
+      url: '.sw-Card__titleInner',
+      title: '.sw-Card__titleMain',
+      actionTarget: '.sw-Card__floatContainer',
+      actionStyle: {
+        fontSize: '1.4rem',
+        lineHeight: 1.4,
+      },
+    },
+  ],
+});
+
+const handlers: Readonly<Record<string, SerpHandler | undefined>> = {
+  // Web
+  '/search': webHandler,
+};
+
+export const getDesktopSerpHandler = (path: string): SerpHandler | null => {
+  return handlers[path] ?? null;
+};
diff --git a/src/scripts/search-engines/yahoo-japan-mobile.ts b/src/scripts/search-engines/yahoo-japan-mobile.ts
new file mode 100644
index 000000000..b45b99026
--- /dev/null
+++ b/src/scripts/search-engines/yahoo-japan-mobile.ts
@@ -0,0 +1,42 @@
+import type { SerpHandler } from '../types';
+import { handleSerp } from './helpers';
+
+const webHandler = handleSerp({
+  globalStyle: {
+    '[data-ub-blocked="visible"]': {
+      backgroundColor: 'var(--ub-block-color, rgba(255, 192, 192, 0.5))',
+    },
+    '.ub-button': {
+      color: 'var(--ub-link-color, var(--color-link, #000d99))',
+    },
+  },
+  controlHandlers: [
+    {
+      target: '.SearchTool',
+      style: {
+        color: '#666',
+      },
+    },
+  ],
+  entryHandlers: [
+    {
+      target: '.sw-CardBase',
+      url: '.sw-Card__space',
+      title: '.sw-Card__titleMain',
+      actionTarget: '.sw-Card__floatContainer',
+      actionStyle: {
+        fontSize: '12px',
+        lineHeight: 1.6,
+      },
+    },
+  ],
+});
+
+const handlers: Readonly<Record<string, SerpHandler | undefined>> = {
+  // Web
+  '/search': webHandler,
+};
+
+export const getMobileSerpHandler = (path: string): SerpHandler | null => {
+  return handlers[path] ?? null;
+};
diff --git a/src/scripts/search-engines/yahoo-japan.ts b/src/scripts/search-engines/yahoo-japan.ts
new file mode 100644
index 000000000..ad0c87774
--- /dev/null
+++ b/src/scripts/search-engines/yahoo-japan.ts
@@ -0,0 +1,15 @@
+import mobile from 'is-mobile';
+import { SEARCH_ENGINES } from '../../common/search-engines';
+import type { SearchEngine } from '../types';
+import { getDesktopSerpHandler } from './yahoo-japan-desktop';
+import { getMobileSerpHandler } from './yahoo-japan-mobile';
+
+export const yahooJapan: Readonly<SearchEngine> = {
+  ...SEARCH_ENGINES.yahooJapan,
+  getSerpHandler() {
+    const { pathname } = new URL(window.location.href);
+    return mobile({ tablet: false })
+      ? getMobileSerpHandler(pathname)
+      : getDesktopSerpHandler(pathname);
+  },
+};