Skip to content

Commit 993ae71

Browse files
tobiutobiu
committed
refactor(devindex): Move StatusToolbar to Wrapper and use StateProvider (#9220)
1 parent 37a4669 commit 993ae71

10 files changed

Lines changed: 103 additions & 54 deletions

File tree

‎apps/devindex/view/ViewportController.mjs‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -46,18 +46,18 @@ class ViewportController extends Controller {
4646
* @param {Object} data
4747
*/
4848
async onControlsToggleButtonClick(data) {
49-
let me = this,
50-
button = data.component,
51-
controls = me.getReference('controls'),
52-
grid = me.getReference('grid');
49+
let me = this,
50+
button = data.component,
51+
controls = me.getReference('controls'),
52+
gridWrapper = me.getReference('grid-wrapper');
5353

5454
button.expanded = !button.expanded;
5555

5656
controls.toggleCls('neo-expanded');
5757

5858
await me.timeout(button.expanded ? 250 : 0);
5959

60-
grid.toggleCls('neo-extend-margin-right');
60+
gridWrapper.toggleCls('neo-extend-margin-right');
6161
}
6262

6363
/**

‎apps/devindex/view/home/GridContainer.mjs‎

Lines changed: 1 addition & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
import BaseGridContainer from '../../../../src/grid/Container.mjs';
2-
import Contributors from '../../store/Contributors.mjs';
32
import Heuristics from './component/Heuristics.mjs';
4-
import StatusToolbar from './StatusToolbar.mjs';
53

64
const
75
regexPrefixCy = /^(c?y)/,
@@ -48,13 +46,6 @@ class GridContainer extends BaseGridContainer {
4846
isScrollingChange: 'onGridIsScrollingChange'
4947
}
5048
},
51-
/**
52-
* @member {Object} footerToolbar
53-
*/
54-
footerToolbar: {
55-
module: StatusToolbar,
56-
flex : 'none'
57-
},
5849
/**
5950
* Default configs for each column
6051
* @member {Object} columnDefaults
@@ -67,12 +58,7 @@ class GridContainer extends BaseGridContainer {
6758
/**
6859
* @member {Number} rowHeight=50
6960
*/
70-
rowHeight: 50,
71-
/**
72-
* @member {Object[]} store=Contributors
73-
* @reactive
74-
*/
75-
store: Contributors
61+
rowHeight: 50
7662
}
7763

7864
/**

‎apps/devindex/view/home/MainContainer.mjs‎

Lines changed: 36 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
1-
import Container from '../../../../src/container/Base.mjs';
2-
import Controller from './MainContainerController.mjs';
3-
import ControlsContainer from './ControlsContainer.mjs';
4-
import GridContainer from './GridContainer.mjs';
1+
import Container from '../../../../src/container/Base.mjs';
2+
import Controller from './MainContainerController.mjs';
3+
import ControlsContainer from './ControlsContainer.mjs';
4+
import GridContainer from './GridContainer.mjs';
5+
import MainContainerStateProvider from './MainContainerStateProvider.mjs';
6+
import StatusToolbar from './StatusToolbar.mjs';
57

68
/**
79
* @class DevIndex.view.home.MainContainer
@@ -14,26 +16,47 @@ class MainContainer extends Container {
1416
* @protected
1517
*/
1618
className: 'DevIndex.view.home.MainContainer',
19+
/**
20+
* @member {String[]} baseCls=['devindex-home-maincontainer','neo-container']
21+
* @protected
22+
*/
23+
baseCls: ['devindex-home-maincontainer', 'neo-container'],
1724
/**
1825
* @member {Neo.controller.Component} controller=Controller
1926
*/
2027
controller: Controller,
28+
/**
29+
* @member {Neo.state.Provider} stateProvider=MainContainerStateProvider
30+
*/
31+
stateProvider: MainContainerStateProvider,
32+
/**
33+
* @member {Object} layout={ntype:'hbox',align:'stretch'}
34+
* @reactive
35+
*/
36+
layout: {ntype: 'hbox', align: 'stretch'},
2137
/**
2238
* @member {Object[]} items
2339
*/
2440
items: [{
25-
module : GridContainer,
26-
reference: 'grid',
27-
flex : 1
41+
module : Container,
42+
cls : ['devindex-grid-wrapper'],
43+
flex : 1,
44+
layout : {ntype: 'vbox', align: 'stretch'},
45+
reference: 'grid-wrapper',
46+
items : [{
47+
module : GridContainer,
48+
bind : {store: 'stores.contributors'},
49+
reference: 'grid',
50+
flex : 1
51+
}, {
52+
module: StatusToolbar,
53+
bind : {store: 'stores.contributors'},
54+
flex : 'none'
55+
}]
2856
}, {
2957
module : ControlsContainer,
3058
reference: 'controls'
31-
}],
32-
/**
33-
* @member {Object} layout={ntype:'hbox',align:'stretch'}
34-
* @reactive
35-
*/
36-
layout: {ntype: 'hbox', align: 'stretch'}
59+
}]
3760
}
3861
}
3962

‎apps/devindex/view/home/MainContainerStateProvider.mjs‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import Contributors from '../../store/Contributors.mjs';
2+
import StateProvider from '../../../../src/state/Provider.mjs';
3+
4+
/**
5+
* @class DevIndex.view.home.MainContainerStateProvider
6+
* @extends Neo.state.Provider
7+
*/
8+
class MainContainerStateProvider extends StateProvider {
9+
static config = {
10+
/**
11+
* @member {String} className='DevIndex.view.home.MainContainerStateProvider'
12+
* @protected
13+
*/
14+
className: 'DevIndex.view.home.MainContainerStateProvider',
15+
/**
16+
* @member {Object} stores
17+
*/
18+
stores: {
19+
contributors: {
20+
module: Contributors
21+
}
22+
}
23+
}
24+
}
25+
26+
export default Neo.setupClass(MainContainerStateProvider);

‎resources/scss/src/apps/devindex/Viewport.scss‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,3 @@
11
.devindex-viewport {
2-
.neo-grid-wrapper {
3-
border-radius: 8px;
4-
box-shadow : var(--devindex-header-shadow);
5-
margin : 1em;
62

7-
&:has(.neo-extend-margin-right) {
8-
margin-right: calc(235px + 1em);
9-
}
10-
}
113
}

‎resources/scss/src/apps/devindex/home/GridContainer.scss‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
11
.devindex-grid-container {
2-
border-radius: 8px;
3-
4-
.devindex-stop-stream-button {
5-
.neo-button-glyph {
6-
color: var(--devindex-stop-stream-button-color);
7-
}
8-
}
2+
border-bottom: none;
93

104
.devindex-sparkline-wrapper {
115
height : 100%;

‎resources/scss/src/apps/devindex/home/MainContainer.scss‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
.devindex-home-maincontainer.neo-container {
2+
.devindex-grid-wrapper {
3+
border-radius: 8px;
4+
box-shadow : var(--devindex-header-shadow);
5+
margin : 1em;
6+
7+
&.neo-extend-margin-right {
8+
margin-right: calc(235px + 1em);
9+
}
10+
11+
.devindex-status-toolbar {
12+
border-bottom-left-radius : 8px;
13+
border-bottom-right-radius: 8px;
14+
border-top : none !important;
15+
font-size : var(--grid-container-font-size);
16+
17+
.devindex-stop-stream-button {
18+
.neo-button-glyph {
19+
color: var(--devindex-stop-stream-button-color);
20+
}
21+
}
22+
}
23+
}
24+
}

‎resources/scss/theme-neo-dark/apps/devindex/home/GridContainer.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
:root .neo-theme-neo-dark {
2+
--devindex-stop-stream-button-color: #ff4d4d;
3+
24
.devindex-grid-container {
35
--heatmap-bg-0: rgba(14, 233, 175, 0.05);
46
--heatmap-text-0: rgba(255, 255, 255, 0.5);
@@ -21,7 +23,5 @@
2123
--devindex-linkedin-hover-color: #298dcd;
2224

2325
--devindex-hireable-color: var(--green-500);
24-
25-
--devindex-stop-stream-button-color: #ff4d4d;
2626
}
27-
}
27+
}

‎resources/scss/theme-neo-light/apps/devindex/home/GridContainer.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
:root .neo-theme-neo-light {
2+
--devindex-stop-stream-button-color: #d73a4a;
3+
24
.devindex-grid-container {
35
--heatmap-bg-0: rgba(14, 233, 175, 0.05);
46
--heatmap-text-0: rgba(0, 0, 0, 0.5);
@@ -21,7 +23,5 @@
2123
--devindex-linkedin-hover-color: #005582;
2224

2325
--devindex-hireable-color: var(--green-600);
24-
25-
--devindex-stop-stream-button-color: #d73a4a;
2626
}
27-
}
27+
}

‎src/grid/Container.mjs‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -443,9 +443,12 @@ class GridContainer extends BaseContainer {
443443
* Triggered before.footerToolbar config gets changed.
444444
* @param {Object|Neo.toolbar.Base|null} value
445445
* @param {Object|Neo.toolbar.Base|null} oldValue
446+
* @returns {Neo.toolbar.Base|null}
446447
* @protected
447448
*/
448449
beforeSetFooterToolbar(value, oldValue) {
450+
if (!value) return null;
451+
449452
const me = this;
450453

451454
return ClassSystemUtil.beforeSetInstance(value, FooterToolbar, {
@@ -458,6 +461,7 @@ class GridContainer extends BaseContainer {
458461
* Triggered before the headerToolbar config gets changed.
459462
* @param {Object|Neo.grid.header.Toolbar|null} value
460463
* @param {Object|Neo.grid.header.Toolbar|null} oldValue
464+
* @returns {Neo.toolbar.Base|null}
461465
* @protected
462466
*/
463467
beforeSetHeaderToolbar(value, oldValue) {

0 commit comments

Comments
 (0)