♻️ (builder) Change to features-centric folder structure
This commit is contained in:
Baptiste Arnaud
committed by
Baptiste Arnaud
Baptiste Arnaud
parent
3686465a85
commit
643571fe7d
@@ -0,0 +1,121 @@
|
||||
import {
|
||||
HStack,
|
||||
Input,
|
||||
Button,
|
||||
Menu,
|
||||
MenuButton,
|
||||
MenuList,
|
||||
Stack,
|
||||
MenuItem,
|
||||
} from '@chakra-ui/react'
|
||||
import { ChevronLeftIcon } from '@/components/icons'
|
||||
import { WorkspaceInvitation, WorkspaceRole } from 'db'
|
||||
import { FormEvent, useState } from 'react'
|
||||
import { Member } from '../../types'
|
||||
import { sendInvitationQuery } from '../../queries/sendInvitationQuery'
|
||||
|
||||
type Props = {
|
||||
workspaceId: string
|
||||
onNewMember: (member: Member) => void
|
||||
onNewInvitation: (invitation: WorkspaceInvitation) => void
|
||||
isLoading: boolean
|
||||
isLocked: boolean
|
||||
}
|
||||
export const AddMemberForm = ({
|
||||
workspaceId,
|
||||
onNewMember,
|
||||
onNewInvitation,
|
||||
isLoading,
|
||||
isLocked,
|
||||
}: Props) => {
|
||||
const [invitationEmail, setInvitationEmail] = useState('')
|
||||
const [invitationRole, setInvitationRole] = useState<WorkspaceRole>(
|
||||
WorkspaceRole.MEMBER
|
||||
)
|
||||
|
||||
const [isSendingInvitation, setIsSendingInvitation] = useState(false)
|
||||
|
||||
const handleInvitationSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault()
|
||||
setIsSendingInvitation(true)
|
||||
const { data } = await sendInvitationQuery({
|
||||
email: invitationEmail,
|
||||
type: invitationRole,
|
||||
workspaceId,
|
||||
})
|
||||
if (data?.member) onNewMember(data.member)
|
||||
if (data?.invitation) onNewInvitation(data.invitation)
|
||||
setInvitationEmail('')
|
||||
setIsSendingInvitation(false)
|
||||
}
|
||||
|
||||
return (
|
||||
<HStack as="form" onSubmit={handleInvitationSubmit}>
|
||||
<Input
|
||||
placeholder="colleague@company.com"
|
||||
name="inviteEmail"
|
||||
value={invitationEmail}
|
||||
onChange={(e) => setInvitationEmail(e.target.value)}
|
||||
rounded="md"
|
||||
isDisabled={isLocked}
|
||||
/>
|
||||
|
||||
{!isLocked && (
|
||||
<WorkspaceRoleMenuButton
|
||||
role={invitationRole}
|
||||
onChange={setInvitationRole}
|
||||
/>
|
||||
)}
|
||||
<Button
|
||||
colorScheme={'blue'}
|
||||
isLoading={isSendingInvitation}
|
||||
flexShrink={0}
|
||||
type="submit"
|
||||
isDisabled={isLoading || isLocked}
|
||||
>
|
||||
Invite
|
||||
</Button>
|
||||
</HStack>
|
||||
)
|
||||
}
|
||||
|
||||
const WorkspaceRoleMenuButton = ({
|
||||
role,
|
||||
onChange,
|
||||
}: {
|
||||
role: WorkspaceRole
|
||||
onChange: (role: WorkspaceRole) => void
|
||||
}) => {
|
||||
return (
|
||||
<Menu placement="bottom-end" isLazy matchWidth>
|
||||
<MenuButton
|
||||
flexShrink={0}
|
||||
as={Button}
|
||||
rightIcon={<ChevronLeftIcon transform={'rotate(-90deg)'} />}
|
||||
>
|
||||
{convertWorkspaceRoleToReadable(role)}
|
||||
</MenuButton>
|
||||
<MenuList minW={0}>
|
||||
<Stack maxH={'35vh'} overflowY="scroll" spacing="0">
|
||||
<MenuItem onClick={() => onChange(WorkspaceRole.ADMIN)}>
|
||||
{convertWorkspaceRoleToReadable(WorkspaceRole.ADMIN)}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => onChange(WorkspaceRole.MEMBER)}>
|
||||
{convertWorkspaceRoleToReadable(WorkspaceRole.MEMBER)}
|
||||
</MenuItem>
|
||||
</Stack>
|
||||
</MenuList>
|
||||
</Menu>
|
||||
)
|
||||
}
|
||||
|
||||
export const convertWorkspaceRoleToReadable = (role: WorkspaceRole): string => {
|
||||
switch (role) {
|
||||
case WorkspaceRole.ADMIN:
|
||||
return 'Admin'
|
||||
case WorkspaceRole.MEMBER:
|
||||
return 'Member'
|
||||
case WorkspaceRole.GUEST:
|
||||
return 'Guest'
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,109 @@
|
||||
import {
|
||||
Avatar,
|
||||
HStack,
|
||||
Menu,
|
||||
MenuButton,
|
||||
MenuItem,
|
||||
MenuList,
|
||||
Stack,
|
||||
Tag,
|
||||
Text,
|
||||
} from '@chakra-ui/react'
|
||||
import { WorkspaceRole } from 'db'
|
||||
import React from 'react'
|
||||
import { convertWorkspaceRoleToReadable } from './AddMemberForm'
|
||||
|
||||
type Props = {
|
||||
image?: string
|
||||
name?: string
|
||||
email: string
|
||||
role: WorkspaceRole
|
||||
isGuest?: boolean
|
||||
isMe?: boolean
|
||||
canEdit: boolean
|
||||
onDeleteClick: () => void
|
||||
onSelectNewRole: (role: WorkspaceRole) => void
|
||||
}
|
||||
|
||||
export const MemberItem = ({
|
||||
email,
|
||||
name,
|
||||
image,
|
||||
role,
|
||||
isGuest = false,
|
||||
isMe = false,
|
||||
canEdit,
|
||||
onDeleteClick,
|
||||
onSelectNewRole,
|
||||
}: Props) => {
|
||||
const handleAdminClick = () => onSelectNewRole(WorkspaceRole.ADMIN)
|
||||
const handleMemberClick = () => onSelectNewRole(WorkspaceRole.MEMBER)
|
||||
return (
|
||||
<Menu placement="bottom-end" isLazy>
|
||||
<MenuButton _hover={{ backgroundColor: 'gray.100' }} borderRadius="md">
|
||||
<MemberIdentityContent
|
||||
email={email}
|
||||
name={name}
|
||||
image={image}
|
||||
isGuest={isGuest}
|
||||
tag={convertWorkspaceRoleToReadable(role)}
|
||||
/>
|
||||
</MenuButton>
|
||||
{!isMe && canEdit && (
|
||||
<MenuList shadow="lg">
|
||||
<MenuItem onClick={handleAdminClick}>
|
||||
{convertWorkspaceRoleToReadable(WorkspaceRole.ADMIN)}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMemberClick}>
|
||||
{convertWorkspaceRoleToReadable(WorkspaceRole.MEMBER)}
|
||||
</MenuItem>
|
||||
<MenuItem color="red.500" onClick={onDeleteClick}>
|
||||
Remove
|
||||
</MenuItem>
|
||||
</MenuList>
|
||||
)}
|
||||
</Menu>
|
||||
)
|
||||
}
|
||||
|
||||
export const MemberIdentityContent = ({
|
||||
name,
|
||||
tag,
|
||||
isGuest = false,
|
||||
image,
|
||||
email,
|
||||
}: {
|
||||
name?: string
|
||||
tag?: string
|
||||
image?: string
|
||||
isGuest?: boolean
|
||||
email: string
|
||||
}) => (
|
||||
<HStack justifyContent="space-between" maxW="full" p="2">
|
||||
<HStack minW={0} spacing="4">
|
||||
<Avatar name={name} src={image} size="sm" />
|
||||
<Stack spacing={0} minW="0">
|
||||
{name && (
|
||||
<Text textAlign="left" fontSize="15px">
|
||||
{name}
|
||||
</Text>
|
||||
)}
|
||||
<Text
|
||||
color="gray.500"
|
||||
fontSize={name ? '14px' : 'inherit'}
|
||||
noOfLines={1}
|
||||
>
|
||||
{email}
|
||||
</Text>
|
||||
</Stack>
|
||||
</HStack>
|
||||
<HStack flexShrink={0}>
|
||||
{isGuest && (
|
||||
<Tag color="gray.400" data-testid="tag">
|
||||
Pending
|
||||
</Tag>
|
||||
)}
|
||||
<Tag data-testid="tag">{tag}</Tag>
|
||||
</HStack>
|
||||
</HStack>
|
||||
)
|
||||
@@ -0,0 +1,149 @@
|
||||
import {
|
||||
Heading,
|
||||
HStack,
|
||||
SkeletonCircle,
|
||||
SkeletonText,
|
||||
Stack,
|
||||
} from '@chakra-ui/react'
|
||||
import { UnlockPlanAlertInfo } from '@/components/UnlockPlanAlertInfo'
|
||||
import { WorkspaceInvitation, WorkspaceRole } from 'db'
|
||||
import React from 'react'
|
||||
import { getSeatsLimit } from 'utils'
|
||||
import { AddMemberForm } from './AddMemberForm'
|
||||
import { checkCanInviteMember } from './helpers'
|
||||
import { MemberItem } from './MemberItem'
|
||||
import { useUser } from '@/features/account'
|
||||
import { useWorkspace } from '../../WorkspaceProvider'
|
||||
import { useMembers } from '../../hooks/useMembers'
|
||||
import { deleteMemberQuery } from '../../queries/deleteMemberQuery'
|
||||
import { updateMemberQuery } from '../../queries/updateMemberQuery'
|
||||
import { deleteInvitationQuery } from '../../queries/deleteInvitationQuery'
|
||||
import { updateInvitationQuery } from '../../queries/updateInvitationQuery'
|
||||
import { Member } from '../../types'
|
||||
|
||||
export const MembersList = () => {
|
||||
const { user } = useUser()
|
||||
const { workspace, canEdit } = useWorkspace()
|
||||
const { members, invitations, isLoading, mutate } = useMembers({
|
||||
workspaceId: workspace?.id,
|
||||
})
|
||||
|
||||
const handleDeleteMemberClick = (memberId: string) => async () => {
|
||||
if (!workspace) return
|
||||
await deleteMemberQuery(workspace.id, memberId)
|
||||
mutate({
|
||||
members: members.filter((m) => m.userId !== memberId),
|
||||
invitations,
|
||||
})
|
||||
}
|
||||
|
||||
const handleSelectNewRole =
|
||||
(memberId: string) => async (role: WorkspaceRole) => {
|
||||
if (!workspace) return
|
||||
await updateMemberQuery(workspace.id, { userId: memberId, role })
|
||||
mutate({
|
||||
members: members.map((m) =>
|
||||
m.userId === memberId ? { ...m, role } : m
|
||||
),
|
||||
invitations,
|
||||
})
|
||||
}
|
||||
|
||||
const handleDeleteInvitationClick = (id: string) => async () => {
|
||||
if (!workspace) return
|
||||
await deleteInvitationQuery({ workspaceId: workspace.id, id })
|
||||
mutate({
|
||||
invitations: invitations.filter((i) => i.id !== id),
|
||||
members,
|
||||
})
|
||||
}
|
||||
|
||||
const handleSelectNewInvitationRole =
|
||||
(id: string) => async (type: WorkspaceRole) => {
|
||||
if (!workspace) return
|
||||
await updateInvitationQuery({ workspaceId: workspace.id, id, type })
|
||||
mutate({
|
||||
invitations: invitations.map((i) => (i.id === id ? { ...i, type } : i)),
|
||||
members,
|
||||
})
|
||||
}
|
||||
|
||||
const handleNewInvitation = async (invitation: WorkspaceInvitation) => {
|
||||
await mutate({
|
||||
members,
|
||||
invitations: [...invitations, invitation],
|
||||
})
|
||||
}
|
||||
|
||||
const handleNewMember = async (member: Member) => {
|
||||
await mutate({
|
||||
members: [...members, member],
|
||||
invitations,
|
||||
})
|
||||
}
|
||||
|
||||
const currentMembersCount = members.length + invitations.length
|
||||
|
||||
const canInviteNewMember = checkCanInviteMember({
|
||||
plan: workspace?.plan,
|
||||
customSeatsLimit: workspace?.customSeatsLimit,
|
||||
currentMembersCount,
|
||||
})
|
||||
|
||||
return (
|
||||
<Stack w="full" spacing={3}>
|
||||
{!canInviteNewMember && (
|
||||
<UnlockPlanAlertInfo
|
||||
contentLabel={`
|
||||
Upgrade your plan to work with more team members, and unlock awesome
|
||||
power features 🚀
|
||||
`}
|
||||
/>
|
||||
)}
|
||||
{workspace && (
|
||||
<Heading fontSize="2xl">
|
||||
Members ({currentMembersCount}/{getSeatsLimit(workspace)})
|
||||
</Heading>
|
||||
)}
|
||||
{workspace?.id && canEdit && (
|
||||
<AddMemberForm
|
||||
workspaceId={workspace.id}
|
||||
onNewInvitation={handleNewInvitation}
|
||||
onNewMember={handleNewMember}
|
||||
isLoading={isLoading}
|
||||
isLocked={!canInviteNewMember}
|
||||
/>
|
||||
)}
|
||||
{members.map((member) => (
|
||||
<MemberItem
|
||||
key={member.userId}
|
||||
email={member.email ?? ''}
|
||||
image={member.image ?? undefined}
|
||||
name={member.name ?? undefined}
|
||||
role={member.role}
|
||||
isMe={member.userId === user?.id}
|
||||
onDeleteClick={handleDeleteMemberClick(member.userId)}
|
||||
onSelectNewRole={handleSelectNewRole(member.userId)}
|
||||
canEdit={canEdit}
|
||||
/>
|
||||
))}
|
||||
{invitations.map((invitation) => (
|
||||
<MemberItem
|
||||
key={invitation.email}
|
||||
email={invitation.email ?? ''}
|
||||
role={invitation.type}
|
||||
onDeleteClick={handleDeleteInvitationClick(invitation.id)}
|
||||
onSelectNewRole={handleSelectNewInvitationRole(invitation.id)}
|
||||
isGuest
|
||||
canEdit={canEdit}
|
||||
/>
|
||||
))}
|
||||
{isLoading && (
|
||||
<HStack py="4">
|
||||
<SkeletonCircle boxSize="32px" />
|
||||
<SkeletonText width="200px" noOfLines={2} />
|
||||
</HStack>
|
||||
)}
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
import { Plan } from 'db'
|
||||
import { getSeatsLimit } from 'utils'
|
||||
|
||||
export function checkCanInviteMember({
|
||||
plan,
|
||||
customSeatsLimit,
|
||||
currentMembersCount,
|
||||
}: {
|
||||
plan?: Plan
|
||||
customSeatsLimit?: number | null
|
||||
currentMembersCount?: number
|
||||
}) {
|
||||
if (!plan || !currentMembersCount) return false
|
||||
|
||||
return (
|
||||
getSeatsLimit({ plan, customSeatsLimit: customSeatsLimit ?? null }) >
|
||||
currentMembersCount
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export { MembersList } from './MembersList'
|
||||
@@ -0,0 +1,98 @@
|
||||
import {
|
||||
Stack,
|
||||
FormControl,
|
||||
FormLabel,
|
||||
Flex,
|
||||
Button,
|
||||
useDisclosure,
|
||||
Text,
|
||||
} from '@chakra-ui/react'
|
||||
import { ConfirmModal } from '@/components/ConfirmModal'
|
||||
import React from 'react'
|
||||
import { EditableEmojiOrImageIcon } from '@/components/EditableEmojiOrImageIcon'
|
||||
import { useWorkspace } from '../WorkspaceProvider'
|
||||
import { Input } from '@/components/inputs'
|
||||
|
||||
export const WorkspaceSettingsForm = ({ onClose }: { onClose: () => void }) => {
|
||||
const { workspace, workspaces, updateWorkspace, deleteCurrentWorkspace } =
|
||||
useWorkspace()
|
||||
|
||||
const handleNameChange = (name: string) => {
|
||||
if (!workspace?.id) return
|
||||
updateWorkspace(workspace?.id, { name })
|
||||
}
|
||||
|
||||
const handleChangeIcon = (icon: string) => {
|
||||
if (!workspace?.id) return
|
||||
updateWorkspace(workspace?.id, { icon })
|
||||
}
|
||||
|
||||
const handleDeleteClick = async () => {
|
||||
await deleteCurrentWorkspace()
|
||||
onClose()
|
||||
}
|
||||
|
||||
return (
|
||||
<Stack spacing="6" w="full">
|
||||
<FormControl>
|
||||
<FormLabel>Icon</FormLabel>
|
||||
<Flex>
|
||||
{workspace && (
|
||||
<EditableEmojiOrImageIcon
|
||||
uploadFilePath={`workspaces/${workspace.id}/icon`}
|
||||
icon={workspace.icon}
|
||||
onChangeIcon={handleChangeIcon}
|
||||
boxSize="40px"
|
||||
/>
|
||||
)}
|
||||
</Flex>
|
||||
</FormControl>
|
||||
<FormControl>
|
||||
<FormLabel htmlFor="name">Name</FormLabel>
|
||||
{workspace && (
|
||||
<Input
|
||||
id="name"
|
||||
withVariableButton={false}
|
||||
defaultValue={workspace?.name}
|
||||
onChange={handleNameChange}
|
||||
/>
|
||||
)}
|
||||
</FormControl>
|
||||
{workspace && workspaces && workspaces.length > 1 && (
|
||||
<DeleteWorkspaceButton
|
||||
onConfirm={handleDeleteClick}
|
||||
workspaceName={workspace?.name}
|
||||
/>
|
||||
)}
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
const DeleteWorkspaceButton = ({
|
||||
workspaceName,
|
||||
onConfirm,
|
||||
}: {
|
||||
workspaceName: string
|
||||
onConfirm: () => Promise<void>
|
||||
}) => {
|
||||
const { isOpen, onOpen, onClose } = useDisclosure()
|
||||
return (
|
||||
<>
|
||||
<Button colorScheme="red" variant="outline" onClick={onOpen}>
|
||||
Delete workspace
|
||||
</Button>
|
||||
<ConfirmModal
|
||||
isOpen={isOpen}
|
||||
onConfirm={onConfirm}
|
||||
onClose={onClose}
|
||||
message={
|
||||
<Text>
|
||||
Are you sure you want to delete {workspaceName} workspace? All its
|
||||
folders, typebots and results will be deleted forever.'
|
||||
</Text>
|
||||
}
|
||||
confirmButtonLabel="Delete"
|
||||
/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,180 @@
|
||||
import {
|
||||
Modal,
|
||||
ModalOverlay,
|
||||
ModalContent,
|
||||
Stack,
|
||||
Text,
|
||||
Button,
|
||||
Avatar,
|
||||
Flex,
|
||||
} from '@chakra-ui/react'
|
||||
import {
|
||||
CreditCardIcon,
|
||||
HardDriveIcon,
|
||||
SettingsIcon,
|
||||
UsersIcon,
|
||||
} from '@/components/icons'
|
||||
import { EmojiOrImageIcon } from '@/components/EmojiOrImageIcon'
|
||||
import { User, Workspace } from 'db'
|
||||
import { useState } from 'react'
|
||||
import { MembersList } from './MembersList'
|
||||
import { WorkspaceSettingsForm } from './WorkspaceSettingsForm'
|
||||
import { useWorkspace } from '../WorkspaceProvider'
|
||||
import { MyAccountForm } from '@/features/account'
|
||||
import { BillingContent } from '@/features/billing'
|
||||
import { EditorSettingsForm } from '@/features/editor'
|
||||
|
||||
type Props = {
|
||||
isOpen: boolean
|
||||
user: User
|
||||
workspace: Workspace
|
||||
onClose: () => void
|
||||
}
|
||||
|
||||
type SettingsTab =
|
||||
| 'my-account'
|
||||
| 'user-settings'
|
||||
| 'workspace-settings'
|
||||
| 'members'
|
||||
| 'billing'
|
||||
|
||||
export const WorkspaceSettingsModal = ({
|
||||
isOpen,
|
||||
user,
|
||||
workspace,
|
||||
onClose,
|
||||
}: Props) => {
|
||||
const { canEdit } = useWorkspace()
|
||||
const [selectedTab, setSelectedTab] = useState<SettingsTab>('my-account')
|
||||
|
||||
return (
|
||||
<Modal isOpen={isOpen} onClose={onClose} size="4xl">
|
||||
<ModalOverlay />
|
||||
<ModalContent minH="600px" flexDir="row">
|
||||
<Stack
|
||||
spacing={8}
|
||||
w="200px"
|
||||
py="6"
|
||||
borderRightWidth={1}
|
||||
justifyContent="space-between"
|
||||
>
|
||||
<Stack spacing={8}>
|
||||
<Stack>
|
||||
<Text pl="4" color="gray.500">
|
||||
{user.email}
|
||||
</Text>
|
||||
<Button
|
||||
variant={selectedTab === 'my-account' ? 'solid' : 'ghost'}
|
||||
onClick={() => setSelectedTab('my-account')}
|
||||
leftIcon={
|
||||
<Avatar
|
||||
name={user.name ?? undefined}
|
||||
src={user.image ?? undefined}
|
||||
boxSize="15px"
|
||||
/>
|
||||
}
|
||||
size="sm"
|
||||
justifyContent="flex-start"
|
||||
pl="4"
|
||||
>
|
||||
My account
|
||||
</Button>
|
||||
<Button
|
||||
variant={selectedTab === 'user-settings' ? 'solid' : 'ghost'}
|
||||
onClick={() => setSelectedTab('user-settings')}
|
||||
leftIcon={<SettingsIcon />}
|
||||
size="sm"
|
||||
justifyContent="flex-start"
|
||||
pl="4"
|
||||
>
|
||||
Preferences
|
||||
</Button>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Text pl="4" color="gray.500">
|
||||
Workspace
|
||||
</Text>
|
||||
{canEdit && (
|
||||
<Button
|
||||
variant={
|
||||
selectedTab === 'workspace-settings' ? 'solid' : 'ghost'
|
||||
}
|
||||
onClick={() => setSelectedTab('workspace-settings')}
|
||||
leftIcon={
|
||||
<EmojiOrImageIcon
|
||||
icon={workspace.icon}
|
||||
boxSize="15px"
|
||||
defaultIcon={HardDriveIcon}
|
||||
/>
|
||||
}
|
||||
size="sm"
|
||||
justifyContent="flex-start"
|
||||
pl="4"
|
||||
>
|
||||
Settings
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
variant={selectedTab === 'members' ? 'solid' : 'ghost'}
|
||||
onClick={() => setSelectedTab('members')}
|
||||
leftIcon={<UsersIcon />}
|
||||
size="sm"
|
||||
justifyContent="flex-start"
|
||||
pl="4"
|
||||
>
|
||||
Members
|
||||
</Button>
|
||||
{canEdit && (
|
||||
<Button
|
||||
variant={selectedTab === 'billing' ? 'solid' : 'ghost'}
|
||||
onClick={() => setSelectedTab('billing')}
|
||||
leftIcon={<CreditCardIcon />}
|
||||
size="sm"
|
||||
justifyContent="flex-start"
|
||||
pl="4"
|
||||
>
|
||||
Billing & Usage
|
||||
</Button>
|
||||
)}
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
<Flex justify="center" pt="10">
|
||||
<Text color="gray.500" fontSize="xs">
|
||||
Version: 2.5.1
|
||||
</Text>
|
||||
</Flex>
|
||||
</Stack>
|
||||
|
||||
{isOpen && (
|
||||
<Flex flex="1" p="10">
|
||||
<SettingsContent tab={selectedTab} onClose={onClose} />
|
||||
</Flex>
|
||||
)}
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
const SettingsContent = ({
|
||||
tab,
|
||||
onClose,
|
||||
}: {
|
||||
tab: SettingsTab
|
||||
onClose: () => void
|
||||
}) => {
|
||||
switch (tab) {
|
||||
case 'my-account':
|
||||
return <MyAccountForm />
|
||||
case 'user-settings':
|
||||
return <EditorSettingsForm />
|
||||
case 'workspace-settings':
|
||||
return <WorkspaceSettingsForm onClose={onClose} />
|
||||
case 'members':
|
||||
return <MembersList />
|
||||
case 'billing':
|
||||
return <BillingContent />
|
||||
default:
|
||||
return null
|
||||
}
|
||||
}
|
||||
1
apps/builder/src/features/workspace/components/index.tsx
Normal file
1
apps/builder/src/features/workspace/components/index.tsx
Normal file
@@ -0,0 +1 @@
|
||||
export { WorkspaceSettingsModal } from './WorkspaceSettingsModal'
|
||||
Reference in New Issue
Block a user