diff --git a/common/user.ts b/common/user.ts index eb17d403..26d531cf 100644 --- a/common/user.ts +++ b/common/user.ts @@ -67,6 +67,7 @@ export type PrivateUser = { twitchInfo?: { twitchName: string controlToken: string + botEnabled?: boolean } } diff --git a/web/components/profile/twitch-panel.tsx b/web/components/profile/twitch-panel.tsx index 8415a06e..4d886fb9 100644 --- a/web/components/profile/twitch-panel.tsx +++ b/web/components/profile/twitch-panel.tsx @@ -1,22 +1,44 @@ import clsx from 'clsx' -import React, { useState } from 'react' +import React, { MouseEventHandler, ReactNode, useState } from 'react' import toast from 'react-hot-toast' import { copyToClipboard } from 'web/lib/util/copy' -import { linkTwitchAccount } from 'web/lib/twitch/link-twitch-account' +import { linkTwitchAccountRedirect } from 'web/lib/twitch/link-twitch-account' import { LinkIcon } from '@heroicons/react/solid' import { track } from 'web/lib/service/analytics' -import { Button } from './../button' +import { Button, ColorType } from './../button' import { LoadingIndicator } from './../loading-indicator' import { Row } from './../layout/row' import { usePrivateUser, useUser } from 'web/hooks/use-user' +import { updatePrivateUser } from 'web/lib/firebase/users' +import { deleteField } from 'firebase/firestore' + +function BouncyButton(props: { + children: ReactNode + onClick?: MouseEventHandler + color?: ColorType +}) { + const { children, onClick, color } = props + return ( + + ) +} export function TwitchPanel() { const user = useUser() const privateUser = usePrivateUser() + const twitchInfo = privateUser?.twitchInfo const twitchName = privateUser?.twitchInfo?.twitchName const twitchToken = privateUser?.twitchInfo?.controlToken + const twitchBotConnected = privateUser?.twitchInfo?.botEnabled const linkIcon =