improve tabs performance and UI with this one simple trick #10691

cezaraugusto · 2017-08-28T14:01:45Z

dear reviewer each commit addresses a logical part of the whole fix and most of them have tests included. I took 2 days ☕️☕️☕️☕️☕️ rebasing this against the first trial for better review and bug check, so please consider do not squash.

TL;DR

Improved performance for opening tabs
Improved performance for resizing the window
Tabs do not flicker on hover anymore
Audio indicator is can now be clicked again to mute/unmute
Observable tabs now resize automatically as tabs get added/removed/resized
Going/exiting fullscreen videos gracefully resize tab content
Fixed back/forward tabPage action not showing the close icon
Tab Title is always visible once title is fetch
Tab title can gracefully show emojis 💥 🎉

`Click to ignore it all and go to test plan`

Performance tests

Performance while resizing window

Test plan was made as the following:

Window is sized as ~1200px
20 tabs loaded with brave.com as webview
resizing to minimum then maximizing to 1200px again

Metrics used:

main resize function cost
main call stack cost

current

main resize function cost

We relied on get tabSize for our calculations, which has some cost and we don't use it anymore.

main call stack cost

Values varied while doing tests. Below shows that previous call stack was lighter than what this PR introduces so still room for improvement. Getting a tab by id seems to have a heavier cost too and other new methods also added some weight.

after this PR

main resize function cost

There's no need for this.tabSize getter anymore.

main call stack cost

Performance while opening tabs

Test plan was made as the following:

Window is sized as ~1200px
set brave.com as your home page
keep one tab only, which should be loaded as brave.com
open 19 tabs sequentially, wait all tabs to load (no loading icon). Operation took around 22s in local network

current

Again get tabSize taking its space which is no longer required.

after this pr

Performance while closing tabs

Test plan was made as the following:

I couldn't see a significant change here, as tab icons are only updated when you mouse out of tabs, but I'm sharing anyway.

Window is sized as ~1200px
set brave.com as your home page
keep one tab only, which should be loaded as brave.com
open 20 tabs
close 20 tabs sequentially, wait for all tabs to load (no loading icon). Operation took around 22s in local network

Tests were made several times, below a comparison between two consecutive tests.
Other than scripting, no gains were found. Given we only update tab size after mouse leave, that makes sense.

current

after this pr

Performance while resizing window -- stress test (multiple heavy tabs)

window is sized around 1200px
set https://www.youtube.com/watch?v=A_MjCqQoLLA as your homepage (disable your audio pls)
Open total of 9 tabs. While profiling operation should took 20s
Resize the window to the minimum possible
Resize the window back to 1200px

Tests were made several times, below a comparison between two consecutive tests.

saved around ~400ms from scripting
saved around ~200ms from rendering
paiting is about the same for all, which makes sense given icons didn't change

current

after this pr

Bugs fixed | usability improved

Total: 16 issues

close #10883
fix #10838
fix #10611
fix #10582
fix #10544
fix #10464
fix #10509
fix #10123
fix #10103
fix #9398
fix #8414
fix #7925
fix #7765
fix #7730
fix #7301
fix #6716

Unrelated tasks covered with this PR

Opens the road for theming: added theme.js

Test plan

For reviewers (QA please skip)

Most new methods were unit tested, you can track them by looking for each commit description.

For everybody (cc QA team)

Overall test plan is to have a lot of tabs, being included pinned, partitioned, private, newtab (which has no icon), about:blank (which has a "default" icon) and other tabs.

As you resize the window, icons should be shown in a graceful state, without bad UI/UX

Running through each issue (from older to newer)

Issue #6716 (fading effect b/w tabs feels like flickering)

Have 3 tabs open. Ensure at least one have tab color (i.e. facebook), and one is private.
Set each tab as active and then hover over other tabs
there should be no flicker background (bad UI)

This is slightly different than #10838 as was reported by not the active tab. Test plan is similar.

Issue #7301 (Tabs display wrong after exiting HTML5 fullscreen)

Have enough tabs so the close tab icon is always visible
Also have some pinned tabs
In one tab, go to a video website (i.e. youtube)
Keep record of what you see in that tab (like favicon, title, close icon and a blue top border)
Open a video in fullscreen mode. Keep an eye on tabs just in case
Exit fullscreen.
Tab content should be in the same size as step 4

Issue #7730 (Title on new tab flickers after setting the language to Russian)

Set the lang setting to Russian
Restart
Open a new tab
Change the window size vertically
Title shouldn't ficker

Issue #7925 (Throttling between window resize cause tabContent to pop)

Open 100 tabs between video playing, new sessions and private tabs. default tabs too
resize the window
icons shouldn't pop or show/hide with a bad ui feeling

Issue #7765 (Tab title often isn't updated until the cursor is moved over it or tab focus is changed)

Run simulated Brave payments to generate reports (npm run add-simulated-payment-history)
Click on the payment report (the "clock" icon) to open it in a new tab
Save the file/Close the save file prompt
Tab title should show the title and not the url

Issue #8414 (Tabs No Longer Show Full-Color Emoji)

Open getemoji.com
You should see an emoji in the tab title and not a gray/black circle

Issue #9398 (Tab Label Rendering Issue)

Not sure how to track this but issue is unreproducible. See #9398 for comments

issue #10103 (Tab preview does not work properly with DnD)

Note: Needs PR #10937 merged to be tested.

open two tabs
let your mouse stale for 3s in a tab. this enable preview
drag a tab to reorder
preview should be canceled

Issue #10123 (no tab close icon is shown for the active tab on Windows)

(you need Windows)
(Test plan gently borrowed from @bsclifton)

Set tab page to 20
Maximize window
Create enough tabs that you get a second page (21 tabs)
switch back to tab page 1
click one of the tabs to make it the active tab
Hover over the other tabs and notice there is no X button
Close a few tabs- enough that you see the tab breakpoint size change
Hover over tabs and X now shows again

Issue #10464 (Description for Session Tab on Hover)

Have enough tabs so the close tab icon is always visible
Open one partitioned tab (new session)
Hover over the icon
alt title tooltip should render correctly (with a number!)

Issue #10509 (make use of intersectionObserver for tabs)

This is the main base of this PR and there's no test plan needed

Issue #10544 (Tabs cannot be muted via speaker icon)

Open a tab with audio/video playing. See the icon
Toggle the icon. Should be muted/unmuted

Issue #10582 (Tabs do not automatically resize until mousing over them)

Open a lot of tabs up to a point that close icon is always shown
Restart the browser
important: ensure you do not hover over any tab
Resize the window
Icons should follow based on window resize

Issue #10611 (intermittent - audio indicator is not shown)

This issue happened because when breakpoints was a thing, "dynamic"
breakpoint wasn't set for the icon to be visible (see https://github.com/brave/browser-laptop/blob/master/app/renderer/components/tabs/tab.js#L263). We do not rely on breakpoints anymore, so:

Open one tab
Go to youtube.com, play a video
Audio icon should be visible

Issue #10838 (Active tab flicker on hover)

Have 3 tabs open. Ensure at least one have custom background (i.e. facebook), and one is private.
Set each tab as active and then hover it
there should be no flicker background (bad UI)

Issue #10883 (create smooth transitions for tab components)

close icon, favicon, private, new session icons will have a smooth transition between resizes
audio icon will slightly scroll to the right when enabled

luixxiul · 2017-09-12T02:45:41Z

less/main.less

@@ -3,7 +3,7 @@
 * You can obtain one at http://mozilla.org/MPL/2.0/. */

 @bodyBG: #000;
-@windowContainerFG: #f00;
+@windowContainerFG: #000;


main.less was removed on #10861, not being sure what those specifications have been required for. See: https://github.com/brave/browser-laptop/pull/10861/files#diff-eb0db025dc73e282655968f53c9bfbdfR171. We could discuss it later.

yes I saw that just after pushing. Should be removed here too.

Confirmed main.less was removed here too 👍

NejcZdovc · 2017-09-12T09:25:38Z

app/common/state/tabContentState/audioState.js

+  const frame = getFrameByKey(state, frameKey)
+
+  if (frame == null) {
+    if (process.env.NODE_ENV !== 'test') {


I see that you use this pattern a lot. I am curious why we wouldn't like to see this error in test as well?

it always falls to that condition for unit tests even when the test pass for some async reason

ok will check out unit tests and try to fix it, so that we can remove this check

NejcZdovc

all state helper functions should be converted from format (currentWindow, frameKey) to (currentWindow, tabId), because we are in the process of converting frameKey into tabId

NejcZdovc · 2017-09-12T09:30:26Z

app/common/state/tabContentState/faviconState.js

+    return false
+  }
+
+  const isNewTabPage = frame.get('location') === 'about:newtab'


I see that we use this check in different places, can you please create function in utils for it

Function should receive location as param, so that we can reuse this function in other places. We can create followup where we would fix other places, that are not included in this PR. This way we would have 'about:newtab' defined only in one place.

sounds good

NejcZdovc · 2017-09-12T09:33:21Z

app/common/state/tabContentState/titleState.js

+  // until we know what we're loading.  We should probably do this for
+  // all about: pages that we already know the title for so we don't have
+  // to wait for the title to be parsed.
+  if (frame.get('location') === 'about:blank') {


Same as for 'about:newtab' we should do the same with about:blank

NejcZdovc · 2017-09-12T09:35:46Z

app/common/state/tabUIState.js

+// Constants
+const settings = require('../../../js/constants/settings')
+
+// state


s/state/State/g

NejcZdovc · 2017-09-12T09:35:57Z

app/common/state/tabUIState.js

+const tabCloseState = require('../../common/state/tabContentState/tabCloseState')
+const partitionState = require('../../common/state/tabContentState/partitionState')
+
+// Utis


s/Utis/Utils/g

NejcZdovc · 2017-09-12T09:36:10Z

app/common/state/tabUIState.js

+const {getTextColorForBackground} = require('../../../js/lib/color')
+const {isEntryIntersected} = require('../../../app/renderer/lib/observerUtil')
+
+// settings


s/settings/Settings/g

NejcZdovc · 2017-09-12T10:34:01Z

app/renderer/components/tabs/tab.js

-            ? <TabTitle frameKey={this.props.frameKey} />
-            : null
-          }
+          <Favicon frameKey={this.props.frameKey} />


In this component and all bellow we should be passing tabId into them

NejcZdovc · 2017-09-12T10:39:10Z

docs/state.md

@@ -697,7 +696,8 @@ WindowStore
      hoverTabIndex: number, // index of the current hovered tab
      previewMode: boolean, // whether or not tab preview should be fired based on mouse idle time
      previewTabPageIndex: number, // index of the tab being previewed
-      tabPageIndex: number // index of the current tab page
+      tabPageIndex: number, // index of the current tab page
+      intersectionRatio: number // at which tab size position the tab sentinel is being intersected


please sort this alphabetically

NejcZdovc · 2017-09-12T10:40:24Z

js/state/frameStateUtil.js

+  const tabPageIndex = state.getIn(['ui', 'tabs', 'tabPageIndex'], 0)
+  const previewTabPageIndex = state.getIn(['ui', 'tabs', 'previewTabPageIndex'])
+
+  return previewTabPageIndex != null ? previewTabPageIndex : tabPageIndex


can we simplify this to return state.getIn(['ui', 'tabs', 'previewTabPageIndex']) || tabPageIndex

NejcZdovc · 2017-09-12T10:42:51Z

js/state/frameStateUtil.js

+
+const hasFrame = (state, frameKey) => {
+  const frame = getFrameByKey(state, frameKey)
+  return !frame.isEmpty()


getFrameByKey can return null as well so we need to add check here as well frame && !frame.isEmpty()

NejcZdovc · 2017-09-12T10:43:08Z

js/state/frameStateUtil.js

+
+const getTabIdByFrameKey = (state, frameKey) => {
+  const frame = getFrameByKey(state, frameKey)
+  return frame.get('tabId', tabState.TAB_ID_NONE)


we need to add null check here as well

NejcZdovc · 2017-09-12T10:53:24Z

app/renderer/components/tabs/tab.js

+    }
+    // we only have one entry
+    const entry = entries[0]
+    windowActions.setTabIntersectionState(this.props.frameKey, entry.intersectionRatio)


This is called quite a lot of time when resizing, can we doubnce it?

throttling tabs as we do now leads to #7925. I tried minimizing perf cost by observing only the first tab in a tab set. I'll share perf wins once I finish this monster

luixxiul · 2017-09-14T06:43:06Z

@cezaraugusto just in case let me remind you that detaching and reattaching tabs do not work for now. Also you cannot drag tabs.

NejcZdovc · 2017-09-14T06:44:27Z

@luixxiul @cezaraugusto should be fixed with #10937, so I will review it and if it's ok I will merge it very soon

luixxiul · 2017-09-14T06:46:33Z

app/renderer/components/tabs/content/tabTitle.js

  },

-  enforceFontVisibility: {
-    fontWeight: '600'
+  tab__title_bold: {


I am not sure if this would be a proper name as we have tab__title_windows below which has bolder font-weight. How about renaming it to tab__title_isDarwin?

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-6c5463a6f60c16525fb939516ad54125R53

On the commit: d97a56b#diff-6c5463a6f60c16525fb939516ad54125R53

luixxiul · 2017-09-14T06:56:01Z

app/renderer/components/tabs/content/favIcon.js

+            !this.props.showIconAtReducedSize &&
+            css(styles.icon__loading, iconStyles.icon__loading_color)
+          )
+          : !this.props.favicon && css(styles.icon__default, iconStyles.icon__default_props)


We have icon__default* for both styles and iconStyles. I'm wondering if it would be confusing a bit.

changed icon__default_props to icon__default_sizeAndColor. Not sure if best but more declarative ya

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-af59f73d2e4394ed5cd93fbab7e1cdc7R92

On the commit: c6947c5#diff-af59f73d2e4394ed5cd93fbab7e1cdc7R92

luixxiul · 2017-09-14T06:59:35Z

app/renderer/components/styles/theme.js

+      background: '#ddd',
+      borderColor: '#bbb',
+      color: '#000',
+      hover: {


would you mind adding blank lines for readability?

Confirmed this was addressed on https://github.com/brave/browser-laptop/blob/83864a8769ee10cb2d2d864b19289ba5e229bd34/app/renderer/components/styles/theme.js

luixxiul · 2017-09-14T07:01:31Z

app/renderer/components/tabs/content/closeTabIcon.js

-      className={css(this.props.showCloseIcon && styles.closeTab)}
+      className={css(
+        styles.closeTab__icon,
+        this.props.centralizeTabIcons && styles.closeTab__icon__centered


Shouldn't it be closeTab__icon_centered?

Addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-08a3077ca08d52dfaad29de7ae4d904aR76

On the commit: 8a1a150#diff-08a3077ca08d52dfaad29de7ae4d904aR76

luixxiul · 2017-09-14T07:08:11Z

app/renderer/components/tabs/content/audioTabIcon.js

    return <TabIcon
-      className={css(styles.icon, styles.icon_audio)}
+      data-test-id={this.audioIcon}
+      className={css(styles.audio__tabIcon)}


would you mind renaming this to styles.audioTab__icon following d69c3f7#diff-08a3077ca08d52dfaad29de7ae4d904aR75 or renaming the other?

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-1a5be0fc07ffeb6eda18603b57e9fce9R65

On the commit: 01092fe#diff-1a5be0fc07ffeb6eda18603b57e9fce9R65

luixxiul · 2017-09-14T07:14:25Z

app/renderer/components/tabs/content/newSessionIcon.js

+
+    const newSessionProps = StyleSheet.create({
+      newSession__indicator: {
+        filter: this.props.isActive && this.props.textIsWhite ? 'invert(100%)' : 'none'


Would you mind formatting like this? f672622#diff-bf09ff10e2191a87584e58393f99b728R44

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-d8880b1566bd03fcd4e0b29425a5d473R50

On the commit: 049f438#diff-d8880b1566bd03fcd4e0b29425a5d473R50

luixxiul · 2017-09-14T07:15:39Z

app/renderer/components/tabs/content/newSessionIcon.js

@@ -73,21 +64,17 @@ class NewSessionIcon extends React.Component {
 module.exports = ReduxComponent.connect(NewSessionIcon)

 const styles = StyleSheet.create({
-  icon: {
+  newSession__icon: {
+    zIndex: 99,


Would you mind converting this into const and adding it to global.js so that we could see the relationship among z-index values?

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-d8880b1566bd03fcd4e0b29425a5d473R70

On the commit: 049f438#diff-d8880b1566bd03fcd4e0b29425a5d473R70

luixxiul · 2017-09-14T07:19:39Z

app/renderer/components/styles/global.js

@@ -214,6 +214,7 @@ const globalStyles = {
    zindexWindowIsPreview: '1100',
    zindexDownloadsBar: '1000',
    zindexTabs: '1000',
+    zindexTabsAudioTopBorder: '10001',


Is it not 1001 instead of 10001?

Confirmed this was addressed on https://github.com/brave/browser-laptop/pull/10691/files#diff-f14732b3ea914a26c2215676e7208907R217

On the commit: f4780d3#diff-f14732b3ea914a26c2215676e7208907R217

luixxiul

++ 👍

@luixxiul

- text w/ gradient can be buggy. Let's do it with a layer Auditors: @luixxiul fix #8414 fix #9398

@luixxiul

Auditors: @luixxiul Fix #10103

@luixxiul

Auditors: @luixxiul close #10883

luixxiul · 2017-09-21T08:51:49Z

@cezaraugusto please do not forget to merge this to 0.20.x too, thanks!

improve tabs performance and UI with this one simple trick

cezaraugusto · 2017-09-21T20:21:18Z

master 9e6642f
0.20.x 472f152

@luixxiul

Auditors: @luixxiul Address #10691 Follow-up of sha 33c5d10

luixxiul · 2017-11-06T10:11:39Z

By doing QA I must say the tabs area has been massively improved 🦁 Kudos to @cezaraugusto 🎖

@luixxiul

Auditors: @luixxiul Address brave#10691 Follow-up of sha 33c5d10

cezaraugusto added feature/tabsbar perf PR/work-in-progress ⚒ labels Aug 28, 2017

cezaraugusto added this to the 0.20.x (Developer Channel) milestone Aug 28, 2017

cezaraugusto self-assigned this Aug 28, 2017

cezaraugusto force-pushed the tabs-observer branch from 4b20c2e to b058a21 Compare August 29, 2017 17:25

bbondy mentioned this pull request Sep 2, 2017

Tabs display wrong after exiting HTML5 fullscreen #7301

Closed

cezaraugusto force-pushed the tabs-observer branch from b058a21 to 21005b1 Compare September 10, 2017 01:20

luixxiul reviewed Sep 12, 2017

View reviewed changes

NejcZdovc reviewed Sep 12, 2017

View reviewed changes

ghost added the sprint/1 label Sep 13, 2017

cezaraugusto force-pushed the tabs-observer branch from 21005b1 to 019522e Compare September 14, 2017 05:11

cezaraugusto changed the title ~~improve performance for tabs, include intersectionObserver~~ improve tabs performance and UI with this one simple trick Sep 14, 2017

This was referenced Sep 14, 2017

Closing an opening the browser does not restore tab titles #9998

Closed

Moving a tab that is loading results in the tab forever showing loading indicators #6957

Closed

Description for Session Tab on Hover #10464

Closed

luixxiul reviewed Sep 14, 2017

View reviewed changes

This was referenced Sep 14, 2017

Tab preview does not work properly with DnD #10103

Closed

Tab title often isn't updated until the cursor is moved over it or tab focus is changed #7765

Closed

luixxiul reviewed Sep 14, 2017

View reviewed changes

luixxiul approved these changes Sep 21, 2017

View reviewed changes

cezaraugusto added 3 commits September 21, 2017 05:01

add gradient layer to mimic current title gradient

80af744

- text w/ gradient can be buggy. Let's do it with a layer Auditors: @luixxiul fix #8414 fix #9398

do not allow previews if tab is being dragged

c3def82

Auditors: @luixxiul Fix #10103

add smooth animation transitions to tab content

33c5d10

Auditors: @luixxiul close #10883

cezaraugusto force-pushed the tabs-observer branch from 6517c74 to 33c5d10 Compare September 21, 2017 08:05

cezaraugusto merged commit 9e6642f into master Sep 21, 2017

bsclifton deleted the tabs-observer branch September 21, 2017 08:06

cezaraugusto mentioned this pull request Sep 21, 2017

Throttling between window resize cause tabContent to pop #7925

Closed

bobinson mentioned this pull request Sep 21, 2017

fading effect b/w tabs feels like flickering #6716

Closed

cezaraugusto mentioned this pull request Sep 21, 2017

intermittent - audio indicator is not shown #10611

Closed

luixxiul mentioned this pull request Sep 21, 2017

Tabs cannot be muted via speaker icon #10544

Closed

JaneSmith mentioned this pull request Sep 21, 2017

Tabs do not automatically resize until mousing over them. #10582

Closed

jonathansampson mentioned this pull request Sep 21, 2017

Tabs No Longer Show Full-Color Emoji #8414

Closed

luixxiul mentioned this pull request Sep 21, 2017

Title on new tab flickers after setting the language to Russian #7730

Closed

cezaraugusto mentioned this pull request Sep 21, 2017

make use of intersectionObserver for tabs #10509

Closed

jonathansampson mentioned this pull request Sep 21, 2017

Tab Label Rendering Issue #9398

Closed

srirambv mentioned this pull request Sep 21, 2017

Active tab flicker on hover #10838

Closed

cezaraugusto mentioned this pull request Sep 21, 2017

no tab close icon is shown for the active tab on Windows #10123

Closed

cezaraugusto added a commit that referenced this pull request Sep 21, 2017

Merge pull request #10691 from brave/tabs-observer

472f152

improve tabs performance and UI with this one simple trick

cezaraugusto added a commit that referenced this pull request Sep 22, 2017

make tabTitle work for gradient calc instead of tab

1b93dc6

Auditors: @luixxiul Address #10691 Follow-up of sha 33c5d10

cezaraugusto mentioned this pull request Sep 22, 2017

make tabTitle work for gradient calc instead of tab #11086

Merged

luixxiul mentioned this pull request Sep 25, 2017

Automated tests related 'data-test-active-tab' and 'data-test-pinned-tab' failing #11135

Closed

NejcZdovc mentioned this pull request Sep 27, 2017

Ledger transfer PDF opens another window #11173

Closed

luixxiul mentioned this pull request Oct 3, 2017

Tab colour has weird fade in paint effect when switching #11249

Closed

This was referenced Oct 12, 2017

Tab 'appear' animations run again when tab is moved #11470

Closed

Prevent tab icon 'appear' animations running again when tab is moved #11501

Merged

syuan100 pushed a commit to syuan100/browser-laptop that referenced this pull request Nov 9, 2017

make tabTitle work for gradient calc instead of tab

a95fe3d

Auditors: @luixxiul Address brave#10691 Follow-up of sha 33c5d10

improve tabs performance and UI with this one simple trick #10691

improve tabs performance and UI with this one simple trick #10691

Conversation

cezaraugusto commented Aug 28, 2017 • edited Loading

TL;DR

Performance tests

Performance while resizing window

current

main resize function cost

main call stack cost

after this PR

main resize function cost

main call stack cost

Performance while opening tabs

Performance while closing tabs

Performance while resizing window -- stress test (multiple heavy tabs)

Bugs fixed | usability improved

Unrelated tasks covered with this PR

For reviewers (QA please skip)

For everybody (cc QA team)

Issue #6716 (fading effect b/w tabs feels like flickering)

Issue #7301 (Tabs display wrong after exiting HTML5 fullscreen)

Issue #7730 (Title on new tab flickers after setting the language to Russian)

Issue #7925 (Throttling between window resize cause tabContent to pop)

Issue #7765 (Tab title often isn't updated until the cursor is moved over it or tab focus is changed)

Issue #8414 (Tabs No Longer Show Full-Color Emoji)

Issue #9398 (Tab Label Rendering Issue)

issue #10103 (Tab preview does not work properly with DnD)

Issue #10123 (no tab close icon is shown for the active tab on Windows)

Issue #10464 (Description for Session Tab on Hover)

Issue #10509 (make use of intersectionObserver for tabs)

Issue #10544 (Tabs cannot be muted via speaker icon)

Issue #10582 (Tabs do not automatically resize until mousing over them)

Issue #10611 (intermittent - audio indicator is not shown)

Issue #10838 (Active tab flicker on hover)

Issue #10883 (create smooth transitions for tab components)

luixxiul Sep 12, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

NejcZdovc left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

luixxiul commented Sep 14, 2017

NejcZdovc commented Sep 14, 2017

luixxiul Sep 14, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

luixxiul Sep 14, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

luixxiul Sep 14, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

cezaraugusto commented Aug 28, 2017 •

edited

Loading

luixxiul Sep 12, 2017 •

edited

Loading

luixxiul Sep 14, 2017 •

edited

Loading

luixxiul Sep 14, 2017 •

edited

Loading

luixxiul Sep 14, 2017 •

edited

Loading