stoneFree/bingo

1import { useEffect, useState } from 'react'2import { useAtom } from 'jotai'3import { Switch } from '@headlessui/react'4import { toast } from 'react-hot-toast'5import { hashAtom, voiceAtom } from '@/state'6import {7  Dialog,8  DialogContent,9  DialogDescription,10  DialogFooter,11  DialogHeader,12  DialogTitle13} from '@/components/ui/dialog'14import { Button } from './ui/button'15import { Input } from './ui/input'16import { ChunkKeys, parseCookies, extraCurlFromCookie, randomIP, encodeHeadersToCookie } from '@/lib/utils'17import { ExternalLink } from './external-link'18import { useCopyToClipboard } from '@/lib/hooks/use-copy-to-clipboard'19 20export function Settings() {21  const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2000 })22  const [loc, setLoc] = useAtom(hashAtom)23  const [curlValue, setCurlValue] = useState(extraCurlFromCookie(parseCookies(document.cookie, ChunkKeys)))24  const [enableTTS, setEnableTTS] = useAtom(voiceAtom)25 26  useEffect(() => {27    if (isCopied) {28      toast.success('复制成功')29    }30  }, [isCopied])31 32  if (loc === 'settings') {33    return (34      <Dialog open onOpenChange={() => setLoc('')} modal>35        <DialogContent>36          <DialogHeader>37            <DialogTitle>设置你的用户信息</DialogTitle>38            <DialogDescription>39              请使用 Edge 浏览器40              <ExternalLink41                href="https://www.bing.com/turing/captcha/challenge"42              >43                打开并登录 Bing44              </ExternalLink>45              ，然后再打开46              <ExternalLink href="https://www.bing.com/turing/captcha/challenge">Challenge 接口</ExternalLink>47              右键 》检查。打开开发者工具，在网络里面找到 Create 接口 》右键复制》复制为 cURL(bash)，粘贴到此处，然后保存。48              <div className="h-2" />49              图文示例：50              <ExternalLink href="https://github.com/weaigc/bingo#如何获取%20BING_HEADER">如何获取 BING_HEADER</ExternalLink>51            </DialogDescription>52          </DialogHeader>53          <div className="flex gap-4">54 55          </div>56          <Input57            value={curlValue}58            placeholder="在此填写用户信息，格式: curl 'https://www.bing.com/turing/captcha/challenge' ..."59            onChange={e => setCurlValue(e.target.value)}60          />61          <Button variant="ghost" className="bg-[#F5F5F5] hover:bg-[#F2F2F2]" onClick={() => copyToClipboard(btoa(curlValue))}>62            转成 BING_HEADER 并复制63          </Button>64 65          <DialogFooter className="items-center">66            <Button67              variant="secondary"68              className="bg-[#c7f3ff] hover:bg-[#fdc7ff]"69              onClick={() => {70                let headerValue = curlValue71                if (headerValue) {72                  try {73                    headerValue = atob(headerValue)74                  } catch (e) {}75                  if (!/^\s*curl ['"]https:\/\/www\.bing\.com\/turing\/captcha\/challenge['"]/.test(headerValue)) {76                    toast.error('格式不正确')77                    return78                  }79                  const maxAge = 86400 * 3080                  encodeHeadersToCookie(headerValue).forEach(cookie => document.cookie = `${cookie}; Max-Age=${maxAge}; Path=/; SameSite=None; Secure`)81                } else {82                  [...ChunkKeys, 'BING_COOKIE', 'BING_UA', 'BING_IP'].forEach(key => document.cookie = `${key}=; Path=/; SameSite=None; Secure`)83                }84 85                toast.success('保存成功')86                setLoc('')87                setTimeout(() => {88                  location.href = './'89                }, 2000)90              }}91            >92              保存93            </Button>94          </DialogFooter>95        </DialogContent>96      </Dialog>97    )98  } else if (loc === 'voice') {99    return (100      <Dialog open onOpenChange={() => setLoc('')} modal>101        <DialogContent>102          <DialogHeader>103            <DialogTitle>语音设置</DialogTitle>104            <DialogDescription>105              目前仅支持 PC 端 Edge 及 Chrome 浏览器106            </DialogDescription>107          </DialogHeader>108 109          <div className="flex gap-2">110            启用语音回答111            <Switch112              checked={enableTTS}113              className={`${enableTTS ? 'bg-blue-600' : 'bg-gray-200'} relative inline-flex h-6 w-11 items-center rounded-full`}114              onChange={(checked: boolean) => setEnableTTS(checked)}115            >116              <span117                className={`${enableTTS ? 'translate-x-6' : 'translate-x-1'} inline-block h-4 w-4 transform rounded-full bg-white transition`}118              />119            </Switch>120          </div>121 122          <DialogFooter className="items-center">123            <Button124              variant="secondary"125              onClick={() => {126                toast.success('保存成功')127                setLoc('')128                setTimeout(() => {129                  location.href = './'130                }, 2000)131              }}132            >133              保存134            </Button>135          </DialogFooter>136        </DialogContent>137      </Dialog>138    )139  }140  return null141}142