Refactored file structure and added url-loader to webpack. (equinor#82)

In order to have it similar to webviz-subsurface-components.

Added MIT copyright notices.

package.json

@@ -1,5 +1,6 @@
 {
     "name": "webviz_core_components",
+    "version": "0.0.1",
     "description": "Core components for webviz config",
     "repository": {
         "type": "git",
@@ -15,7 +16,7 @@
         "postinstall": "cp ./package.json webviz_core_components/package-info.json",
         "build:js": "webpack --mode production",
         "build:js-dev": "webpack --mode development",
-        "build:py_and_r": "dash-generate-components ./src/lib/components webviz_core_components -p package-info.json --r-prefix ''",
+        "build:py_and_r": "dash-generate-components ./src/lib/components webviz_core_components -p package-info.json --r-prefix '' --ignore .*.js$",
         "build": "npm run build:js && npm run build:js-dev && npm run build:py_and_r",
         "format": "prettier --write *.js *.json 'src/**/*.+(js|jsx|json|css)'",
         "linting": "prettier --check *.js *.json 'src/**/*.+(js|jsx|json|css)' && eslint src/"
@@ -42,6 +43,7 @@
         "babel-loader": "^8.0.6",
         "copyfiles": "^2.1.1",
         "css-loader": "^3.0.0",
+        "url-loader": "^4.1.1",
         "eslint": "^6.0.1",
         "eslint-config-prettier": "^6.0.0",
         "eslint-plugin-import": "^2.18.0",

requirements.txt

@@ -0,0 +1,2 @@
+# dash is required to call `build:py`
+dash[dev]>=1.15.0

src/demo/App.js

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
 /* eslint no-magic-numbers: 0 */
 import React, { Component } from "react";
 

src/demo/index.js

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
 import React from "react";
 import ReactDOM from "react-dom";
 import App from "./App";

src/lib/components/ColorScales/index.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { default } from "./ColorScales";

src/lib/components/Select/Select.css

@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.webviz-config-select {
+    width: 100%;
+    overflow-y: auto;
+    font-family: inherit;
+    font-size: inherit;
+}

src/lib/components/Select.react.js → src/lib/components/Select/Select.jsx

@@ -1,3 +1,10 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import "./Select.css";

src/lib/components/Select/index.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { default } from "./Select";

src/lib/components/WebvizPluginPlaceholder.react.js → src/lib/components/WebvizPluginPlaceholder/WebvizPluginPlaceholder.jsx

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import html2canvas from "html2canvas";
@@ -11,9 +19,9 @@ import {
     faDownload,
 } from "@fortawesome/free-solid-svg-icons";
 
-import WebvizToolbarButton from "../private-components/webviz-plugin-placeholder-resources/WebvizToolbarButton";
-import WebvizContentOverlay from "../private-components/webviz-plugin-placeholder-resources/WebvizContentOverlay";
-import download_file from "../private-components/webviz-plugin-placeholder-resources/download_file";
+import WebvizToolbarButton from "./utils/WebvizToolbarButton";
+import WebvizContentOverlay from "./utils/WebvizContentOverlay";
+import download_file from "./utils/download_file";
 
 import "./webviz_plugin_component.css";
 
@@ -87,7 +95,7 @@ export default class WebvizPluginPlaceholder extends Component {
                                         {
                                             scrollX: -window.scrollX,
                                             scrollY: -window.scrollY,
-                                        }                                        
+                                        }
                                     ).then(canvas =>
                                         canvas.toBlob(blob =>
                                             download_file({
@@ -139,7 +147,7 @@ export default class WebvizPluginPlaceholder extends Component {
                         )}
                         {this.props.buttons.includes("contact_person") &&
                             Object.keys(this.props.contact_person).length >
-                                0 && (
+                            0 && (
                                 <WebvizToolbarButton
                                     icon={faAddressCard}
                                     tooltip="Contact person"

src/lib/components/WebvizPluginPlaceholder/index.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { default } from "./WebvizPluginPlaceholder";

src/lib/private-components/webviz-plugin-placeholder-resources/WebvizContentOverlay.js → src/lib/components/WebvizPluginPlaceholder/utils/WebvizContentOverlay.js

@@ -1,3 +1,10 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

src/lib/private-components/webviz-plugin-placeholder-resources/WebvizToolbarButton.js → src/lib/components/WebvizPluginPlaceholder/utils/WebvizToolbarButton.js

@@ -1,3 +1,10 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

src/lib/private-components/webviz-plugin-placeholder-resources/download_file.js → src/lib/components/WebvizPluginPlaceholder/utils/download_file.js

@@ -1,4 +1,11 @@
-export default function download_file({filename, data, mimeType}) {
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export default function download_file({ filename, data, mimeType }) {
     const link = document.createElement("a");
 
     if (data instanceof Blob) {

src/lib/components/webviz_plugin_component.css → src/lib/components/WebvizPluginPlaceholder/webviz_plugin_component.css

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
 .webviz-config-plugin-wrapper {
     width: 100%;
     box-sizing: border-box;

src/lib/flexbox.css

@@ -1,3 +1,11 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
 div.webviz-core-components-flexbox {
     display: flex; 
     flex-wrap: wrap;

src/lib/index.js

@@ -1,7 +1,14 @@
+/**
+ * Copyright (c) 2021- Equinor ASA
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
 /* eslint-disable import/prefer-default-export */
-import WebvizPluginPlaceholder from "./components/WebvizPluginPlaceholder.react";
-import ColorScales from "./components/ColorScales.react";
-import Select from "./components/Select.react";
+import WebvizPluginPlaceholder from "./components/WebvizPluginPlaceholder";
+import ColorScales from "./components/ColorScales";
+import Select from "./components/Select";
 
 import "./flexbox.css"
 

tests/test_color_scales.py

@@ -1,3 +1,12 @@
+##################################################################
+#
+# Copyright (c) 2021- Equinor ASA
+#
+# This source code is licensed under the MIT license found in the
+# LICENSE file in the root directory of this source tree.
+#
+##################################################################
+
 import dash
 import dash_html_components as html
 import webviz_core_components

tests/test_graph.py

@@ -1,3 +1,12 @@
+##################################################################
+#
+# Copyright (c) 2021- Equinor ASA
+#
+# This source code is licensed under the MIT license found in the
+# LICENSE file in the root directory of this source tree.
+#
+##################################################################
+
 import dash
 import dash_html_components as html
 import webviz_core_components

tests/test_plugin_placeholder.py

@@ -1,3 +1,12 @@
+##################################################################
+#
+# Copyright (c) 2021- Equinor ASA
+#
+# This source code is licensed under the MIT license found in the
+# LICENSE file in the root directory of this source tree.
+#
+##################################################################
+
 import dash
 import dash_html_components as html
 import webviz_core_components

webpack.config.js

@@ -51,6 +51,9 @@ module.exports = (env, argv) => {
     return {
         mode,
         entry,
+        resolve: {
+            extensions: [".ts", ".tsx", ".js", ".jsx"],
+        },
         output: {
             path: path.resolve(__dirname, dashLibraryName),
             filename,
@@ -74,7 +77,7 @@ module.exports = (env, argv) => {
         module: {
             rules: [
                 {
-                    test: /\.js$/,
+                    test: /\.(ts|js)x?$/,
                     exclude: /node_modules/,
                     use: {
                         loader: "babel-loader",
@@ -92,6 +95,12 @@ module.exports = (env, argv) => {
                         "css-loader",
                     ],
                 },
+                {
+		    test: /\.(png|svg|jpg|jpeg|gif)$/i,
+		    use: {
+          	        loader: 'url-loader',
+                   },
+	        },
             ],
         },
         devtool,