feat: Add dedicated button to make project private

client/src/components/common/ConfirmationStep/ConfirmationStep.jsx

@@ -19,7 +19,17 @@ const ButtonTypes = {
 };
 
 const ConfirmationStep = React.memo(
-  ({ title, content, buttonType, buttonContent, typeValue, typeContent, onConfirm, onBack }) => {
+  ({
+    title,
+    content,
+    buttonType,
+    buttonContent,
+    typeValue,
+    typeContent,
+    onConfirm,
+    onBack,
+    onClose,
+  }) => {
     const [t] = useTranslation();
 
     const [data, handleFieldChange] = useForm({
@@ -45,8 +55,12 @@ const ConfirmationStep = React.memo(
         }
 
         onConfirm();
+
+        if (onClose) {
+          onClose();
+        }
       },
-      [typeValue, onConfirm, data, nameFieldRef],
+      [typeValue, onConfirm, onClose, data, nameFieldRef],
     );
 
     useEffect(() => {
@@ -101,6 +115,7 @@ ConfirmationStep.propTypes = {
   typeContent: PropTypes.string,
   onConfirm: PropTypes.func.isRequired,
   onBack: PropTypes.func,
+  onClose: PropTypes.func,
 };
 
 ConfirmationStep.defaultProps = {
@@ -108,6 +123,7 @@ ConfirmationStep.defaultProps = {
   typeValue: undefined,
   typeContent: undefined,
   onBack: undefined,
+  onClose: undefined,
 };
 
 export default ConfirmationStep;

client/src/components/projects/ProjectSettingsModal/ManagersPane.jsx

@@ -17,6 +17,8 @@ import ProjectManagers from '../../project-managers/ProjectManagers';
 import styles from './ManagersPane.module.scss';
 
 const ManagersPane = React.memo(() => {
+  const projectManagers = useSelector(selectors.selectManagersForCurrentProject);
+
   // TODO: rename?
   const isShared = useSelector(
     (state) => !selectors.selectCurrentProject(state).ownerProjectManagerId,
@@ -25,45 +27,62 @@ const ManagersPane = React.memo(() => {
   const dispatch = useDispatch();
   const [t] = useTranslation();
 
-  const handleMakeSharedConfirm = useCallback(() => {
+  const firstProjectManager = projectManagers[0];
+
+  const handleToggleSharedConfirm = useCallback(() => {
     dispatch(
       entryActions.updateCurrentProject({
-        ownerProjectManagerId: null,
+        ownerProjectManagerId: isShared ? firstProjectManager.id : null,
       }),
     );
-  }, [dispatch]);
+  }, [firstProjectManager, isShared, dispatch]);
 
   const ConfirmationPopup = usePopupInClosableContext(ConfirmationStep);
 
+  let toggleSharedButtonContent;
+  if (isShared) {
+    toggleSharedButtonContent =
+      projectManagers.length === 1
+        ? t('action.makeProjectPrivate', {
+            context: 'title',
+          })
+        : t('common.onlyOneManagerShouldRemainToMakeThisProjectPrivate');
+  } else {
+    toggleSharedButtonContent = t('action.makeProjectShared', {
+      context: 'title',
+    });
+  }
+
   return (
     <Tab.Pane attached={false} className={styles.wrapper}>
       <ProjectManagers />
-      {!isShared && (
-        <>
-          <Divider horizontal section>
-            <Header as="h4">
-              {t('common.dangerZone', {
-                context: 'title',
-              })}
-            </Header>
-          </Divider>
-          <div className={styles.action}>
-            <ConfirmationPopup
-              title="common.makeProjectShared"
-              content="common.areYouSureYouWantToMakeThisProjectShared"
-              buttonType="positive"
-              buttonContent="action.makeProjectShared"
-              onConfirm={handleMakeSharedConfirm}
-            >
-              <Button className={styles.actionButton}>
-                {t('action.makeProjectShared', {
-                  context: 'title',
-                })}
-              </Button>
-            </ConfirmationPopup>
-          </div>
-        </>
-      )}
+      <Divider horizontal section>
+        <Header as="h4">
+          {t('common.dangerZone', {
+            context: 'title',
+          })}
+        </Header>
+      </Divider>
+      <div className={styles.action}>
+        <ConfirmationPopup
+          title={isShared ? 'common.makeProjectPrivate' : 'common.makeProjectShared'}
+          content={
+            isShared
+              ? 'common.areYouSureYouWantToMakeThisProjectPrivate'
+              : 'common.areYouSureYouWantToMakeThisProjectShared'
+          }
+          buttonType="positive"
+          buttonContent={isShared ? 'action.makeProjectPrivate' : 'action.makeProjectShared'}
+          onConfirm={handleToggleSharedConfirm}
+        >
+          <Button
+            disabled={isShared && projectManagers.length !== 1}
+            className={styles.actionButton}
+          >
+            {toggleSharedButtonContent}
+          </Button>
+        </ConfirmationPopup>
+      </div>
     </Tab.Pane>
   );
 });

client/src/components/projects/ProjectSettingsModal/ManagersPane.module.scss

@@ -14,7 +14,7 @@
     transition: background 0.3s ease;
     width: 100%;
 
-    &:hover {
+    &:has(:enabled):hover {
       background: #e9e9e9;
     }
   }

client/src/locales/en-GB/core.js

@@ -74,6 +74,8 @@ export default {
       areYouSureYouWantToEmptyTrash: 'Are you sure you want to empty the trash?',
       areYouSureYouWantToLeaveBoard: 'Are you sure you want to leave the board?',
       areYouSureYouWantToLeaveProject: 'Are you sure you want to leave the project?',
+      areYouSureYouWantToMakeThisProjectPrivate:
+        'Are you sure you want to make this project private?',
       areYouSureYouWantToMakeThisProjectShared:
         'Are you sure you want to make this project shared?',
       areYouSureYouWantToRemoveThisManagerFromProject:
@@ -211,6 +213,7 @@ export default {
       list: 'List',
       listActions_title: 'List Actions',
       lists: 'Lists',
+      makeProjectPrivate_title: 'Make Project Private',
       makeProjectShared_title: 'Make Project Shared',
       managers: 'Managers',
       memberActions_title: 'Member Actions',
@@ -234,6 +237,8 @@ export default {
       noUnreadNotifications: 'No unread notifications.',
       notifications: 'Notifications',
       oldestFirst: 'Oldest first',
+      onlyOneManagerShouldRemainToMakeThisProjectPrivate:
+        'Only one manager should remain to make this project private',
       openBoard_title: 'Open Board',
       optional_inline: 'optional',
       organization: 'Organization',
@@ -417,6 +422,8 @@ export default {
       leaveProject: 'Leave project',
       logOut_title: 'Log Out',
       makeCover_title: 'Make Cover',
+      makeProjectPrivate: 'Make project private',
+      makeProjectPrivate_title: 'Make Project Private',
       makeProjectShared: 'Make project shared',
       makeProjectShared_title: 'Make Project Shared',
       move: 'Move',

client/src/locales/en-US/core.js

@@ -69,6 +69,8 @@ export default {
       areYouSureYouWantToEmptyTrash: 'Are you sure you want to empty the trash?',
       areYouSureYouWantToLeaveBoard: 'Are you sure you want to leave the board?',
       areYouSureYouWantToLeaveProject: 'Are you sure you want to leave the project?',
+      areYouSureYouWantToMakeThisProjectPrivate:
+        'Are you sure you want to make this project private?',
       areYouSureYouWantToMakeThisProjectShared:
         'Are you sure you want to make this project shared?',
       areYouSureYouWantToRemoveThisManagerFromProject:
@@ -206,6 +208,7 @@ export default {
       list: 'List',
       listActions_title: 'List Actions',
       lists: 'Lists',
+      makeProjectPrivate_title: 'Make Project Private',
       makeProjectShared_title: 'Make Project Shared',
       managers: 'Managers',
       memberActions_title: 'Member Actions',
@@ -229,6 +232,8 @@ export default {
       noUnreadNotifications: 'No unread notifications.',
       notifications: 'Notifications',
       oldestFirst: 'Oldest first',
+      onlyOneManagerShouldRemainToMakeThisProjectPrivate:
+        'Only one manager should remain to make this project private',
       openBoard_title: 'Open Board',
       optional_inline: 'optional',
       organization: 'Organization',
@@ -412,6 +417,8 @@ export default {
       leaveProject: 'Leave project',
       logOut_title: 'Log Out',
       makeCover_title: 'Make Cover',
+      makeProjectPrivate: 'Make project private',
+      makeProjectPrivate_title: 'Make Project Private',
       makeProjectShared: 'Make project shared',
       makeProjectShared_title: 'Make Project Shared',
       move: 'Move',