mirrors/posthog
0
0
Fork 0
mirror of https://github.com/PostHog/posthog.git synced 2024-11-21 13:39:22 +01:00
Code Issues Releases Activity

Move add member modal state to logic

Browse Source
This commit is contained in:
Zach Waterfield 2024-11-19 16:40:41 -08:00
parent d4556c96d0
commit bb17532bea
2 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/scenes/settings/environment/AddMembersModal.tsx
View File

@ -1,6 +1,6 @@
import { IconPlus } from '@posthog/icons'
import { LemonButton, LemonModal, LemonSelect, LemonSelectOption } from '@posthog/lemon-ui'
import { useValues } from 'kea'
import { useActions, useValues } from 'kea'
import { Form } from 'kea-forms'
import { upgradeModalLogic } from 'lib/components/UpgradeModal/upgradeModalLogic'
import { usersLemonSelectOptions } from 'lib/components/UserSelectItem'
@ -8,7 +8,6 @@ import { TeamMembershipLevel } from 'lib/constants'
import { LemonField } from 'lib/lemon-ui/LemonField'
import { LemonInputSelect } from 'lib/lemon-ui/LemonInputSelect/LemonInputSelect'
import { membershipLevelToName, teamMembershipLevelIntegers } from 'lib/utils/permissioning'
import { useState } from 'react'
import { teamLogic } from 'scenes/teamLogic'
import { userLogic } from 'scenes/userLogic'
@ -17,24 +16,19 @@ import { AvailableFeature } from '~/types'
import { teamMembersLogic } from './teamMembersLogic'
export function AddMembersModalWithButton({ disabledReason }: { disabledReason: string | null }): JSX.Element {
const { addableMembers, allMembersLoading } = useValues(teamMembersLogic)
const { addableMembers, allMembersLoading, isAddMembersModalOpen } = useValues(teamMembersLogic)
const { openAddMembersModal, closeAddMembersModal } = useActions(teamMembersLogic)
const { currentTeam } = useValues(teamLogic)
const { guardAvailableFeature } = useValues(upgradeModalLogic)
const { hasAvailableFeature } = useValues(userLogic)
const [isVisible, setIsVisible] = useState(false)
function closeModal(): void {
setIsVisible(false)
}
return (
<>
<LemonButton
type="primary"
data-attr="add-project-members-button"
onClick={() =>
guardAvailableFeature(AvailableFeature.PROJECT_BASED_PERMISSIONING, () => setIsVisible(true), {
guardAvailableFeature(AvailableFeature.PROJECT_BASED_PERMISSIONING, () => openAddMembersModal(), {
isGrandfathered:
!hasAvailableFeature(AvailableFeature.PROJECT_BASED_PERMISSIONING) &&
currentTeam?.access_control,
@ -45,7 +39,7 @@ export function AddMembersModalWithButton({ disabledReason }: { disabledReason:
>
Add members to project
</LemonButton>
<LemonModal title="" onClose={closeModal} isOpen={isVisible} simple>
<LemonModal title="" onClose={closeAddMembersModal} isOpen={isAddMembersModalOpen} simple>
<Form logic={teamMembersLogic} formKey="addMembers" enableFormOnSubmit>
<LemonModal.Header>
<h3>{`Adding members${currentTeam?.name ? ` to project ${currentTeam.name}` : ''}`}</h3>
@ -76,7 +70,7 @@ export function AddMembersModalWithButton({ disabledReason }: { disabledReason:
</LemonField>
</LemonModal.Content>
<LemonModal.Footer>
<LemonButton type="secondary" onClick={closeModal}>
<LemonButton type="secondary" onClick={closeAddMembersModal}>
Cancel
</LemonButton>
<LemonButton type="primary" data-attr="add-project-members-submit" htmlType="submit">

19
frontend/src/scenes/settings/environment/teamMembersLogic.tsx
View File

@ -1,4 +1,4 @@
import { actions, afterMount, kea, listeners, path, selectors } from 'kea'
import { actions, afterMount, kea, listeners, path, reducers, selectors } from 'kea'
import { forms } from 'kea-forms'
import { loaders } from 'kea-loaders'
import api from 'lib/api'
@ -27,8 +27,19 @@ export const teamMembersLogic = kea<teamMembersLogicType>([
user,
newLevel,
}),
openAddMembersModal: true,
closeAddMembersModal: true,
}),
loaders(({ values }) => ({
reducers({
isAddMembersModalOpen: [
false,
{
openAddMembersModal: () => true,
closeAddMembersModal: () => false,
},
],
}),
loaders(({ actions, values }) => ({
explicitMembers: {
__default: [] as ExplicitTeamMemberType[],
loadMembers: async () => {
@ -46,6 +57,7 @@ export const teamMembersLogic = kea<teamMembersLogicType>([
lemonToast.success(
`Added ${newMembers.length} member${newMembers.length !== 1 ? 's' : ''} to the project.`
)
actions.closeAddMembersModal()
return [...values.explicitMembers, ...newMembers]
},
removeMember: async ({ member }: { member: BaseMemberType }) => {
@ -176,6 +188,9 @@ export const teamMembersLogic = kea<teamMembersLogicType>([
)
actions.loadMembers()
},
closeAddMembersModal: () => {
actions.resetAddMembers()
},
})),
afterMount(({ actions }) => {
actions.loadMembers()