React hooks

1
// [aruniverse/adblock-detect-react](https://github.com/aruniverse/adblock-detect-react/tree/master)
2
import { useEffect, useState } from "react";
3

4
export const useDetectAdBlock = () => {
5
 const [adBlockDetected, setAdBlockDetected] = useState(false);
6

7
 useEffect(() => {
8
  // grab a domain from https://github1s.com/gorhill/uBlock/blob/master/docs/tests/hostname-pool.js
9
  const url = "https://www3.doubleclick.net";
10
  fetch(url, {
11
   method: "HEAD",
12
   mode: "no-cors",
13
   cache: "no-store",
14
  })
15
   .then(({ redirected }) => {
16
    if (redirected) setAdBlockDetected(true);
17
   })
18
   .catch(() => {
19
    setAdBlockDetected(true);
20
   });
21
 }, []);
22

23
 return adBlockDetected;
24
};

1
import { useState } from "react";
2

3
type CopiedValue = string | null;
4
type CopyFn = (text: string) => Promise<boolean>;
5

6
export function useCopyToClipboard(): [CopiedValue, CopyFn] {
7
 const [copiedText, setCopiedText] = useState<CopiedValue>(null);
8

9
 const copy: CopyFn = async (text) => {
10
  if (!navigator?.clipboard) {
11
   console.warn("Clipboard not supported");
12
   return false;
13
  }
14

15
  // Try to save to clipboard then save it in the state if worked
16
  try {
17
   await navigator.clipboard.writeText(text);
18
   setCopiedText(text);
19
   return true;
20
  } catch (error) {
21
   console.warn("Copy failed", error);
22
   setCopiedText(null);
23
   return false;
24
  }
25
 };
26

27
 return [copiedText, copy];
28
}

1
// [フロントエンド開発者のためのハッシュ関数入門](https://zenn.dev/bosushi/articles/3353a1b28ef93b#5.-%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89%E3%81%A7%E3%81%AE%E3%83%8F%E3%83%83%E3%82%B7%E3%83%A5%E9%96%A2%E6%95%B0%E3%81%AE%E9%81%A9%E7%94%A8)
2

3
// 仮パスワードとハッシュ値を取得
4
// const params = new URLSearchParams(window.location.search);
5
// const temporaryPassword = params.get('tempPass');
6
// const hashedPassword = params.get('hash');
7

8
// ハッシュ関数（SHA-256）を用いて仮パスワードをハッシュ化
9
const encoder = new TextEncoder();
10
export async function getHash(tempPass: string) {
11
 const msgUint8 = encoder.encode(tempPass);
12
 const hashBuffer = await crypto.subtle.digest("SHA-256", msgUint8);
13
 const binaryArray = new Uint8Array(hashBuffer);
14
 const hashArray = Array.from(binaryArray);
15
 const hashedPass = hashArray
16
  .map((b) => b.toString(16).padStart(2, "0"))
17
  .join("");
18
 return hashedPass;
19
}
20

21
/**
22
 * compare password; if true, same
23
 * @param temporaryPassword
24
 * @param hashedPassword
25
 * @returns
26
 */
27
export async function comparePassword(
28
 temporaryPassword: string,
29
 hashedPassword: string,
30
) {
31
 const hashedTempPass = await getHash(temporaryPassword);
32
 return hashedTempPass === hashedPassword;
33
}
34

35
// getHash(temporaryPassword).then((hashedTempPass) => {
36
//   // 仮パスワードのハッシュ値とURLから取得したハッシュ値を比較
37
//   if(hashedTempPass === hashedPassword) {
38
//     // 新しいパスワードの入力と更新処理を実行
39
//     const newPassword = prompt("新しいパスワードを入力してください：");
40
//     // updatePassword(newPassword);  // updatePasswordはサーバーと通信してパスワードを更新する関数とする
41
//   } else {
42
//     alert("URLが無効です。");
43
//   }
44
// });