From d2cc4ced2b952ec78b857c031e5e9e63550b2e35 Mon Sep 17 00:00:00 2001 From: Matt Warman Date: Mon, 9 Jul 2018 11:12:19 -0400 Subject: [PATCH 1/5] Update project metadata to version 0.7.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 74d5e54..452c073 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "skeleton-ui-react", - "version": "0.6.0", + "version": "0.7.0", "description": "React SPA Starter Project", "main": "index.js", "repository": "git@github.com:leanstacks/skeleton-ui-react.git", From cd0beb67700fb05d73e90caebaf9433302ff63d2 Mon Sep 17 00:00:00 2001 From: Matt Warman Date: Mon, 9 Jul 2018 15:32:14 -0400 Subject: [PATCH 2/5] See #5. Updated BusyIndicator. --- src/components/BusyIndicator.js | 27 +++++++------- src/components/LoadingPage.js | 4 +- src/styles/base/_base.scss | 20 +++++++--- src/styles/components/_busy-indicator.scss | 43 ---------------------- src/styles/styles.scss | 1 - 5 files changed, 31 insertions(+), 64 deletions(-) delete mode 100644 src/styles/components/_busy-indicator.scss diff --git a/src/components/BusyIndicator.js b/src/components/BusyIndicator.js index 67496c4..d8a2e51 100644 --- a/src/components/BusyIndicator.js +++ b/src/components/BusyIndicator.js @@ -3,27 +3,28 @@ import React from 'react'; const getSizeClass = (size) => { switch (size) { case 'xl': - return 'busy-indicator--xl'; + return 'h1'; case 'lg': - return 'busy-indicator--lg'; + return 'lead'; case 'sm': - return 'busy-indicator--sm'; + return 'small'; default: - return 'busy-indicator--md'; + return ''; }; }; const BusyIndicator = (props) => { - const icon = props.icon || 'fa-circle-o-notch'; + const icon = props.icon || 'fa-circle-notch'; return ( -
-
-
-
{props.title}
-
-
- -
+
+
+ { + props.title ? ( + {props.title}  + ) : ( + + ) + }
); diff --git a/src/components/LoadingPage.js b/src/components/LoadingPage.js index 4e9ad61..e5025d0 100644 --- a/src/components/LoadingPage.js +++ b/src/components/LoadingPage.js @@ -3,8 +3,8 @@ import React from 'react'; import BusyIndicator from './BusyIndicator'; const LoadingPage = () => ( -
- +
+
); diff --git a/src/styles/base/_base.scss b/src/styles/base/_base.scss index a842a9b..7a768f8 100644 --- a/src/styles/base/_base.scss +++ b/src/styles/base/_base.scss @@ -16,10 +16,6 @@ a { } } -.page { - min-height: 75vh; -} - .text-blue { color: $blue; } @@ -30,4 +26,18 @@ a { .text-react-blue { color: $react-blue; -} \ No newline at end of file +} + +.page { + min-height: 75vh; +} + +.page-full { + height: 100vh; + width: 100vw; +} + +.page-half { + height: 50vh; + width: 100vw; +} diff --git a/src/styles/components/_busy-indicator.scss b/src/styles/components/_busy-indicator.scss deleted file mode 100644 index 031658e..0000000 --- a/src/styles/components/_busy-indicator.scss +++ /dev/null @@ -1,43 +0,0 @@ -.busy-indicator { - align-items: center; - display: flex; - justify-content: center; - height: 100%; - width: 100%; -} - -.busy-indicator__content { - align-items: center; - display: flex; - justify-content: center; -} - -.busy-indicator__icon { - margin-left: $s-size; -} - -.busy-indicator--xl { - font-size: $font-size-xxlarge; -} - -.busy-indicator--lg { - font-size: $font-size-xlarge; -} - -.busy-indicator--md { - -} - -.busy-indicator--sm { - font-size: $font-size-xsmall; -} - -.busy-indicator--full-page { - height: 100vh; - width: 100vw; -} - -.busy-indicator--half-page { - height: 50vh; - width: 100vw; -} diff --git a/src/styles/styles.scss b/src/styles/styles.scss index 70926d6..61c0d21 100644 --- a/src/styles/styles.scss +++ b/src/styles/styles.scss @@ -1,4 +1,3 @@ @import './base/settings'; @import './base/base'; -@import './components/busy-indicator'; @import './components/footer'; From e559a551da8f56d72b62ace52c060e789668646f Mon Sep 17 00:00:00 2001 From: Matt Warman Date: Mon, 9 Jul 2018 15:34:02 -0400 Subject: [PATCH 3/5] See #5. Updated test snapshots. --- .../__snapshots__/BusyIndicator.test.js.snap | 21 +++++-------------- .../__snapshots__/LoadingPage.test.js.snap | 3 ++- 2 files changed, 7 insertions(+), 17 deletions(-) diff --git a/src/tests/components/__snapshots__/BusyIndicator.test.js.snap b/src/tests/components/__snapshots__/BusyIndicator.test.js.snap index 764fa5f..b946c26 100644 --- a/src/tests/components/__snapshots__/BusyIndicator.test.js.snap +++ b/src/tests/components/__snapshots__/BusyIndicator.test.js.snap @@ -2,25 +2,14 @@ exports[`should render BusyIndicator correctly 1`] = `
-
-
-
-
- -
+
`; diff --git a/src/tests/components/__snapshots__/LoadingPage.test.js.snap b/src/tests/components/__snapshots__/LoadingPage.test.js.snap index 0adf3f9..131bc42 100644 --- a/src/tests/components/__snapshots__/LoadingPage.test.js.snap +++ b/src/tests/components/__snapshots__/LoadingPage.test.js.snap @@ -2,10 +2,11 @@ exports[`should render LoadingPage correctly 1`] = `
`; From 05b373f2bb2d1b18a7fa5ef6b2c7b104ad0c7e59 Mon Sep 17 00:00:00 2001 From: Matt Warman Date: Tue, 10 Jul 2018 07:14:59 -0400 Subject: [PATCH 4/5] See #5. Show loading page for simulated delay. --- src/app.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/app.js b/src/app.js index 74a9539..663cae8 100644 --- a/src/app.js +++ b/src/app.js @@ -42,7 +42,10 @@ if (technologiesLastUpdated.add(1, 'hours').isBefore(moment())) { // Fetch Data using API store.dispatch(startSetTechnologies()).then(() => { console.log('startSetTechnologies success'); - renderApp(); + // Simulate API Latency -- Remove in Production + setTimeout(() => { + renderApp(); + }, 2000); }).catch((err) => { //TODO Handle API Failure console.log('startSetTechnologies failure'); From 1c89c072aeac11b4a18169e538a7ff4709bf26ef Mon Sep 17 00:00:00 2001 From: Matt Warman Date: Tue, 10 Jul 2018 07:27:29 -0400 Subject: [PATCH 5/5] Update project metadata to version 0.6.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 452c073..723378c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "skeleton-ui-react", - "version": "0.7.0", + "version": "0.6.1", "description": "React SPA Starter Project", "main": "index.js", "repository": "git@github.com:leanstacks/skeleton-ui-react.git",