import { Archivos, DocumentFilter } from 'src/models';
import { reactive, Ref } from 'vue';
import { useStore } from 'vuex';

export function useDocumentsFilter(index: Ref<number>) {
  const store = useStore();

  const documentFilter = reactive<DocumentFilter>({
    tags: ['all'],
    types: [-1],
  });

  const filterDocumentsByTag = (documents: Array<Archivos>): Archivos[] => {
    let itemsMatched: Array<Archivos> = [];
    for (let item of documents) {
      const tags = item?.TAGS?.split(',') || [];
      for (let val of tags) {
        if (documentFilter?.tags?.includes(val)) {
          itemsMatched.push(item);
          break;
        }
      }
    }
    return itemsMatched;
  };

  const filterDocumentsByType = (documents: Array<Archivos>): Archivos[] => {
    let itemsMatched: Array<Archivos> = [];
    for (let item of documents) {
      if (documentFilter?.types?.includes(item.ID_TIPO_DOCUMENTO!)) {
        itemsMatched.push(item);
      }
    }
    return itemsMatched;
  };

  const filterDocuments = (items: Array<Archivos>) => {
    if (documentFilter?.tags?.length > 0 && !documentFilter.tags?.includes('all')) {
      items = filterDocumentsByTag(items);
    }

    if (documentFilter?.types?.length > 0 && !documentFilter.types?.includes(-1)) {
      items = filterDocumentsByType(items);
    }
    return items;
  };

  const handleTipoFilterClick = ({ value }) => {
    if (value === -1) {
      documentFilter.types = [-1];
      store.commit('captacion/setDocumentFilter', documentFilter);
      return;
    }

    documentFilter.types = documentFilter.types.filter((val) => val !== -1);
    if (documentFilter.types.includes(value)) {
      documentFilter.types = documentFilter.types.filter((val) => val !== value);
    } else {
      documentFilter.types.push(value);
    }

    if (documentFilter.types.length === 0) {
      documentFilter.types.push(-1);
    }
    store.commit('captacion/setDocumentFilter', documentFilter);
  };

  const handleTagFilterClick = ({ value }) => {
    if (value === 'all') {
      documentFilter.tags = ['all'];
      store.commit('captacion/setDocumentFilter', documentFilter);
      return;
    }

    documentFilter.tags = documentFilter.tags.filter((val) => val !== 'all');
    if (documentFilter.tags.includes(value)) {
      documentFilter.tags = documentFilter.tags.filter((val) => val !== value);
    } else {
      documentFilter.tags.push(value);
    }

    if (documentFilter.tags.length === 0) {
      documentFilter.tags.push('all');
    }
    store.commit('captacion/setDocumentFilter', documentFilter);
    index.value = 0;
  };

  return {
    documentFilter,
    handleTagFilterClick,
    handleTipoFilterClick,
    filterDocuments,
  };
}