diff --git a/frontend/src/shared/components/Admin/index.tsx b/frontend/src/shared/components/Admin/index.tsx index b3f03f2..3f56856 100644 --- a/frontend/src/shared/components/Admin/index.tsx +++ b/frontend/src/shared/components/Admin/index.tsx @@ -2,6 +2,7 @@ import React, {useState, useRef} from 'react'; import {UserPlus, Checkmark} from 'shared/icons'; import styled, {css} from 'styled-components'; import TaskAssignee from 'shared/components/TaskAssignee'; +import Select from 'shared/components/Select'; import {User, Plus, Lock, Pencil, Trash} from 'shared/icons'; import {usePopup, Popup} from 'shared/components/PopupMenu'; import {RoleCode, useUpdateUserRoleMutation} from 'shared/generated/graphql'; @@ -133,9 +134,10 @@ const TeamRoleManagerPopup: React.FC = ({ {`(${user.role.name})`} )} - {}}>Reset password... - {}}>Lock user... - {}}>Remove from organzation... + { + setTab(3) + }}>Reset password... + setTab(5)}>Remove from organzation... {warning && ( @@ -206,14 +208,68 @@ const TeamRoleManagerPopup: React.FC = ({ + hidePopup()} tab={3}> + + + You can either set the user's new password directly or send the user an email allowing them to reset their own password. + + + setTab(4)} color="warning">Set password... + Send reset link + + + + hidePopup()} tab={4}> + + + + {}} color="danger">Set password + + + hidePopup()} tab={5}> + + + Removing this user from the organzation will remove them from assigned tasks, projects, and teams. + + + The user is the owner of 3 projects & 2 teams. + + {}} value={null} options={[{label: 'Jordan Knott', value: "jordanknott"}]} /> + {}} color="danger">Set password + + ); }; +const UserSelect = styled(Select)` +margin: 8px 0; +padding: 8px 0; +` +const NewUserPassInput = styled(Input)` +margin: 8px 0; +` const InviteMemberButton = styled(Button)` padding: 7px 12px; `; +const UserPassBar = styled.div` +display: flex; +padding-top: 8px; +` +const UserPassConfirmButton = styled(Button)` + width: 100%; + padding: 7px 12px; +` + +const UserPassButton = styled(Button)` + width: 50%; + padding: 7px 12px; + & ~ & { + margin-left: 6px; + } +` + const MemberItemOptions = styled.div``; const MemberItemOption = styled(Button)` @@ -374,9 +430,6 @@ const ActionButtons = (params: any) => { {}}> - {}}> - - params.onDeleteUser($target, params.value)}> diff --git a/frontend/src/shared/components/Select/index.tsx b/frontend/src/shared/components/Select/index.tsx index 0c1a2b7..341cb5a 100644 --- a/frontend/src/shared/components/Select/index.tsx +++ b/frontend/src/shared/components/Select/index.tsx @@ -104,11 +104,12 @@ type SelectProps = { onChange: (e: any) => void; value: any; options: Array; + className?: string; }; -const SelectElement: React.FC = ({ onChange, value, options, label }) => { +const SelectElement: React.FC = ({ onChange, value, options, label, className }) => { return ( - +