Better UI for adding / removing groups
This commit is contained in:
parent
e9870acf41
commit
17ac42450c
|
@ -260,5 +260,6 @@ export async function listMemberIds(group: Group) {
|
||||||
|
|
||||||
export const topFollowedGroupsQuery = query(
|
export const topFollowedGroupsQuery = query(
|
||||||
groups,
|
groups,
|
||||||
|
where('anyoneCanJoin', '==', true),
|
||||||
orderBy('totalMembers', 'desc')
|
orderBy('totalMembers', 'desc')
|
||||||
)
|
)
|
||||||
|
|
|
@ -4,8 +4,8 @@ import {
|
||||||
AdjustmentsIcon,
|
AdjustmentsIcon,
|
||||||
PencilAltIcon,
|
PencilAltIcon,
|
||||||
ArrowSmRightIcon,
|
ArrowSmRightIcon,
|
||||||
DotsHorizontalIcon,
|
|
||||||
} from '@heroicons/react/solid'
|
} from '@heroicons/react/solid'
|
||||||
|
import { XCircleIcon } from '@heroicons/react/outline'
|
||||||
import clsx from 'clsx'
|
import clsx from 'clsx'
|
||||||
|
|
||||||
import { Page } from 'web/components/page'
|
import { Page } from 'web/components/page'
|
||||||
|
@ -41,12 +41,12 @@ import { useProbChanges } from 'web/hooks/use-prob-changes'
|
||||||
import { ProfitBadge } from 'web/components/bets-list'
|
import { ProfitBadge } from 'web/components/bets-list'
|
||||||
import { calculatePortfolioProfit } from 'common/calculate-metrics'
|
import { calculatePortfolioProfit } from 'common/calculate-metrics'
|
||||||
import { chooseRandomSubset } from 'common/util/random'
|
import { chooseRandomSubset } from 'common/util/random'
|
||||||
import { MenuButton } from 'web/components/nav/menu'
|
|
||||||
import { hasCompletedStreakToday } from 'web/components/profile/betting-streak-modal'
|
import { hasCompletedStreakToday } from 'web/components/profile/betting-streak-modal'
|
||||||
import { useContractsQuery } from 'web/hooks/use-contracts'
|
import { useContractsQuery } from 'web/hooks/use-contracts'
|
||||||
import { ContractsGrid } from 'web/components/contract/contracts-grid'
|
import { ContractsGrid } from 'web/components/contract/contracts-grid'
|
||||||
import { PillButton } from 'web/components/buttons/pill-button'
|
import { PillButton } from 'web/components/buttons/pill-button'
|
||||||
import { filterDefined } from 'common/util/array'
|
import { filterDefined } from 'common/util/array'
|
||||||
|
import { updateUser } from 'web/lib/firebase/users'
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
const user = useUser()
|
const user = useUser()
|
||||||
|
@ -181,24 +181,25 @@ function GroupSection(props: {
|
||||||
return (
|
return (
|
||||||
<Col>
|
<Col>
|
||||||
<SectionHeader label={group.name} href={groupPath(group.slug)}>
|
<SectionHeader label={group.name} href={groupPath(group.slug)}>
|
||||||
<MenuButton
|
<Button
|
||||||
buttonContent={
|
className=""
|
||||||
<button className="text-gray-500 hover:text-gray-700">
|
color="gray-white"
|
||||||
<DotsHorizontalIcon
|
onClick={() => {
|
||||||
|
if (user) {
|
||||||
|
leaveGroup(group, user?.id)
|
||||||
|
|
||||||
|
const homeSections = (user.homeSections ?? []).filter(
|
||||||
|
(id) => id !== group.id
|
||||||
|
)
|
||||||
|
updateUser(user.id, { homeSections })
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<XCircleIcon
|
||||||
className={clsx('h-5 w-5 flex-shrink-0')}
|
className={clsx('h-5 w-5 flex-shrink-0')}
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
/>
|
/>
|
||||||
</button>
|
</Button>
|
||||||
}
|
|
||||||
menuItems={[
|
|
||||||
{
|
|
||||||
name: 'Unfollow',
|
|
||||||
onClick: () => {
|
|
||||||
user && leaveGroup(group, user?.id)
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</SectionHeader>
|
</SectionHeader>
|
||||||
<ContractsGrid contracts={contracts} />
|
<ContractsGrid contracts={contracts} />
|
||||||
</Col>
|
</Col>
|
||||||
|
@ -307,7 +308,13 @@ function TrendingGroupsSection(props: { user: User | null | undefined }) {
|
||||||
onSelect={() => {
|
onSelect={() => {
|
||||||
if (!user) return
|
if (!user) return
|
||||||
if (memberGroupIds.includes(g.id)) leaveGroup(g, user?.id)
|
if (memberGroupIds.includes(g.id)) leaveGroup(g, user?.id)
|
||||||
else joinGroup(g, user.id)
|
else {
|
||||||
|
joinGroup(g, user.id)
|
||||||
|
const homeSections = (user.homeSections ?? [])
|
||||||
|
.filter((id) => id !== g.id)
|
||||||
|
.concat(g.id)
|
||||||
|
updateUser(user.id, { homeSections })
|
||||||
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{g.name}
|
{g.name}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user