Lens restructure (#540)

Signed-off-by: Roman <ixrock@gmail.com>

src/renderer/components/status-brick/index.ts

@@ -0,0 +1 @@
+export * from './status-brick'

src/renderer/components/status-brick/status-brick.scss

@@ -0,0 +1,15 @@
+.StatusBrick {
+  $brickSize: 8px;
+
+  display: inline-block;
+  width: $brickSize;
+  height: $brickSize;
+  margin-right: $margin;
+  background: $colorOk;
+  border-radius: 2px;
+
+  &:last-child {
+    margin-right: 0;
+  }
+}
+

src/renderer/components/status-brick/status-brick.tsx

@@ -0,0 +1,21 @@
+import "./status-brick.scss";
+
+import React from "react";
+import { cssNames } from "../../utils";
+import { TooltipDecoratorProps, withTooltip } from "../tooltip";
+
+interface Props extends React.HTMLAttributes<any>, TooltipDecoratorProps {
+}
+
+@withTooltip
+export class StatusBrick extends React.Component<Props> {
+  render() {
+    const { className, ...elemProps } = this.props
+    return (
+      <div
+        className={cssNames("StatusBrick", className)}
+        {...elemProps}
+      />
+    )
+  }
+}