import * as React from "react";
import * as ReactDOM from "react-dom";

class App extends React.Component {
  render() {
    return <div>Hello, world!</div>;
  }
}

ReactDOM.render(<App />, document.getElementById("app"));

import { observeTweets } from "./twitterObserver";
import { generateFriendlyReply } from "./chatGptApi";

function modifyReplies(element: HTMLElement): void {
  const aggressiveReplies = ["bad example reply 1", "bad example reply 2"]; // これらを攻撃的なリプライの判定方法に置き換えます

  aggressiveReplies.forEach(async (reply) => {
    const friendlyReply = await generateFriendlyReply(reply);
    element.innerHTML = element.innerHTML.replace(reply, friendlyReply);
  });
}

observeTweets(modifyReplies);

import { observeTweets } from "./twitterObserver";
import { generateFriendlyReply } from "./chatGptApi";

function modifyReplies(element: HTMLElement): void {
  const replyElements = element.querySelectorAll<HTMLElement>('div[data-testid="tweet"] > div > div > div > div > div > div[dir="auto"] > span');
  const aggressiveReplies: string[] = [];

  replyElements.forEach((replyElement) => {
    const replyText = replyElement.textContent;
    // ここで攻撃的なリプライかどうかを判断するロジックを追加し、条件に一致する場合、aggressiveRepliesに追加します
    if (isAggressive(replyText)) {
      aggressiveReplies.push(replyText);
    }
  });

  aggressiveReplies.forEach(async (reply) => {
    const friendlyReply = await generateFriendlyReply(reply);
    element.innerHTML = element.innerHTML.replace(reply, friendlyReply);
  });
}

function isAggressive(replyText: string): boolean {
  // ここで攻撃的なリプライかどうかを判断するロジックを実装します
  // 例えば、キーワードリストや感情分析APIを使用して判断することができます
  // この例では、簡単なキーワードリストを使用しています

  const aggressiveKeywords = ["bad", "hate", "idiot", "stupid"];
  return aggressiveKeywords.some((keyword) => replyText.includes(keyword));
}

observeTweets(modifyReplies);