From c222e0da9d4ed99301bacd9db5c85badbfded0dc Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Tue, 5 Oct 2021 13:09:41 -0500
Subject: [PATCH] TabsBar: fall back to Home icon when no logo is provided

---
 app/soapbox/features/ui/components/tabs_bar.js |  8 +++++++-
 app/styles/components/tabs-bar.scss            | 11 ++++++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/app/soapbox/features/ui/components/tabs_bar.js b/app/soapbox/features/ui/components/tabs_bar.js
index e7f96520d..15b293cbd 100644
--- a/app/soapbox/features/ui/components/tabs_bar.js
+++ b/app/soapbox/features/ui/components/tabs_bar.js
@@ -7,6 +7,7 @@ import { connect } from 'react-redux';
 import classNames from 'classnames';
 import SearchContainer from 'soapbox/features/compose/containers/search_container';
 import Avatar from '../../../components/avatar';
+import Icon from 'soapbox/components/icon';
 import ProfileDropdown from './profile_dropdown';
 import { openModal } from '../../../actions/modal';
 import { openSidebar } from '../../../actions/sidebar';
@@ -57,11 +58,16 @@ class TabsBar extends React.PureComponent {
       <nav className={classes} ref={this.setRef}>
         <div className='tabs-bar__container'>
           <div className='tabs-bar__split tabs-bar__split--left'>
-            {logo && (
+            {logo ? (
               <Link key='logo' className='tabs-bar__link--logo' to='/' data-preview-title-id='column.home'>
                 <img alt='Logo' src={logo} />
                 <span><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></span>
               </Link>
+            ) : (
+              <Link key='logo' className='tabs-bar__link--logo' to='/' data-preview-title-id='column.home'>
+                <Icon alt='Logo' src={require('icons/home-2-filled.svg')} />
+                <span><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></span>
+              </Link>
             )}
 
             <div className='tabs-bar__search-container'>
diff --git a/app/styles/components/tabs-bar.scss b/app/styles/components/tabs-bar.scss
index bf03ed610..5038f05da 100644
--- a/app/styles/components/tabs-bar.scss
+++ b/app/styles/components/tabs-bar.scss
@@ -276,12 +276,21 @@
     padding: 13px 0 0;
     box-sizing: border-box;
     filter: brightness(0%) grayscale(100%) invert(100%);
-    & span { display: none !important; }
+
+    & span {
+      display: none !important;
+    }
 
     img {
       height: 100%;
     }
 
+    .svg-icon {
+      width: 26px;
+      height: 26px;
+      margin: 0 auto;
+    }
+
     &:hover {
       border: 0 !important;
     }