Skip to content

Commit 39165ca

Browse files
committed
feat: refactor FleetOps sidebar navigation
1 parent b96096f commit 39165ca

50 files changed

Lines changed: 4900 additions & 725 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.
Lines changed: 19 additions & 233 deletions
Original file line numberDiff line numberDiff line change
@@ -1,235 +1,21 @@
1-
<div id="create-order-button-menu-wrapper" class="create-order-menu-button-wrapper mb-2">
2-
<Button
3-
@text={{t "common.create-new-resource" resource=(lowercase (t "resource.order"))}}
4-
@type="primary"
5-
@size="xs"
6-
@icon="paper-plane"
7-
@iconPrefix="fas"
8-
@iconSize="sm"
9-
@wrapperClass="w-full create-order-button-wrapper"
10-
@onClick={{this.onClickCreateOrder}}
11-
@permission="fleet-ops create order"
12-
@tooltipPlacement="right"
13-
class="w-full create-order-button"
14-
/>
15-
</div>
16-
{{#each this.universeMenuItems as |menuItem|}}
17-
{{#if menuItem.renderComponentInPlace}}
18-
{{component menuItem.component}}
19-
{{else}}
20-
<Layout::Sidebar::Item
21-
@onClick={{fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem}}
22-
@menuItem={{menuItem}}
23-
@icon={{menuItem.icon}}
24-
@iconComponent={{menuItem.iconComponent}}
25-
@iconComponentOptions={{menuItem.iconComponentOptions}}
26-
@iconSize={{menuItem.iconSize}}
27-
@iconPrefix={{menuItem.iconPrefix}}
28-
@iconClass={{menuItem.iconClass}}
29-
@rightSideComponent={{menuItem.rightSideComponent}}
30-
@rightSideComponentContext={{menuItem.rightSideComponentContext}}
31-
@rightSideStatus={{menuItem.rightSideStatus}}
32-
@rightSideStatusText={{menuItem.rightSideStatusText}}
33-
@hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
34-
@rightSideStatusClass={{menuItem.rightSideStatusClass}}
35-
@disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
36-
@dropdownButton={{menuItem.dropdownButton}}
37-
@dropdownButtonActions={{menuItem.dropdownButtonActions}}
38-
@dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
39-
@dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
40-
@dropdownButtonText={{menuItem.dropdownButtonText}}
41-
@dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
42-
@dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
43-
@dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
44-
@dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
45-
@dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
46-
@registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
47-
@permission={{menuItem.permission}}
48-
@visible={{menuItem.visible}}
49-
>{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
50-
{{/if}}
51-
{{/each}}
52-
{{#each this.menuPanels as |menuPanel|}}
53-
<Layout::Sidebar::Panel
54-
@open={{menuPanel.open}}
55-
@title={{if menuPanel.intl (t menuPanel.intl) menuPanel.title}}
56-
@titleIcon={{menuPanel.icon}}
57-
@caretLeft={{true}}
58-
@caretIcon="caret"
59-
@hideCaret={{menuPanel.hideCaret}}
60-
@toggleOnCaretOnly={{menuPanel.toggleOnCaretOnly}}
61-
@onClickPanelTitle={{menuPanel.onClickPanelTitle}}
62-
@wrapperClass={{menuPanel.wrapperClass}}
63-
@dropdownButton={{menuPanel.dropdownButton}}
64-
@dropdownButtonActions={{menuPanel.dropdownButtonActions}}
65-
@dropdownButtonRenderInPlace={{menuPanel.dropdownButtonRenderInPlace}}
66-
@dropdownHorizontalPosition={{menuPanel.dropdownHorizontalPosition}}
67-
@dropdownButtonMenuLabel={{menuPanel.dropdownButtonMenuLabel}}
68-
@onToggle={{menuPanel.onToggle}}
69-
>
70-
{{#each menuPanel.items as |menuItem|}}
71-
{{#if menuItem.renderComponentInPlace}}
72-
{{component
73-
menuItem.component
74-
menuItem=menuItem
75-
title=(if menuItem.intl (t menuItem.intl) menuItem.title)
76-
onClick=menuItem.onClick
77-
route=(concat this.routePrefix menuItem.route)
78-
icon=menuItem.icon
79-
iconComponent=menuItem.iconComponent
80-
iconComponentOptions=menuItem.iconComponentOptions
81-
iconSize=menuItem.iconSize
82-
iconPrefix=menuItem.iconPrefix
83-
iconClass=menuItem.iconClass
84-
rightSideComponent=menuItem.rightSideComponent
85-
rightSideComponentContext=menuItem.rightSideComponentContext
86-
rightSideStatus=menuItem.rightSideStatus
87-
rightSideStatusText=menuItem.rightSideStatusText
88-
hideRightSideStatusDot=menuItem.hideRightSideStatusDot
89-
rightSideStatusClass=menuItem.rightSideStatusClass
90-
disableRightSideStatusHumanize=menuItem.disableRightSideStatusHumanize
91-
dropdownButton=menuItem.dropdownButton
92-
dropdownButtonActions=menuItem.dropdownButtonActions
93-
dropdownButtonIcon=menuItem.dropdownButtonIcon
94-
dropdownButtonIconPrefix=menuItem.dropdownButtonIconPrefix
95-
dropdownButtonText=menuItem.dropdownButtonText
96-
dropdownButtonCalculatePosition=menuItem.dropdownButtonCalculatePosition
97-
dropdownButtonRenderInPlace=menuItem.dropdownButtonRenderInPlace
98-
dropdownButtonMenuLabel=menuItem.dropdownButtonMenuLabel
99-
dropdownButtonWrapperClass=menuItem.dropdownButtonWrapperClass
100-
dropdownButtonTriggerClass=menuItem.dropdownButtonTriggerClass
101-
registerDropdownButtonAPI=menuItem.registerDropdownButtonAPI
102-
permission=menuItem.permission
103-
visible=menuItem.visible
104-
}}
105-
{{else}}
106-
<Layout::Sidebar::Item
107-
@onClick={{if menuItem._virtual (fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem) menuItem.onClick}}
108-
@menuItem={{menuItem}}
109-
@route={{if menuItem._virtual null (concat this.routePrefix menuItem.route)}}
110-
@icon={{menuItem.icon}}
111-
@iconComponent={{menuItem.iconComponent}}
112-
@iconComponentOptions={{menuItem.iconComponentOptions}}
113-
@iconSize={{menuItem.iconSize}}
114-
@iconPrefix={{menuItem.iconPrefix}}
115-
@iconClass={{menuItem.iconClass}}
116-
@rightSideComponent={{menuItem.rightSideComponent}}
117-
@rightSideComponentContext={{menuItem.rightSideComponentContext}}
118-
@rightSideStatus={{menuItem.rightSideStatus}}
119-
@rightSideStatusText={{menuItem.rightSideStatusText}}
120-
@hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
121-
@rightSideStatusClass={{menuItem.rightSideStatusClass}}
122-
@disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
123-
@dropdownButton={{menuItem.dropdownButton}}
124-
@dropdownButtonActions={{menuItem.dropdownButtonActions}}
125-
@dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
126-
@dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
127-
@dropdownButtonText={{menuItem.dropdownButtonText}}
128-
@dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
129-
@dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
130-
@dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
131-
@dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
132-
@dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
133-
@registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
134-
@permission={{menuItem.permission}}
135-
@visible={{menuItem.visible}}
136-
>{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
137-
{{/if}}
1+
<Layout::Sidebar::Navigator
2+
@items={{this.navigationItems}}
3+
@primaryAction={{this.createOrderAction}}
4+
@searchPlaceholder="Search Fleet-Ops..."
5+
@searchProvider={{this.searchNavigation}}
6+
@initialActiveParentSync={{false}}
7+
class="fleet-ops-sidebar-navigator"
8+
>
9+
<:footer as |state|>
10+
{{#if (or (not state.isNested) (eq state.currentParent.id "operations"))}}
11+
<Layout::FleetOpsSidebar::OperationsMonitor />
12+
{{/if}}
13+
14+
{{#each (get this.footerRegistryComponents (or state.currentParent.id "root")) as |menuItem|}}
15+
{{component menuItem.component}}
13816
{{/each}}
139-
{{!-- {{#let (array "operations" "management" "connectivity" "maintenance" "analytics" "settings") as |sectionsToRender|}}
140-
{{#each sectionsToRender as |section|}}
141-
{{#if (eq menuPanel.routePrefix section)}}
142-
{{#each (get this (concat "universe" (capitalize section) "MenuItems")) as |menuItem|}}
143-
{{#if menuItem.renderComponentInPlace}}
144-
{{component menuItem.component}}
145-
{{else}}
146-
<Layout::Sidebar::Item
147-
@onClick={{fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem}}
148-
@menuItem={{menuItem}}
149-
@icon={{menuItem.icon}}
150-
@iconComponent={{menuItem.iconComponent}}
151-
@iconComponentOptions={{menuItem.iconComponentOptions}}
152-
@iconSize={{menuItem.iconSize}}
153-
@iconPrefix={{menuItem.iconPrefix}}
154-
@iconClass={{menuItem.iconClass}}
155-
@rightSideComponent={{menuItem.rightSideComponent}}
156-
@rightSideComponentContext={{menuItem.rightSideComponentContext}}
157-
@rightSideStatus={{menuItem.rightSideStatus}}
158-
@rightSideStatusText={{menuItem.rightSideStatusText}}
159-
@hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
160-
@rightSideStatusClass={{menuItem.rightSideStatusClass}}
161-
@disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
162-
@dropdownButton={{menuItem.dropdownButton}}
163-
@dropdownButtonActions={{menuItem.dropdownButtonActions}}
164-
@dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
165-
@dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
166-
@dropdownButtonText={{menuItem.dropdownButtonText}}
167-
@dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
168-
@dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
169-
@dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
170-
@dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
171-
@dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
172-
@registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
173-
@permission={{menuItem.permission}}
174-
@visible={{menuItem.visible}}
175-
>{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
176-
{{/if}}
177-
{{/each}}
178-
{{/if}}
179-
{{/each}}
180-
{{/let}} --}}
181-
</Layout::Sidebar::Panel>
182-
{{/each}}
183-
{{#each this.universeMenuPanels as |menuPanel|}}
184-
<Layout::Sidebar::Panel
185-
@open={{menuPanel.open}}
186-
@title={{if menuPanel.intl (t menuPanel.intl) menuPanel.title}}
187-
@titleIcon={{menuPanel.icon}}
188-
@caretLeft={{true}}
189-
@caretIcon="caret"
190-
@hideCaret={{menuPanel.hideCaret}}
191-
@toggleOnCaretOnly={{menuPanel.toggleOnCaretOnly}}
192-
@onClickPanelTitle={{menuPanel.onClickPanelTitle}}
193-
@wrapperClass={{menuPanel.wrapperClass}}
194-
@dropdownButton={{menuPanel.dropdownButton}}
195-
@dropdownButtonActions={{menuPanel.dropdownButtonActions}}
196-
@dropdownButtonRenderInPlace={{menuPanel.dropdownButtonRenderInPlace}}
197-
@dropdownHorizontalPosition={{menuPanel.dropdownHorizontalPosition}}
198-
@dropdownButtonMenuLabel={{menuPanel.dropdownButtonMenuLabel}}
199-
>
200-
{{#each menuPanel.items as |menuItem|}}
201-
<Layout::Sidebar::Item
202-
@onClick={{fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem}}
203-
@menuItem={{menuItem}}
204-
@icon={{menuItem.icon}}
205-
@iconComponent={{menuItem.iconComponent}}
206-
@iconComponentOptions={{menuItem.iconComponentOptions}}
207-
@iconSize={{menuItem.iconSize}}
208-
@iconPrefix={{menuItem.iconPrefix}}
209-
@iconClass={{menuItem.iconClass}}
210-
@rightSideComponent={{menuItem.rightSideComponent}}
211-
@rightSideComponentContext={{menuItem.rightSideComponentContext}}
212-
@rightSideStatus={{menuItem.rightSideStatus}}
213-
@rightSideStatusText={{menuItem.rightSideStatusText}}
214-
@hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
215-
@rightSideStatusClass={{menuItem.rightSideStatusClass}}
216-
@disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
217-
@dropdownButton={{menuItem.dropdownButton}}
218-
@dropdownButtonActions={{menuItem.dropdownButtonActions}}
219-
@dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
220-
@dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
221-
@dropdownButtonText={{menuItem.dropdownButtonText}}
222-
@dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
223-
@dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
224-
@dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
225-
@dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
226-
@dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
227-
@registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
228-
@permission={{menuItem.permission}}
229-
@visible={{menuItem.visible}}
230-
>{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
231-
{{/each}}
232-
</Layout::Sidebar::Panel>
233-
{{/each}}
17+
</:footer>
18+
</Layout::Sidebar::Navigator>
19+
23420
{{yield}}
235-
<Spacer @height="10px" />
21+
<Spacer @height="10px" />

0 commit comments

Comments
 (0)