import React from 'react';
import { FormHandles } from '@unform/core';
import { IFilterOptions, IViewList } from '../../../hooks/useViewList';
import { IPropsNavActions } from '../../NavActions';
import { IPropsTabs, ITabsRef } from '../../Tabs/Tabs.interface';
import { IPropsTagFilter, ITagFilterRef } from '../../TagsFilters/TagsFilters.interface';

export type IFilterComponent<T = any> = React.FunctionComponent<{
   handleFilters: () => void;
   filters: T;
}>;

export interface IPageListingProps {
   viewList: IViewList;
   // Componentes
   FiltersContainerComponent?: React.FunctionComponent<IPageListingChildrenProps>;
   HeaderListingContainerComponent?: React.FunctionComponent<IPageListingChildrenProps>;
   TitleContainerComponent?: React.FunctionComponent<IPageListingChildrenProps>;
   FiltersComponent: IFilterComponent;
   renderResource: (resource: any, index: number) => JSX.Element;
   renderResourceSkeleton: (resource: any, index: number) => JSX.Element;
   //
   navActions?: IPropsNavActions;
   // Tabs
   tabs?: IPropsTabs;
   sortOptions?: {
      name: any;
      value: any;
   }[];
   tagsFilters?: Partial<IPropsTagFilter>;
   // Header
   title?: string;
   textResourceSingular?: string;
   textResourcePlural?: string;
   // Callback ao clicar no botão adicionar
   onClickHeaderBtn?: () => void;
   //
   showCountListing?: boolean;
}

export interface IPageListingChildrenProps extends IPageListingProps {
   // FiltersComponent: React.FunctionComponent<any>;
   tabsRef: React.MutableRefObject<ITabsRef>;
   tagsFiltersRef: React.MutableRefObject<ITagFilterRef>;
   formSortRef: React.MutableRefObject<FormHandles>;
   scrollListingRef: React.MutableRefObject<HTMLDivElement>;

   openFilters: () => void;
   closeFilters: () => void;
   filterMobileOpen: boolean;
   setFilterMobileOpen: (v: boolean) => void;
}
