import type { FC } from 'react';
import React from 'react';
import { GridTable } from '@theorchard/suite-components';
import { Illustration } from '@theorchard/suite-icons';
import { NrContributionSearchOrderByField } from 'src/data/globalTypes';
import {
    TextCell,
    DateCell,
    SongNameLinkCell,
    ContributorNameAndValidCell,
} from './tableCells';
import type { SortBy } from './types';
import type { CatalogContributions } from 'src/data/queries';

export const CLASSNAME = 'CatalogTable';

interface Props {
    contributions: CatalogContributions[];
    totalContributions?: number;
    loading: boolean;
    onClearFilters: () => void;
    onSort: (sortBy: SortBy[]) => void;
    sortBy: SortBy;
    filtersApplied: boolean;
    page: number;
    pageSize: number;
    handlePageChange: (page: number) => void;
    handlePageSizeChange: (pageSize: number) => void;
}

const CatalogTable: FC<Props> = ({
    contributions,
    totalContributions,
    loading,
    onClearFilters,
    onSort,
    sortBy,
    filtersApplied,
    page,
    pageSize,
    handlePageChange,
    handlePageSizeChange,
}) => (
    <GridTable
        className={CLASSNAME}
        data={contributions}
        loading={loading}
        bordered
        onSort={onSort}
        sortBy={sortBy}
        emptyStateTitle={$t('neighbouringRights.catalogPage.noContributions')}
        emptyStateIcon={() => <Illustration name="noResults" />}
        emptyStateBody={$t('neighbouringRights.catalogPage.adjustFilters')}
        rowKey={(row: CatalogContributions) => row.id}
        paginated
        totalCount={totalContributions}
        page={page}
        pageSize={pageSize}
        onPageChange={handlePageChange}
        onPageSizeChange={handlePageSizeChange}
        onClearFilters={onClearFilters}
        showClearFilters={filtersApplied}
        showUpdateIndicator
    >
        <GridTable.Column
            className={`${CLASSNAME}-cell-songName`}
            name="srNameVersion"
            title={$t('neighbouringRights.catalogPage.srNameVersion')}
            Cell={SongNameLinkCell}
            sortable
            sortKey={NrContributionSearchOrderByField.NRSR_NAME_VERSION}
            defaultSortDirection="desc"
            minWidth="300px"
            maxWidth="2fr"
            fixed
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-artist`}
            name="primaryArtist"
            title={$t('neighbouringRights.catalogPage.primaryArtist')}
            Cell={TextCell}
            sortable
            sortKey={NrContributionSearchOrderByField.PRIMARY_ARTIST}
            defaultSortDirection="desc"
            minWidth="250px"
            maxWidth="2fr"
            tooltip={$t('neighbouringRights.catalogPage.primaryArtistTooltip')}
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-nrSrId`}
            name="nrSrId"
            title={$t('neighbouringRights.catalogPage.nrSrId')}
            Cell={TextCell}
            sortable={false}
            tooltip={$t('neighbouringRights.catalogPage.nrSrIdTooltip')}
            minWidth="100px"
            maxWidth="1fr"
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-contributor`}
            name="contributorName"
            title={$t('neighbouringRights.catalogPage.contributorLegalName')}
            Cell={ContributorNameAndValidCell}
            sortable={false}
            minWidth="250px"
            maxWidth="2fr"
            tooltip={$t('neighbouringRights.catalogPage.contributorTooltip')}
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-isrc`}
            name="isrc"
            title={$t('neighbouringRights.catalogPage.isrc')}
            Cell={TextCell}
            sortable={false}
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-releaseYear`}
            name="firstReleaseYear"
            title={$t('neighbouringRights.catalogPage.releaseYear')}
            Cell={TextCell}
            sortable
            sortKey={NrContributionSearchOrderByField.RELEASE_YEAR}
            defaultSortDirection="desc"
            minWidth="100px"
            maxWidth="100px"
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-lastModified`}
            name="lastModifiedAt"
            title={$t('neighbouringRights.catalogPage.lastModifiedAt')}
            Cell={DateCell}
            sortable
            sortKey={NrContributionSearchOrderByField.LAST_MODIFIED}
            defaultSortDirection="desc"
            minWidth="110px"
            maxWidth="110px"
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-accountName`}
            name="accountName"
            title={$t('neighbouringRights.catalogPage.accountName')}
            Cell={TextCell}
            sortable={false}
            minWidth="170px"
            maxWidth="2fr"
            tooltip={$t('neighbouringRights.catalogPage.accountTooltip')}
        />
        <GridTable.Column
            className={`${CLASSNAME}-cell-priority`}
            name="priority"
            title={$t('neighbouringRights.catalogPage.priority')}
            Cell={TextCell}
            sortable={false}
        />
    </GridTable>
);

export default CatalogTable;