Skip to content
This repository was archived by the owner on Jun 3, 2024. It is now read-only.

Commit da9e5e3

Browse files
Marc-Andre-RivetMarc-Andre-Rivet
authored
Renderer regression (#496)
1 parent 49a4451 commit da9e5e3

File tree

8 files changed

+429
-201
lines changed

8 files changed

+429
-201
lines changed

Diff for: ‎src/components/Loading.react.js

+4-23
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,7 @@ export default class Loading extends Component {
3737
type,
3838
} = this.props;
3939

40-
const isLoading = getLoadingState(this);
41-
42-
if (isLoading) {
40+
if (loading_state && loading_state.is_loading) {
4341
const Spinner = getSpinner(type);
4442
return (
4543
<Spinner
@@ -52,6 +50,7 @@ export default class Loading extends Component {
5250
/>
5351
);
5452
}
53+
5554
if (
5655
R.type(this.props.children) !== 'Object' ||
5756
R.type(this.props.children) !== 'Function'
@@ -62,6 +61,8 @@ export default class Loading extends Component {
6261
}
6362
}
6463

64+
Loading._dashprivate_isLoadingComponent = true;
65+
6566
Loading.defaultProps = {
6667
type: 'default',
6768
color: '#119DFF',
@@ -126,23 +127,3 @@ Loading.propTypes = {
126127
component_name: PropTypes.string,
127128
}),
128129
};
129-
130-
function getLoadingState(element) {
131-
if (
132-
element.props &&
133-
element.props.loading_state &&
134-
element.props.loading_state.is_loading
135-
) {
136-
return true;
137-
}
138-
139-
const children = element.props && element.props.children;
140-
if (!children) {
141-
return false;
142-
}
143-
144-
return R.any(
145-
child => child.type !== Loading && getLoadingState(child),
146-
Array.isArray(children) ? children : [children]
147-
);
148-
}

Diff for: ‎src/fragments/Loading/spinners/CircleSpinner.jsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const CircleSpinner = ({
2828
return (
2929
<div style={style ? style : {}} className={spinnerClass}>
3030
{debugTitle}
31-
<div className="dash-sk-circle">
31+
<div className="dash-spinner dash-sk-circle">
3232
<div className="dash-sk-circle1 dash-sk-child" />
3333
<div className="dash-sk-circle2 dash-sk-child" />
3434
<div className="dash-sk-circle3 dash-sk-child" />
@@ -160,7 +160,7 @@ const CircleSpinner = ({
160160
.dash-spinner-container .sk-circle .sk-circle12:before {
161161
-webkit-animation-delay: -0.1s;
162162
animation-delay: -0.1s; }
163-
163+
164164
@-webkit-keyframes dash-sk-circleBounceDelay {
165165
0%, 80%, 100% {
166166
-webkit-transform: scale(0);
@@ -170,7 +170,7 @@ const CircleSpinner = ({
170170
transform: scale(1);
171171
}
172172
}
173-
173+
174174
@keyframes dash-sk-circleBounceDelay {
175175
0%, 80%, 100% {
176176
-webkit-transform: scale(0);

Diff for: ‎src/fragments/Loading/spinners/CubeSpinner.jsx

+10-10
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const CubeSpinner = ({status, color, fullscreen, debug, className, style}) => {
2020
return (
2121
<div style={style ? style : {}} className={spinnerClass}>
2222
{debugTitle}
23-
<div className="dash-cube-container">
23+
<div className="dash-spinner dash-cube-container">
2424
<div className="dash-cube">
2525
<div className="dash-cube-side dash-cube-side--front" />
2626
<div className="dash-cube-side dash-cube-side--back" />
@@ -61,16 +61,16 @@ const CubeSpinner = ({status, color, fullscreen, debug, className, style}) => {
6161
width: 80px;
6262
margin: 7rem auto;
6363
}
64-
64+
6565
.dash-cube-side {
6666
width: 100%;
6767
height: 100%;
6868
position: absolute;
6969
display: inline-block;
7070
}
71-
71+
7272
.dash-cube-side--front {
73-
background-color: ${color};
73+
background-color: ${color};
7474
animation: blowout-front 4s infinite;
7575
transform: rotateY(0deg) translateZ(40px);
7676
}
@@ -79,31 +79,31 @@ const CubeSpinner = ({status, color, fullscreen, debug, className, style}) => {
7979
transform: rotateX(180deg) translateZ(40px);
8080
animation: blowout-back 4s infinite;
8181
}
82-
82+
8383
.dash-cube-side--left {
8484
background-color: ${changeColor(color).darken(0.2)};
8585
transform: rotateY(-90deg) translateZ(40px);
8686
animation: blowout-left 4s infinite;
8787
}
88-
88+
8989
.dash-cube-side--right {
9090
background-color: ${changeColor(color).darken(0.4)};
9191
transform: rotateY(90deg) translateZ(40px);
9292
animation: blowout-right 4s infinite;
9393
}
94-
94+
9595
.dash-cube-side--top {
9696
background-color: ${changeColor(color).darken(0.2)};
9797
transform: rotateX(90deg) translateZ(40px);
9898
animation: blowout-top 4s infinite;
9999
}
100-
100+
101101
.dash-cube-side--bottom {
102102
background-color: ${changeColor(color).darken(0.4)};
103103
transform: rotateX(-90deg) translateZ(40px);
104104
animation: blowout-bottom 4s infinite;
105105
}
106-
106+
107107
@keyframes rotate {
108108
0% {
109109
transform: rotateX(0deg) rotateY(0deg);
@@ -115,7 +115,7 @@ const CubeSpinner = ({status, color, fullscreen, debug, className, style}) => {
115115
transform: rotateX(360deg) rotateY(360deg);
116116
}
117117
}
118-
118+
119119
@keyframes blowout-bottom {
120120
20% {
121121
transform: rotateX(-90deg) translateZ(40px);

Diff for: ‎src/fragments/Loading/spinners/DefaultSpinner.jsx

+12-12
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const DefaultSpinner = ({
2828
return (
2929
<div style={style ? style : {}} className={spinnerClass}>
3030
{debugTitle}
31-
<div className="dash-default-spinner">
31+
<div className="dash-spinner dash-default-spinner">
3232
<div className="dash-default-spinner-rect1" />
3333
<div className="dash-default-spinner-rect2" />
3434
<div className="dash-default-spinner-rect3" />
@@ -59,48 +59,48 @@ const DefaultSpinner = ({
5959
text-align: center;
6060
font-size: 10px;
6161
}
62-
62+
6363
.dash-default-spinner > div {
6464
background-color: ${color};
6565
height: 100%;
6666
width: 6px;
6767
display: inline-block;
6868
margin-right: 4px;
69-
69+
7070
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
7171
animation: sk-stretchdelay 1.2s infinite ease-in-out;
7272
}
73-
73+
7474
.dash-default-spinner .dash-default-spinner-rect2 {
7575
-webkit-animation-delay: -1.1s;
7676
animation-delay: -1.1s;
7777
}
78-
78+
7979
.dash-default-spinner .dash-default-spinner-rect3 {
8080
-webkit-animation-delay: -1.0s;
8181
animation-delay: -1.0s;
8282
}
83-
83+
8484
.dash-default-spinner .dash-default-spinner-rect4 {
8585
-webkit-animation-delay: -0.9s;
8686
animation-delay: -0.9s;
8787
}
88-
88+
8989
.dash-default-spinner .dash-default-spinner-rect5 {
9090
-webkit-animation-delay: -0.8s;
9191
animation-delay: -0.8s;
9292
}
93-
93+
9494
@-webkit-keyframes sk-stretchdelay {
95-
0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
95+
0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
9696
20% { -webkit-transform: scaleY(1.0) }
9797
}
98-
98+
9999
@keyframes sk-stretchdelay {
100-
0%, 40%, 100% {
100+
0%, 40%, 100% {
101101
transform: scaleY(0.4);
102102
-webkit-transform: scaleY(0.4);
103-
} 20% {
103+
} 20% {
104104
transform: scaleY(1.0);
105105
-webkit-transform: scaleY(1.0);
106106
}

Diff for: ‎src/fragments/Loading/spinners/DotSpinner.jsx

+9-9
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const DotSpinner = ({status, color, fullscreen, debug, className, style}) => {
2121
return (
2222
<div style={style ? style : {}} className={spinnerClass}>
2323
{debugTitle}
24-
<div className="dash-dot-spinner">
24+
<div className="dash-spinner dash-dot-spinner">
2525
<div className="dash-dot-spinner-bounce1"></div>
2626
<div className="dash-dot-spinner-bounce2"></div>
2727
<div className="dash-dot-spinner-bounce3"></div>
@@ -48,38 +48,38 @@ const DotSpinner = ({status, color, fullscreen, debug, className, style}) => {
4848
width: 70px;
4949
text-align: center;
5050
}
51-
51+
5252
.dash-dot-spinner > div {
5353
width: 18px;
5454
height: 18px;
5555
background-color: ${color};
56-
56+
5757
border-radius: 100%;
5858
display: inline-block;
5959
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
6060
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
6161
}
62-
62+
6363
.dash-dot-spinner .dash-dot-spinner-bounce1 {
6464
-webkit-animation-delay: -0.32s;
6565
animation-delay: -0.32s;
6666
}
67-
67+
6868
.dash-dot-spinner .dash-dot-spinner-bounce2 {
6969
-webkit-animation-delay: -0.16s;
7070
animation-delay: -0.16s;
7171
}
72-
72+
7373
@-webkit-keyframes sk-bouncedelay {
7474
0%, 80%, 100% { -webkit-transform: scale(0) }
7575
40% { -webkit-transform: scale(1.0) }
7676
}
77-
77+
7878
@keyframes sk-bouncedelay {
79-
0%, 80%, 100% {
79+
0%, 80%, 100% {
8080
-webkit-transform: scale(0);
8181
transform: scale(0);
82-
} 40% {
82+
} 40% {
8383
-webkit-transform: scale(1.0);
8484
transform: scale(1.0);
8585
}

Diff for: ‎src/fragments/Loading/spinners/GraphSpinner.jsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -19,18 +19,18 @@ const GraphSpinner = ({status, fullscreen, debug, className, style}) => {
1919
<div style={style ? style : {}} className={spinnerClass}>
2020
<div>
2121
{debugTitle}
22-
<div className="dash-spinner">
23-
<div className="dash-spinner__bottom">
22+
<div className="dash-spinner dash-graph-spinner">
23+
<div className="dash-graph-spinner__bottom">
2424
<div className="dash-bar dash-bar__one" />
2525
<div className="dash-bar dash-bar__two" />
2626
<div className="dash-bar dash-bar__three" />
2727
</div>
28-
<div className="dash-spinner__background">
28+
<div className="dash-graph-spinner__background">
2929
<div className="dash-dot dash-dot__one" />
3030
<div className="dash-dot dash-dot__two" />
3131
<div className="dash-dot dash-dot__three" />
3232
<div className="dash-dot dash-dot__four" />
33-
<div className="dash-spinner__bottom">
33+
<div className="dash-graph-spinner__bottom">
3434
<div className="dash-vert dash-vert__one" />
3535
<div className="dash-vert dash-vert__two" />
3636
<div className="dash-vert dash-vert__three" />
@@ -56,7 +56,7 @@ const GraphSpinner = ({status, fullscreen, debug, className, style}) => {
5656
.dash-loading-title {
5757
text-align: center;
5858
}
59-
.dash-spinner {
59+
.dash-graph-spinner {
6060
display: flex;
6161
margin: 0 auto;
6262
width: 200px;
@@ -65,14 +65,14 @@ const GraphSpinner = ({status, fullscreen, debug, className, style}) => {
6565
z-index: -2;
6666
border-radius: 4px;
6767
}
68-
.dash-spinner__bottom {
68+
.dash-graph-spinner__bottom {
6969
display: flex;
7070
margin-top: auto;
7171
flex-direction: column;
7272
height: 12px;
7373
width: 100%;
7474
}
75-
.dash-spinner__background {
75+
.dash-graph-spinner__background {
7676
width: 100%;
7777
height: 100%;
7878
display: block;

0 commit comments

Comments
 (0)