diff --git a/web/components/contract/contract-details.tsx b/web/components/contract/contract-details.tsx
index c61a0fd1..7dbfc809 100644
--- a/web/components/contract/contract-details.tsx
+++ b/web/components/contract/contract-details.tsx
@@ -27,7 +27,7 @@ import { Modal } from 'web/components/layout/modal'
import { Col } from 'web/components/layout/col'
import { ContractGroupsList } from 'web/components/groups/contract-groups-list'
import { SiteLink } from 'web/components/site-link'
-import { groupPath } from 'web/lib/firebase/groups'
+import { getGroupLinkToDisplay, groupPath } from 'web/lib/firebase/groups'
import { insertContent } from '../editor/utils'
import { contractMetrics } from 'common/contract-details'
import { User } from 'common/user'
@@ -52,10 +52,10 @@ export function MiscDetails(props: {
isResolved,
createdTime,
resolutionTime,
- groupLinks,
} = contract
const isNew = createdTime > Date.now() - DAY_MS && !isResolved
+ const groupToDisplay = getGroupLinkToDisplay(contract)
return (
@@ -83,12 +83,12 @@ export function MiscDetails(props: {
)}
- {!hideGroupLink && groupLinks && groupLinks.length > 0 && (
+ {!hideGroupLink && groupToDisplay && (
- {groupLinks[0].name}
+ {groupToDisplay.name}
)}
@@ -148,19 +148,15 @@ export function ContractDetails(props: {
creatorName,
creatorUsername,
creatorId,
- groupLinks,
creatorAvatarUrl,
resolutionTime,
} = contract
const { volumeLabel, resolvedDate } = contractMetrics(contract)
-
- const groupToDisplay =
- groupLinks?.sort((a, b) => a.createdTime - b.createdTime)[0] ?? null
const user = useUser()
const [open, setOpen] = useState(false)
const { width } = useWindowSize()
const isMobile = (width ?? 0) < 600
-
+ const groupToDisplay = getGroupLinkToDisplay(contract)
const groupInfo = groupToDisplay ? (
-
+
diff --git a/web/components/groups/contract-groups-list.tsx b/web/components/groups/contract-groups-list.tsx
index 79f2390f..7bbcfa7c 100644
--- a/web/components/groups/contract-groups-list.tsx
+++ b/web/components/groups/contract-groups-list.tsx
@@ -13,15 +13,14 @@ import {
import { User } from 'common/user'
import { Contract } from 'common/contract'
import { SiteLink } from 'web/components/site-link'
-import { GroupLink } from 'common/group'
import { useGroupsWithContract } from 'web/hooks/use-group'
export function ContractGroupsList(props: {
- groupLinks: GroupLink[]
contract: Contract
user: User | null | undefined
}) {
- const { groupLinks, user, contract } = props
+ const { user, contract } = props
+ const { groupLinks } = contract
const groups = useGroupsWithContract(contract)
return (
@@ -35,7 +34,7 @@ export function ContractGroupsList(props: {
options={{
showSelector: true,
showLabel: false,
- ignoreGroupIds: groupLinks.map((g) => g.groupId),
+ ignoreGroupIds: groupLinks?.map((g) => g.groupId),
}}
setSelectedGroup={(group) =>
group && addContractToGroup(group, contract, user.id)
diff --git a/web/lib/firebase/groups.ts b/web/lib/firebase/groups.ts
index 28515a35..4d22e0ee 100644
--- a/web/lib/firebase/groups.ts
+++ b/web/lib/firebase/groups.ts
@@ -208,3 +208,17 @@ export function canModifyGroupContracts(group: Group, userId: string) {
group.anyoneCanJoin
)
}
+
+export function getGroupLinkToDisplay(contract: Contract) {
+ const { groupLinks } = contract
+ const sortedGroupLinks = groupLinks?.sort(
+ (a, b) => b.createdTime - a.createdTime
+ )
+ const groupCreatorAdded = sortedGroupLinks?.find(
+ (g) => g.userId === contract.creatorId
+ )
+ const groupToDisplay = groupCreatorAdded
+ ? groupCreatorAdded
+ : sortedGroupLinks?.[0] ?? null
+ return groupToDisplay
+}