From 00d0fc1ccb888772ba74484907854475a2b35a3b Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Wed, 26 Sep 2018 21:39:57 +0200
Subject: [PATCH] Created basic components skeleton

---
 .../components/Group/index.js                 | 24 +++++++
 .../Notification/NotificationGroups/index.js  | 67 +++++++++++++++++++
 src/components/Notification/index.js          |  2 +-
 3 files changed, 92 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Notification/NotificationGroups/components/Group/index.js
 create mode 100644 src/components/Notification/NotificationGroups/index.js

diff --git a/src/components/Notification/NotificationGroups/components/Group/index.js b/src/components/Notification/NotificationGroups/components/Group/index.js
new file mode 100644
index 00000000..7559e7a2
--- /dev/null
+++ b/src/components/Notification/NotificationGroups/components/Group/index.js
@@ -0,0 +1,24 @@
+import React, { Component } from 'react';
+import styled from 'styled-components';
+
+const Wrapper = styled.div``;
+
+class Group extends Component {
+    hide() {
+
+    }
+
+    show() {
+
+    }
+
+    render() {
+        return (
+            <Wrapper>
+                Group
+            </Wrapper>
+        );
+    }
+}
+
+export default Group;
\ No newline at end of file
diff --git a/src/components/Notification/NotificationGroups/index.js b/src/components/Notification/NotificationGroups/index.js
new file mode 100644
index 00000000..2e5ad4d2
--- /dev/null
+++ b/src/components/Notification/NotificationGroups/index.js
@@ -0,0 +1,67 @@
+import React, { Component } from 'react';
+import styled from 'styled-components';
+
+import Group from './components/Group';
+
+const Wrapper = styled.div``;
+
+class NotificationsGroup extends Component {
+    constructor() {
+        super();
+        this.notificationPriority = {
+            error: 0,
+            warning: 1,
+            info: 2,
+            success: 3,
+        };
+
+        this.notifications = [
+            { type: 'warning' },
+            { type: 'error' },
+            { type: 'info' },
+            { type: 'error' },
+            { type: 'warning' },
+            { type: 'success' },
+            { type: 'error' },
+            { type: 'error' },
+        ];
+    }
+
+    getGroupNotifications(notifications, type) {
+        return notifications.filter(item => item.type === type);
+    }
+
+    groupNotifications = (items, key) => items.reduce(
+        (result, item) => ({
+            ...result,
+            [item[key]]: [...(result[item[key]] || []), item],
+        }),
+        {},
+    );
+
+    sortByPriority(notifications) {
+        const sorted = Object.keys(notifications).sort((a, b) => {
+            // sort
+        });
+        return sorted;
+    }
+
+    render() {
+        const { notifications } = this;
+        const notificationGroups = this.groupNotifications(notifications, 'type');
+        const sortedNotifications = this.sortByPriority(notificationGroups);
+
+        return (
+            <Wrapper>
+                {sortedNotifications.map(group => (
+                    <Group
+                        notifications={this.getGroupNotifications(group.type, sortedNotifications)}
+                        type={group.type}
+                    />
+                ))}
+            </Wrapper>
+        );
+    }
+}
+
+export default NotificationsGroup;
\ No newline at end of file
diff --git a/src/components/Notification/index.js b/src/components/Notification/index.js
index 6654a152..5c55082b 100644
--- a/src/components/Notification/index.js
+++ b/src/components/Notification/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React } from 'react';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import styled, { css } from 'styled-components';