Build welder

This needs a bunch of new runtime dependencies. In particular, welder does not (currently) work with react-lite. As webpack aliases can't be made specific to subdirectories, dynamically add the react → react-lite alias when building the welder directory. Note that this *only* works with our tools/webpack-make build system, not with calling plain "webpack" (due to the above limitation). It isn't possible to change import statements to "react-lite", or import "react-full" from welder and alias that to react, as the imports of the imported NPM dependencies would still be wrong. Add `*.jsx` to webpack's module extensions, to allow welder (and other) code to `import` other `*.jsx` modules without extension. Don't install welder on Debian/Ubuntu, as there is no viable backend for it in sight.
martinpitt · Jan 2, 2018 · 9374d7d · 9374d7d
1 parent 6ae5fd0
commit 9374d7d
Show file tree

Hide file tree

Showing 7 changed files with 67 additions and 9 deletions.
diff --git a/Makefile.am b/Makefile.am
@@ -168,6 +168,7 @@ WEBPACK_PACKAGES = \
 	systemd \
 	tuned \
 	users \
+	welder \
 	$(NULL)
 
 V_WEBPACK = $(V_WEBPACK_$(V))

diff --git a/package.json b/package.json
@@ -3,6 +3,23 @@
   "description": "Cockpit isn't a Node package, these are devel time deps, not needed to build tarball either",
   "private": true,
   "dependencies": {
+    "babel-polyfill": "^6.9.1",
+    "classnames": "^2.2.5",
+    "fastclick": "^1.0.6",
+    "history": "^3.0.0",
+    "patternfly-webcomponents": "0.0.8",
+    "react": "^15.2.1",
+    "react-dom": "^15.6.1",
+    "react-patternfly-shims": "0.0.2",
+    "react-redux": "^5.0.5",
+    "redux-persist": "^4.8.2",
+    "redux-saga": "^0.15.3",
+    "reselect": "^3.0.1",
+    "webcomponentsjs": "^1.0.2",
+    "whatwg-fetch": "^1.0.0",
+    "@webcomponents/custom-elements": "^1.0.0",
+    "@webcomponents/webcomponentsjs": "^1.0.0",
+    "bootstrap-select": "^1.12.4",
     "angular": "1.3.20",
     "angular-bootstrap-npm": "0.13.4",
     "angular-gettext": "2.3.10",
@@ -59,6 +76,7 @@
     "less": "~2.6.0",
     "less-loader": "~2.2.3",
     "ng-cache-loader": "0.0.16",
+    "path-to-regexp": "^1.7.0",
     "po2json": "~0.4.1",
     "promise": "~7.1.1",
     "raw-loader": "~0.5.1",

diff --git a/pkg/welder/index.html b/pkg/welder/index.html
@@ -7,16 +7,16 @@
     <meta name="description" content="">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="apple-touch-icon" href="apple-touch-icon.png">
-    <link rel="stylesheet" href="./css/patternfly.min.css">
-    <link rel="stylesheet" href="./css/patternfly-additions.min.css">
-    <link rel="stylesheet" href="./custom.css">
+    <link href="../base1/patternfly.css" type="text/css" rel="stylesheet">
+    <!-- not being used? <link rel="stylesheet" href="./css/patternfly-additions.min.css"> -->
+    <link rel="stylesheet" href="./welder.css">
 
     <!-- js dependencies -->
     <script src="../base1/jquery.js"></script>
     <!-- <script src="dist/jquery.matchHeight-min.js"></script> -->
     <script type="text/javascript" src="../base1/cockpit.js"></script>
-    <script src="dist/webcomponents-lite.js"></script>
-    <script src="dist/native-shim.js"></script>
+    <script src="./webcomponents-lite.js"></script>
+    <script src="./native-shim.js"></script>
     <script src="./js/config.js"></script>
   </head>
   <body>

diff --git a/tools/check-dist b/tools/check-dist
@@ -13,7 +13,8 @@ find $1/dist -type f | while read file; do
     # We don't care about these files
     case $file in
     *.png|*.svg|*.gif|*.map|*.woff|*.ttf|*.gz| \
-    *machines/include/logo.js|*machines/include/keysymdef.js)
+    *machines/include/logo.js|*machines/include/keysymdef.js| \
+    *welder/webcomponents-lite.js)
         continue
         ;;
     esac

diff --git a/tools/cockpit.spec b/tools/cockpit.spec
@@ -220,6 +220,9 @@ find %{buildroot}%{_datadir}/%{name}/machines -type f >> machines.list
 echo '%dir %{_datadir}/%{name}/ovirt' > ovirt.list
 find %{buildroot}%{_datadir}/%{name}/ovirt -type f >> ovirt.list
 
+echo '%dir %{_datadir}/%{name}/welder' > welder.list
+find %{buildroot}%{_datadir}/%{name}/welder -type f >> welder.list
+
 # on CentOS systems we don't have the required setroubleshoot-server packages
 %if 0%{?centos}
 rm -rf %{buildroot}%{_datadir}/%{name}/selinux
@@ -701,5 +704,16 @@ via PackageKit.
 
 %files packagekit -f packagekit.list
 
+%package welder
+Summary: Cockpit user interface for Welder
+Requires: %{name}-bridge >= %{required_base}
+# FIXME: backend dependencies once it exists
+
+%description welder
+The Cockpit components for creating and maintaining recipes and builds of
+operating system images through Welder.
+
+%files welder -f welder.list
+
 # The changelog is automatically generated and merged
 %changelog
diff --git a/tools/debian/rules b/tools/debian/rules
@@ -59,7 +59,7 @@ override_dh_install:
 	dpkg-vendor --derives-from ubuntu || rm -r debian/tmp/usr/share/cockpit/branding/ubuntu
 
 	# unpackaged modules
-	for m in kdump kubernetes ostree selinux sosreport subscriptions ovirt; do rm -r debian/tmp/usr/share/cockpit/$$m; done
+	for m in kdump kubernetes ostree selinux sosreport subscriptions ovirt welder; do rm -r debian/tmp/usr/share/cockpit/$$m; done
 	# part of kubernetes
 	rm -f debian/tmp/usr/lib/cockpit/cockpit-stub
 

diff --git a/webpack.config.js b/webpack.config.js
@@ -150,6 +150,11 @@ var info = {
         "users/users": [
             "users/local.js",
             "users/users.css",
+        ],
+
+        "welder/welder": [
+            "welder/main.jsx",
+            "welder/custom.css",
         ]
     },
 
@@ -271,6 +276,7 @@ var info = {
         "users/manifest.json",
 
         "welder/index.html",
+        "welder/js/config.js",
     ]
 };
 
@@ -410,22 +416,36 @@ if (!section || section.indexOf("base1") === 0) {
     });
 }
 
+if (section == "welder/") {
+    files.push({
+        from: nodedir + path.sep + "@webcomponents/custom-elements/src/native-shim.js",
+        to: "welder/"
+    }, {
+        from: nodedir + path.sep + "@webcomponents/webcomponentsjs/webcomponents-lite.js",
+        to: "welder/"
+    });
+}
+
 var aliases = {
     "angular": "angular/angular.js",
     "angular-route": "angular-route/angular-route.js",
     "d3": "d3/d3.js",
     "moment": "moment/moment.js",
-    "react": "react-lite/dist/react-lite.js",
     "term": "term.js-cockpit/src/term.js",
 };
 
+/* HACK: welder currently doesn't work with react-lite */
+if (section !== "welder/")
+    aliases["react"] = "react-lite/dist/react-lite.js";
+
 /* HACK: To get around redux warning about reminimizing code */
 if (production)
     aliases["redux/dist/redux"] = "redux/dist/redux.min.js";
 
 module.exports = {
     resolve: {
         alias: aliases,
+        extensions: ["", ".js", ".jsx"],
         modulesDirectories: [ libdir, nodedir ]
     },
     resolveLoader: {
@@ -484,7 +504,11 @@ module.exports = {
             {
                 test: /[\/]angular\.js$/,
                 loader: "exports?angular"
-            }
+            },
+            {
+                test: /\/routes.json$/,
+                loaders: ["babel-loader", "./utils/routes-loader.jsx"],
+            },
         ],
 
         /* The stuff in noVNC are plain ol javascript */