From b232b4c5639ee114f9ee70b5cce9ce07076d497b Mon Sep 17 00:00:00 2001
From: Fox <7926053+SrZorro@users.noreply.github.com>
Date: Fri, 22 Jun 2018 17:43:09 +0200
Subject: [PATCH] Added AudioBubble scafolding, stoped till grid system is
 implemented

---
 CHANGELOG.md                                  |  9 +++++--
 src/renderer/components/ChatBubble.tsx        |  3 +++
 .../components/bubbles/AudioBubble.tsx        | 24 +++++++++++++++++++
 3 files changed, 34 insertions(+), 2 deletions(-)
 create mode 100644 src/renderer/components/bubbles/AudioBubble.tsx

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ef3387b..56cfb8c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,7 +4,7 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-## [Unreleased]
+## [Future]
 - Add a screen to chose the community to see.
 - "private" messages add a profile image.
 - Add a chat bubble to see users join and leave threads.
@@ -13,7 +13,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Add thread name to the header of threads.
 - Add a leave thread, maybe in header?
 - Overhaul textbox in threads.
-- Display correctly special syntax flavor [B]old [I]talic [C]enter [U]nderline [S]trikeout
+- Display correctly special syntax flavor [B]old [I]talic [C]enter [U]nderline [S]trikeout.
+- Migrate chat bubbles from float based to grid.
+- Move chat bubble elements to his own components.
+
+## [Unreleased]
+
 
 ## [1.0.6] - 2018-06-21
 ### Added
diff --git a/src/renderer/components/ChatBubble.tsx b/src/renderer/components/ChatBubble.tsx
index 6c8dbe9..08a69db 100644
--- a/src/renderer/components/ChatBubble.tsx
+++ b/src/renderer/components/ChatBubble.tsx
@@ -2,6 +2,7 @@ import { IAminoMessage } from "aminoclient/dist/AminoTypes";
 import { Component } from "inferno";
 import { style } from "typestyle";
 import moment from "moment";
+// import AudioBubble from "./bubbles/AudioBubble";
 
 const classMain = style({
     width: "100%",
@@ -162,6 +163,8 @@ export default class ChatBubble extends Component<any, any> {
                 case 110:
                     // ToDo - Add style from https://codepen.io/gregh/pen/NdVvbm
                     ctx.push(<audio controls><source src={this.props.aminoMessage.mediaValue} type="audio/aac" /></audio>);
+                    // Stoped AudioBubble development till grid system is implemented
+                    // ctx.push(<AudioBubble src={this.props.aminoMessage.mediaValue} />);
                     break;
             }
         }
diff --git a/src/renderer/components/bubbles/AudioBubble.tsx b/src/renderer/components/bubbles/AudioBubble.tsx
new file mode 100644
index 0000000..0f8c2bc
--- /dev/null
+++ b/src/renderer/components/bubbles/AudioBubble.tsx
@@ -0,0 +1,24 @@
+import { Component } from "inferno";
+import { style } from "typestyle";
+
+const classMain = style({
+    height: 50
+});
+
+interface IAudioBubble {
+    src: string;
+}
+
+export default class ChatBubble extends Component<any, any> {
+    constructor(props: IAudioBubble, context) {
+        super(props, context);
+    }
+
+    public render() {
+        return (
+            <div class={classMain}>
+
+            </div >
+        );
+    }
+}
\ No newline at end of file