diff --git a/app/client/src/components/editorComponents/form/FormDialogComponent.tsx b/app/client/src/components/editorComponents/form/FormDialogComponent.tsx
index 8fd3cd035e..db9c3d95b6 100644
--- a/app/client/src/components/editorComponents/form/FormDialogComponent.tsx
+++ b/app/client/src/components/editorComponents/form/FormDialogComponent.tsx
@@ -7,6 +7,9 @@ import { isPermitted } from "pages/Applications/permissionHelpers";
const StyledDialog = styled(Dialog)<{ setMaxWidth?: boolean }>`
&& {
background: white;
+ & .bp3-dialog-header {
+ padding: 36px;
+ }
& .bp3-dialog-footer-actions {
display: block;
}
@@ -68,4 +71,4 @@ export const FormDialogComponent = (props: FormDialogComponentProps) => {
);
};
-export default connect()(FormDialogComponent);
+export default connect()(FormDialogComponent);
\ No newline at end of file
diff --git a/app/client/src/pages/organization/InviteUsersFromv2.tsx b/app/client/src/pages/organization/InviteUsersFromv2.tsx
index 6cb635a1c7..def5938daa 100644
--- a/app/client/src/pages/organization/InviteUsersFromv2.tsx
+++ b/app/client/src/pages/organization/InviteUsersFromv2.tsx
@@ -11,22 +11,28 @@ import {
getRoles,
getDefaultRole,
getRolesForField,
+ getAllUsers,
} from "selectors/organizationSelectors";
import { ReduxActionTypes } from "constants/ReduxActionConstants";
import { InviteUsersToOrgFormValues, inviteUsersToOrg } from "./helpers";
import { OrgRole } from "constants/orgConstants";
import { INVITE_USERS_TO_ORG_FORM } from "constants/forms";
+import { Classes } from "@blueprintjs/core";
const StyledForm = styled.div`
width: 100%;
background: white;
- padding: ${props => props.theme.spaces[11]}px;
+ padding: ${props => props.theme.spaces[5]}px;
&&& {
.bp3-input {
box-shadow: none;
}
}
+ .manageUsers {
+ float: right;
+ margin-top: 12px;
+ }
`;
const StyledInviteFieldGroup = styled.div`
&& {
@@ -35,22 +41,37 @@ const StyledInviteFieldGroup = styled.div`
flex-wrap: none;
justify-content: space-between;
align-items: flex-start;
+ }
- & > div {
- min-width: 150px;
- margin: 0em 1em 1em 0em;
- }
- & > div:last-of-type {
- min-width: 0;
- display: flex;
- align-self: center;
- }
+ .bp3-popover-target {
+ padding-right: 10px;
+ padding-top: 5px;
+ }
+`;
+
+const UserList = styled.div`
+ max-height: 100px;
+ overflow-y: scroll;
+ .user {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ margin-top: 8px;
+ margin-bottom: 8px;
+ }
+`;
+
+const StyledButton = styled(Button)`
+ &&&.${Classes.BUTTON} {
+ width: 100px;
+ height: 32px;
}
`;
const InviteUsersForm = (props: any) => {
- const { handleSubmit } = props;
+ const { handleSubmit, allUsers } = props;
useEffect(() => {
+ props.fetchUser(props.orgId);
props.fetchAllRoles(props.orgId);
}, [props.orgId]);
@@ -66,21 +87,41 @@ const InviteUsersForm = (props: any) => {
intent="success"
/>
-
-