export function TaskAction()

in frontend/src/views/taskAction.js [24:96]
71 lines of code
14 McCabe index (conditional complexity)

export function TaskAction({ project, action }: Object) {
  const userDetails = useSelector((state) => state.auth.get('userDetails'));
  const token = useSelector((state) => state.auth.get('token'));
  const locale = useSelector((state) => state.preferences.locale);
  // eslint-disable-next-line
  const [editor, setEditor] = useQueryParam('editor', StringParam);
  const [tasks, setTasks] = useState([]);
  const [loading, setLoading] = useState(true);
  useEffect(() => {
    if (userDetails.id && token && action && project) {
      fetchLocalJSONAPI(`users/queries/tasks/locked/details/`, token, 'GET', locale)
        .then((res) => {
          setTasks(res.tasks);
          setLoading(false);
        })
        .catch((e) => navigate(`/projects/${project}/tasks/`));
    }
  }, [action, userDetails.id, token, project, locale]);
  if (token) {
    if (loading) {
      return (
        <ReactPlaceholder
          showLoadingAnimation={true}
          type="text"
          rows={4}
          delay={10}
          ready={!loading}
        >
          Loading...
        </ReactPlaceholder>
      );
    }
    // if user has not locked tasks on the system, suggest him to go to the task selection page of the current project
    if (tasks.length === 0) {
      return (
        <div className="cf pull-center pa4">
          <p>
            <FormattedMessage
              {...messages.noLockedTasksMessage}
              values={{ currentProject: project }}
            />
          </p>
          <Button
            className="bg-primary white"
            onClick={() => navigate(`/projects/${project}/tasks/`)}
          >
            <FormattedMessage {...messages.goToProjectButton} values={{ project: project }} />
          </Button>
        </div>
      );
    }
    // if user has locked tasks on another project, suggest him to go update it
    if (tasks.length > 0 && tasks[0].projectId !== Number(project)) {
      const action = tasks[0].taskStatus === 'LOCKED_FOR_VALIDATION' ? 'validate' : 'map';
      return (
        <div className="cf tc blue-dark pull-center pa4">
          <AnotherProjectLock
            projectId={tasks[0].projectId}
            action={action}
            lockedTasksLength={tasks.length}
          />
        </div>
      );
    }
    if (tasks.length > 0 && tasks[0].projectId === Number(project)) {
      return <TaskActionPossible project={project} tasks={tasks} action={action} editor={editor} />;
    }
  } else {
    return (
      <Login redirectTo={`/projects/${project}/${action === 'VALIDATION' ? 'validate' : 'map'}/`} />
    );
  }
}