diff --git a/app/soapbox/features/group/components/group-member-count.tsx b/app/soapbox/features/group/components/group-member-count.tsx
index 6dc936181..d6e0223f4 100644
--- a/app/soapbox/features/group/components/group-member-count.tsx
+++ b/app/soapbox/features/group/components/group-member-count.tsx
@@ -1,5 +1,6 @@
import React from 'react';
import { FormattedMessage } from 'react-intl';
+import { Link } from 'react-router-dom';
import { Text } from 'soapbox/components/ui';
import { Group } from 'soapbox/types/entities';
@@ -11,17 +12,19 @@ interface IGroupMemberCount {
const GroupMemberCount = ({ group }: IGroupMemberCount) => {
return (
-
- {shortNumberFormat(group.members_count)}
- {' '}
-
-
+
+
+ {shortNumberFormat(group.members_count)}
+ {' '}
+
+
+
);
};
diff --git a/app/soapbox/features/groups/components/discover/group-list-item.tsx b/app/soapbox/features/groups/components/discover/group-list-item.tsx
index fc2aedcf5..6331d9d05 100644
--- a/app/soapbox/features/groups/components/discover/group-list-item.tsx
+++ b/app/soapbox/features/groups/components/discover/group-list-item.tsx
@@ -22,17 +22,18 @@ const GroupListItem = (props: IGroup) => {
justifyContent='between'
data-testid='group-list-item'
>
-
+
-
+
diff --git a/app/soapbox/features/placeholder/components/placeholder-group-search.tsx b/app/soapbox/features/placeholder/components/placeholder-group-search.tsx
index b2e2dc6f8..3b3bd3870 100644
--- a/app/soapbox/features/placeholder/components/placeholder-group-search.tsx
+++ b/app/soapbox/features/placeholder/components/placeholder-group-search.tsx
@@ -4,7 +4,7 @@ import { HStack, Stack, Text } from 'soapbox/components/ui';
import { generateText, randomIntFromInterval } from '../utils';
-export default () => {
+export default ({ withJoinAction = true }: { withJoinAction?: boolean }) => {
const groupNameLength = randomIntFromInterval(12, 20);
return (
@@ -13,7 +13,7 @@ export default () => {
justifyContent='between'
className='animate-pulse'
>
-
+
{/* Group Avatar */}
@@ -37,7 +37,9 @@ export default () => {
{/* Join Group Button */}
-
+ {withJoinAction && (
+
+ )}
);
};
diff --git a/app/soapbox/features/ui/components/panels/my-groups-panel.tsx b/app/soapbox/features/ui/components/panels/my-groups-panel.tsx
index c732f5ae7..d9a95a314 100644
--- a/app/soapbox/features/ui/components/panels/my-groups-panel.tsx
+++ b/app/soapbox/features/ui/components/panels/my-groups-panel.tsx
@@ -19,7 +19,7 @@ const MyGroupsPanel = () => {
>
{isFetching ? (
new Array(3).fill(0).map((_, idx) => (
-
+
))
) : (
groups.slice(0, 3).map((group) => (
diff --git a/app/soapbox/features/ui/components/panels/suggested-groups-panel.tsx b/app/soapbox/features/ui/components/panels/suggested-groups-panel.tsx
index 5ef131047..d2671bc14 100644
--- a/app/soapbox/features/ui/components/panels/suggested-groups-panel.tsx
+++ b/app/soapbox/features/ui/components/panels/suggested-groups-panel.tsx
@@ -19,7 +19,7 @@ const SuggestedGroupsPanel = () => {
>
{isFetching ? (
new Array(3).fill(0).map((_, idx) => (
-
+
))
) : (
groups.slice(0, 3).map((group) => (