mirror of
https://github.com/Steffo99/sophon.git
synced 2024-12-23 07:14:21 +00:00
✨ Implement group joining and leaving
This commit is contained in:
parent
701e4be2d8
commit
d919e6d042
3 changed files with 91 additions and 1 deletions
43
frontend/src/components/group/GroupJoinButton.tsx
Normal file
43
frontend/src/components/group/GroupJoinButton.tsx
Normal file
|
@ -0,0 +1,43 @@
|
|||
import {faUserPlus} from "@fortawesome/free-solid-svg-icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {Button} from "@steffo/bluelib-react"
|
||||
import * as React from "react"
|
||||
import {useAuthorizationContext} from "../../contexts/authorization"
|
||||
import {ManagedResource} from "../../hooks/useManagedViewSet"
|
||||
import {SophonResearchGroup} from "../../types/SophonTypes"
|
||||
|
||||
|
||||
export interface GroupJoinButtonProps {
|
||||
resource: ManagedResource<SophonResearchGroup>,
|
||||
}
|
||||
|
||||
|
||||
export function GroupJoinButton({resource}: GroupJoinButtonProps): JSX.Element | null {
|
||||
const authorization = useAuthorizationContext()
|
||||
|
||||
const doJoin =
|
||||
React.useCallback(
|
||||
async () => {
|
||||
await resource.action("POST", "join", {})
|
||||
},
|
||||
[resource],
|
||||
)
|
||||
|
||||
if(!authorization) {
|
||||
return null
|
||||
}
|
||||
if(!authorization.state.user) {
|
||||
return null
|
||||
}
|
||||
if(resource.value.members.includes(authorization.state.user.id)) {
|
||||
return null
|
||||
}
|
||||
|
||||
const canJoin = !resource.busy && resource.value.access === "OPEN"
|
||||
|
||||
return (
|
||||
<Button disabled={!canJoin} onClick={doJoin} bluelibClassNames={resource.busy ? "color-yellow" : ""}>
|
||||
<FontAwesomeIcon icon={faUserPlus}/> Join
|
||||
</Button>
|
||||
)
|
||||
}
|
44
frontend/src/components/group/GroupLeaveButton.tsx
Normal file
44
frontend/src/components/group/GroupLeaveButton.tsx
Normal file
|
@ -0,0 +1,44 @@
|
|||
import {faUserMinus} from "@fortawesome/free-solid-svg-icons"
|
||||
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"
|
||||
import {Button} from "@steffo/bluelib-react"
|
||||
import * as React from "react"
|
||||
import {useAuthorizationContext} from "../../contexts/authorization"
|
||||
import {ManagedResource} from "../../hooks/useManagedViewSet"
|
||||
import {SophonResearchGroup} from "../../types/SophonTypes"
|
||||
|
||||
|
||||
export interface GroupLeaveButtonProps {
|
||||
resource: ManagedResource<SophonResearchGroup>,
|
||||
}
|
||||
|
||||
|
||||
export function GroupLeaveButton({resource}: GroupLeaveButtonProps): JSX.Element | null {
|
||||
const authorization = useAuthorizationContext()
|
||||
|
||||
const doLeave =
|
||||
React.useCallback(
|
||||
async () => {
|
||||
await resource.action("DELETE", "leave", {})
|
||||
},
|
||||
[resource],
|
||||
)
|
||||
|
||||
if(!authorization) {
|
||||
return null
|
||||
}
|
||||
if(!authorization.state.user) {
|
||||
return null
|
||||
}
|
||||
if(!resource.value.members.includes(authorization.state.user.id)) {
|
||||
return null
|
||||
}
|
||||
|
||||
const isOwner = resource.value.owner === authorization.state.user.id
|
||||
const canLeave = !resource.busy && !isOwner
|
||||
|
||||
return (
|
||||
<Button disabled={!canLeave} onClick={doLeave} bluelibClassNames={resource.busy ? "color-yellow" : ""}>
|
||||
<FontAwesomeIcon icon={faUserMinus}/> Leave
|
||||
</Button>
|
||||
)
|
||||
}
|
|
@ -5,6 +5,8 @@ import {ManagedResource} from "../../hooks/useManagedViewSet"
|
|||
import {SophonResearchGroup} from "../../types/SophonTypes"
|
||||
import {Link} from "../elements/Link"
|
||||
import {ResourcePanel} from "../elements/ResourcePanel"
|
||||
import {GroupJoinButton} from "./GroupJoinButton"
|
||||
import {GroupLeaveButton} from "./GroupLeaveButton"
|
||||
|
||||
|
||||
export interface GroupResourcePanelProps {
|
||||
|
@ -30,7 +32,8 @@ export function GroupResourcePanel({resource}: GroupResourcePanelProps): JSX.Ele
|
|||
{members} member{members !== 1 ? "s" : ""}
|
||||
</ResourcePanel.Text>
|
||||
<ResourcePanel.Buttons>
|
||||
|
||||
<GroupLeaveButton resource={resource}/>
|
||||
<GroupJoinButton resource={resource}/>
|
||||
</ResourcePanel.Buttons>
|
||||
</ResourcePanel>
|
||||
)
|
||||
|
|
Loading…
Reference in a new issue