Merge pull request #266 from Geotab/MYG-47663_Convert_API_Runner_to_R…

…eact_&_add_various_new_features

Myg 47663 convert api runner to react & add various new features

.editorconfig

@@ -2,7 +2,7 @@ root = true
 
 [*]
 indent_style = space
-indent_size = 2
+indent_size = 4
 end_of_line = lf
 charset = utf-8
 trim_trailing_whitespace = true

Gemfile.lock

@@ -33,8 +33,9 @@ GEM
     faraday-patron (1.0.0)
     faraday-rack (1.0.0)
     faraday-retry (1.0.3)
-    ffi (1.15.5-x64-mingw-ucrt)
+    ffi (1.15.5)
     ffi (1.15.5-x64-mingw32)
+    ffi (1.15.5-x64-unknown)
     forwardable-extended (2.6.0)
     http_parser.rb (0.8.0)
     i18n (1.10.0)
@@ -107,8 +108,10 @@ GEM
     unicode-display_width (1.8.0)
 
 PLATFORMS
-  x64-mingw-ucrt
+  ruby
   x64-mingw32
+  x64-unknown
+  x86_64-linux
 
 DEPENDENCIES
   jekyll
@@ -121,4 +124,4 @@ DEPENDENCIES
   kramdown
 
 BUNDLED WITH
-   2.3.6
+   2.3.25

gulp/tasks/assets.js

@@ -84,26 +84,3 @@ gulp.task('styles', () =>
     .pipe(gulp.dest('.tmp/assets/stylesheets'))
     .pipe(when(!argv.prod, browserSync.stream()))
 );
-
-// Function to properly reload your browser
-function reload(done) {
-  browserSync.reload();
-  done();
-}
-// 'gulp serve' -- open up your website in your browser and watch for changes
-// in all your files and update them when needed
-gulp.task('serve', (done) => {
-  browserSync.init({
-    // tunnel: true,
-    // open: false,
-    server: ['.tmp', 'dist']
-  });
-  done();
-
-  // Watch various files for changes and do the needful
-  gulp.watch(['src/**/*.md', 'src/**/*.html', 'src/**/*.yml'], gulp.series('build:site', reload));
-  gulp.watch(['src/**/*.xml', 'src/**/*.txt'], gulp.series('site', reload));
-  gulp.watch('src/assets/javascript/**/*.js', gulp.series('scripts', reload));
-  gulp.watch('src/assets/scss/**/*.scss', gulp.series('styles'));
-  gulp.watch('src/assets/images/**/*', gulp.series('images', reload));
-});

gulp/tasks/build.js

@@ -7,7 +7,7 @@ const argv = require('yargs').argv;
 // 'gulp jekyll:tmp' -- copies your Jekyll site to a temporary directory
 // to be processed
 gulp.task('site:tmp', () =>
-  gulp.src(['src/**/*', '!src/assets/**/*', '!src/assets'], {dot: true})
+  gulp.src(['src/**/*', '!src/assets/**/*', '!src/assets', '!src/**/*.jsx'], {dot: true})
     .pipe(gulp.dest('.tmp/src'))
     .pipe(size({title: 'Jekyll'}))
 );

gulp/tasks/serve.js

@@ -0,0 +1,26 @@
+const gulp = require("gulp");
+const browserSync = require('browser-sync').create();
+
+// Function to properly reload your browser
+function reload(done) {
+    browserSync.reload();
+    done();
+}
+// 'gulp serve' -- open up your website in your browser and watch for changes
+// in all your files and update them when needed
+gulp.task('serve', (done) => {
+    browserSync.init({
+        // tunnel: true,
+        // open: false,
+        server: ['dist']
+        // server: ['.tmp', 'dist']
+    });
+    done();
+
+    // Watch various files for changes and do the needful
+    gulp.watch(['src/**/*.md', 'src/**/*.html', 'src/**/*.yml', 'src/**/*.js', 'src/**/*.css', 'src/**/*.jsx'], gulp.series('webpack', 'build:site', reload));
+    gulp.watch(['src/**/*.xml', 'src/**/*.txt'], gulp.series('site', reload));
+    gulp.watch('src/assets/javascript/**/*.js', gulp.series('scripts', reload));
+    gulp.watch('src/assets/scss/**/*.scss', gulp.series('styles'));
+    gulp.watch('src/assets/images/**/*', gulp.series('images', reload));
+});

gulp/tasks/webpack.js

@@ -0,0 +1,19 @@
+const gulp = require("gulp");
+const webpack = require('webpack')
+const webpackConfig = require('../../webpack.config')
+const argv = require('yargs').argv;
+
+function webpackTask(cb) {
+    return new Promise((resolve, reject) => {
+        webpack(webpackConfig, (err, stats) => {
+            if (err) {
+                return reject(err)
+            }
+            if (stats.hasErrors()) {
+                return reject(new Error(stats.compilation.errors.join('\n')))
+            }
+            resolve()
+        })
+    })
+}
+gulp.task("webpack", webpackTask);

gulpfile.js

@@ -25,7 +25,7 @@ gulp.task('clean', gulp.parallel('clean:assets', 'clean:gzip', 'clean:dist', 'cl
 
 // 'gulp build' -- same as 'gulp' but doesn't serve your site in your browser
 // 'gulp build --prod' -- same as above but with production settings
-gulp.task('build', gulp.series('clean', 'assets', 'build:site', 'html'));
+gulp.task('build', gulp.series('clean', 'assets', 'webpack', 'build:site', 'html'));
 
 // You can also just use 'gulp upload' but this way you can see all the main
 // tasks in the gulpfile instead of having to hunt for the deploy tasks