Auth user server-side on groups page

This commit is contained in:
Ian Philips 2022-09-02 19:52:38 -06:00
parent c74d972caf
commit 25a0276bf7

View File

@ -8,7 +8,6 @@ import { Row } from 'web/components/layout/row'
import { Page } from 'web/components/page'
import { Title } from 'web/components/title'
import { useGroups, useMemberGroupIds } from 'web/hooks/use-group'
import { useUser } from 'web/hooks/use-user'
import { groupPath, listAllGroups } from 'web/lib/firebase/groups'
import { getUser, User } from 'web/lib/firebase/users'
import { Tabs } from 'web/components/layout/tabs'
@ -18,14 +17,15 @@ import { Avatar } from 'web/components/avatar'
import { JoinOrLeaveGroupButton } from 'web/components/groups/groups-button'
import { searchInAny } from 'common/util/parse'
import { SEO } from 'web/components/SEO'
import { GetServerSideProps } from 'next'
import { authenticateOnServer } from 'web/lib/firebase/server-auth'
import { useUser } from 'web/hooks/use-user'
export async function getStaticProps() {
export const getServerSideProps: GetServerSideProps = async (ctx) => {
const creds = await authenticateOnServer(ctx)
const serverUser = creds ? await getUser(creds.uid) : null
const groups = await listAllGroups().catch((_) => [])
// mqp: temporary fix to make dev deploy while Ian works on migrating groups away
// from the document array member and contracts representation
// groups = groups.filter((g) => g.contractIds != null && g.memberIds != null)
const creators = await Promise.all(
groups.map((group) => getUser(group.creatorId))
)
@ -33,25 +33,20 @@ export async function getStaticProps() {
creators.map((creator) => [creator.id, creator])
)
return {
props: {
groups: groups,
creatorsDict,
},
revalidate: 60, // regenerate after a minute
}
return { props: { serverUser, groups: groups, creatorsDict } }
}
export default function Groups(props: {
serverUser: User | null
groups: Group[]
creatorsDict: { [k: string]: User }
}) {
//TODO: do we really need the creatorsDict?
const [creatorsDict, setCreatorsDict] = useState(props.creatorsDict)
const { serverUser } = props || {}
const groups = useGroups() ?? props.groups
const user = useUser()
const memberGroupIds = useMemberGroupIds(user) || []
const memberGroupIds = useMemberGroupIds(serverUser) || []
const user = useUser() ?? serverUser
useEffect(() => {
// Load User object for creator of new Groups.
@ -117,6 +112,39 @@ export default function Groups(props: {
<Tabs
currentPageForAnalytics={'groups'}
tabs={[
...(user
? [
{
title: 'My Groups',
content: (
<Col>
<input
type="text"
onChange={(e) => debouncedQuery(e.target.value)}
placeholder="Search your groups"
className="input input-bordered mb-4 w-full"
/>
<div className="flex flex-wrap justify-center gap-4">
{matchesOrderedByRecentActivity
.filter((match) =>
memberGroupIds.includes(match.id)
)
.map((group) => (
<GroupCard
key={group.id}
group={group}
creator={creatorsDict[group.creatorId]}
user={user}
isMember={memberGroupIds.includes(group.id)}
/>
))}
</div>
</Col>
),
},
]
: []),
{
title: 'All',
content: (
@ -142,33 +170,6 @@ export default function Groups(props: {
</Col>
),
},
{
title: 'My Groups',
content: (
<Col>
<input
type="text"
onChange={(e) => debouncedQuery(e.target.value)}
placeholder="Search your groups"
className="input input-bordered mb-4 w-full"
/>
<div className="flex flex-wrap justify-center gap-4">
{matchesOrderedByRecentActivity
.filter((match) => memberGroupIds.includes(match.id))
.map((group) => (
<GroupCard
key={group.id}
group={group}
creator={creatorsDict[group.creatorId]}
user={user}
isMember={memberGroupIds.includes(group.id)}
/>
))}
</div>
</Col>
),
},
]}
/>
</Col>