Remove unnecessary virtuoso "group item counts" mapping

This commit is contained in:
schroda
2025-03-10 01:10:00 +01:00
parent e9b42db10f
commit c7611e4ae1
4 changed files with 19 additions and 17 deletions

View File

@@ -9,6 +9,10 @@
import { useCallback, useMemo } from 'react'; import { useCallback, useMemo } from 'react';
export class VirtuosoUtil { export class VirtuosoUtil {
static readonly GROUP = 0;
static readonly ITEMS = 1;
/** /**
* Returns the index converted to the index of the list of group or normal items. * Returns the index converted to the index of the list of group or normal items.
* *

View File

@@ -107,7 +107,7 @@ export function Extensions({ tabsMenuHeight }: { tabsMenuHeight: number }) {
const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey( const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey(
groupCounts, groupCounts,
useCallback((index) => filteredGroupedExtensions[index][0], [filteredGroupedExtensions]), useCallback((index) => filteredGroupedExtensions[index][LANGUAGE], [filteredGroupedExtensions]),
useCallback((index) => visibleExtensions[index].pkgName, [visibleExtensions]), useCallback((index) => visibleExtensions[index].pkgName, [visibleExtensions]),
); );

View File

@@ -40,18 +40,17 @@ export const History: React.FC = () => {
const endCursor = chapterHistoryData?.chapters.pageInfo.endCursor; const endCursor = chapterHistoryData?.chapters.pageInfo.endCursor;
const readEntries = chapterHistoryData?.chapters.nodes ?? []; const readEntries = chapterHistoryData?.chapters.nodes ?? [];
const groupedHistory = useMemo( const groupedHistory = useMemo(
() => () => Object.entries(Chapters.groupByDate(readEntries, 'lastReadAt')),
Object.entries(Chapters.groupByDate(readEntries, 'lastReadAt')).map(([date, chapters]) => [
date,
chapters.length,
]) satisfies [date: string, itemCount: number][],
[readEntries], [readEntries],
); );
const groupCounts: number[] = useMemo(() => groupedHistory.map((group) => group[1]), [groupedHistory]); const groupCounts: number[] = useMemo(
() => groupedHistory.map((group) => group[VirtuosoUtil.ITEMS].length),
[groupedHistory],
);
const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey( const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey(
groupCounts, groupCounts,
useCallback((index) => groupedHistory[index][0], [groupedHistory]), useCallback((index) => groupedHistory[index][VirtuosoUtil.GROUP], [groupedHistory]),
useCallback((index) => readEntries[index].id, [readEntries]), useCallback((index) => readEntries[index].id, [readEntries]),
); );
@@ -100,7 +99,7 @@ export const History: React.FC = () => {
groupContent={(index) => ( groupContent={(index) => (
<StyledGroupHeader isFirstItem={index === 0}> <StyledGroupHeader isFirstItem={index === 0}>
<Typography variant="h5" component="h2"> <Typography variant="h5" component="h2">
{groupedHistory[index][0]} {groupedHistory[index][VirtuosoUtil.GROUP]}
</Typography> </Typography>
</StyledGroupHeader> </StyledGroupHeader>
)} )}

View File

@@ -42,18 +42,17 @@ export const Updates: React.FC = () => {
const endCursor = chapterUpdateData?.chapters.pageInfo.endCursor; const endCursor = chapterUpdateData?.chapters.pageInfo.endCursor;
const updateEntries = chapterUpdateData?.chapters.nodes ?? []; const updateEntries = chapterUpdateData?.chapters.nodes ?? [];
const groupedUpdates = useMemo( const groupedUpdates = useMemo(
() => () => Object.entries(Chapters.groupByDate(updateEntries, 'fetchedAt')),
Object.entries(Chapters.groupByDate(updateEntries, 'fetchedAt')).map(([date, chapters]) => [
date,
chapters.length,
]) satisfies [date: string, itemCount: number][],
[updateEntries], [updateEntries],
); );
const groupCounts: number[] = useMemo(() => groupedUpdates.map((group) => group[1]), [groupedUpdates]); const groupCounts: number[] = useMemo(
() => groupedUpdates.map((group) => group[VirtuosoUtil.ITEMS].length),
[groupedUpdates],
);
const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey( const computeItemKey = VirtuosoUtil.useCreateGroupedComputeItemKey(
groupCounts, groupCounts,
useCallback((index) => groupedUpdates[index][0], [groupedUpdates]), useCallback((index) => groupedUpdates[index][VirtuosoUtil.GROUP], [groupedUpdates]),
useCallback((index) => updateEntries[index].id, [updateEntries]), useCallback((index) => updateEntries[index].id, [updateEntries]),
); );
@@ -131,7 +130,7 @@ export const Updates: React.FC = () => {
groupContent={(index) => ( groupContent={(index) => (
<StyledGroupHeader isFirstItem={index === 0}> <StyledGroupHeader isFirstItem={index === 0}>
<Typography variant="h5" component="h2"> <Typography variant="h5" component="h2">
{groupedUpdates[index][0]} {groupedUpdates[index][VirtuosoUtil.GROUP]}
</Typography> </Typography>
</StyledGroupHeader> </StyledGroupHeader>
)} )}