remove all other uses of 'btn'
This commit is contained in:
parent
f9b0f0c813
commit
e6054c1d06
|
@ -126,7 +126,10 @@ export function AnswerBetPanel(props: {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{!isModal && (
|
{!isModal && (
|
||||||
<button className="btn-ghost btn-circle" onClick={closePanel}>
|
<button
|
||||||
|
className="hover:bg-greyscale-2 rounded-full"
|
||||||
|
onClick={closePanel}
|
||||||
|
>
|
||||||
<XIcon
|
<XIcon
|
||||||
className="mx-auto h-8 w-8 text-gray-500"
|
className="mx-auto h-8 w-8 text-gray-500"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
|
|
|
@ -10,6 +10,7 @@ import { ChooseCancelSelector } from '../yes-no-selector'
|
||||||
import { ResolveConfirmationButton } from '../confirmation-button'
|
import { ResolveConfirmationButton } from '../confirmation-button'
|
||||||
import { removeUndefinedProps } from 'common/util/object'
|
import { removeUndefinedProps } from 'common/util/object'
|
||||||
import { BETTOR, PAST_BETS } from 'common/user'
|
import { BETTOR, PAST_BETS } from 'common/user'
|
||||||
|
import { Button } from '../button'
|
||||||
|
|
||||||
export function AnswerResolvePanel(props: {
|
export function AnswerResolvePanel(props: {
|
||||||
isAdmin: boolean
|
isAdmin: boolean
|
||||||
|
@ -109,14 +110,14 @@ export function AnswerResolvePanel(props: {
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{resolveOption && (
|
{resolveOption && (
|
||||||
<button
|
<Button
|
||||||
className="btn btn-ghost"
|
color="gray-white"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setResolveOption(undefined)
|
setResolveOption(undefined)
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Clear
|
Clear
|
||||||
</button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<ResolveConfirmationButton
|
<ResolveConfirmationButton
|
||||||
|
|
|
@ -197,17 +197,15 @@ export function CreateAnswerPanel(props: { contract: FreeResponseContract }) {
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
{user ? (
|
{user ? (
|
||||||
<button
|
<Button
|
||||||
className={clsx(
|
color="green"
|
||||||
'btn mt-2',
|
size="lg"
|
||||||
canSubmit ? 'btn-outline' : 'btn-disabled',
|
loading={isSubmitting}
|
||||||
isSubmitting && 'loading'
|
|
||||||
)}
|
|
||||||
disabled={!canSubmit}
|
disabled={!canSubmit}
|
||||||
onClick={withTracking(submitAnswer, 'submit answer')}
|
onClick={withTracking(submitAnswer, 'submit answer')}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
</button>
|
</Button>
|
||||||
) : (
|
) : (
|
||||||
text && (
|
text && (
|
||||||
<Button
|
<Button
|
||||||
|
|
|
@ -64,7 +64,7 @@ export function CommentBountyDialog(props: {
|
||||||
|
|
||||||
<Row className={'items-center gap-2'}>
|
<Row className={'items-center gap-2'}>
|
||||||
<Button
|
<Button
|
||||||
className={clsx('ml-2', isLoading && 'btn-disabled')}
|
className="ml-2"
|
||||||
onClick={submit}
|
onClick={submit}
|
||||||
disabled={isLoading}
|
disabled={isLoading}
|
||||||
color={'blue'}
|
color={'blue'}
|
||||||
|
|
|
@ -93,9 +93,10 @@ export function CreatePost(props: { group?: Group }) {
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
type="submit"
|
type="submit"
|
||||||
loading={isSubmitting}
|
color="green"
|
||||||
size="xl"
|
size="xl"
|
||||||
disabled={isSubmitting || !isValid || upload.isLoading}
|
loading={isSubmitting}
|
||||||
|
disabled={!isValid || upload.isLoading}
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
setIsSubmitting(true)
|
setIsSubmitting(true)
|
||||||
await savePost(title)
|
await savePost(title)
|
||||||
|
|
|
@ -11,6 +11,7 @@ import { FilterSelectUsers } from 'web/components/filter-select-users'
|
||||||
import { User } from 'common/user'
|
import { User } from 'common/user'
|
||||||
import { useMemberIds } from 'web/hooks/use-group'
|
import { useMemberIds } from 'web/hooks/use-group'
|
||||||
import { Input } from '../input'
|
import { Input } from '../input'
|
||||||
|
import { Button } from '../button'
|
||||||
|
|
||||||
export function EditGroupButton(props: { group: Group; className?: string }) {
|
export function EditGroupButton(props: { group: Group; className?: string }) {
|
||||||
const { group, className } = props
|
const { group, className } = props
|
||||||
|
@ -40,14 +41,14 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={clsx('flex p-1', className)}>
|
<div className={clsx('flex p-1', className)}>
|
||||||
<div
|
<Button
|
||||||
className={clsx(
|
size="sm"
|
||||||
'btn-ghost cursor-pointer whitespace-nowrap rounded-md p-1 text-sm text-gray-700'
|
color="gray-white"
|
||||||
)}
|
className="whitespace-nowrap"
|
||||||
onClick={() => updateOpen(!open)}
|
onClick={() => updateOpen(!open)}
|
||||||
>
|
>
|
||||||
<PencilIcon className="inline h-4 w-4" /> Edit
|
<PencilIcon className="inline h-4 w-4" /> Edit
|
||||||
</div>
|
</Button>
|
||||||
<Modal open={open} setOpen={updateOpen}>
|
<Modal open={open} setOpen={updateOpen}>
|
||||||
<div className="h-full rounded-md bg-white p-8">
|
<div className="h-full rounded-md bg-white p-8">
|
||||||
<div className="form-control w-full">
|
<div className="form-control w-full">
|
||||||
|
@ -77,8 +78,9 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="modal-action">
|
<div className="modal-action">
|
||||||
<label
|
<Button
|
||||||
htmlFor="edit"
|
color="red"
|
||||||
|
size="xs"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
if (confirm('Are you sure you want to delete this group?')) {
|
if (confirm('Are you sure you want to delete this group?')) {
|
||||||
deleteGroup(group)
|
deleteGroup(group)
|
||||||
|
@ -86,30 +88,24 @@ export function EditGroupButton(props: { group: Group; className?: string }) {
|
||||||
router.replace('/groups')
|
router.replace('/groups')
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
className={clsx(
|
|
||||||
'btn btn-sm btn-outline mr-auto self-center hover:border-red-500 hover:bg-red-500'
|
|
||||||
)}
|
|
||||||
>
|
>
|
||||||
Delete
|
Delete
|
||||||
</label>
|
</Button>
|
||||||
<label
|
<Button
|
||||||
htmlFor="edit"
|
color="gray-white"
|
||||||
className={'btn'}
|
size="xs"
|
||||||
onClick={() => updateOpen(false)}
|
onClick={() => updateOpen(false)}
|
||||||
>
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</label>
|
</Button>
|
||||||
<label
|
<Button
|
||||||
className={clsx(
|
color="green"
|
||||||
'btn',
|
disabled={saveDisabled}
|
||||||
saveDisabled ? 'btn-disabled' : 'btn-primary',
|
loading={isSubmitting}
|
||||||
isSubmitting && 'loading'
|
|
||||||
)}
|
|
||||||
htmlFor="edit"
|
|
||||||
onClick={onSubmit}
|
onClick={onSubmit}
|
||||||
>
|
>
|
||||||
Save
|
Save
|
||||||
</label>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
|
@ -116,10 +116,7 @@ export function GroupPosts(props: { posts: Post[]; group: Group }) {
|
||||||
</Col>
|
</Col>
|
||||||
<Col>
|
<Col>
|
||||||
{user && (
|
{user && (
|
||||||
<Button
|
<Button onClick={() => setShowCreatePost(!showCreatePost)}>
|
||||||
className="btn-md"
|
|
||||||
onClick={() => setShowCreatePost(!showCreatePost)}
|
|
||||||
>
|
|
||||||
Add a Post
|
Add a Post
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
|
@ -432,7 +429,7 @@ export function GroupAbout(props: {
|
||||||
<CopyLinkButton
|
<CopyLinkButton
|
||||||
url={shareUrl}
|
url={shareUrl}
|
||||||
tracking="copy group share link"
|
tracking="copy group share link"
|
||||||
buttonClassName="btn-md rounded-l-none"
|
buttonClassName="rounded-l-none"
|
||||||
toastClassName={'-left-28 mt-1'}
|
toastClassName={'-left-28 mt-1'}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
|
@ -20,6 +20,7 @@ import { Row } from './layout/row'
|
||||||
import { Spacer } from './layout/spacer'
|
import { Spacer } from './layout/spacer'
|
||||||
import { BetSignUpPrompt } from './sign-up-prompt'
|
import { BetSignUpPrompt } from './sign-up-prompt'
|
||||||
import { track } from 'web/lib/service/analytics'
|
import { track } from 'web/lib/service/analytics'
|
||||||
|
import { Button } from './button'
|
||||||
|
|
||||||
export function NumericBetPanel(props: {
|
export function NumericBetPanel(props: {
|
||||||
contract: NumericContract
|
contract: NumericContract
|
||||||
|
@ -108,7 +109,7 @@ function NumericBuyPanel(props: {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const betDisabled = isSubmitting || !betAmount || !bucketChoice || error
|
const betDisabled = isSubmitting || !betAmount || !bucketChoice || !!error
|
||||||
|
|
||||||
const { newBet, newPool, newTotalShares, newTotalBets } = getNumericBetsInfo(
|
const { newBet, newPool, newTotalShares, newTotalBets } = getNumericBetsInfo(
|
||||||
value ?? 0,
|
value ?? 0,
|
||||||
|
@ -195,16 +196,14 @@ function NumericBuyPanel(props: {
|
||||||
<Spacer h={8} />
|
<Spacer h={8} />
|
||||||
|
|
||||||
{user && (
|
{user && (
|
||||||
<button
|
<Button
|
||||||
className={clsx(
|
disabled={betDisabled}
|
||||||
'btn flex-1',
|
color="green"
|
||||||
betDisabled ? 'btn-disabled' : 'btn-primary',
|
loading={isSubmitting}
|
||||||
isSubmitting ? 'loading' : ''
|
onClick={submitBet}
|
||||||
)}
|
|
||||||
onClick={betDisabled ? undefined : submitBet}
|
|
||||||
>
|
>
|
||||||
{isSubmitting ? 'Submitting...' : 'Submit'}
|
Submit
|
||||||
</button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{wasSubmitted && <div className="mt-4">Bet submitted!</div>}
|
{wasSubmitted && <div className="mt-4">Bet submitted!</div>}
|
||||||
|
|
|
@ -12,6 +12,7 @@ import { FilterSelectUsers } from 'web/components/filter-select-users'
|
||||||
import { getUser, updateUser } from 'web/lib/firebase/users'
|
import { getUser, updateUser } from 'web/lib/firebase/users'
|
||||||
import { TextButton } from 'web/components/text-button'
|
import { TextButton } from 'web/components/text-button'
|
||||||
import { UserLink } from 'web/components/user-link'
|
import { UserLink } from 'web/components/user-link'
|
||||||
|
import { Button } from './button'
|
||||||
|
|
||||||
export function ReferralsButton(props: {
|
export function ReferralsButton(props: {
|
||||||
user: User
|
user: User
|
||||||
|
@ -89,11 +90,9 @@ function ReferralsDialog(props: {
|
||||||
maxUsers={1}
|
maxUsers={1}
|
||||||
/>
|
/>
|
||||||
<Row className={'mt-0 justify-end'}>
|
<Row className={'mt-0 justify-end'}>
|
||||||
<button
|
<Button
|
||||||
className={
|
className={
|
||||||
referredBy.length === 0
|
referredBy.length === 0 ? 'hidden' : 'my-2 w-24'
|
||||||
? 'hidden'
|
|
||||||
: 'btn btn-primary btn-md my-2 w-24 normal-case'
|
|
||||||
}
|
}
|
||||||
disabled={referredBy.length === 0 || isSubmitting}
|
disabled={referredBy.length === 0 || isSubmitting}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
|
@ -114,7 +113,7 @@ function ReferralsDialog(props: {
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Save
|
Save
|
||||||
</button>
|
</Button>
|
||||||
</Row>
|
</Row>
|
||||||
<span className={'text-warning'}>
|
<span className={'text-warning'}>
|
||||||
{referredBy.length > 0 &&
|
{referredBy.length > 0 &&
|
||||||
|
|
|
@ -72,7 +72,6 @@ export function ResolutionPanel(props: {
|
||||||
className="mx-auto my-2"
|
className="mx-auto my-2"
|
||||||
selected={outcome}
|
selected={outcome}
|
||||||
onSelect={setOutcome}
|
onSelect={setOutcome}
|
||||||
btnClassName={isSubmitting ? 'btn-disabled' : ''}
|
|
||||||
/>
|
/>
|
||||||
<Spacer h={4} />
|
<Spacer h={4} />
|
||||||
<div>
|
<div>
|
||||||
|
|
|
@ -1,59 +0,0 @@
|
||||||
import { BinaryContract, PseudoNumericContract } from 'common/contract'
|
|
||||||
import { User } from 'common/user'
|
|
||||||
import { useUserContractBets } from 'web/hooks/use-user-bets'
|
|
||||||
import { useState } from 'react'
|
|
||||||
import { Col } from './layout/col'
|
|
||||||
import clsx from 'clsx'
|
|
||||||
import { SellSharesModal } from './sell-modal'
|
|
||||||
|
|
||||||
export function SellButton(props: {
|
|
||||||
contract: BinaryContract | PseudoNumericContract
|
|
||||||
user: User | null | undefined
|
|
||||||
sharesOutcome: 'YES' | 'NO' | undefined
|
|
||||||
shares: number
|
|
||||||
panelClassName?: string
|
|
||||||
}) {
|
|
||||||
const { contract, user, sharesOutcome, shares, panelClassName } = props
|
|
||||||
const userBets = useUserContractBets(user?.id, contract.id)
|
|
||||||
const [showSellModal, setShowSellModal] = useState(false)
|
|
||||||
const { mechanism, outcomeType } = contract
|
|
||||||
const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC'
|
|
||||||
|
|
||||||
if (sharesOutcome && user && mechanism === 'cpmm-1') {
|
|
||||||
return (
|
|
||||||
<Col className={'items-center'}>
|
|
||||||
<button
|
|
||||||
className={clsx(
|
|
||||||
'btn-sm w-24 gap-1',
|
|
||||||
// from the yes-no-selector:
|
|
||||||
'inline-flex items-center justify-center rounded-3xl border-2 p-2',
|
|
||||||
sharesOutcome === 'NO'
|
|
||||||
? 'hover:bg-primary-focus border-primary hover:border-primary-focus text-primary hover:text-white'
|
|
||||||
: 'border-red-400 text-red-500 hover:border-red-500 hover:bg-red-500 hover:text-white'
|
|
||||||
)}
|
|
||||||
onClick={() => setShowSellModal(true)}
|
|
||||||
>
|
|
||||||
Sell{' '}
|
|
||||||
{isPseudoNumeric
|
|
||||||
? { YES: 'HIGH', NO: 'LOW' }[sharesOutcome]
|
|
||||||
: sharesOutcome}
|
|
||||||
</button>
|
|
||||||
<div className={'mt-1 w-24 text-center text-sm text-gray-500'}>
|
|
||||||
{'(' + Math.floor(shares) + ' shares)'}
|
|
||||||
</div>
|
|
||||||
{showSellModal && (
|
|
||||||
<SellSharesModal
|
|
||||||
className={panelClassName}
|
|
||||||
contract={contract}
|
|
||||||
user={user}
|
|
||||||
userBets={userBets ?? []}
|
|
||||||
shares={shares}
|
|
||||||
sharesOutcome={sharesOutcome}
|
|
||||||
setOpen={setShowSellModal}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Col>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return <div />
|
|
||||||
}
|
|
|
@ -101,7 +101,7 @@ export function YesNoCancelSelector(props: {
|
||||||
<Button
|
<Button
|
||||||
color={selected === 'MKT' ? 'blue' : 'gray'}
|
color={selected === 'MKT' ? 'blue' : 'gray'}
|
||||||
onClick={() => onSelect('MKT')}
|
onClick={() => onSelect('MKT')}
|
||||||
className={clsx(btnClassName, 'btn-sm')}
|
className={btnClassName}
|
||||||
>
|
>
|
||||||
PROB
|
PROB
|
||||||
</Button>
|
</Button>
|
||||||
|
@ -109,7 +109,7 @@ export function YesNoCancelSelector(props: {
|
||||||
<Button
|
<Button
|
||||||
color={selected === 'CANCEL' ? 'yellow' : 'gray'}
|
color={selected === 'CANCEL' ? 'yellow' : 'gray'}
|
||||||
onClick={() => onSelect('CANCEL')}
|
onClick={() => onSelect('CANCEL')}
|
||||||
className={clsx(btnClassName, 'btn-sm')}
|
className={btnClassName}
|
||||||
>
|
>
|
||||||
N/A
|
N/A
|
||||||
</Button>
|
</Button>
|
||||||
|
|
|
@ -248,10 +248,10 @@ export function ContractPageContent(
|
||||||
ogCardProps={ogCardProps}
|
ogCardProps={ogCardProps}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<Col className="w-full justify-between rounded border-0 border-gray-100 bg-white py-6 pl-1 pr-2 sm:px-2 md:px-6 md:py-8">
|
<Col className="w-full justify-between rounded bg-white py-6 pl-1 pr-2 sm:px-2 md:px-6 md:py-8">
|
||||||
{backToHome && (
|
{backToHome && (
|
||||||
<button
|
<button
|
||||||
className="btn btn-sm mb-4 items-center gap-2 self-start border-0 border-gray-700 bg-white normal-case text-gray-700 hover:bg-white hover:text-gray-700 lg:hidden"
|
className="mb-4 items-center gap-2 self-start bg-white text-gray-700 lg:hidden"
|
||||||
onClick={backToHome}
|
onClick={backToHome}
|
||||||
>
|
>
|
||||||
<ArrowLeftIcon className="h-5 w-5 text-gray-700" />
|
<ArrowLeftIcon className="h-5 w-5 text-gray-700" />
|
||||||
|
|
|
@ -11,6 +11,7 @@ import { useAdmin } from 'web/hooks/use-admin'
|
||||||
import { contractPath } from 'web/lib/firebase/contracts'
|
import { contractPath } from 'web/lib/firebase/contracts'
|
||||||
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
||||||
import { firestoreConsolePath } from 'common/envs/constants'
|
import { firestoreConsolePath } from 'common/envs/constants'
|
||||||
|
import { Button } from 'web/components/button'
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/')
|
export const getServerSideProps = redirectIfLoggedOut('/')
|
||||||
|
|
||||||
|
@ -107,9 +108,7 @@ function UsersTable() {
|
||||||
limit: 25,
|
limit: 25,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<button className="btn" onClick={exportCsv}>
|
<Button onClick={exportCsv}>Export emails to CSV</Button>
|
||||||
Export emails to CSV
|
|
||||||
</button>
|
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,6 +23,7 @@ import { Donation } from 'web/components/charity/feed-items'
|
||||||
import { manaToUSD } from 'common/util/format'
|
import { manaToUSD } from 'common/util/format'
|
||||||
import { track } from 'web/lib/service/analytics'
|
import { track } from 'web/lib/service/analytics'
|
||||||
import { SEO } from 'web/components/SEO'
|
import { SEO } from 'web/components/SEO'
|
||||||
|
import { Button } from 'web/components/button'
|
||||||
|
|
||||||
export default function CharityPageWrapper() {
|
export default function CharityPageWrapper() {
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
@ -126,15 +127,13 @@ function Blurb({ text }: { text: string }) {
|
||||||
>
|
>
|
||||||
{text}
|
{text}
|
||||||
</div>
|
</div>
|
||||||
<button
|
<Button
|
||||||
|
color="indigo"
|
||||||
onClick={() => setOpen(!open)}
|
onClick={() => setOpen(!open)}
|
||||||
className={clsx(
|
className={clsx('my-3', hideExpander && 'invisible')}
|
||||||
'btn btn-link capitalize-none my-3 normal-case text-indigo-700',
|
|
||||||
hideExpander && 'invisible'
|
|
||||||
)}
|
|
||||||
>
|
>
|
||||||
{open ? 'Hide' : 'Read more'}
|
{open ? 'Hide' : 'Read more'}
|
||||||
</button>
|
</Button>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -175,7 +174,7 @@ function DonationBox(props: {
|
||||||
const [isSubmitting, setIsSubmitting] = useState(false)
|
const [isSubmitting, setIsSubmitting] = useState(false)
|
||||||
const [error, setError] = useState<string | undefined>()
|
const [error, setError] = useState<string | undefined>()
|
||||||
|
|
||||||
const donateDisabled = isSubmitting || !amount || error
|
const donateDisabled = isSubmitting || !amount || !!error
|
||||||
|
|
||||||
const onSubmit: React.FormEventHandler = async (e) => {
|
const onSubmit: React.FormEventHandler = async (e) => {
|
||||||
if (!user || donateDisabled) return
|
if (!user || donateDisabled) return
|
||||||
|
@ -230,16 +229,15 @@ function DonationBox(props: {
|
||||||
<Spacer h={8} />
|
<Spacer h={8} />
|
||||||
|
|
||||||
{user && (
|
{user && (
|
||||||
<button
|
<Button
|
||||||
type="submit"
|
type="submit"
|
||||||
className={clsx(
|
color="green"
|
||||||
'btn w-full',
|
className="w-full"
|
||||||
donateDisabled ? 'btn-disabled' : 'btn-primary',
|
disabled={donateDisabled}
|
||||||
isSubmitting && 'loading'
|
loading={isSubmitting}
|
||||||
)}
|
|
||||||
>
|
>
|
||||||
Donate
|
Donate
|
||||||
</button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -519,20 +519,18 @@ export function NewContract(props: {
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<button
|
<Button
|
||||||
type="submit"
|
type="submit"
|
||||||
className={clsx(
|
color="green"
|
||||||
'btn btn-primary normal-case',
|
loading={isSubmitting}
|
||||||
isSubmitting && 'loading disabled'
|
disabled={!isValid || upload.isLoading}
|
||||||
)}
|
|
||||||
disabled={isSubmitting || !isValid || upload.isLoading}
|
|
||||||
onClick={(e) => {
|
onClick={(e) => {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
submit()
|
submit()
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{isSubmitting ? 'Creating...' : 'Create question'}
|
{isSubmitting ? 'Creating...' : 'Create question'}
|
||||||
</button>
|
</Button>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
<Spacer h={6} />
|
<Spacer h={6} />
|
||||||
|
|
|
@ -3,11 +3,13 @@ import { PrivateUser, User } from 'common/user'
|
||||||
import { cleanDisplayName, cleanUsername } from 'common/util/clean-username'
|
import { cleanDisplayName, cleanUsername } from 'common/util/clean-username'
|
||||||
import Link from 'next/link'
|
import Link from 'next/link'
|
||||||
import React, { useState } from 'react'
|
import React, { useState } from 'react'
|
||||||
|
import { buttonClass } from 'web/components/button'
|
||||||
import { ConfirmationButton } from 'web/components/confirmation-button'
|
import { ConfirmationButton } from 'web/components/confirmation-button'
|
||||||
import { ExpandingInput } from 'web/components/expanding-input'
|
import { ExpandingInput } from 'web/components/expanding-input'
|
||||||
import { Input } from 'web/components/input'
|
import { Input } from 'web/components/input'
|
||||||
import { Col } from 'web/components/layout/col'
|
import { Col } from 'web/components/layout/col'
|
||||||
import { Row } from 'web/components/layout/row'
|
import { Row } from 'web/components/layout/row'
|
||||||
|
import { LoadingIndicator } from 'web/components/loading-indicator'
|
||||||
import { Page } from 'web/components/page'
|
import { Page } from 'web/components/page'
|
||||||
import { SEO } from 'web/components/SEO'
|
import { SEO } from 'web/components/SEO'
|
||||||
import { SiteLink } from 'web/components/site-link'
|
import { SiteLink } from 'web/components/site-link'
|
||||||
|
@ -129,14 +131,17 @@ export default function ProfilePage(props: {
|
||||||
<Col className="max-w-lg rounded bg-white p-6 shadow-md sm:mx-auto">
|
<Col className="max-w-lg rounded bg-white p-6 shadow-md sm:mx-auto">
|
||||||
<Row className="justify-between">
|
<Row className="justify-between">
|
||||||
<Title className="!mt-0" text="Edit Profile" />
|
<Title className="!mt-0" text="Edit Profile" />
|
||||||
<SiteLink className="btn btn-primary" href={`/${user.username}`}>
|
<SiteLink
|
||||||
|
className={buttonClass('md', 'green')}
|
||||||
|
href={`/${user.username}`}
|
||||||
|
>
|
||||||
Done
|
Done
|
||||||
</SiteLink>
|
</SiteLink>
|
||||||
</Row>
|
</Row>
|
||||||
<Col className="gap-4">
|
<Col className="gap-4">
|
||||||
<Row className="items-center gap-4">
|
<Row className="items-center gap-4">
|
||||||
{avatarLoading ? (
|
{avatarLoading ? (
|
||||||
<button className="btn btn-ghost btn-lg btn-circle loading"></button>
|
<LoadingIndicator />
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<img
|
<img
|
||||||
|
|
|
@ -50,7 +50,7 @@ export default function ReferralsPage() {
|
||||||
<CopyLinkButton
|
<CopyLinkButton
|
||||||
url={url}
|
url={url}
|
||||||
tracking="copy referral link"
|
tracking="copy referral link"
|
||||||
buttonClassName="btn-md rounded-l-none"
|
buttonClassName="rounded-l-none"
|
||||||
toastClassName={'-left-28 mt-1'}
|
toastClassName={'-left-28 mt-1'}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
|
@ -121,7 +121,7 @@ function TwitchPlaysManifoldMarkets(props: {
|
||||||
<Button
|
<Button
|
||||||
size="xl"
|
size="xl"
|
||||||
color="green"
|
color="green"
|
||||||
className="btn-disabled my-4 self-center !border-none"
|
className="my-4 self-center !border-none"
|
||||||
>
|
>
|
||||||
Account connected: {twitchUser}
|
Account connected: {twitchUser}
|
||||||
</Button>
|
</Button>
|
||||||
|
@ -331,25 +331,18 @@ function BotConnectButton(props: {
|
||||||
<Button
|
<Button
|
||||||
color="red"
|
color="red"
|
||||||
onClick={updateBotConnected(false)}
|
onClick={updateBotConnected(false)}
|
||||||
className={clsx(loading && '!btn-disabled', 'border-none')}
|
loading={loading}
|
||||||
>
|
>
|
||||||
{loading ? (
|
Remove bot from channel
|
||||||
<LoadingIndicator spinnerClassName="!h-5 !w-5 border-white !border-2" />
|
|
||||||
) : (
|
|
||||||
'Remove bot from channel'
|
|
||||||
)}
|
|
||||||
</Button>
|
</Button>
|
||||||
) : (
|
) : (
|
||||||
<Button
|
<Button
|
||||||
color="green"
|
color="green"
|
||||||
onClick={updateBotConnected(true)}
|
onClick={updateBotConnected(true)}
|
||||||
className={clsx(loading && '!btn-disabled', 'border-none')}
|
loading={loading}
|
||||||
|
className="border-none"
|
||||||
>
|
>
|
||||||
{loading ? (
|
Add bot to your channel
|
||||||
<LoadingIndicator spinnerClassName="!h-5 !w-5 border-white !border-2" />
|
|
||||||
) : (
|
|
||||||
'Add bot to your channel'
|
|
||||||
)}
|
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user