diff --git a/app/soapbox/features/groups/components/discover/search/results.tsx b/app/soapbox/features/groups/components/discover/search/results.tsx
index 9df350375..2543f6ebc 100644
--- a/app/soapbox/features/groups/components/discover/search/results.tsx
+++ b/app/soapbox/features/groups/components/discover/search/results.tsx
@@ -46,10 +46,8 @@ export default (props: Props) => {
), []);
- const renderGroupGrid = useCallback((group: Group, index: number) => (
-
-
-
+ const renderGroupGrid = useCallback((group: Group) => (
+
), []);
return (
@@ -79,10 +77,10 @@ export default (props: Props) => {
renderGroupGrid(group, index)}
+ itemContent={(_index, group) => renderGroupGrid(group)}
components={{
Item: (props) => (
-
+
),
List: GridList,
}}
diff --git a/app/soapbox/features/groups/popular.tsx b/app/soapbox/features/groups/popular.tsx
index 7f2d43a64..c2c11148c 100644
--- a/app/soapbox/features/groups/popular.tsx
+++ b/app/soapbox/features/groups/popular.tsx
@@ -46,10 +46,8 @@ const Popular: React.FC = () => {
), []);
- const renderGroupGrid = useCallback((group: Group, index: number) => (
-
-
-
+ const renderGroupGrid = useCallback((group: Group) => (
+
), []);
return (
@@ -73,10 +71,10 @@ const Popular: React.FC = () => {
renderGroupGrid(group, index)}
+ itemContent={(_index, group) => renderGroupGrid(group)}
components={{
Item: (props) => (
-
+
),
List: GridList,
}}
diff --git a/app/soapbox/features/groups/suggested.tsx b/app/soapbox/features/groups/suggested.tsx
index 5c52f678b..4d1843598 100644
--- a/app/soapbox/features/groups/suggested.tsx
+++ b/app/soapbox/features/groups/suggested.tsx
@@ -46,10 +46,8 @@ const Suggested: React.FC = () => {
), []);
- const renderGroupGrid = useCallback((group: Group, index: number) => (
-
-
-
+ const renderGroupGrid = useCallback((group: Group) => (
+
), []);
return (
@@ -73,10 +71,10 @@ const Suggested: React.FC = () => {
renderGroupGrid(group, index)}
+ itemContent={(_index, group) => renderGroupGrid(group)}
components={{
Item: (props) => (
-
+
),
List: GridList,
}}
diff --git a/app/soapbox/features/groups/tag.tsx b/app/soapbox/features/groups/tag.tsx
index 4774a4700..8b18053d3 100644
--- a/app/soapbox/features/groups/tag.tsx
+++ b/app/soapbox/features/groups/tag.tsx
@@ -50,10 +50,8 @@ const Tag: React.FC = (props) => {
), []);
- const renderGroupGrid = useCallback((group: Group, index: number) => (
-
-
-
+ const renderGroupGrid = useCallback((group: Group) => (
+
), []);
if (isLoading || !tag) {
@@ -100,10 +98,10 @@ const Tag: React.FC = (props) => {
renderGroupGrid(group, index)}
+ itemContent={(_index, group) => renderGroupGrid(group)}
components={{
Item: (props) => (
-
+
),
List: GridList,
}}