From 78ea172428ddbc9ed2485d8ab8c99f236741eeee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Se=CC=81rgio=20Ramos?= <mail@sergioramos.me>
Date: Mon, 9 Oct 2017 14:43:51 +0100
Subject: [PATCH] fix(my-joy-beta): use new Message API

---
 .../src/containers/instances/firewall.js      | 20 ++++++++++++-----
 .../src/containers/instances/list.js          | 19 +++++++++++-----
 .../src/containers/instances/metadata.js      | 20 ++++++++++++-----
 .../src/containers/instances/networks.js      | 22 ++++++++++++-------
 .../src/containers/instances/snapshots.js     | 20 ++++++++++++-----
 .../src/containers/instances/summary.js       | 20 ++++++++++++-----
 .../src/containers/instances/tags.js          | 20 ++++++++++++-----
 7 files changed, 97 insertions(+), 44 deletions(-)

diff --git a/packages/my-joy-beta/src/containers/instances/firewall.js b/packages/my-joy-beta/src/containers/instances/firewall.js
index 201749fe..eab2013f 100644
--- a/packages/my-joy-beta/src/containers/instances/firewall.js
+++ b/packages/my-joy-beta/src/containers/instances/firewall.js
@@ -5,7 +5,14 @@ import { compose, graphql } from 'react-apollo';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import GetFirewallRules from '@graphql/list-firewall-rules.gql';
 import { FirewallRule as InstanceFirewallRule } from '@components/instances';
@@ -34,11 +41,12 @@ const Firewall = ({
 
   const _error =
     error && !values.length && !_loading ? (
-      <Message
-        title="Ooops!"
-        message="An error occurred while loading your instance firewall rules"
-        error
-      />
+      <Message error>
+        <MessageTitle>Ooops!</MessageTitle>
+        <MessageDescription>
+          An error occurred while loading your instance firewall rules
+        </MessageDescription>
+      </Message>
     ) : null;
 
   return (
diff --git a/packages/my-joy-beta/src/containers/instances/list.js b/packages/my-joy-beta/src/containers/instances/list.js
index 3aec53d8..7452b868 100644
--- a/packages/my-joy-beta/src/containers/instances/list.js
+++ b/packages/my-joy-beta/src/containers/instances/list.js
@@ -8,7 +8,13 @@ import get from 'lodash.get';
 import sortBy from 'lodash.sortby';
 import find from 'lodash.find';
 
-import { ViewContainer, Title, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import ListInstances from '@graphql/list-instances.gql';
 import StopInstance from '@graphql/stop-instance.gql';
@@ -43,11 +49,12 @@ const List = ({
 
   const _error =
     error && !_instances.length && !_loading ? (
-      <Message
-        title="Ooops!"
-        message="An error occurred while loading your instances."
-        error
-      />
+      <Message error>
+        <MessageTitle>Ooops!</MessageTitle>
+        <MessageDescription>
+          An error occurred while loading your instances
+        </MessageDescription>
+      </Message>
     ) : null;
 
   const handleAction = name => onAction({ name, ids: selected });
diff --git a/packages/my-joy-beta/src/containers/instances/metadata.js b/packages/my-joy-beta/src/containers/instances/metadata.js
index 6c302894..2da3e6f1 100644
--- a/packages/my-joy-beta/src/containers/instances/metadata.js
+++ b/packages/my-joy-beta/src/containers/instances/metadata.js
@@ -7,7 +7,14 @@ import { reduxForm } from 'redux-form';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import GetMetadata from '@graphql/list-metadata.gql';
 import { KeyValue } from '@components/instances';
@@ -44,11 +51,12 @@ const Metadata = ({ metadata = [], loading, error }) => {
 
   const _error =
     error && !values.length && !_loading ? (
-      <Message
-        title="Ooops!"
-        message="An error occurred while loading your instance metadata"
-        error
-      />
+      <Message error>
+        <MessageTitle>Ooops!</MessageTitle>
+        <MessageDescription>
+          An error occurred while loading your instance metadata
+        </MessageDescription>
+      </Message>
     ) : null;
 
   return (
diff --git a/packages/my-joy-beta/src/containers/instances/networks.js b/packages/my-joy-beta/src/containers/instances/networks.js
index ae8b0880..4eb9ce99 100644
--- a/packages/my-joy-beta/src/containers/instances/networks.js
+++ b/packages/my-joy-beta/src/containers/instances/networks.js
@@ -5,7 +5,14 @@ import { compose, graphql } from 'react-apollo';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import GetNetworks from '@graphql/list-networks.gql';
 import { Network as InstanceNetwork } from '@components/instances';
@@ -15,8 +22,6 @@ const Networks = ({ networks = [], loading, error }) => {
   const _title = <Title>Networks</Title>;
   const _loading = !(loading && !values.length) ? null : <StatusLoader />;
 
-  console.log(values);
-
   const _networks =
     !_loading &&
     values.map((network, i, all) => (
@@ -30,11 +35,12 @@ const Networks = ({ networks = [], loading, error }) => {
 
   const _error =
     error && !values.length && !_loading ? (
-      <Message
-        title="Ooops!"
-        message="An error occurred while loading your instance networks"
-        error
-      />
+      <Message error>
+        <MessageTitle>Ooops!</MessageTitle>
+        <MessageDescription>
+          An error occurred while loading your instance networks
+        </MessageDescription>
+      </Message>
     ) : null;
 
   return (
diff --git a/packages/my-joy-beta/src/containers/instances/snapshots.js b/packages/my-joy-beta/src/containers/instances/snapshots.js
index 84438457..c5805543 100644
--- a/packages/my-joy-beta/src/containers/instances/snapshots.js
+++ b/packages/my-joy-beta/src/containers/instances/snapshots.js
@@ -6,7 +6,14 @@ import { compose, graphql } from 'react-apollo';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageTitle,
+  MessageDescription
+} from 'joyent-ui-toolkit';
 
 import GetSnapshots from '@graphql/list-snapshots.gql';
 
@@ -19,11 +26,12 @@ const Snapshots = ({ snapshots = [], loading, error }) => {
   const _summary = !_loading && <ReactJson src={snapshots} />;
 
   const _error = !(error && !_loading) ? null : (
-    <Message
-      title="Ooops!"
-      message="An error occurred while loading your instance snapshots"
-      error
-    />
+    <Message error>
+      <MessageTitle>Ooops!</MessageTitle>
+      <MessageDescription>
+        An error occurred while loading your instance snapshots
+      </MessageDescription>
+    </Message>
   );
 
   return (
diff --git a/packages/my-joy-beta/src/containers/instances/summary.js b/packages/my-joy-beta/src/containers/instances/summary.js
index 61d6ffea..7de2a128 100644
--- a/packages/my-joy-beta/src/containers/instances/summary.js
+++ b/packages/my-joy-beta/src/containers/instances/summary.js
@@ -5,7 +5,14 @@ import { compose, graphql } from 'react-apollo';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import GetInstance from '@graphql/get-instance.gql';
 
@@ -17,11 +24,12 @@ const Summary = ({ instance = {}, loading, error }) => {
   const _summary = !_loading && <ReactJson src={instance} />;
 
   const _error = !(error && !_loading) ? null : (
-    <Message
-      title="Ooops!"
-      message="An error occurred while loading your instance summary"
-      error
-    />
+    <Message error>
+      <MessageTitle>Ooops!</MessageTitle>
+      <MessageDescription>
+        An error occurred while loading your instance summary
+      </MessageDescription>
+    </Message>
   );
 
   return (
diff --git a/packages/my-joy-beta/src/containers/instances/tags.js b/packages/my-joy-beta/src/containers/instances/tags.js
index b2948868..a205e0f1 100644
--- a/packages/my-joy-beta/src/containers/instances/tags.js
+++ b/packages/my-joy-beta/src/containers/instances/tags.js
@@ -7,7 +7,14 @@ import { reduxForm } from 'redux-form';
 import find from 'lodash.find';
 import get from 'lodash.get';
 
-import { ViewContainer, Title, StatusLoader, Message } from 'joyent-ui-toolkit';
+import {
+  ViewContainer,
+  Title,
+  StatusLoader,
+  Message,
+  MessageDescription,
+  MessageTitle
+} from 'joyent-ui-toolkit';
 
 import { KeyValue } from '@components/instances';
 import GetTags from '@graphql/list-tags.gql';
@@ -44,11 +51,12 @@ const Tags = ({ tags = [], loading, error }) => {
 
   const _error =
     error && !values.length && !_loading ? (
-      <Message
-        title="Ooops!"
-        message="An error occurred while loading your instance tags"
-        error
-      />
+      <Message error>
+        <MessageTitle>Ooops!</MessageTitle>
+        <MessageDescription>
+          An error occurred while loading your instance tags
+        </MessageDescription>
+      </Message>
     ) : null;
 
   return (