From 96e47962c9050a8be1b20cba1c8bb6fd9df8ba85 Mon Sep 17 00:00:00 2001
From: Justin <dice.warrant-02@icloud.com>
Date: Mon, 11 Jul 2022 09:10:10 -0400
Subject: [PATCH] Hide carousel if no avatars

---
 .../__tests__/feed-carousel.test.tsx          | 20 +++++++++++++++++++
 .../features/feed-filtering/feed-carousel.tsx |  4 ++++
 2 files changed, 24 insertions(+)

diff --git a/app/soapbox/features/feed-filtering/__tests__/feed-carousel.test.tsx b/app/soapbox/features/feed-filtering/__tests__/feed-carousel.test.tsx
index eb84e7ad0d..d7f439fa20 100644
--- a/app/soapbox/features/feed-filtering/__tests__/feed-carousel.test.tsx
+++ b/app/soapbox/features/feed-filtering/__tests__/feed-carousel.test.tsx
@@ -56,11 +56,31 @@ describe('<FeedCarousel />', () => {
     });
 
     it('should render the Carousel', () => {
+      store.carousels = {
+        avatars: [
+          { account_id: '1', acct: 'a', account_avatar: 'https://example.com/some.jpg' },
+        ],
+      };
+
       render(<FeedCarousel />, undefined, store);
 
       expect(screen.queryAllByTestId('feed-carousel')).toHaveLength(1);
     });
 
+    describe('with 0 avatars', () => {
+      beforeEach(() => {
+        store.carousels = {
+          avatars: [],
+        };
+      });
+
+      it('renders the error message', () => {
+        render(<FeedCarousel />, undefined, store);
+
+        expect(screen.queryAllByTestId('feed-carousel-error')).toHaveLength(0);
+      });
+    });
+
     describe('with a failed request to the API', () => {
       beforeEach(() => {
         store.carousels = {
diff --git a/app/soapbox/features/feed-filtering/feed-carousel.tsx b/app/soapbox/features/feed-filtering/feed-carousel.tsx
index 803773885f..59c6776ba7 100644
--- a/app/soapbox/features/feed-filtering/feed-carousel.tsx
+++ b/app/soapbox/features/feed-filtering/feed-carousel.tsx
@@ -93,6 +93,10 @@ const FeedCarousel = () => {
     );
   }
 
+  if (avatars.length === 0) {
+    return null;
+  }
+
   return (
     <Card variant='rounded' size='lg' ref={cardRef} className='relative' data-testid='feed-carousel'>
       <div>