nandi.uk
This repository has no description
feat: improve feed, connections, and contributors, rendering performance
author
pdelfan
date
(May 1, 2026, 10:47 AM -0700)
commit
975e3003
975e3003bff415c8c80e3e944c35e2dfe74b7d08
parent
af520b0d
af520b0d0f1246d6eb36492120b290b787eafd53
+61
-31
+8
-1
src/webapp/features/cards/containers/similarCardsContainer/SimilarCardsContainer.tsx
+8
-1
src/webapp/features/cards/containers/similarCardsContainer/SimilarCardsContainer.tsx
···
48
48
) : (
49
49
<Grid gap="sm" mx={'auto'} maw={600} w={'100%'}>
50
50
{allSimilarUrls.map((urlView) => (
51
-
<Grid.Col key={urlView.url} span={12}>
51
+
<Grid.Col
52
+
key={urlView.url}
53
+
span={12}
54
+
style={{
55
+
contentVisibility: 'auto',
56
+
containIntrinsicSize: 'auto 300px',
57
+
}}
58
+
>
52
59
<SimilarUrlCard
53
60
urlView={urlView}
54
61
analyticsContext={{
+19
-11
src/webapp/features/collections/containers/collectionContributorsContainer/CollectionContributorsContainer.tsx
+19
-11
src/webapp/features/collections/containers/collectionContributorsContainer/CollectionContributorsContainer.tsx
···
1
1
'use client';
2
2
3
-
import { Container, Stack, Text, Center, Badge } from '@mantine/core';
3
+
import { Box, Container, Stack, Text, Center, Badge } from '@mantine/core';
4
4
import InfiniteScroll from '@/components/contentDisplay/infiniteScroll/InfiniteScroll';
5
5
import useCollectionContributors from '../../lib/queries/useCollectionContributors';
6
6
import ProfileCard from '@/features/profile/components/profileCard/ProfileCard';
···
34
34
>
35
35
<Stack gap={'xs'}>
36
36
{allUsers.map((user) => (
37
-
<ProfileCard key={user.id} profile={user}>
38
-
{user.contributionCount && (
39
-
<Badge variant="light" color="blue">
40
-
{user.contributionCount}{' '}
41
-
{user.contributionCount === 1
42
-
? 'Contribution'
43
-
: 'Contributions'}
44
-
</Badge>
45
-
)}
46
-
</ProfileCard>
37
+
<Box
38
+
key={user.id}
39
+
style={{
40
+
contentVisibility: 'auto',
41
+
containIntrinsicSize: 'auto 80px',
42
+
}}
43
+
>
44
+
<ProfileCard profile={user}>
45
+
{user.contributionCount && (
46
+
<Badge variant="light" color="blue">
47
+
{user.contributionCount}{' '}
48
+
{user.contributionCount === 1
49
+
? 'Contribution'
50
+
: 'Contributions'}
51
+
</Badge>
52
+
)}
53
+
</ProfileCard>
54
+
</Box>
47
55
))}
48
56
</Stack>
49
57
</InfiniteScroll>
+18
-10
src/webapp/features/connections/containers/connectionsContainer/ConnectionsContainer.tsx
+18
-10
src/webapp/features/connections/containers/connectionsContainer/ConnectionsContainer.tsx
···
4
4
import useBackwardConnections from '@/features/connections/lib/queries/useBackwardConnections';
5
5
import useAllConnections from '@/features/connections/lib/queries/useAllConnections';
6
6
import InfiniteScroll from '@/components/contentDisplay/infiniteScroll/InfiniteScroll';
7
-
import { Grid, Group, Stack } from '@mantine/core';
7
+
import { Box, Grid, Group, Stack } from '@mantine/core';
8
8
import ConnectionsContainerError from './Error.ConnectionsContainer';
9
9
import ConnectionItem from '@/features/connections/components/connectionItem/ConnectionItem';
10
10
import SembleEmptyTab from '@/features/semble/components/sembleEmptyTab/SembleEmptyTab';
···
170
170
: connection.source.url;
171
171
172
172
return (
173
-
<Grid.Col key={`${direction}-${index}`} span={12}>
174
-
<ConnectionItem
175
-
connection={connection}
176
-
direction={connectionDirection}
177
-
onEdit={() => {
178
-
handleOpenEditModal(connection.connection, targetUrl);
179
-
}}
180
-
/>
181
-
</Grid.Col>
173
+
<Box
174
+
key={`${direction}-${index}`}
175
+
style={{
176
+
contentVisibility: 'auto',
177
+
containIntrinsicSize: 'auto 200px',
178
+
}}
179
+
>
180
+
<Grid.Col span={12}>
181
+
<ConnectionItem
182
+
connection={connection}
183
+
direction={connectionDirection}
184
+
onEdit={() => {
185
+
handleOpenEditModal(connection.connection, targetUrl);
186
+
}}
187
+
/>
188
+
</Grid.Col>
189
+
</Box>
182
190
);
183
191
})}
184
192
</Grid>
+16
-9
src/webapp/features/feeds/containers/myFeedContainer/MyFeedContainer.tsx
+16
-9
src/webapp/features/feeds/containers/myFeedContainer/MyFeedContainer.tsx
···
115
115
<Stack gap={'xl'} mx={'auto'} maw={600} w={'100%'}>
116
116
<Stack gap={60}>
117
117
{allActivities.map((item) => (
118
-
<FeedItem
118
+
<Box
119
119
key={item.id}
120
-
item={item}
121
-
analyticsContext={{
122
-
saveSource: CardSaveSource.FEED,
123
-
activeFilters: {
124
-
urlType: selectedUrlType,
125
-
},
126
-
pagePath: pathname,
120
+
style={{
121
+
contentVisibility: 'auto',
122
+
containIntrinsicSize: 'auto 400px',
127
123
}}
128
-
/>
124
+
>
125
+
<FeedItem
126
+
item={item}
127
+
analyticsContext={{
128
+
saveSource: CardSaveSource.FEED,
129
+
activeFilters: {
130
+
urlType: selectedUrlType,
131
+
},
132
+
pagePath: pathname,
133
+
}}
134
+
/>
135
+
</Box>
129
136
))}
130
137
</Stack>
131
138
</Stack>