From 9e148d2825397ee0a67edc29b81199e62890a382 Mon Sep 17 00:00:00 2001
From: Cezar Augusto <cezaraugusto@outlook.it>
Date: Mon, 13 Mar 2017 23:33:15 -0300
Subject: [PATCH] Add support for 100 tabs

Fix #6692

Auditors: @bbondy, @bsclifton
---
 app/renderer/components/styles/tab.js | 1 +
 app/renderer/components/tabContent.js | 6 +++---
 js/about/preferences.js               | 2 +-
 js/components/tab.js                  | 8 +++++++-
 js/components/tabs.js                 | 1 +
 js/constants/appConfig.js             | 2 +-
 6 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/app/renderer/components/styles/tab.js b/app/renderer/components/styles/tab.js
index 33d33ee869c..c77068dfca5 100644
--- a/app/renderer/components/styles/tab.js
+++ b/app/renderer/components/styles/tab.js
@@ -77,6 +77,7 @@ const styles = StyleSheet.create({
   },
 
   tabId: {
+    justifyContent: 'center',
     alignItems: 'center',
     display: 'flex',
     flex: '1',
diff --git a/app/renderer/components/tabContent.js b/app/renderer/components/tabContent.js
index 8ade95d9b1c..3fefac2d16d 100644
--- a/app/renderer/components/tabContent.js
+++ b/app/renderer/components/tabContent.js
@@ -80,7 +80,7 @@ class Favicon extends ImmutableComponent {
         className={css(
           styles.icon,
           this.favicon && iconStyles.favicon,
-          this.narrowView && styles.faviconNarrowView
+          !this.props.tabProps.get('pinnedLocation') && this.narrowView && styles.faviconNarrowView
         )}
         symbol={this.loadingIcon || this.defaultIcon} />
       : null
@@ -283,9 +283,9 @@ const styles = StyleSheet.create({
   },
 
   faviconNarrowView: {
-    minWidth: globalStyles.spacing.narrowIconSize,
+    minWidth: 'auto',
     width: globalStyles.spacing.narrowIconSize,
-    backgroundSize: globalStyles.spacing.narrowIconSize,
+    backgroundSize: 'contain',
     padding: '0',
     fontSize: '10px',
     backgroundPosition: 'center center'
diff --git a/js/about/preferences.js b/js/about/preferences.js
index 63d9063566a..0f6a675e081 100644
--- a/js/about/preferences.js
+++ b/js/about/preferences.js
@@ -319,7 +319,7 @@ class TabsTab extends ImmutableComponent {
             onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TABS_PER_PAGE)}>
             {
               // Sorry, Brad says he hates primes :'(
-              [6, 8, 10, 20].map((x) =>
+              [6, 8, 10, 20, 100].map((x) =>
                 <option value={x} key={x}>{x}</option>)
             }
           </SettingDropdown>
diff --git a/js/components/tab.js b/js/components/tab.js
index 10586c81242..21443b25519 100644
--- a/js/components/tab.js
+++ b/js/components/tab.js
@@ -208,7 +208,6 @@ class Tab extends ImmutableComponent {
   }
 
   componentDidUpdate () {
-    this.tabSize
     this.onUpdateTabSize()
   }
 
@@ -217,6 +216,13 @@ class Tab extends ImmutableComponent {
     window.removeEventListener('resize', this.onUpdateTabSize)
   }
 
+  componentWillReceiveProps (nextProps) {
+    // Update breakpoint each time a new tab is open
+    if (this.props.totalTabs !== nextProps.totalTabs) {
+      this.onUpdateTabSize()
+    }
+  }
+
   render () {
     const perPageStyles = StyleSheet.create({
       themeColor: {
diff --git a/js/components/tabs.js b/js/components/tabs.js
index 7f065dfca3a..eaad80210c3 100644
--- a/js/components/tabs.js
+++ b/js/components/tabs.js
@@ -143,6 +143,7 @@ class Tabs extends ImmutableComponent {
                 onTabClosedWithMouse={this.onTabClosedWithMouse}
                 tabWidth={this.props.fixTabWidth}
                 hasTabInFullScreen={this.props.hasTabInFullScreen}
+                totalTabs={this.props.tabs.size}
                 partOfFullPageSet={this.props.partOfFullPageSet} />)
         }
         {(() => {
diff --git a/js/constants/appConfig.js b/js/constants/appConfig.js
index e065e8f9ba8..52810146ae7 100644
--- a/js/constants/appConfig.js
+++ b/js/constants/appConfig.js
@@ -126,7 +126,7 @@ module.exports = {
     'search.offer-search-suggestions': false, // false by default for privacy reasons
     'tabs.switch-to-new-tabs': false,
     'tabs.paint-tabs': true,
-    'tabs.tabs-per-page': 10,
+    'tabs.tabs-per-page': 20,
     'tabs.close-action': 'parent',
     'tabs.show-tab-previews': true,
     'tabs.show-dashboard-images': true,