import React, { useEffect, useMemo, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { Modal, Select, SegmentedControl, Text, Group, Button, Stack } from '@mantine/core';
import { showNotification } from '@mantine/notifications';
import { __, sprintf } from '@wordpress/i18n';
import { hasPermissionOrWpAdmin } from '../../../../ui/permissions';
import { fetchAllProjects } from '../../../../Settings/store/projectSlice';
import { moveTask, fetchMoveTargetSections, closeTaskEditDrawer } from '../../../../Settings/store/taskSlice';

// Copy or move a top-level task into another project. `canMove` mirrors the
// server's source-side gate (creator/assignee or manage-tasks-by-others); the
// target list mirrors its target-side gate (create-task).
const MoveTaskModal = ({ opened, onClose, taskData, canMove, isDrawer }) => {
    const dispatch = useDispatch();
    const { loggedInUser } = useSelector((state) => state.auth.session);
    const projects = useSelector((state) => state.settings.project.projects);
    const projectPermissionMap = useSelector((state) => state.auth.permissions.projects);
    const targetSections = useSelector((state) => state.settings.task.moveTargetSections);

    const [mode, setMode] = useState(canMove ? 'move' : 'copy');
    const [projectId, setProjectId] = useState(null);
    const [sectionId, setSectionId] = useState(null);
    const [submitting, setSubmitting] = useState(false);

    useEffect(() => {
        if (!opened) return;
        setMode(canMove ? 'move' : 'copy');
        setProjectId(null);
        setSectionId(null);
        if (!projects || projects.length === 0) {
            dispatch(fetchAllProjects());
        }
    }, [opened]);

    useEffect(() => {
        if (opened && projectId) {
            setSectionId(null);
            dispatch(fetchMoveTargetSections(projectId));
        }
    }, [opened, projectId, dispatch]);

    // Preselect the first regular section once the target's sections arrive.
    useEffect(() => {
        if (!projectId || sectionId || !targetSections?.length) return;
        const first = targetSections.find((s) => s.mark_is_complete !== 'complete') || targetSections[0];
        setSectionId(String(first.id));
    }, [targetSections, projectId, sectionId]);

    const eligibleProjects = useMemo(() => (projects || []).filter((p) =>
        String(p.id) !== String(taskData?.project_id)
        && hasPermissionOrWpAdmin(loggedInUser, ['create-task'], projectPermissionMap?.[String(p.id)]?.permissions ?? [], 'project')
    ), [projects, taskData?.project_id, loggedInUser, projectPermissionMap]);

    // Grouped by workspace, since a task may go to a project in another workspace.
    const projectOptions = useMemo(() => {
        const groups = {};
        eligibleProjects.forEach((p) => {
            const group = p.company_name || __('Other', 'lazytasks-project-task-management');
            (groups[group] = groups[group] || []).push({ value: String(p.id), label: p.name });
        });
        return Object.entries(groups).map(([group, items]) => ({ group, items }));
    }, [eligibleProjects]);

    const sectionOptions = (targetSections || []).map((s) => ({ value: String(s.id), label: s.name }));

    // People on the task who are not in the target yet; the server adds them.
    const peopleToAdd = useMemo(() => {
        const target = eligibleProjects.find((p) => String(p.id) === String(projectId));
        if (!target) return [];
        const memberIds = new Set((target.members || []).map((m) => String(m.id)));
        const people = new Map();
        if (taskData?.assigned_to?.id) people.set(String(taskData.assigned_to.id), taskData.assigned_to.name);
        (taskData?.members || []).forEach((m) => m?.id && people.set(String(m.id), m.name));
        return [...people.entries()].filter(([id]) => !memberIds.has(id)).map(([, name]) => name);
    }, [eligibleProjects, projectId, taskData]);

    const handleSubmit = () => {
        if (!projectId || !sectionId) return;
        setSubmitting(true);
        dispatch(moveTask({
            id: taskData.id,
            data: { project_id: Number(projectId), section_id: Number(sectionId), mode },
        })).then((response) => {
            setSubmitting(false);
            const ok = response.payload?.status === 200;
            showNotification({
                title: __('Task', 'lazytasks-project-task-management'),
                message: response.payload?.message || (ok ? '' : __('Something went wrong. Please try again.', 'lazytasks-project-task-management')),
                autoClose: ok ? 3000 : 5000,
                color: ok ? 'green' : 'red',
            });
            if (!ok) return;
            onClose();
            if (mode === 'move' && isDrawer) {
                dispatch(closeTaskEditDrawer());
            }
        });
    };

    return (
        <Modal
            opened={opened}
            onClose={onClose}
            centered
            size="md"
            zIndex={3000}
            title={<Text fw={600}>{__('Copy / Move to project', 'lazytasks-project-task-management')}</Text>}
        >
            <Stack gap="md">
                <SegmentedControl
                    fullWidth
                    value={mode}
                    onChange={setMode}
                    data={[
                        { value: 'move', label: __('Move', 'lazytasks-project-task-management'), disabled: !canMove },
                        { value: 'copy', label: __('Copy', 'lazytasks-project-task-management') },
                    ]}
                />
                <Text size="sm" c="dimmed">
                    {mode === 'move'
                        ? __('The task, its subtasks, comments and attachments move to the selected project.', 'lazytasks-project-task-management')
                        : __('A copy of the task and its subtasks is created in the selected project. The original stays here.', 'lazytasks-project-task-management')}
                </Text>
                {!canMove && (
                    <Text size="xs" c="dimmed">
                        {__('Only the creator, the assignee or someone who can manage others’ tasks can move this task.', 'lazytasks-project-task-management')}
                    </Text>
                )}
                <Select
                    label={__('Project', 'lazytasks-project-task-management')}
                    placeholder={__('Select a project', 'lazytasks-project-task-management')}
                    data={projectOptions}
                    value={projectId}
                    onChange={setProjectId}
                    searchable
                    nothingFoundMessage={__('No project where you can create tasks', 'lazytasks-project-task-management')}
                    comboboxProps={{ zIndex: 3001 }}
                />
                <Select
                    label={__('Section', 'lazytasks-project-task-management')}
                    placeholder={__('Select a section', 'lazytasks-project-task-management')}
                    data={sectionOptions}
                    value={sectionId}
                    onChange={setSectionId}
                    disabled={!projectId}
                    comboboxProps={{ zIndex: 3001 }}
                />
                {peopleToAdd.length > 0 && (
                    <Text size="xs" c="dimmed">
                        {sprintf(
                            /* translators: %s: comma-separated names */
                            __('Will be added to the project: %s', 'lazytasks-project-task-management'),
                            peopleToAdd.join(', ')
                        )}
                    </Text>
                )}
                <Group justify="flex-end" gap="xs">
                    <Button variant="default" onClick={onClose}>
                        {__('Cancel', 'lazytasks-project-task-management')}
                    </Button>
                    <Button color="orange" onClick={handleSubmit} loading={submitting} disabled={!projectId || !sectionId}>
                        {mode === 'move'
                            ? __('Move', 'lazytasks-project-task-management')
                            : __('Copy', 'lazytasks-project-task-management')}
                    </Button>
                </Group>
            </Stack>
        </Modal>
    );
};

export default MoveTaskModal;