Updated all basic components

removed unnecessary components, combined where necessary
added each component to a folder, added individual css style modules
optimized some component rendering flows
removed functional components in favor of pure components
linted and formatted all of the files

app/javascript/gabsocial/components/domain/index.js

@@ -0,0 +1,48 @@
+import IconButton from '../icon_button';
+import { defineMessages, injectIntl } from 'react-intl';
+
+import './index.scss';
+
+const messages = defineMessages({
+  unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unhide {domain}' },
+});
+
+export default @injectIntl
+class Domain extends PureComponent {
+
+  static propTypes = {
+    domain: PropTypes.string,
+    onUnblockDomain: PropTypes.func.isRequired,
+    intl: PropTypes.object.isRequired,
+  };
+
+  handleDomainUnblock = () => {
+    this.props.onUnblockDomain(this.props.domain);
+  }
+
+  render () {
+    const { domain, intl } = this.props;
+
+    return (
+      <div className='domain'>
+        <div className='domain__wrapper'>
+          <span className='domain__name'>
+            <strong>{domain}</strong>
+          </span>
+
+          <div className='domain__buttons'>
+            <IconButton
+              active
+              icon='unlock'
+              title={intl.formatMessage(messages.unblockDomain, {
+                domain,
+              })}
+              onClick={this.handleDomainUnblock}
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+}

app/javascript/gabsocial/components/domain/index.scss

@@ -0,0 +1,23 @@
+.domain {
+  padding: 10px;
+  border-bottom: 1px solid lighten($ui-base-color, 8%);
+
+  &__wrapper {
+    display: flex;
+  }
+
+  .domain__domain-name {
+    flex: 1 1 auto;
+    display: block;
+    color: $primary-text-color;
+    text-decoration: none;
+
+    @include text-sizing(14px, 400);
+  }
+
+  .domain_buttons {
+    height: 18px;
+    padding: 10px;
+    white-space: nowrap;
+  }
+}