Only use username half of account as fallback value

web/components/ui/followers/FollowerCollection/FollowerCollection.stories.tsx

@@ -261,6 +261,9 @@ const noFollowersMock = {
 export default {
   title: 'owncast/Components/Followers/Followers collection',
   component: FollowerCollection,
+  parameters: {
+    chromatic: { diffThreshold: 0.83 },
+  },
 } as ComponentMeta<typeof FollowerCollection>;
 
 const Template: ComponentStory<typeof FollowerCollection> = (args: object) => (

web/components/ui/followers/SingleFollower/SingleFollower.tsx

@@ -22,7 +22,9 @@ export const SingleFollower: FC<SingleFollowerProps> = ({ follower }) => (
         </Col>
         <Col span={18}>
           <Row className={styles.name}>
-            <Typography.Text ellipsis>{follower.name || follower.username}</Typography.Text>
+            <Typography.Text ellipsis>
+              {follower.name || follower.username.split('@', 2)[0]}
+            </Typography.Text>
           </Row>
           <Row className={styles.account}>
             <Typography.Text ellipsis>{follower.username}</Typography.Text>