TNO-2195: Split view for managing folders and new configure page #1449
Conversation
jdtoombs
added
enhancement
| @@ -15,6 +15,7 @@ $bk-main: #dedede; | |||
| $highlightPrimary: #e8e9f1; | |||
| $highlightSecondary: #f8f7f8; | |||
| $highlightTertiary: #d6d9e7; | |||
| $highlight-active: #03bfdc; | |||
There was a problem hiding this comment.
will also be used on side nav bar when updated (to highlight active menu item)
| }, [currentFolder]); | ||
|
|
||
| React.useEffect(() => { | ||
| if ((!currentFolder && id) || currentFolder?.id !== Number(id)) { |
There was a problem hiding this comment.
when user changes selected item on left side, or when folder is not set
There was a problem hiding this comment.
If the folder doesn't exist, won't this infinite loop?
| </div> | ||
|
|
||
| <Modal |
There was a problem hiding this comment.
Just moved Modal to different component, same code.
| data={myFolders} | ||
| showActive={false} | ||
| /> | ||
| </SubscriberTableContainer> | ||
| <TooltipMenu |
There was a problem hiding this comment.
Menu no longer used
| import styled from 'styled-components'; | ||
| import { Row } from 'tno-core'; | ||
|
|
||
| export const FolderLanding = styled(Row)<{ split?: boolean }>` |
There was a problem hiding this comment.
Split is true from the FolderLanding component when an action is defined
i.e) /folders/configure/5
In this case configure is the action and will cause the screen to split. Follows the format /action/id
| @@ -84,18 +83,11 @@ export const AppRouter: React.FC<IAppRouter> = () => { | |||
| } | |||
| /> | |||
| <Route | |||
| path="/folders/:id" | |||
| path="/folders/:action?/:id?" | |||
There was a problem hiding this comment.
optional params for router
| @@ -84,7 +84,7 @@ export const NavbarOptions: INavbarOptions = { | |||
| folders: { | |||
| groupName: 'MY CONTENT', | |||
| label: 'My Folders', | |||
| path: 'landing/folders', | |||
| path: 'folders', | |||
| }, [currentFolder]); | ||
|
|
||
| React.useEffect(() => { | ||
| if ((!currentFolder && id) || currentFolder?.id !== Number(id)) { |
There was a problem hiding this comment.
If the folder doesn't exist, won't this infinite loop?
| const [myFolders, setMyFolders] = React.useState<IFolderModel[]>([]); | ||
| // action consits of the param of type /view /configure etc. | ||
| const { action, id } = useParams(); | ||
| console.log(action, id); |
In this PR: