NavBarButton renamed to NavTabButton

src/common/NavBar/NavBar.js

@@ -1,7 +1,7 @@
 const React = require('react');
 const PropTypes = require('prop-types');
 const classnames = require('classnames');
-const NavBarButton = require('./NavBarButton');
+const NavTabButton = require('./NavTabButton');
 const SearchBar = require('./SearchBar');
 const AddonsButton = require('./AddonsButton');
 const NavMenu = require('./NavMenu');
@@ -15,8 +15,8 @@ const NavBar = React.memo(({ className, backButton = false, tabs = [], title = '
         <nav className={classnames(className, styles['nav-bar-container'])}>
             {
                 backButton ?
-                    <NavBarButton
-                        className={styles['nav-bar-button']}
+                    <NavTabButton
+                        className={styles['nav-tab-button']}
                         icon={'ic_back_ios'}
                         label={'Back'}
                         onClick={backButtonOnClick}
@@ -27,9 +27,9 @@ const NavBar = React.memo(({ className, backButton = false, tabs = [], title = '
             {
                 Array.isArray(tabs) && tabs.length > 0 ?
                     tabs.slice(0, 4).map(({ href = '', icon = '', label = '', onClick }) => (
-                        <NavBarButton
+                        <NavTabButton
                             key={`${href}${icon}${label}`}
-                            className={styles['nav-bar-button']}
+                            className={styles['nav-tab-button']}
                             href={href}
                             icon={icon}
                             label={label}

src/common/NavBar/NavBarButton/index.js

@@ -1,3 +0,0 @@
-const NavBarButton = require('./NavBarButton');
-
-module.exports = NavBarButton;

src/common/NavBar/NavTabButton/NavTabButton.js

@@ -8,7 +8,7 @@ const routesRegexp = require('stremio/common/routesRegexp');
 const useLocationHash = require('stremio/common/useLocationHash');
 const styles = require('./styles');
 
-const NavBarButton = ({ className, icon = '', label = '', href = '', onClick }) => {
+const NavTabButton = ({ className, icon = '', label = '', href = '', onClick }) => {
     const locationHash = useLocationHash();
     const routeRegexp = React.useMemo(() => {
         if (typeof href === 'string' && href.length > 0) {
@@ -30,7 +30,7 @@ const NavBarButton = ({ className, icon = '', label = '', href = '', onClick })
         return false;
     }, [routeRegexp, locationHash]);
     return (
-        <Button className={classnames(className, styles['nav-bar-button-container'], { 'active': active })} title={label} tabIndex={-1} href={href} onClick={onClick}>
+        <Button className={classnames(className, styles['nav-tab-button-container'], { 'active': active })} title={label} tabIndex={-1} href={href} onClick={onClick}>
             {
                 typeof icon === 'string' && icon.length > 0 ?
                     <Icon className={styles['icon']} icon={icon} />
@@ -47,7 +47,7 @@ const NavBarButton = ({ className, icon = '', label = '', href = '', onClick })
     );
 };
 
-NavBarButton.propTypes = {
+NavTabButton.propTypes = {
     className: PropTypes.string,
     icon: PropTypes.string,
     label: PropTypes.string,
@@ -55,4 +55,4 @@ NavBarButton.propTypes = {
     onClick: PropTypes.func
 };
 
-module.exports = NavBarButton;
+module.exports = NavTabButton;

src/common/NavBar/NavTabButton/index.js

@@ -0,0 +1,3 @@
+const NavTabButton = require('./NavTabButton');
+
+module.exports = NavTabButton;

src/common/NavBar/NavTabButton/styles.less

@@ -1,4 +1,4 @@
-.nav-bar-button-container {
+.nav-tab-button-container {
     display: flex;
     flex-direction: row;
     align-items: center;

src/common/NavBar/styles.less

@@ -5,7 +5,7 @@
     height: 3.2rem;
     background-color: var(--color-secondarydark);
 
-    .nav-bar-button {
+    .nav-tab-button {
         flex: none;
         max-width: 11rem;
         height: 3.2rem;