All files / src/components/Settings/ManageTeam/Actions/AddTeamMemberModal TeamMemberModal.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { MemberData } from "@customTypes/team.member";
import { palette } from "@palette";
import TeamPanelBody from "features/Permissions/ModalV2/components/TeamPanelBody";
import SwipeableDrawerMobile from "@components/SwipeableDrawerMobile/SwipeableDrawerMobile";
import NiceModal, { useModal } from "@ebay/nice-modal-react";
 
type IProps = {
  open: boolean;
  data?: MemberData;
  setOpen: (open: boolean) => void;
};
export const TeamMemberModal = NiceModal.create(({ data }: IProps) => {
  const modal = useModal();
 
  const bodyProps = {
    rowData: data as MemberData,
    isLoading: false,
    handleClose: () => modal.remove(),
  };
 
  return (
    <SwipeableDrawerMobile
      data-testid="member-mobile-modal"
      anchor="bottom"
      open={modal.visible}
      onClose={() => {
        modal.remove();
      }}
      onOpen={() => undefined}
      PaperProps={{
        sx: {
          background: palette.neutral[5],
          top: "96px",
          paddingBottom: "32px",
          paddingX: "16px",
          position: "relative",
          height: "90%",
        },
      }}
    >
      {data && <TeamPanelBody {...bodyProps} />}
    </SwipeableDrawerMobile>
  );
});