Project managers, board members, auto-update after reconnection, refactoring

2021-06-24 01:05:22 +05:00
parent 7956503a46
commit fe91b5241e
478 changed files with 21215 additions and 19484 deletions
@@ -0,0 +1,110 @@
+import React, { useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { useTranslation } from 'react-i18next';
+import { Button } from 'semantic-ui-react';
+import { withPopup } from '../../lib/popup';
+
+import { useSteps } from '../../hooks';
+import User from '../User';
+import DeleteStep from '../DeleteStep';
+
+import styles from './ActionsPopup.module.scss';
+
+const StepTypes = {
+  DELETE: 'DELETE',
+};
+
+const ActionsStep = React.memo(
+  ({
+    user,
+    leaveButtonContent,
+    leaveConfirmationTitle,
+    leaveConfirmationContent,
+    leaveConfirmationButtonContent,
+    deleteButtonContent,
+    deleteConfirmationTitle,
+    deleteConfirmationContent,
+    deleteConfirmationButtonContent,
+    canLeave,
+    canDelete,
+    onDelete,
+  }) => {
+    const [t] = useTranslation();
+    const [step, openStep, handleBack] = useSteps();
+
+    const handleDeleteClick = useCallback(() => {
+      openStep(StepTypes.DELETE);
+    }, [openStep]);
+
+    if (step && step.type === StepTypes.DELETE) {
+      return (
+        <DeleteStep
+          title={t(user.isCurrent ? leaveConfirmationTitle : deleteConfirmationTitle, {
+            context: 'title',
+          })}
+          content={t(user.isCurrent ? leaveConfirmationContent : deleteConfirmationContent)}
+          buttonContent={t(
+            user.isCurrent ? leaveConfirmationButtonContent : deleteConfirmationButtonContent,
+          )}
+          onConfirm={onDelete}
+          onBack={handleBack}
+        />
+      );
+    }
+
+    return (
+      <>
+        <span className={styles.user}>
+          <User name={user.name} avatarUrl={user.avatarUrl} size="large" />
+        </span>
+        <span className={styles.content}>
+          <div className={styles.name}>{user.name}</div>
+          <div className={styles.email}>{user.email}</div>
+          {user.isCurrent
+            ? canLeave && (
+                <Button
+                  content={t(leaveButtonContent)}
+                  className={styles.deleteButton}
+                  onClick={handleDeleteClick}
+                />
+              )
+            : canDelete && (
+                <Button
+                  content={t(deleteButtonContent)}
+                  className={styles.deleteButton}
+                  onClick={handleDeleteClick}
+                />
+              )}
+        </span>
+      </>
+    );
+  },
+);
+
+ActionsStep.propTypes = {
+  user: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
+  leaveButtonContent: PropTypes.string,
+  leaveConfirmationTitle: PropTypes.string,
+  leaveConfirmationContent: PropTypes.string,
+  leaveConfirmationButtonContent: PropTypes.string,
+  deleteButtonContent: PropTypes.string,
+  deleteConfirmationTitle: PropTypes.string,
+  deleteConfirmationContent: PropTypes.string,
+  deleteConfirmationButtonContent: PropTypes.string,
+  canLeave: PropTypes.bool.isRequired,
+  canDelete: PropTypes.bool.isRequired,
+  onDelete: PropTypes.func.isRequired,
+};
+
+ActionsStep.defaultProps = {
+  leaveButtonContent: 'action.leaveBoard',
+  leaveConfirmationTitle: 'common.leaveBoard',
+  leaveConfirmationContent: 'common.areYouSureYouWantToLeaveBoard',
+  leaveConfirmationButtonContent: 'action.leaveBoard',
+  deleteButtonContent: 'action.removeFromBoard',
+  deleteConfirmationTitle: 'common.removeMember',
+  deleteConfirmationContent: 'common.areYouSureYouWantToRemoveThisMemberFromBoard',
+  deleteConfirmationButtonContent: 'action.removeMember',
+};
+
+export default withPopup(ActionsStep);