diff --git a/src/components/App.js b/src/components/App.js
index c424bf3..76b3056 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,19 +1,17 @@
-import React from "react";
+import React, { Fragment } from "react";
+
+import Loading from "./common/Loading";
+import ErrorView from "./common/ErrorView";
+import InfoView from "./common/InfoView";
import Welcome from "./Welcome";
import Gallery from "./Gallery";
-const Loading = () => (
-
-);
-const ErrorView = error => {error}
;
-
const App = ({
fonts,
flags,
installedFonts,
error,
+ announcement,
isUserRegistered,
registerUser,
installFont,
@@ -22,22 +20,30 @@ const App = ({
registering,
loading
}) => {
- if (error) return ;
if (loading) return ;
if (isUserRegistered)
return (
-
+
+
+
+
+
);
- return ;
+ return (
+
+
+
+
+
+ );
};
export default App;
diff --git a/src/components/Gallery.js b/src/components/Gallery.js
index 281ea73..7a9a22d 100644
--- a/src/components/Gallery.js
+++ b/src/components/Gallery.js
@@ -3,6 +3,8 @@ import styled from "styled-components";
import { Button, Switch, Card, Elevation } from "@blueprintjs/core";
import find from "lodash/find";
+import Loading from "./common/Loading";
+
// Styles
const Wrapper = styled.div`
height: 100vh;
@@ -134,11 +136,7 @@ class Gallery extends Component {
return (
- {flags[id] && (
-
- )}
+ {flags[id] && }
diff --git a/src/components/common/ErrorView.js b/src/components/common/ErrorView.js
new file mode 100644
index 0000000..caf00f2
--- /dev/null
+++ b/src/components/common/ErrorView.js
@@ -0,0 +1,18 @@
+import React from "react";
+import styled from "styled-components";
+
+// Styles
+const Error = styled.div`
+ color: white;
+ text-align: center;
+ background-color: red;
+ padding: 5px 0;
+ font-size: 11px;
+`;
+
+const ErrorView = ({ error }) => {
+ if (!error) return null;
+ return {error};
+};
+
+export default ErrorView;
diff --git a/src/components/common/InfoView.js b/src/components/common/InfoView.js
new file mode 100644
index 0000000..718a263
--- /dev/null
+++ b/src/components/common/InfoView.js
@@ -0,0 +1,30 @@
+import React from "react";
+import styled from "styled-components";
+
+const electron = window.require("electron");
+
+// Styles
+const Announcement = styled.div`
+ color: white;
+ text-align: center;
+ background-color: green;
+ padding: 5px 0;
+ font-size: 11px;
+ cursor: pointer;
+`;
+
+const openExternalLink = url => {
+ if (!url) return;
+ electron.shell.openExternal(url);
+};
+
+const InfoView = ({ announcement }) => {
+ if (!announcement) return null;
+ const { text, href } = announcement || {};
+ if (!text) return null;
+ return (
+ openExternalLink(href)}>{text}
+ );
+};
+
+export default InfoView;
diff --git a/src/components/common/Loading.js b/src/components/common/Loading.js
new file mode 100644
index 0000000..58f2c38
--- /dev/null
+++ b/src/components/common/Loading.js
@@ -0,0 +1,9 @@
+import React from "react";
+
+const Loading = () => (
+
+);
+
+export default Loading;
diff --git a/src/containers/App.js b/src/containers/App.js
index 8f501f4..e5c91cd 100644
--- a/src/containers/App.js
+++ b/src/containers/App.js
@@ -34,7 +34,7 @@ class AppContainer extends React.Component {
(
error,
{
- announcement,
+ announcements,
fonts,
installedFonts,
flags,
@@ -44,7 +44,7 @@ class AppContainer extends React.Component {
}
) => {
this.setState(() => ({
- announcement,
+ announcement: announcements && announcements[0],
fonts,
installedFonts,
flags,