prettier: ran on all files again, sorry. now settings are defined in package.json

Author: torkelo

.editorconfig

@@ -7,6 +7,8 @@ indent_size = 2
 charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
+max_line_length = 120
+insert_final_newline = true
 
 [*.go]
 indent_style = tab

package.json

@@ -107,14 +107,19 @@
   },
   "lint-staged": {
     "*.{ts,tsx}": [
-      "prettier --single-quote --trailing-comma es5 --write",
+      "prettier --write",
       "git add"
     ],
     "*.scss": [
-      "prettier --single-quote --write",
+      "prettier --write",
       "git add"
     ]
   },
+  "prettier": {
+    "trailingComma": "es5",
+    "singleQuote": true,
+    "printWidth": 120
+  },
   "license": "Apache-2.0",
   "dependencies": {
     "angular": "^1.6.6",

public/app/app.ts

@@ -54,49 +54,40 @@ export class GrafanaApp {
 
     moment.locale(config.bootData.user.locale);
 
-    app.config(
-      (
-        $locationProvider,
-        $controllerProvider,
-        $compileProvider,
-        $filterProvider,
-        $httpProvider,
-        $provide
-      ) => {
-        // pre assing bindings before constructor calls
-        $compileProvider.preAssignBindingsEnabled(true);
-
-        if (config.buildInfo.env !== 'development') {
-          $compileProvider.debugInfoEnabled(false);
-        }
-
-        $httpProvider.useApplyAsync(true);
-
-        this.registerFunctions.controller = $controllerProvider.register;
-        this.registerFunctions.directive = $compileProvider.directive;
-        this.registerFunctions.factory = $provide.factory;
-        this.registerFunctions.service = $provide.service;
-        this.registerFunctions.filter = $filterProvider.register;
-
-        $provide.decorator('$http', [
-          '$delegate',
-          '$templateCache',
-          function($delegate, $templateCache) {
-            var get = $delegate.get;
-            $delegate.get = function(url, config) {
-              if (url.match(/\.html$/)) {
-                // some template's already exist in the cache
-                if (!$templateCache.get(url)) {
-                  url += '?v=' + new Date().getTime();
-                }
-              }
-              return get(url, config);
-            };
-            return $delegate;
-          },
-        ]);
+    app.config(($locationProvider, $controllerProvider, $compileProvider, $filterProvider, $httpProvider, $provide) => {
+      // pre assing bindings before constructor calls
+      $compileProvider.preAssignBindingsEnabled(true);
+
+      if (config.buildInfo.env !== 'development') {
+        $compileProvider.debugInfoEnabled(false);
       }
-    );
+
+      $httpProvider.useApplyAsync(true);
+
+      this.registerFunctions.controller = $controllerProvider.register;
+      this.registerFunctions.directive = $compileProvider.directive;
+      this.registerFunctions.factory = $provide.factory;
+      this.registerFunctions.service = $provide.service;
+      this.registerFunctions.filter = $filterProvider.register;
+
+      $provide.decorator('$http', [
+        '$delegate',
+        '$templateCache',
+        function($delegate, $templateCache) {
+          var get = $delegate.get;
+          $delegate.get = function(url, config) {
+            if (url.match(/\.html$/)) {
+              // some template's already exist in the cache
+              if (!$templateCache.get(url)) {
+                url += '?v=' + new Date().getTime();
+              }
+            }
+            return get(url, config);
+          };
+          return $delegate;
+        },
+      ]);
+    });
 
     this.ngModuleDependencies = [
       'grafana.core',
@@ -111,14 +102,7 @@ export class GrafanaApp {
       'react',
     ];
 
-    var module_types = [
-      'controllers',
-      'directives',
-      'factories',
-      'services',
-      'filters',
-      'routes',
-    ];
+    var module_types = ['controllers', 'directives', 'factories', 'services', 'filters', 'routes'];
 
     _.each(module_types, type => {
       var moduleName = 'grafana.' + type;

public/app/core/components/code_editor/code_editor.ts

@@ -56,9 +56,7 @@ function link(scope, elem, attrs) {
   let maxLines = attrs.maxLines || DEFAULT_MAX_LINES;
   let showGutter = attrs.showGutter !== undefined;
   let tabSize = attrs.tabSize || DEFAULT_TAB_SIZE;
-  let behavioursEnabled = attrs.behavioursEnabled
-    ? attrs.behavioursEnabled === 'true'
-    : DEFAULT_BEHAVIOURS;
+  let behavioursEnabled = attrs.behavioursEnabled ? attrs.behavioursEnabled === 'true' : DEFAULT_BEHAVIOURS;
 
   // Initialize editor
   let aceElem = elem.get(0);

public/app/core/components/colorpicker/spectrum_picker.ts

@@ -12,8 +12,7 @@ export function spectrumPicker() {
     require: 'ngModel',
     scope: true,
     replace: true,
-    template:
-      '<color-picker color="ngModel.$viewValue" onChange="onColorChange"></color-picker>',
+    template: '<color-picker color="ngModel.$viewValue" onChange="onColorChange"></color-picker>',
     link: function(scope, element, attrs, ngModel) {
       scope.ngModel = ngModel;
       scope.onColorChange = color => {

public/app/core/components/form_dropdown/form_dropdown.ts

@@ -32,13 +32,7 @@ export class FormDropdownCtrl {
   lookupText: boolean;
 
   /** @ngInject **/
-  constructor(
-    private $scope,
-    $element,
-    private $sce,
-    private templateSrv,
-    private $q
-  ) {
+  constructor(private $scope, $element, private $sce, private templateSrv, private $q) {
     this.inputElement = $element.find('input').first();
     this.linkElement = $element.find('a').first();
     this.linkMode = true;
@@ -50,8 +44,7 @@ export class FormDropdownCtrl {
     if (this.labelMode) {
       this.cssClasses = 'gf-form-label ' + this.cssClass;
     } else {
-      this.cssClasses =
-        'gf-form-input gf-form-input--dropdown ' + this.cssClass;
+      this.cssClasses = 'gf-form-input gf-form-input--dropdown ' + this.cssClass;
     }
 
     this.inputElement.attr('data-provide', 'typeahead');
@@ -207,16 +200,11 @@ export class FormDropdownCtrl {
 
   updateDisplay(text) {
     this.text = text;
-    this.display = this.$sce.trustAsHtml(
-      this.templateSrv.highlightVariablesAsHtml(text)
-    );
+    this.display = this.$sce.trustAsHtml(this.templateSrv.highlightVariablesAsHtml(text));
   }
 
   open() {
-    this.inputElement.css(
-      'width',
-      Math.max(this.linkElement.width(), 80) + 16 + 'px'
-    );
+    this.inputElement.css('width', Math.max(this.linkElement.width(), 80) + 16 + 'px');
 
     this.inputElement.show();
     this.inputElement.focus();

public/app/core/components/grafana_app.ts

@@ -9,15 +9,7 @@ import Drop from 'tether-drop';
 
 export class GrafanaCtrl {
   /** @ngInject */
-  constructor(
-    $scope,
-    alertSrv,
-    utilSrv,
-    $rootScope,
-    $controller,
-    contextSrv,
-    globalEventSrv
-  ) {
+  constructor($scope, alertSrv, utilSrv, $rootScope, $controller, contextSrv, globalEventSrv) {
     $scope.init = function() {
       $scope.contextSrv = contextSrv;
 
@@ -118,12 +110,7 @@ export class GrafanaCtrl {
 }
 
 /** @ngInject */
-export function grafanaAppDirective(
-  playlistSrv,
-  contextSrv,
-  $timeout,
-  $rootScope
-) {
+export function grafanaAppDirective(playlistSrv, contextSrv, $timeout, $rootScope) {
   return {
     restrict: 'E',
     controller: GrafanaCtrl,
@@ -269,10 +256,7 @@ export function grafanaAppDirective(
 
         // hide search
         if (body.find('.search-container').length > 0) {
-          if (
-            target.parents('.search-results-container, .search-field-wrapper')
-              .length === 0
-          ) {
+          if (target.parents('.search-results-container, .search-field-wrapper').length === 0) {
             scope.$apply(function() {
               scope.appEvent('hide-dash-search');
             });
@@ -281,10 +265,7 @@ export function grafanaAppDirective(
 
         // hide popovers
         var popover = elem.find('.popover');
-        if (
-          popover.length > 0 &&
-          target.parents('.graph-legend').length === 0
-        ) {
+        if (popover.length > 0 && target.parents('.graph-legend').length === 0) {
           popover.hide();
         }
       });

public/app/core/components/json_explorer/helpers.ts

@@ -103,11 +103,7 @@ export function cssClass(className: string): string {
   * Creates a new DOM element wiht given type and class
   * TODO: move me to helpers
 */
-export function createElement(
-  type: string,
-  className?: string,
-  content?: Element | string
-): Element {
+export function createElement(type: string, className?: string, content?: Element | string): Element {
   const el = document.createElement(type);
   if (className) {
     el.classList.add(cssClass(className));

public/app/core/components/json_explorer/json_explorer.ts

@@ -1,14 +1,7 @@
 // Based on work https://github.com/mohsen1/json-formatter-js
 // Licence MIT, Copyright (c) 2015 Mohsen Azimi
 
-import {
-  isObject,
-  getObjectName,
-  getType,
-  getValuePreview,
-  cssClass,
-  createElement,
-} from './helpers';
+import { isObject, getObjectName, getType, getValuePreview, cssClass, createElement } from './helpers';
 
 import _ from 'lodash';
 
@@ -112,9 +105,7 @@ export class JsonExplorer {
   private get isDate(): boolean {
     return (
       this.type === 'string' &&
-      (DATE_STRING_REGEX.test(this.json) ||
-        JSON_DATE_REGEX.test(this.json) ||
-        PARTIAL_DATE_REGEX.test(this.json))
+      (DATE_STRING_REGEX.test(this.json) || JSON_DATE_REGEX.test(this.json) || PARTIAL_DATE_REGEX.test(this.json))
     );
   }
 
@@ -151,9 +142,7 @@ export class JsonExplorer {
    * is this an empty object or array?
   */
   private get isEmpty(): boolean {
-    return (
-      this.isEmptyObject || (this.keys && !this.keys.length && this.isArray)
-    );
+    return this.isEmptyObject || (this.keys && !this.keys.length && this.isArray);
   }
 
   /*
@@ -234,11 +223,7 @@ export class JsonExplorer {
   }
 
   isNumberArray() {
-    return (
-      this.json.length > 0 &&
-      this.json.length < 4 &&
-      (_.isNumber(this.json[0]) || _.isNumber(this.json[1]))
-    );
+    return this.json.length > 0 && this.json.length < 4 && (_.isNumber(this.json[0]) || _.isNumber(this.json[1]));
   }
 
   renderArray() {
@@ -249,17 +234,13 @@ export class JsonExplorer {
     if (this.isNumberArray()) {
       this.json.forEach((val, index) => {
         if (index > 0) {
-          arrayWrapperSpan.appendChild(
-            createElement('span', 'array-comma', ',')
-          );
+          arrayWrapperSpan.appendChild(createElement('span', 'array-comma', ','));
         }
         arrayWrapperSpan.appendChild(createElement('span', 'number', val));
       });
       this.skipChildren = true;
     } else {
-      arrayWrapperSpan.appendChild(
-        createElement('span', 'number', this.json.length)
-      );
+      arrayWrapperSpan.appendChild(createElement('span', 'number', this.json.length));
     }
 
     arrayWrapperSpan.appendChild(createElement('span', 'bracket', ']'));
@@ -298,11 +279,7 @@ export class JsonExplorer {
       const objectWrapperSpan = createElement('span');
 
       // get constructor name and append it to wrapper span
-      var constructorName = createElement(
-        'span',
-        'constructor-name',
-        this.constructorName
-      );
+      var constructorName = createElement('span', 'constructor-name', this.constructorName);
       objectWrapperSpan.appendChild(constructorName);
 
       // if it's an array append the array specific elements like brackets and length
@@ -399,12 +376,7 @@ export class JsonExplorer {
       let index = 0;
       const addAChild = () => {
         const key = this.keys[index];
-        const formatter = new JsonExplorer(
-          this.json[key],
-          this.open - 1,
-          this.config,
-          key
-        );
+        const formatter = new JsonExplorer(this.json[key], this.open - 1, this.config, key);
         children.appendChild(formatter.render());
 
         index += 1;
@@ -421,12 +393,7 @@ export class JsonExplorer {
       requestAnimationFrame(addAChild);
     } else {
       this.keys.forEach(key => {
-        const formatter = new JsonExplorer(
-          this.json[key],
-          this.open - 1,
-          this.config,
-          key
-        );
+        const formatter = new JsonExplorer(this.json[key], this.open - 1, this.config, key);
         children.appendChild(formatter.render());
       });
     }
@@ -437,9 +404,7 @@ export class JsonExplorer {
    * Animated option is used when user triggers this via a click
    */
   removeChildren(animated = false) {
-    const childrenElement = this.element.querySelector(
-      `div.${cssClass('children')}`
-    ) as HTMLDivElement;
+    const childrenElement = this.element.querySelector(`div.${cssClass('children')}`) as HTMLDivElement;
 
     if (animated) {
       let childrenRemoved = 0;