Skip to content
This repository has been archived by the owner on Dec 11, 2019. It is now read-only.

Commit

Permalink
clean-up: remove legacy/deprecated methods
Browse files Browse the repository at this point in the history 
Auditors: @bsclifton
Test plan: `npm run unittest`
  • Loading branch information
@cezaraugusto
cezaraugusto committed Sep 14, 2017
1 parent cb2cfa1 commit 633ab0a
Show file tree
Hide file tree
Showing 12 changed files with 4 additions and 343 deletions.
34 changes: 0 additions & 34 deletions app/common/state/tabContentState/closeState.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,44 +7,10 @@ const frameStateUtil = require('../../../../js/state/frameStateUtil')

// Utils
const {isEntryIntersected} = require('../../../../app/renderer/lib/observerUtil')
const {hasBreakpoint} = require('../../../renderer/lib/tabUtil')

// Styles
const {intersection} = require('../../../renderer/components/styles/global')

/**
* Check whether or not closeTab icon is always visible (fixed) in tab
*/
module.exports.deprecatedHasFixedCloseIcon = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)
const isActive = frameStateUtil.isFrameKeyActive(state, frameKey)

if (frame == null) {
return false
}

return (
isActive &&
// Larger sizes still have a relative closeIcon
// We don't resize closeIcon as we do with favicon so don't show it (smallest)
!hasBreakpoint(frame.get('breakpoint'), ['dynamic', 'default', 'large', 'smallest'])
)
}

/**
* Check whether or not closeTab icon is relative to hover state
*/
module.exports.deprecatedHasRelativeCloseIcon = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)

if (frame == null) {
return false
}

return frameStateUtil.getTabHoverState(state, frameKey) &&
hasBreakpoint(frame.get('breakpoint'), ['dynamic', 'default', 'large'])
}

module.exports.hasFixedCloseIcon = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)

Expand Down
21 changes: 0 additions & 21 deletions app/common/state/tabContentState/faviconState.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,30 +7,9 @@ const {isSourceAboutUrl} = require('../../../../js/lib/appUrlUtil')
const frameStateUtil = require('../../../../js/state/frameStateUtil')
const {isEntryIntersected} = require('../../../../app/renderer/lib/observerUtil')

// TODO deprecate
const {braveExtensionId} = require('../../../../js/constants/config')

// Styles
const {intersection} = require('../../../renderer/components/styles/global')

// TODO deprecate
module.exports.deprecatedIsTabLoading = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)

if (frame == null) {
return false
}

return (
frame.get('loading') ||
frame.get('location') === 'about:blank'
) &&
(
!frame.get('provisionalLocation') ||
!frame.get('provisionalLocation').startsWith(`chrome-extension://${braveExtensionId}/`)
)
}

module.exports.showFavicon = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)

Expand Down
58 changes: 0 additions & 58 deletions app/common/state/tabUIState.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,70 +12,12 @@ const frameStateUtil = require('../../../js/state/frameStateUtil')
// Utils
const {isEntryIntersected} = require('../../../app/renderer/lib/observerUtil')
const {getTextColorForBackground} = require('../../../js/lib/color')
const {hasBreakpoint} = require('../../renderer/lib/tabUtil') // TODO deprecate

// Settings
const {getSetting} = require('../../../js/settings')

// Styles
const {intersection} = require('../../renderer/components/styles/global')
// const {theme} = require('../../renderer/components/styles/theme')

// ///////////////////////////////////////////
// methods to deprecate after the observer
// ///////////////////////////////////////////

module.exports.hasTabInFullScreen = (state) => {
return state.get('frames')
.map((frame) => frame.get('isFullScreen'))
.some(fullScreenMode => fullScreenMode === true)
}

module.exports.isMediumView = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)
return frame
? ['large', 'largeMedium'].includes(frame.get('breakpoint'))
: false
}

module.exports.isNarrowView = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)
return frame
? ['medium', 'mediumSmall', 'small', 'extraSmall', 'smallest'].includes(frame.get('breakpoint'))
: false
}

module.exports.isNarrowestView = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)
return frame
? ['extraSmall', 'smallest'].includes(frame.get('breakpoint'))
: false
}

/**
* Check whether or not private or newSession icon should be visible
*/
module.exports.hasVisibleSecondaryIcon = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)

if (frame == null) {
return false
}

return (
// Hide icon on hover
!closeState.deprecatedHasRelativeCloseIcon(state, frameKey) &&
// If closeIcon is fixed then there's no room for another icon
!closeState.deprecatedHasFixedCloseIcon(state, frameKey) &&
// completely hide it for small sizes
!hasBreakpoint(frame.get('breakpoint'),
['medium', 'mediumSmall', 'small', 'extraSmall', 'smallest'])
)
}

// ///////////////////////////////////////////
// end of methods to deprecate
// ///////////////////////////////////////////

module.exports.getThemeColor = (state, frameKey) => {
const frame = frameStateUtil.getFrameByKey(state, frameKey)
Expand Down
13 changes: 1 addition & 12 deletions app/renderer/components/styles/global.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,18 +25,7 @@ const globalStyles = {
breakpointExtensionButtonPadding: '720px',
breakpointSmallWin32: '650px',
breakpointTinyWin32: '500px',
breakpointNewPrivateTab: '890px',
tab: {
dynamic: '99999px', // add a large number as new spec will set tab width based on window size
default: '184px', // match tabArea max-width
large: '120px',
largeMedium: '83px',
medium: '66px',
mediumSmall: '53px',
small: '46px',
extraSmall: '40px',
smallest: '19px'
}
breakpointNewPrivateTab: '890px'
},
intersection: {
// whereas 1 === 100%
Expand Down
109 changes: 3 additions & 106 deletions app/renderer/components/tabs/tab.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,8 @@ const {getTextColorForBackground} = require('../../../../js/lib/color')
const {isIntermediateAboutPage} = require('../../../../js/lib/appUrlUtil')
const contextMenus = require('../../../../js/contextMenus')
const dnd = require('../../../../js/dnd')
const throttle = require('../../../../js/lib/throttle')
const frameStateUtil = require('../../../../js/state/frameStateUtil')
const {
getTabBreakpoint,
tabUpdateFrameRate,
hasTabAsRelatedTarget
} = require('../../lib/tabUtil')
const {hasTabAsRelatedTarget} = require('../../lib/tabUtil')
const isWindows = require('../../../common/lib/platformUtil').isWindows()
const {getCurrentWindowId} = require('../../currentWindow')
const {setObserver} = require('../../lib/observerUtil')
Expand All @@ -58,7 +53,6 @@ class Tab extends React.Component {
this.onMouseMove = this.onMouseMove.bind(this)
this.onMouseEnter = this.onMouseEnter.bind(this)
this.onMouseLeave = this.onMouseLeave.bind(this)
this.onUpdateTabSize = this.onUpdateTabSize.bind(this)
this.onDragStart = this.onDragStart.bind(this)
this.onDragEnd = this.onDragEnd.bind(this)
this.onDragOver = this.onDragOver.bind(this)
Expand Down Expand Up @@ -191,22 +185,6 @@ class Tab extends React.Component {
}
}

get tabSize () {
const tab = this.tabNode
// Avoid TypeError keeping it null until component is mounted
return tab && !this.props.isPinnedTab ? tab.getBoundingClientRect().width : null
}

onUpdateTabSize () {
const currentSize = getTabBreakpoint(this.tabSize)
// Avoid updating breakpoint when user enters fullscreen (see #7301)
// Also there can be a race condition for pinned tabs if we update when not needed
// since a new tab component with the same key gets created which is not pinned.
if (this.props.breakpoint !== currentSize && !this.props.hasTabInFullScreen) {
windowActions.setTabBreakpoint(this.props.frameKey, currentSize)
}
}

componentDidMount () {
// do not observe pinned tabs
if (this.props.isPinned) {
Expand All @@ -219,9 +197,7 @@ class Tab extends React.Component {
this.observer = setObserver(this.tabSentinel, threshold, margin, this.onObserve)
this.observer.observe(this.tabSentinel)

this.onUpdateTabSize() // TODO: this will be depreacated
this.tabNode.addEventListener('auxclick', this.onAuxClick.bind(this))
window.addEventListener('resize', throttle(this.onUpdateTabSize, tabUpdateFrameRate), { passive: true })
}

componentDidUpdate () {
Expand All @@ -230,12 +206,10 @@ class Tab extends React.Component {
if (this.props.isPinnedTab) {
this.observer.unobserve(this.tabSentinel)
}
this.onUpdateTabSize() // TODO: deprecate
}

componentWillUnmount () {
this.observer.unobserve(this.tabSentinel)
window.removeEventListener('resize', this.onUpdateTabSize)
}

onObserve (entries) {
Expand Down Expand Up @@ -270,23 +244,18 @@ class Tab extends React.Component {
// used in renderer
props.frameKey = ownProps.frameKey
props.isPrivateTab = frame.get('isPrivate')
props.breakpoint = frame.get('breakpoint')
props.notificationBarActive = notificationBarActive
props.isActive = frameStateUtil.isFrameKeyActive(currentWindow, props.frameKey)
props.tabWidth = currentWindow.getIn(['ui', 'tabs', 'fixTabWidth'])
props.isPinnedTab = tabState.isTabPinned(state, tabId)
props.canPlayAudio = audioState.canPlayAudio(currentWindow, props.frameKey)
props.themeColor = tabUIState.getThemeColor(currentWindow, props.frameKey)
props.isNarrowView = tabUIState.isNarrowView(currentWindow, props.frameKey)
props.isNarrowestView = tabUIState.isNarrowestView(currentWindow, props.frameKey)
props.isPlayIndicatorBreakpoint = tabUIState.isMediumView(currentWindow, props.frameKey) || props.isNarrowView
props.title = frame.get('title')
props.partOfFullPageSet = ownProps.partOfFullPageSet

// used in other functions
props.totalTabs = state.get('tabs').size
props.dragData = state.getIn(['dragData', 'type']) === dragTypes.TAB && state.get('dragData')
props.hasTabInFullScreen = tabUIState.hasTabInFullScreen(currentWindow)
props.tabId = tabId
props.previewMode = currentWindow.getIn(['ui', 'tabs', 'previewMode'])

Expand Down Expand Up @@ -335,19 +304,12 @@ class Tab extends React.Component {
isWindows && styles.tabForWindows,
this.props.isPinnedTab && styles.isPinned,
this.props.isActive && styles.active,
this.props.isPlayIndicatorBreakpoint && this.props.canPlayAudio && styles.narrowViewPlayIndicator,
this.props.isActive && this.props.themeColor && perPageStyles.themeColor,
// Private color should override themeColor
this.props.isPrivateTab && styles.private,
this.props.isActive && this.props.isPrivateTab && styles.activePrivateTab,
!this.props.isPinnedTab && this.props.isNarrowView && styles.tabNarrowView,
!this.props.isPinnedTab && this.props.isNarrowestView && styles.tabNarrowestView,
!this.props.isPinnedTab && this.props.breakpoint === 'smallest' && styles.tabMinAllowedSize
this.props.isActive && this.props.isPrivateTab && styles.activePrivateTab
)}
data-test-id='tab'
data-test-active-tab={this.props.isActive}
data-test-pinned-tab={this.props.isPinnedTab}
data-test-private-tab={this.props.isPrivateTab}
data-frame-key={this.props.frameKey}
draggable
title={this.props.title}
Expand All @@ -361,11 +323,7 @@ class Tab extends React.Component {
ref={(node) => { this.tabSentinel = node }}
className={css(styles.tab__sentinel)}
/>
<div className={css(
styles.tabId,
this.props.isNarrowView && styles.tabIdNarrowView,
this.props.breakpoint === 'smallest' && styles.tabIdMinAllowedSize
)}>
<div className={css(styles.tabId)}>
<Favicon tabId={this.props.tabId} />
<AudioTabIcon tabId={this.props.tabId} />
<TabTitle tabId={this.props.tabId} />
Expand Down Expand Up @@ -422,44 +380,6 @@ const styles = StyleSheet.create({
width: globalStyles.spacing.sentinelSize
},

// Custom classes based on tab's width and behaviour
tabNarrowView: {
padding: '0 2px'
},

narrowViewPlayIndicator: {
'::before': {
content: `''`,
display: 'block',
position: 'absolute',
top: 0,
left: 0,
right: 0,
height: '2px',
background: 'lightskyblue'
}
},

tabNarrowestView: {
justifyContent: 'center'
},

tabMinAllowedSize: {
padding: 0
},

tabIdNarrowView: {
flex: 'inherit'
},

tabIdMinAllowedSize: {
overflow: 'hidden'
},

alternativePlayIndicator: {
borderTop: '2px solid lightskyblue'
},

tabId: {
justifyContent: 'center',
alignItems: 'center',
Expand Down Expand Up @@ -514,29 +434,6 @@ const styles = StyleSheet.create({
opacity: '0'
}
}
},

icon: {
width: globalStyles.spacing.iconSize,
minWidth: globalStyles.spacing.iconSize,
height: globalStyles.spacing.iconSize,
backgroundSize: globalStyles.spacing.iconSize,
fontSize: globalStyles.fontSize.tabIcon,
backgroundPosition: 'center',
backgroundRepeat: 'no-repeat',
paddingLeft: globalStyles.spacing.defaultIconPadding,
paddingRight: globalStyles.spacing.defaultIconPadding
},

icon_audio: {
color: globalStyles.color.highlightBlue,

// 16px
fontSize: `calc(${globalStyles.fontSize.tabIcon} + 2px)`,

// equal spacing around audio icon (favicon and tabTitle)
padding: globalStyles.spacing.defaultTabPadding,
paddingRight: '0 !important'
}
})

Expand Down
Loading

0 comments on commit 633ab0a

Please sign in to comment.