45 lines
1.3 KiB
JavaScript
45 lines
1.3 KiB
JavaScript
import React from 'react';
|
|
|
|
import MenuHeader from './MenuHeader';
|
|
import MenuBodyContainer from './MenuBodyContainer';
|
|
import MenuFooter from './MenuFooter';
|
|
import Redirecter from './Redirecter';
|
|
import { useSelector } from 'react-redux';
|
|
import { getSiteDomain, mostStrictSiteMatch } from '../../utils';
|
|
|
|
|
|
const AppMenu = ({ menuOpen, toggleMenu, getCatalog, isPreLaunch, isInternal, deselectTags }) => {
|
|
const allSites = useSelector(state => state.urls.allSites);
|
|
const color = useSelector(state => state.urls.color);
|
|
return (
|
|
<div className={`AppMenu ${menuOpen ? 'open' : ''}`}>
|
|
{isInternal && <Redirecter />}
|
|
<div className='AppMenu__container'>
|
|
<div className="SitesTabGroup">
|
|
{
|
|
Object.getOwnPropertyNames(allSites).map((site, i) => {
|
|
const isActive = site === mostStrictSiteMatch(allSites, getSiteDomain());
|
|
if (isActive) {
|
|
return <a className="SitesTab active" key={i} style={{backgroundColor: color}} href={site}>№ {i + 1}</a>
|
|
} else {
|
|
return <a className="SitesTab" key={i} href={site}>№ {i + 1}</a>
|
|
}
|
|
})
|
|
}
|
|
</div>
|
|
|
|
<MenuHeader
|
|
toggleMenu={toggleMenu}
|
|
getCatalog={getCatalog}
|
|
isPreLaunch={isPreLaunch}
|
|
deselectTags={deselectTags}
|
|
/>
|
|
<MenuBodyContainer />
|
|
<MenuFooter isPreLaunch={isPreLaunch} />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default AppMenu;
|