Merge pull request #40 from hamachi25:formslink

googleフォームでブラウザ情報やバージョンが自動入力されるように

src/entrypoints/popup/App.tsx

@@ -2,20 +2,18 @@ import { settingsItem } from "@/utils/storage";
 import { GoLinkExternal } from "react-icons/go";
 import { Header } from "./components/Header";
 import { ToggleSetting } from "./components/ToggleSetting";
-
-const formsLinks = {
-	ja: "https://forms.gle/nWLZzi86qnWaAyEs7",
-	en: "https://forms.gle/viWPDzAzzwkVxjD18",
-};
+import { getBrowserInfo } from "./utils/getBrowserInfo";
+import { createFormsLink } from "./utils/createFormsLink";
 
 const lang = browser.i18n.getUILanguage();
-const formsLink = lang === "ja" ? formsLinks.ja : formsLinks.en;
+const { version } = browser.runtime.getManifest();
+const browserInfo = getBrowserInfo();
+const formsLink = createFormsLink({ lang, version, browserInfo });
 const isRTL = ["ar"].includes(lang);
 
 const App = () => {
 	const [openInNewTab, setOpenInNewTab] = useState(false);
 	const [isMute, setIsMute] = useState(false);
-	const { version } = browser.runtime.getManifest();
 
 	const handleNewtabCheckbox = () => {
 		setOpenInNewTab((prev) => {

src/entrypoints/popup/utils/createFormsLink.tsx

@@ -0,0 +1,36 @@
+interface Props {
+	lang: string;
+	version: string;
+	browserInfo: {
+		name: string | undefined;
+		version: string | undefined;
+	};
+}
+
+const FORMS_INFO = {
+	ja: {
+		url: "https://docs.google.com/forms/d/e/1FAIpQLSfMXVLOG1tSjL8qH4SabLLAvjW32OMZwqNMwDjbgXMW0-guZw/viewform?usp=dialog",
+		extVersion: "entry.1458562736",
+		browser: "entry.1879078577",
+	},
+	en: {
+		url: "https://docs.google.com/forms/d/e/1FAIpQLSfglmKh2bxsYzHX3IlpYUhkxCUVqUH-4eIQyFcceDDykM7uFw/viewform?usp=dialog",
+		extVersion: "entry.279573501",
+		browser: "entry.1405636948",
+	},
+};
+
+export const createFormsLink = ({ lang, version, browserInfo }: Props): string => {
+	const localizedFormsInfo = lang === "ja" ? FORMS_INFO.ja : FORMS_INFO.en;
+
+	const formsUrl = new URL(localizedFormsInfo.url);
+	formsUrl.searchParams.append(localizedFormsInfo.extVersion, version);
+	if (browserInfo.name && browserInfo.version) {
+		formsUrl.searchParams.append(
+			localizedFormsInfo.browser,
+			`${browserInfo.name} ${browserInfo.version}`,
+		);
+	}
+
+	return formsUrl.toString();
+};

src/entrypoints/popup/utils/getBrowserInfo.tsx

@@ -0,0 +1,32 @@
+export interface BrowserInfo {
+	name: string | undefined;
+	version: string | undefined;
+}
+
+export const getBrowserInfo = (): BrowserInfo => {
+	const ua = navigator.userAgent;
+	let name = undefined;
+	let version = undefined;
+
+	if (/Firefox\/\d+/i.test(ua)) {
+		name = "Firefox";
+		version = ua.match(/Firefox\/(\d+\.\d+)/i)?.[1] || undefined;
+	} else if (/Edg\/\d+/i.test(ua)) {
+		name = "Edge";
+		version = ua.match(/Edg\/(\d+\.\d+)/i)?.[1] || undefined;
+	} else if (/Opera|OPR\//.test(ua)) {
+		name = "Opera";
+		version = ua.match(/(?:Opera|OPR)\/(\d+\.\d+)/i)?.[1] || undefined;
+	} else if (/Vivaldi\/\d+/i.test(ua)) {
+		name = "Chrome";
+		version = ua.match(/Vivaldi\/(\d+\.\d+)/i)?.[1] || undefined;
+	} else if (/Chrome\/\d+/i.test(ua)) {
+		name = "Chrome";
+		version = ua.match(/Chrome\/(\d+\.\d+)/i)?.[1] || undefined;
+	}
+
+	return {
+		name,
+		version,
+	};
+};