change(ui): separate bookmarks route
This commit is contained in:
Shekar Siri
parent
fa94bd2cb3
commit
477356c4e3
5 changed files with 47 additions and 40 deletions
|
|
@ -68,6 +68,7 @@ const FFLAGS_PATH = routes.fflags();
|
|||
const FFLAG_PATH = routes.fflag();
|
||||
const FFLAG_CREATE_PATH = routes.newFFlag();
|
||||
const NOTES_PATH = routes.notes();
|
||||
const BOOKMARKS_PATH = routes.bookmarks();
|
||||
const ASSIST_PATH = routes.assist();
|
||||
const RECORDINGS_PATH = routes.recordings();
|
||||
// const ERRORS_PATH = routes.errors();
|
||||
|
|
@ -239,6 +240,7 @@ class Router extends React.Component {
|
|||
<Route exact strict path={withSiteId(FFLAG_PATH, siteIdList)} component={SessionsOverview} />
|
||||
<Route exact strict path={withSiteId(FFLAG_CREATE_PATH, siteIdList)} component={SessionsOverview} />
|
||||
<Route exact strict path={withSiteId(NOTES_PATH, siteIdList)} component={SessionsOverview} />
|
||||
<Route exact strict path={withSiteId(BOOKMARKS_PATH, siteIdList)} component={SessionsOverview} />
|
||||
<Route exact strict path={withSiteId(SESSION_PATH, siteIdList)} component={Session} />
|
||||
<Route exact strict path={withSiteId(LIVE_SESSION_PATH, siteIdList)} component={LiveSession} />
|
||||
<Route exact strict path={withSiteId(LIVE_SESSION_PATH, siteIdList)} render={(props) => <Session {...props} live />} />
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import OverviewMenu from 'Shared/OverviewMenu';
|
|||
import FFlagsList from 'Components/FFlags';
|
||||
import NewFFlag from 'Components/FFlags/NewFFlag';
|
||||
import { Switch, Route } from 'react-router';
|
||||
import { sessions, fflags, withSiteId, newFFlag, fflag, notes } from 'App/routes';
|
||||
import { sessions, fflags, withSiteId, newFFlag, fflag, notes, bookmarks } from 'App/routes';
|
||||
import { withRouter, RouteComponentProps } from 'react-router-dom';
|
||||
|
||||
// @ts-ignore
|
||||
|
|
@ -32,7 +32,7 @@ function Overview({ match: { params } }: IProps) {
|
|||
</div>
|
||||
<div className={cn('side-menu-margined w-full')}>
|
||||
<Switch>
|
||||
<Route exact strict path={[withSiteId(sessions(), siteId), withSiteId(notes(), siteId)]}>
|
||||
<Route exact strict path={[withSiteId(sessions(), siteId), withSiteId(notes(), siteId), withSiteId(bookmarks(), siteId)]}>
|
||||
<div className="mb-5 w-full mx-auto" style={{ maxWidth: '1300px' }}>
|
||||
<NoSessionsMessage />
|
||||
<MainSearchBar />
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { SideMenuitem } from 'UI';
|
|||
import { connect } from 'react-redux';
|
||||
import { setActiveTab } from 'Duck/search';
|
||||
import { withRouter, RouteComponentProps } from 'react-router-dom';
|
||||
import { sessions, fflags, withSiteId, notes } from "App/routes";
|
||||
import { sessions, fflags, withSiteId, notes, bookmarks } from 'App/routes';
|
||||
|
||||
interface Props {
|
||||
setActiveTab: (tab: any) => void;
|
||||
|
|
@ -13,10 +13,10 @@ interface Props {
|
|||
|
||||
const TabToUrlMap = {
|
||||
all: sessions() as '/sessions',
|
||||
bookmark: sessions() as '/sessions',
|
||||
bookmark: bookmarks() as '/bookmarks',
|
||||
notes: notes() as '/notes',
|
||||
flags: fflags() as '/feature-flags',
|
||||
}
|
||||
flags: fflags() as '/feature-flags'
|
||||
};
|
||||
|
||||
function OverviewMenu(props: Props & RouteComponentProps) {
|
||||
// @ts-ignore
|
||||
|
|
@ -26,56 +26,57 @@ function OverviewMenu(props: Props & RouteComponentProps) {
|
|||
const currentLocation = location.pathname;
|
||||
const tab = Object.keys(TabToUrlMap).find((tab: keyof typeof TabToUrlMap) => currentLocation.includes(TabToUrlMap[tab]));
|
||||
if (tab && tab !== activeTab) {
|
||||
props.setActiveTab({ type: tab })
|
||||
props.setActiveTab({ type: tab });
|
||||
}
|
||||
}, [location.pathname])
|
||||
}, [location.pathname]);
|
||||
|
||||
return (
|
||||
<div className={"flex flex-col gap-2 w-full"}>
|
||||
<div className="w-full">
|
||||
<div className={'flex flex-col gap-2 w-full'}>
|
||||
<div className='w-full'>
|
||||
<SideMenuitem
|
||||
active={activeTab === 'all'}
|
||||
id="menu-sessions"
|
||||
title="Sessions"
|
||||
iconName="play-circle-bold"
|
||||
id='menu-sessions'
|
||||
title='Sessions'
|
||||
iconName='play-circle-bold'
|
||||
onClick={() => {
|
||||
props.setActiveTab({ type: 'all' })
|
||||
!location.pathname.includes(sessions()) && history.push(withSiteId(sessions(), siteId))
|
||||
props.setActiveTab({ type: 'all' });
|
||||
!location.pathname.includes(sessions()) && history.push(withSiteId(sessions(), siteId));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className='w-full'>
|
||||
<SideMenuitem
|
||||
active={activeTab === 'bookmark'}
|
||||
id="menu-bookmarks"
|
||||
id='menu-bookmarks'
|
||||
title={`${isEnterprise ? 'Vault' : 'Bookmarks'}`}
|
||||
iconName={ isEnterprise ? "safe" : "star" }
|
||||
iconName={isEnterprise ? 'safe' : 'star'}
|
||||
onClick={() => {
|
||||
props.setActiveTab({ type: 'bookmark' })
|
||||
!location.pathname.includes(sessions()) && history.push(withSiteId(sessions(), siteId))
|
||||
// props.setActiveTab({ type: 'bookmark' });
|
||||
!location.pathname.includes(bookmarks()) && history.push(withSiteId(bookmarks(), siteId));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className='w-full'>
|
||||
<SideMenuitem
|
||||
active={activeTab === 'notes'}
|
||||
id="menu-notes"
|
||||
title="Notes"
|
||||
iconName="stickies"
|
||||
id='menu-notes'
|
||||
title='Notes'
|
||||
iconName='stickies'
|
||||
onClick={() => {
|
||||
props.setActiveTab({ type: 'notes' })
|
||||
!location.pathname.includes(notes()) && history.push(withSiteId(notes(), siteId))
|
||||
props.setActiveTab({ type: 'notes' });
|
||||
!location.pathname.includes(notes()) && history.push(withSiteId(notes(), siteId));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<div className='w-full'>
|
||||
<SideMenuitem
|
||||
active={activeTab === 'flags'}
|
||||
id="menu-flags"
|
||||
title="Feature Flags"
|
||||
iconName="toggles"
|
||||
id='menu-flags'
|
||||
title='Feature Flags'
|
||||
iconName='toggles'
|
||||
onClick={() => {
|
||||
props.setActiveTab({ type: 'flags' })
|
||||
!location.pathname.includes(fflags()) && history.push(withSiteId(fflags(), siteId))
|
||||
props.setActiveTab({ type: 'flags' });
|
||||
!location.pathname.includes(fflags()) && history.push(withSiteId(fflags(), siteId));
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -84,6 +85,6 @@ function OverviewMenu(props: Props & RouteComponentProps) {
|
|||
}
|
||||
|
||||
export default connect((state: any) => ({
|
||||
activeTab: state.getIn(['search', 'activeTab', 'type']),
|
||||
isEnterprise: state.getIn(['user', 'account', 'edition']) === 'ee',
|
||||
activeTab: state.getIn(['search', 'activeTab', 'type']),
|
||||
isEnterprise: state.getIn(['user', 'account', 'edition']) === 'ee'
|
||||
}), { setActiveTab })(withRouter(OverviewMenu));
|
||||
|
|
|
|||
|
|
@ -98,12 +98,13 @@ function SessionList(props: Props) {
|
|||
// handle scroll position
|
||||
const { scrollY } = props;
|
||||
window.scrollTo(0, scrollY);
|
||||
if (total === 0) {
|
||||
setTimeout(() => {
|
||||
props.fetchSessions(null, true);
|
||||
}, 300);
|
||||
}
|
||||
props.fetchMetadata();
|
||||
|
||||
// if (total === 0) {
|
||||
// setTimeout(() => {
|
||||
// props.fetchSessions(null, true);
|
||||
// }, 300);
|
||||
// }
|
||||
// props.fetchMetadata();
|
||||
|
||||
return () => {
|
||||
props.setScrollPosition(window.scrollY);
|
||||
|
|
|
|||
|
|
@ -87,6 +87,7 @@ export const fflags = params => queried('/feature-flags', params);
|
|||
export const newFFlag = () => '/feature-flags/create';
|
||||
export const fflag = (id = ':fflagId', hash) => hashed(`/feature-flags/${ id }`, hash);
|
||||
export const notes = params => queried('/notes', params);
|
||||
export const bookmarks = params => queried('/bookmarks', params);
|
||||
export const assist = params => queried('/assist', params);
|
||||
export const recordings = params => queried("/recordings", params);
|
||||
export const multiviewIndex = params => queried('/multiview', params);
|
||||
|
|
@ -124,6 +125,7 @@ const REQUIRED_SITE_ID_ROUTES = [
|
|||
newFFlag(),
|
||||
fflag(),
|
||||
notes(),
|
||||
bookmarks(),
|
||||
fflags(),
|
||||
assist(),
|
||||
recordings(),
|
||||
|
|
@ -177,6 +179,7 @@ export function isRoute(route, path){
|
|||
const SITE_CHANGE_AVALIABLE_ROUTES = [
|
||||
sessions(),
|
||||
notes(),
|
||||
bookmarks(),
|
||||
fflags(),
|
||||
funnels(),
|
||||
assist(),
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue