restructure scm-ui and use ui-components and ui-types

scm-ui-components/packages/ui-components/src/Loading.js

@@ -0,0 +1,51 @@
+//@flow
+import React from "react";
+import { translate } from "react-i18next";
+import injectSheet from "react-jss";
+import Image from "./Image";
+
+const styles = {
+  wrapper: {
+    position: "relative"
+  },
+  loading: {
+    width: "128px",
+    height: "128px",
+
+    position: "absolute",
+    top: "50%",
+    left: "50%",
+
+    margin: "64px 0 0 -64px"
+  },
+  image: {
+    width: "128px",
+    height: "128px"
+  }
+};
+
+type Props = {
+  t: string => string,
+  message?: string,
+  classes: any
+};
+
+class Loading extends React.Component<Props> {
+  render() {
+    const { message, t, classes } = this.props;
+    return (
+      <div className={classes.wrapper}>
+        <div className={classes.loading}>
+          <Image
+            className={classes.image}
+            src="/images/loading.svg"
+            alt={t("loading.alt")}
+          />
+          <p className="has-text-centered">{message}</p>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default injectSheet(styles)(translate("commons")(Loading));