Moved history component, added start draft of frontend code style guide

style_guides/frontend.md

@@ -0,0 +1,62 @@
+# Frontend Style Guide
+
+Generally we follow the Airbnb  [React Style Guide](https://github.com/airbnb/javascript/tree/master/react).
+
+## Table of Contents
+
+  1. [Basic Rules](#basic-rules)
+  1. [File & Component Organization](#Organization)
+  1. [Naming](#naming)
+  1. [Declaration](#declaration)
+  1. [Props](#props)
+  1. [Refs](#refs)
+  1. [Methods](#methods)
+  1. [Ordering](#ordering)
+
+## Basic rules
+
+* Try to keep files small and focused and break large components up into sub components.
+
+## Organization
+
+* Components and types that needs to be used by external plugins needs to go into @grafana/ui
+* Components should get their own folder under features/xxx/components
+  * Sub components can live in that component folders, so not small component needs their own folder
+  * Place test next to their component file (same dir)
+  * Mocks in __mocks__ dir
+  * Test utils in __tests__ dir
+  * Component sass should live in the same folder as component code
+* State logic & domain models should live in features/xxx/state
+* Containers (pages) can live in feature root features/xxx
+  * up for debate?
+
+## Props
+
+* Name callback props & handlers with a "on"  prefix.
+
+```tsx
+// good
+onChange = () => {
+
+};
+
+render() {
+  return (
+    <MyComponent onChange={this.onChange} />
+  );
+}
+
+// bad
+handleChange = () => {
+
+};
+
+render() {
+  return (
+    <MyComponent changed={this.handleChange} />
+  );
+}
+```
+
+
+