u
This commit is contained in:
@@ -27,6 +27,10 @@ class AppSidebar extends PureComponent {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
bgcolor: theme.nav.background,
|
||||
position: 'sticky',
|
||||
top: 0,
|
||||
alignSelf: 'flex-start',
|
||||
height: '100vh',
|
||||
})}
|
||||
>
|
||||
<List disablePadding sx={{ flexGrow: 1 }}>
|
||||
@@ -107,6 +111,10 @@ class AppSubNav extends PureComponent {
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
gap: 1,
|
||||
position: 'sticky',
|
||||
top: 0,
|
||||
alignSelf: 'flex-start',
|
||||
py: 4,
|
||||
}}
|
||||
>
|
||||
{subNav.map(({ segment, label, icon: Icon }) => {
|
||||
|
||||
@@ -16,12 +16,14 @@ import {
|
||||
DEFAULT_ARTICLE_TAB,
|
||||
artikelDetailPath,
|
||||
articleShowsCompoundTab,
|
||||
articleSku,
|
||||
articleTabFromPathname,
|
||||
readPreferredArticleTab,
|
||||
resolveArticleTab,
|
||||
writePreferredArticleTab,
|
||||
} from '../../pages/artikel/articleRoute';
|
||||
import { router } from '../../appRouter';
|
||||
import { matchPath } from 'react-router-dom';
|
||||
import { PanelTile } from '../panels';
|
||||
import { PANEL_TILE_BORDER_RADIUS, responsiveColumnSpan } from '../panels/panelTileLayout';
|
||||
import ArticleAttributesTab from './tabs/ArticleAttributesTab';
|
||||
@@ -77,6 +79,18 @@ function readRouteTab() {
|
||||
return articleTabFromPathname(router.state.location.pathname);
|
||||
}
|
||||
|
||||
/** True only while the URL is this article’s detail route. */
|
||||
function isOnArticleDetail(article) {
|
||||
const sku = articleSku(article);
|
||||
if (!sku) return false;
|
||||
const match = matchPath(
|
||||
'/artikel/:sku/:tab?',
|
||||
router.state.location.pathname,
|
||||
);
|
||||
if (!match?.params?.sku) return false;
|
||||
return decodeURIComponent(match.params.sku) === sku;
|
||||
}
|
||||
|
||||
class ArticleTileTab extends PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
@@ -106,6 +120,7 @@ class ArticleTileTab extends PureComponent {
|
||||
}
|
||||
|
||||
syncTabFromRouter() {
|
||||
if (!isOnArticleDetail(this.props.article)) return;
|
||||
const tabParam = readRouteTab();
|
||||
if (tabParam !== this.state.tabParam) {
|
||||
this.setState({ tabParam }, () => this.ensureValidTab());
|
||||
@@ -115,7 +130,7 @@ class ArticleTileTab extends PureComponent {
|
||||
ensureValidTab() {
|
||||
const { article } = this.props;
|
||||
const { tabParam } = this.state;
|
||||
if (!article) return;
|
||||
if (!article || !isOnArticleDetail(article)) return;
|
||||
const resolved = resolveArticleTab(tabParam, article);
|
||||
if (tabParam !== resolved) {
|
||||
void router.navigate(artikelDetailPath(article, resolved), { replace: true });
|
||||
|
||||
Reference in New Issue
Block a user