import React, {useCallback} from 'react';
import {View} from 'react-native';
import {useTranslation} from 'react-i18next';
import {useSafeAreaBottomPadding} from '@hooks/useSafeAreaBottomPadding';
import {Navigation} from '@interfaces/navigation';
import {useAgentWorkspaceTasksList} from '@modules/serviceManagement/hooks/useAgentWorkspaceTasksList';
import {
  AgentPanelModules,
  AmplitudeServiceManagementSource,
  ServiceManagementTaskIncident,
} from '@modules/serviceManagement/interfaces';
import {ServiceManagementApprovalsLayout} from '@modules/serviceManagement/components/ServiceManagementApprovalsLayout';
import {ServiceManagementAgentSubtaskList} from '@modules/serviceManagement/components/ServiceManagementAgentSubtaskList';
import {ServiceManagementFABButton} from '@modules/serviceManagement/components/ServiceManagementFABButton';
import {commonStyles} from '@shared/styles';
import {Screens} from '@shared/constants';
import {useTheme} from '@shared/theme';

import AgentHeader from './components/AgentHeader';
import AgentPanelDialog from './components/AgentPanelDialog';
import AgentWorkspaceModals from './components/AgentWorkspaceModals';
import HelpDeskMetrics from './components/HelpDeskMetrics';
import AgentTaskItem from './components/AgentTaskItem';
import TicketsListContent from './components/TicketsListContent';

function AgentWorkspaceTaskList({
  navigation,
  route: {params},
}: Navigation<Screens.AGENT_WORKSPACE_TASKS>) {
  const {theme} = useTheme();
  const paddingBottom = useSafeAreaBottomPadding();
  const {t} = useTranslation();

  const workspace = useAgentWorkspaceTasksList({navigation, params});

  const {
    agentPanel,
    isCoordinator,
    helpDesks,
    selectedHelpDesk,
    onSelectHelpDesk,
    shouldShowApprovals,
    shouldShowSubtasks,
    isMultiSelectEnabled,
    selectedItems,
    selectAll,
    disableMultipleAssign,
    isAgentPanelVisible,
    onCloseAgentPanel,
    onOpenAgentPanel,
    isOptionsModalVisible,
    onCloseOptionsModal,
    isAssignAgentModalVisible,
    onCloseAssignAgentModal,
    isNewViewModalVisible,
    onCloseNewViewModal,
    onOpenNewViewModal,
    isAssignWarningModalVisible,
    onCloseAssignWarningModal,
    onOpenAssignWarningModal,
    appliedFiltersCount,
    data,
    filterText,
    onChangeFilterText,
    getNextPage,
    hasNextPage,
    isError,
    isFetchingNextPage,
    isLoading,
    isRefreshing,
    refresh,
    selectedView,
    showNewFiltersAlert,
    config,
    isDeleteViewPending,
    isUpdateViewNamePending,
    flatlistRef,
    isUpdateButtonVisible,
    onPressAlertButton,
    onPressView,
    onPressSelectAll,
    onPressMultiSelectCheckbox,
    onSuccessReassign,
    onPressMultipleAssign,
    onPressDeleteView,
    onPressRenameView,
    onPressAgentModule,
    onPressClearMultiSelect,
    onOpenOptionsModal,
    keyExtractor,
    emptyList,
    routeTaskId,
    onPressFilterIcon,
    onItemPress,
    onSelectItem,
  } = workspace;

  const renderItem = useCallback(
    ({item}: {item: ServiceManagementTaskIncident}) => {
      const checked = selectedItems.includes(item);
      const onPressItem = () =>
        isMultiSelectEnabled ? onSelectItem(item) : onItemPress(item);
      const onPressSelect = () => onSelectItem(item);
      return (
        <AgentTaskItem
          checked={checked}
          onPressItem={onPressItem}
          item={item}
          isMultiSelectEnabled={isMultiSelectEnabled}
          onSelectItem={onPressSelect}
          showAgentName={agentPanel !== AgentPanelModules.Tickets}
        />
      );
    },
    [
      agentPanel,
      isMultiSelectEnabled,
      onItemPress,
      onSelectItem,
      selectedItems,
    ],
  );

  return (
    <View
      style={[
        commonStyles.flex,
        {backgroundColor: theme.background.layout.default},
      ]}>
      <AgentHeader
        disableMultipleAssign={disableMultipleAssign}
        isMultiSelectEnabled={isMultiSelectEnabled}
        onOpenOptionsModal={onOpenOptionsModal}
        onPressAgentPanel={
          !!isCoordinator || !!shouldShowApprovals
            ? onOpenAgentPanel
            : undefined
        }
        onPressClearMultiSelect={onPressClearMultiSelect}
        onPressMultipleAssign={onPressMultipleAssign}
        onPressWarning={onOpenAssignWarningModal}
        selectedItemsCount={selectedItems.length}
        currentAgentPanel={agentPanel}
      />
      <ServiceManagementFABButton
        text={t('service_management.updates_available')}
        onPress={onPressAlertButton}
        isVisible={isUpdateButtonVisible}
      />
      <AgentPanelDialog
        isCoordinator={!!isCoordinator}
        hasApprovals={!!shouldShowApprovals}
        hasSubtasks={!!shouldShowSubtasks}
        selectedAgentPanel={agentPanel}
        isVisible={isAgentPanelVisible}
        onClose={onCloseAgentPanel}
        onPressModule={onPressAgentModule}
      />
      <AgentWorkspaceModals
        agentPanel={agentPanel}
        disableMultipleAssign={disableMultipleAssign}
        isAssignAgentModalVisible={isAssignAgentModalVisible}
        isAssignWarningModalVisible={isAssignWarningModalVisible}
        isDeleteViewPending={isDeleteViewPending}
        isNewViewModalVisible={isNewViewModalVisible}
        isOptionsModalVisible={isOptionsModalVisible}
        isUpdateViewNamePending={isUpdateViewNamePending}
        onCloseAssignAgentModal={onCloseAssignAgentModal}
        onCloseAssignWarningModal={onCloseAssignWarningModal}
        onCloseNewViewModal={onCloseNewViewModal}
        onCloseOptionsModal={onCloseOptionsModal}
        onPressDeleteView={onPressDeleteView}
        onPressMultiSelectCheckbox={onPressMultiSelectCheckbox}
        onPressRenameView={onPressRenameView}
        onPressView={onPressView}
        onSuccessReassign={onSuccessReassign}
        selectedItems={selectedItems}
        selectedView={selectedView}
      />
      {agentPanel === AgentPanelModules.Coordinator && selectedHelpDesk ? (
        <HelpDeskMetrics
          helpDesks={helpDesks}
          selectedHelpDesk={selectedHelpDesk}
          onSelectHelpDesk={onSelectHelpDesk}
        />
      ) : agentPanel === AgentPanelModules.Approvals ? (
        <ServiceManagementApprovalsLayout
          source={AmplitudeServiceManagementSource.ApprovalsListAgentWorkspace}
        />
      ) : agentPanel === AgentPanelModules.Subtasks ? (
        <ServiceManagementAgentSubtaskList preSelectedSubtaskId={routeTaskId} />
      ) : (
        <TicketsListContent
          agentPanel={agentPanel}
          appliedFiltersCount={appliedFiltersCount}
          backgroundColor={theme.background.layout.default}
          config={config}
          data={data as ServiceManagementTaskIncident[] | undefined}
          emptyList={emptyList}
          errorText={t('service_management.tasks_error_body')}
          filterText={filterText}
          getNextPage={getNextPage}
          hasNextPage={hasNextPage}
          helpDesks={helpDesks}
          isError={isError}
          isFetchingNextPage={isFetchingNextPage}
          isLoading={isLoading}
          isMultiSelectEnabled={isMultiSelectEnabled}
          isRefreshing={isRefreshing}
          keyExtractor={keyExtractor}
          listRef={flatlistRef}
          onChangeFilterText={onChangeFilterText}
          onOpenNewViewModal={onOpenNewViewModal}
          onPressFilterIcon={onPressFilterIcon}
          onPressSelectAll={onPressSelectAll}
          onPressView={onPressView}
          onSelectHelpDesk={onSelectHelpDesk}
          paddingBottom={paddingBottom}
          refresh={refresh}
          renderItem={renderItem}
          selectedHelpDesk={selectedHelpDesk}
          selectedItems={selectedItems}
          selectedView={selectedView}
          selectAll={selectAll}
          showNewFiltersAlert={showNewFiltersAlert}
        />
      )}
    </View>
  );
}

export default AgentWorkspaceTaskList;