✨ [saya] コメントソース別にオミットできるように (#5)

Author: ci7lus

src/miraktest-saya/comment.ts

@@ -6,3 +6,15 @@ export const trimCommentForFlow = (s: string) => {
     .replace(/^\/nicoad.*/, "") // ニコニ広告削除
     .replace(/^\/\w+\s?/, "") // コマンド削除
 }
+
+export const classfySource = (s: string) => {
+  if (s.startsWith("5ch")) {
+    return "5ch"
+  } else if (s.startsWith("Twitter")) {
+    return "twitter"
+  } else if (s.startsWith("ニコニコ生放送")) {
+    return "nicojk"
+  } else {
+    return
+  }
+}

src/miraktest-saya/index.tsx

@@ -16,7 +16,7 @@ import { DPlayerCommentPayload } from "../miraktest-dplayer/types"
 import { ChatInput, PECORE_ID } from "../pecore"
 import { useRefFromState } from "../shared/utils"
 import tailwind from "../tailwind.scss"
-import { trimCommentForFlow } from "./comment"
+import { classfySource, trimCommentForFlow } from "./comment"
 import { SayaSetting } from "./types"
 
 /**
@@ -31,7 +31,7 @@ const meta = {
   id: _id,
   name: "Saya",
   author: "ci7lus",
-  version: "0.2.0",
+  version: "0.2.1",
   description:
     "Sayaからコメントを取得するプラグインです。対応するコメントレンダラープラグインが必要です。",
 }
@@ -45,6 +45,9 @@ const main: InitPlugin = {
         replaces: [],
         isEnabled: true,
         isTimeshiftEnabled: true,
+        isTwitterDisabled: false,
+        is5chDisabled: false,
+        isNicojkDisabled: false,
       },
     })
     const sayaUrlHistoryAtom = atom<string[]>({
@@ -194,6 +197,16 @@ const main: InitPlugin = {
                   setRawComment(payload)
                   const commentText = trimCommentForFlow(payload.text)
                   if (commentText.trim().length === 0) return
+                  const source = classfySource(payload.source)
+                  if (sayaSetting.isTwitterDisabled && source === "twitter") {
+                    return
+                  }
+                  if (sayaSetting.is5chDisabled && source === "5ch") {
+                    return
+                  }
+                  if (sayaSetting.isNicojkDisabled && source === "nicojk") {
+                    return
+                  }
                   if (isDplayerFound) {
                     const event = new CustomEvent(DPLAYER_COMMENT_EVENT, {
                       bubbles: false,
@@ -270,6 +283,15 @@ const main: InitPlugin = {
             const [repl2, setRepl2] = useState("")
             const [sayaHistoryUrl, setSayaHistoryUrl] =
               useRecoilState(sayaUrlHistoryAtom)
+            const [is5chDisabled, setIs5chDisabled] = useState(
+              sayaSetting.is5chDisabled
+            )
+            const [isTwitterDisabled, setIsTwitterDisabled] = useState(
+              sayaSetting.isTwitterDisabled
+            )
+            const [isNicojkDisabled, setIsNicojkDisabled] = useState(
+              sayaSetting.isNicojkDisabled
+            )
             return (
               <>
                 <style>{tailwind}</style>
@@ -294,6 +316,9 @@ const main: InitPlugin = {
                       replaces,
                       isEnabled,
                       isTimeshiftEnabled,
+                      is5chDisabled,
+                      isTwitterDisabled,
+                      isNicojkDisabled,
                     })
                   }}
                 >
@@ -396,6 +421,37 @@ const main: InitPlugin = {
                       </button>
                     </div>
                   </label>
+                  <label className="block mt-4">
+                    <span>Twitterを除外する</span>
+                    <input
+                      type="checkbox"
+                      className="block mt-2 form-checkbox"
+                      checked={isTwitterDisabled || false}
+                      onChange={() =>
+                        setIsTwitterDisabled((enabled) => !enabled)
+                      }
+                    />
+                  </label>
+                  <label className="block mt-4">
+                    <span>5chを除外する</span>
+                    <input
+                      type="checkbox"
+                      className="block mt-2 form-checkbox"
+                      checked={is5chDisabled || false}
+                      onChange={() => setIs5chDisabled((enabled) => !enabled)}
+                    />
+                  </label>
+                  <label className="block mt-4">
+                    <span>ニコニコ実況を除外する</span>
+                    <input
+                      type="checkbox"
+                      className="block mt-2 form-checkbox"
+                      checked={isNicojkDisabled || false}
+                      onChange={() =>
+                        setIsNicojkDisabled((enabled) => !enabled)
+                      }
+                    />
+                  </label>
                   <button
                     type="submit"
                     className="bg-gray-100 text-gray-800 p-2 px-2 my-4 rounded-md focus:outline-none cursor-pointer"

src/miraktest-saya/types.ts

@@ -3,4 +3,7 @@ export type SayaSetting = {
   replaces: [string, string][]
   isEnabled: boolean
   isTimeshiftEnabled: boolean
+  isTwitterDisabled: boolean
+  is5chDisabled: boolean
+  isNicojkDisabled: boolean
 }