From cf07fe1ac663d981ebbf4c7b59701456f7ce52bb Mon Sep 17 00:00:00 2001 From: Ankita Kinger Date: Mon, 11 Sep 2023 09:44:32 +0530 Subject: [PATCH] fix: Adding invite to app permission to fix share modal getting auto-closed issue (#27106) ## Description A public app that the logged-in user doesn't have access to was auto-closing the share modal when opened. This was happening because we were fetching workspace even when the user did not have the invite to app permission. This is now fixed with this PR. #### PR fixes following issue(s) Fixes [#26870](https://github.com/appsmithorg/appsmith/issues/26870) #### Type of change - Bug fix (non-breaking change which fixes an issue) ## Testing #### How Has This Been Tested? - [x] Manual - [ ] JUnit - [ ] Jest - [x] Cypress ## Checklist: #### Dev activity - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [ ] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [ ] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed --- app/client/src/ce/actions/applicationActions.ts | 5 ----- .../src/ce/constants/ReduxActionConstants.tsx | 1 - app/client/src/ce/constants/messages.ts | 2 +- app/client/src/ce/pages/Applications/index.tsx | 10 +--------- .../reducers/uiReducers/applicationsReducer.tsx | 9 --------- .../src/ce/selectors/applicationSelectors.tsx | 3 --- .../form/FormDialogComponent.tsx | 2 -- .../Navigation/components/ShareButton.tsx | 3 ++- app/client/src/pages/AppViewer/PageMenu.tsx | 5 ----- app/client/src/pages/Editor/EditorHeader.tsx | 3 ++- .../src/pages/workspace/AppInviteUsersForm.tsx | 2 +- app/client/src/pages/workspace/settings.tsx | 10 +--------- app/client/src/utils/hooks/useWorkspace.tsx | 16 +++++++++++++++- 13 files changed, 23 insertions(+), 48 deletions(-) diff --git a/app/client/src/ce/actions/applicationActions.ts b/app/client/src/ce/actions/applicationActions.ts index 3bf3888741..666e45c326 100644 --- a/app/client/src/ce/actions/applicationActions.ts +++ b/app/client/src/ce/actions/applicationActions.ts @@ -175,11 +175,6 @@ export const resetCurrentApplication = () => { }; }; -export const setShowAppInviteUsersDialog = (payload: boolean) => ({ - type: ReduxActionTypes.SET_SHOW_APP_INVITE_USERS_MODAL, - payload, -}); - export const initDatasourceConnectionDuringImportRequest = ( payload: string, ) => ({ diff --git a/app/client/src/ce/constants/ReduxActionConstants.tsx b/app/client/src/ce/constants/ReduxActionConstants.tsx index 1b18dc4226..612e6696bd 100644 --- a/app/client/src/ce/constants/ReduxActionConstants.tsx +++ b/app/client/src/ce/constants/ReduxActionConstants.tsx @@ -136,7 +136,6 @@ const ActionTypes = { FETCH_FEATURE_FLAGS_SUCCESS: "FETCH_FEATURE_FLAGS_SUCCESS", BIND_DATA_TO_WIDGET: "BIND_DATA_TO_WIDGET", BIND_DATA_ON_CANVAS: "BIND_DATA_ON_CANVAS", - SET_SHOW_APP_INVITE_USERS_MODAL: "SET_SHOW_APP_INVITE_USERS_MODAL", UPLOAD_PROFILE_PHOTO: "UPLOAD_PROFILE_PHOTO", REMOVE_PROFILE_PHOTO: "REMOVE_PROFILE_PHOTO", UPDATE_PHOTO_ID: "UPDATE_PHOTO_ID", diff --git a/app/client/src/ce/constants/messages.ts b/app/client/src/ce/constants/messages.ts index 6ddde6320f..8a10ceeed7 100644 --- a/app/client/src/ce/constants/messages.ts +++ b/app/client/src/ce/constants/messages.ts @@ -164,7 +164,7 @@ export const INVITE_TAB = () => "Invite"; export const INVITE_USERS_VALIDATION_EMAIL_LIST = () => `Invalid email address(es) found`; export const INVITE_USERS_VALIDATION_ROLE_EMPTY = () => `Please select a role`; - +export const APPLICATION_INVITE = () => "Application Invite"; export const INVITE_USERS_EMAIL_LIST_PLACEHOLDER = () => `Comma separated emails`; export const INVITE_USERS_ROLE_SELECT_PLACEHOLDER = () => `Select role`; diff --git a/app/client/src/ce/pages/Applications/index.tsx b/app/client/src/ce/pages/Applications/index.tsx index 66ed5440e3..61f95dfc78 100644 --- a/app/client/src/ce/pages/Applications/index.tsx +++ b/app/client/src/ce/pages/Applications/index.tsx @@ -44,10 +44,7 @@ import { TextType, } from "design-system-old"; import { Divider, Icon } from "design-system"; -import { - setShowAppInviteUsersDialog, - updateApplication, -} from "@appsmith/actions/applicationActions"; +import { updateApplication } from "@appsmith/actions/applicationActions"; import { Position } from "@blueprintjs/core/lib/esm/common/position"; import type { UpdateApplicationPayload } from "@appsmith/api/ApplicationApi"; import PerformanceTracker, { @@ -546,10 +543,6 @@ export function ApplicationsSection(props: any) { }); }; - const handleFormOpenOrClose = useCallback((isOpen: boolean) => { - dispatch(setShowAppInviteUsersDialog(isOpen)); - }, []); - let updatedWorkspaces; if (!isLoadingResources) { updatedWorkspaces = userWorkspaces; @@ -659,7 +652,6 @@ export function ApplicationsSection(props: any) { {canInviteToWorkspace && !isMobile && ( , - ) => ({ - ...state, - showAppInviteUsersDialog: action.payload, - }), [ReduxActionTypes.CONNECT_TO_GIT_SUCCESS]: ( state: ApplicationsReduxState, action: ReduxAction, @@ -686,7 +678,6 @@ export interface ApplicationsReduxState { userWorkspaces: Workspaces[]; isSavingWorkspaceInfo: boolean; importingApplication: boolean; - showAppInviteUsersDialog: boolean; importedApplication: unknown; isImportAppModalOpen: boolean; workspaceIdForImport: any; diff --git a/app/client/src/ce/selectors/applicationSelectors.tsx b/app/client/src/ce/selectors/applicationSelectors.tsx index 16a152b47d..e3f88ae7ce 100644 --- a/app/client/src/ce/selectors/applicationSelectors.tsx +++ b/app/client/src/ce/selectors/applicationSelectors.tsx @@ -207,9 +207,6 @@ export const getCurrentAppGitMetaData = createSelector( export const getIsSavingWorkspaceInfo = (state: AppState) => state.ui.applications.isSavingWorkspaceInfo; -export const showAppInviteUsersDialogSelector = (state: AppState) => - state.ui.applications.showAppInviteUsersDialog; - export const getIsDatasourceConfigForImportFetched = (state: AppState) => state.ui.applications.isDatasourceConfigForImportFetched; diff --git a/app/client/src/components/editorComponents/form/FormDialogComponent.tsx b/app/client/src/components/editorComponents/form/FormDialogComponent.tsx index 4174c069e1..7adb4cc6eb 100644 --- a/app/client/src/components/editorComponents/form/FormDialogComponent.tsx +++ b/app/client/src/components/editorComponents/form/FormDialogComponent.tsx @@ -14,7 +14,6 @@ type FormDialogComponentProps = { message?: string; Form: any; onClose?: () => void; - onOpenOrClose?: (isOpen: boolean) => void; applicationId?: string; placeholder?: string; hideDefaultTrigger?: boolean; @@ -29,7 +28,6 @@ export function FormDialogComponent(props: FormDialogComponentProps) { const setIsOpen = (isOpen: boolean) => { setIsModalOpenState(isOpen); - props.onOpenOrClose && props.onOpenOrClose(isOpen); }; const onOpenChange = (isOpen: boolean) => { diff --git a/app/client/src/pages/AppViewer/Navigation/components/ShareButton.tsx b/app/client/src/pages/AppViewer/Navigation/components/ShareButton.tsx index a3544aefb5..9588ce3953 100644 --- a/app/client/src/pages/AppViewer/Navigation/components/ShareButton.tsx +++ b/app/client/src/pages/AppViewer/Navigation/components/ShareButton.tsx @@ -10,6 +10,7 @@ import { NAVIGATION_SETTINGS } from "constants/AppConstants"; import { get } from "lodash"; import type { ApplicationPayload } from "@appsmith/constants/ReduxActionConstants"; import { + APPLICATION_INVITE, createMessage, INVITE_USERS_PLACEHOLDER, SHARE_APP, @@ -80,7 +81,7 @@ const ShareButton = (props: ShareButtonProps) => { isOpen={showModal} onClose={() => setShowModal(false)} placeholder={createMessage(INVITE_USERS_PLACEHOLDER, cloudHosting)} - title={currentApplicationDetails?.name} + title={createMessage(APPLICATION_INVITE)} workspace={{ id: currentWorkspaceId }} /> )} diff --git a/app/client/src/pages/AppViewer/PageMenu.tsx b/app/client/src/pages/AppViewer/PageMenu.tsx index 5436428ad3..f810b07aa6 100644 --- a/app/client/src/pages/AppViewer/PageMenu.tsx +++ b/app/client/src/pages/AppViewer/PageMenu.tsx @@ -80,11 +80,6 @@ export function PageMenu(props: NavigationProps) { }); } - // TODO: Rahul - Check how to use this function in the new layout. - // const handleFormOpenOrClose = useCallback((isOpen: boolean) => { - // dispatch(setShowAppInviteUsersDialog(isOpen)); - // }, []); - return ( <> {/* BG OVERLAY */} diff --git a/app/client/src/pages/Editor/EditorHeader.tsx b/app/client/src/pages/Editor/EditorHeader.tsx index 0527734b54..69f671b9e2 100644 --- a/app/client/src/pages/Editor/EditorHeader.tsx +++ b/app/client/src/pages/Editor/EditorHeader.tsx @@ -86,6 +86,7 @@ import { RENAME_APPLICATION_TOOLTIP, SHARE_BUTTON_TOOLTIP, SHARE_BUTTON_TOOLTIP_WITH_USER, + APPLICATION_INVITE, } from "@appsmith/constants/messages"; import { getExplorerPinned } from "selectors/explorerSelector"; import { @@ -539,7 +540,7 @@ export function EditorHeader() { open={showModal} > - Application Invite + {createMessage(APPLICATION_INVITE)} setActiveTab(value)} diff --git a/app/client/src/pages/workspace/AppInviteUsersForm.tsx b/app/client/src/pages/workspace/AppInviteUsersForm.tsx index 1ab93ac16f..5aa7503ab7 100644 --- a/app/client/src/pages/workspace/AppInviteUsersForm.tsx +++ b/app/client/src/pages/workspace/AppInviteUsersForm.tsx @@ -60,7 +60,7 @@ function AppInviteUsersForm(props: any) { const [isCopied, setIsCopied] = useState(false); const currentWorkspaceId = useSelector(getCurrentWorkspaceId); const currentWorkspace = useWorkspace(currentWorkspaceId); - const userWorkspacePermissions = currentWorkspace.userPermissions ?? []; + const userWorkspacePermissions = currentWorkspace?.userPermissions ?? []; const userAppPermissions = currentApplicationDetails?.userPermissions ?? []; const canInviteToApplication = hasInviteUserToApplicationPermission([ ...userWorkspacePermissions, diff --git a/app/client/src/pages/workspace/settings.tsx b/app/client/src/pages/workspace/settings.tsx index f66259d4b4..5cf3113f57 100644 --- a/app/client/src/pages/workspace/settings.tsx +++ b/app/client/src/pages/workspace/settings.tsx @@ -14,10 +14,7 @@ import { Tabs, Tab, TabsList, TabPanel } from "design-system"; import MemberSettings from "@appsmith/pages/workspace/Members"; import { GeneralSettings } from "./General"; import * as Sentry from "@sentry/react"; -import { - getAllApplications, - setShowAppInviteUsersDialog, -} from "@appsmith/actions/applicationActions"; +import { getAllApplications } from "@appsmith/actions/applicationActions"; import { useMediaQuery } from "react-responsive"; import { BackButton, StickyHeader } from "components/utils/helperComponents"; import { debounce } from "lodash"; @@ -159,10 +156,6 @@ export default function Settings() { } }, [dispatch, currentWorkspace]); - const handleFormOpenOrClose = useCallback((isOpen: boolean) => { - dispatch(setShowAppInviteUsersDialog(isOpen)); - }, []); - const GeneralSettingsComponent = ( setShowModal(false)} - onOpenOrClose={handleFormOpenOrClose} placeholder={createMessage(INVITE_USERS_PLACEHOLDER, cloudHosting)} workspace={currentWorkspace} /> diff --git a/app/client/src/utils/hooks/useWorkspace.tsx b/app/client/src/utils/hooks/useWorkspace.tsx index 491bb1fbdb..bef1e1a707 100644 --- a/app/client/src/utils/hooks/useWorkspace.tsx +++ b/app/client/src/utils/hooks/useWorkspace.tsx @@ -5,16 +5,30 @@ import { getCurrentUser } from "selectors/usersSelectors"; import { getCurrentAppWorkspace } from "@appsmith/selectors/workspaceSelectors"; import { ANONYMOUS_USERNAME } from "constants/userConstants"; +import { getCurrentApplication } from "selectors/editorSelectors"; +import { hasInviteUserToApplicationPermission } from "@appsmith/utils/permissionHelpers"; const useWorkspace = (workspaceId: string) => { const dispatch = useDispatch(); const workspace = useSelector(getCurrentAppWorkspace); const currentUser = useSelector(getCurrentUser); + const currentApplicationDetails = useSelector(getCurrentApplication); + + const userWorkspacePermissions = workspace?.userPermissions ?? []; + const userAppPermissions = currentApplicationDetails?.userPermissions ?? []; + const canInviteToApplication = hasInviteUserToApplicationPermission([ + ...userWorkspacePermissions, + ...userAppPermissions, + ]); useEffect(() => { if (!currentUser || currentUser.username === ANONYMOUS_USERNAME) return; - if ((!workspace || !workspace.userPermissions) && workspaceId) { + if ( + (!workspace || !workspace?.userPermissions) && + workspaceId && + canInviteToApplication + ) { dispatch(fetchWorkspace(workspaceId, true)); } }, [workspaceId, currentUser && currentUser.username]);