onTabChange(tabs[index])}\n selectedIndex={selectedTab.id}\n >\n \n \n {\n const selectedClassName = selected\n ? \"border-b-[2px] border-black outline-none px-7\"\n : \"px-7 text-gray\";\n const hiddenClassName = beatsCount === 0 ? \"hidden\" : \"\";\n return `${selectedClassName} ${hiddenClassName}`;\n }}\n >\n Beats ({beatsCount})\n \n {\n const selectedClassName = selected\n ? \"border-b-[2px] border-black outline-none px-7\"\n : \"px-7 text-gray\";\n const hiddenClassName = songsCount === 0 ? \"hidden\" : \"\";\n return `${selectedClassName} ${hiddenClassName}`;\n }}\n >\n Songs ({songsCount})\n \n {\n const selectedClassName = selected\n ? \"border-b-[2px] border-black outline-none px-7\"\n : \"px-7 text-gray\";\n const hiddenClassName = soundkitsCount === 0 ? \"hidden\" : \"\";\n return `${selectedClassName} ${hiddenClassName}`;\n }}\n >\n Sound Kits ({soundkitsCount})\n \n \n\n \n opt.id !== 4 && opt.id !== 5)\n : sortOptions\n }\n value={sort.name}\n onItemClick={(option) => {\n handleSortClick(option);\n }}\n className=\"mr-5\"\n />\n \n
\n }\n className={`${size.width! < 1024 ? \"flex\" : \"hidden\"} px-3`}\n />\n\n {/* Grid/List toggle (desktop) */}\n \n {\n handleSortClick(option);\n }}\n className=\"hidden mr-5 lg:inline-block\"\n />\n \n
\n \n\n \n {/* Beats */}\n \n {viewType === \"list\" ? (\n <>\n \n {beats?.map((track, index) => (\n \n ))}\n {isBeatsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n {isBeatsLoadingMore && }\n >\n ) : (\n <>\n \n {beats?.map((track, index) => (\n \n ))}\n {isBeatsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n {isBeatsLoadingMore && }\n >\n )}\n\n {!isBeatsLoading && (beats?.length ?? 0) < (beatsCount ?? 0) && (\n \n \n
\n )}\n \n\n {/* Songs */}\n \n {viewType === \"list\" ? (\n <>\n \n {songs?.map((track, index) => (\n \n ))}\n {isSongsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n {isSongsLoadingMore && }\n >\n ) : (\n <>\n \n {songs?.map((track, index) => (\n \n ))}\n {isSongsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n {isSongsLoadingMore && }\n >\n )}\n\n {!isSongsLoading && (songs?.length ?? 0) < (songsCount ?? 0) && (\n \n \n
\n )}\n \n\n {/* Soundkits */}\n \n {viewType === \"list\" ? (\n <>\n \n {soundkits?.map((track, index) => (\n \n ))}\n {isSoundkitsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n {isSoundkitsLoadingMore && }\n >\n ) : (\n <>\n \n {soundkits?.map((track, index) => (\n \n ))}\n {isSoundkitsLoading &&\n Array.from(Array(10).keys()).map((key) => (\n \n ))}\n \n\n {isSoundkitsLoadingMore && }\n >\n )}\n\n {isSoundkitsLoading &&\n (soundkits?.length ?? 0) < (soundkitsCount ?? 0) && (\n \n \n
\n )}\n \n \n \n );\n};\n\nexport default CreatorsAssetsTabs;\n","import { ArtistFilterParams } from \"../types/artist-filter-params\";\nimport { Beat, Filter } from \"@/models/models\";\nimport { useEffect } from \"react\";\nimport { getBeatsAsync } from \"@/lib/beats-manager\";\nimport { FilterType, ItemStatus } from \"@/models/enums\";\nimport { usePaginationQuery } from \"../../../lib/hooks/usePaginationQuery\";\nimport toast from \"react-hot-toast\";\n\nexport type UseArtistBeatsParams = ArtistFilterParams