ISSUE #5149 - create update permission modal & co

frontend/src/v5/ui/components/shared/modalsDispatcher/templates/infoModal/infoModal.component.tsx

@@ -19,15 +19,17 @@ import { Button, DialogContent, DialogContentText, DialogTitle } from '@mui/mate
 import { Modal, ModalContent, Actions, CloseButton } from '@components/shared/modalsDispatcher/modalsDispatcher.styles';
 import { formatMessage } from '@/v5/services/intl';
 import CloseIcon from '@assets/icons/outlined/close-outlined.svg';
+import { ReactNode } from 'react';
 
-interface IInfoModal {
+export interface IInfoModal {
 	title: string;
-	message: string;
+	message: string | ReactNode;
 	primaryButtonLabel?: string;
 	secondaryButtonLabel?: string;
 	open: boolean,
 	onClickClose?: () => void;
 	onClickSecondary?: () => void;
+	Icon?: ReactNode;
 }
 
 export const InfoModal = ({
@@ -41,9 +43,11 @@ export const InfoModal = ({
 	onClickClose,
 	onClickSecondary,
 	open,
+	Icon,
 }: IInfoModal) => (
 	<Modal open={open} onClose={onClickClose}>
 		<ModalContent>
+			{Icon && <Icon />}
 			<DialogTitle>
 				{ title }
 			</DialogTitle>

frontend/src/v5/ui/components/shared/updatePermissionModal/suppressPermissionModalToggle.component.tsx

@@ -0,0 +1,44 @@
+/**
+ *  Copyright (C) 2024 3D Repo Ltd
+ *
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as
+ *  published by the Free Software Foundation, either version 3 of the
+ *  License, or (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { Toggle } from '@controls/inputs/toggle/toggle.component';
+import { isPermissionModalSuppressed, setPermissionModalSuppressed } from './updatePermissionModal.helpers';
+import { FormattedMessage } from 'react-intl';
+import { Container } from './suppressPermissionModalToggle.styles';
+import { useState } from 'react';
+
+export const SuppressPermissionModalToggle = () => {
+	const [suppressModal, setSuppressModal] = useState(isPermissionModalSuppressed());
+
+	const onChange = (e, checked) => {
+		setSuppressModal(checked);
+		setPermissionModalSuppressed(checked);
+	};
+
+	return (
+		<Container>
+			<Toggle
+				onChange={onChange}
+				value={suppressModal}
+				label={<FormattedMessage
+					id="SuppressPermissionModal.toggle"
+					defaultMessage="Suppress permission change notification"
+				/>}
+			/>
+		</Container>
+	);
+};

frontend/src/v5/ui/components/shared/updatePermissionModal/suppressPermissionModalToggle.styles.ts

@@ -0,0 +1,25 @@
+/**
+ *  Copyright (C) 2024 3D Repo Ltd
+ *
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as
+ *  published by the Free Software Foundation, either version 3 of the
+ *  License, or (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import styled from 'styled-components';
+
+export const Container = styled.div`
+	margin: auto;
+	width: 100%;
+	display: flex;
+	justify-content: center;
+`;

frontend/src/v5/ui/components/shared/updatePermissionModal/updatePermissionModal.component.tsx

@@ -0,0 +1,52 @@
+/**
+ *  Copyright (C) 2024 3D Repo Ltd
+ *
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as
+ *  published by the Free Software Foundation, either version 3 of the
+ *  License, or (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { DialogsActionsDispatchers } from '@/v5/services/actionsDispatchers';
+import { IInfoModal, InfoModal } from '../modalsDispatcher/templates/infoModal/infoModal.component';
+import { formatMessage } from '@/v5/services/intl';
+import { isPermissionModalSuppressed } from './updatePermissionModal.helpers';
+import { WarningIcon } from '../modalsDispatcher/modalsDispatcher.styles';
+
+type UpdatePermissionProps = {
+	onConfirm: () => void,
+	permissionType: string,
+	permissionsChange?: number,
+};
+export const UpdatePermissionModal = ({ onConfirm, permissionType, permissionsChange = 1, ...props }: IInfoModal & UpdatePermissionProps) => (
+	<InfoModal
+		Icon={WarningIcon}
+		primaryButtonLabel='Cancel'
+		secondaryButtonLabel='Continue'
+		onClickSecondary={onConfirm}
+		message={formatMessage({
+			id: 'permissionsModal.message',
+			defaultMessage: `
+				You are about to change {permissionsChange} {permissionsChange, plural, one {user} other {users}}
+				permissions to {permissionType}.{br}Are you sure you would like to proceed?
+			`,
+		}, { permissionsChange, permissionType, br: <br /> })}
+		{...props}
+	/>
+);
+
+export const updatePermissionsOrTriggerModal = (props: UpdatePermissionProps) => {
+	if (isPermissionModalSuppressed()) {
+		props.onConfirm();
+		return;
+	}
+	DialogsActionsDispatchers.open(UpdatePermissionModal, props);
+};

frontend/src/v5/ui/components/shared/updatePermissionModal/updatePermissionModal.helpers.ts

@@ -0,0 +1,20 @@
+/**
+ *  Copyright (C) 2024 3D Repo Ltd
+ *
+ *  This program is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU Affero General Public License as
+ *  published by the Free Software Foundation, either version 3 of the
+ *  License, or (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU Affero General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Affero General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+const SUPPRESS_PERMISSION_MODAL = 'suppressPermissionModal';
+export const isPermissionModalSuppressed = () => JSON.parse(sessionStorage.getItem(SUPPRESS_PERMISSION_MODAL) || 'false');
+export const setPermissionModalSuppressed = (suppress: boolean) => sessionStorage.setItem(SUPPRESS_PERMISSION_MODAL, JSON.stringify(suppress));