first commit

.editorconfig

+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# http://editorconfig.org
+
+root = true
+
+[*]
+# Change these settings to your own preference
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[*.{scss}]
+indent_style = tab
+
+[*.{js,jsx,json,html}]
+indent_style = space
+indent_size = 4
+
+[package.json]
+indent_size = 2
+
+[Makefile]
+indent_style = tab

.eslintrc

+{
+  "extends": "eslint:recommended",
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true,
+      "impliedStrict": true,
+      "modules": true
+    }
+  },
+  "parser": "babel-eslint",
+  "plugins": [
+    "react"
+  ],
+  "env": {
+    "browser": true,
+    "node": true,
+    "jquery": true,
+    "es6": true
+  },
+  "rules": {
+    "comma-dangle": [2, "never"],
+    "array-callback-return": 2,
+    "prefer-rest-params": 2,
+    "no-unmodified-loop-condition": 2,
+    "sort-imports": 0,
+    "no-new-symbol": 2,
+    "no-empty-function": 2,
+    "no-whitespace-before-property": 2,
+    "no-useless-constructor": 2,
+    "id-blacklist": 0,
+    "one-var-declaration-per-line": 0,
+    "no-extra-label": 2,
+    "template-curly-spacing": [2, "never"],
+    "no-self-assign": 2,
+    "newline-per-chained-call": 0,
+    "no-confusing-arrow": 2,
+    "no-case-declarations": 2,
+    "no-cond-assign": [2, "except-parens"],
+    "no-console": 2,
+    "no-constant-condition": 2,
+    "no-debugger": 2,
+    "no-dupe-args": 2,
+    "no-dupe-keys": 2,
+    "no-duplicate-case": 2,
+    "no-empty": 2,
+    "no-empty-pattern": 2,
+    "no-ex-assign": 2,
+    "no-extra-semi": 2,
+    "no-fallthrough": 2,
+    "no-func-assign": 2,
+    "no-inner-declarations": 0,
+    "no-invalid-regexp": 2,
+    "no-irregular-whitespace": 2,
+    "no-unexpected-multiline": 2,
+    "no-unreachable": 2,
+    "no-magic-numbers": [1, { "ignore": [-1, 0, 1, 2], "enforceConst": true, "detectObjects": true } ],
+    "valid-typeof": 2,
+
+    "block-scoped-var": 2,
+    "complexity": [0, 8],
+    "consistent-return": 2,
+    "curly": [2, "all"],
+    "dot-location": [2, "object"],
+    "dot-notation": 2,
+    "eqeqeq": [2, "smart"],
+    "global-require": 2,
+    "guard-for-in": 2,
+    "no-alert": 2,
+    "no-array-constructor": 2,
+    "no-caller": 2,
+    "no-div-regex": 2,
+    "no-else-return": 2,
+    "no-eval": 2,
+    "no-extend-native": 2,
+    "no-extra-bind": 2,
+    "no-floating-decimal": 2,
+    "no-implied-eval": 2,
+    "no-implicit-globals": 0,
+    "no-iterator": 2,
+    "no-labels": 2,
+    "no-lone-blocks": 2,
+    "no-loop-func": 2,
+    "no-multi-spaces": [2, { "exceptions": { "Property": false } }],
+    "no-multi-str": 0,
+    "no-native-reassign": 2,
+    "no-new": 2,
+    "no-new-func": 2,
+    "no-new-object": 2,
+    "no-new-wrappers": 2,
+    "no-octal-escape": 2,
+    "no-param-reassign": 2,
+    "no-process-env": 2,
+    "no-process-exit": 2,
+    "no-proto": 2,
+    "no-redeclare": 2,
+    "no-return-assign": [2, "always"],
+    "no-script-url": 2,
+    "no-self-compare": 2,
+    "no-sequences": 2,
+    "no-throw-literal": 2,
+    "no-undef-init": 2,
+    "no-unused-expressions": 2,
+    "no-useless-concat": 1,
+    "no-void": 2,
+    "no-warning-comments": 1,
+    "no-with": 2,
+    "radix": 2,
+    "vars-on-top": 0,
+    "wrap-iife": [2, "outside"],
+    "yoda": [2, "never", {"exceptRange": false, "onlyEquality": false}],
+
+    "no-undefined": 2,
+    "no-shadow": [2, {"hoist": "functions"}],
+    "no-shadow-restricted-names": 2,
+    "no-unused-vars": [2, {"vars": "all", "args": "after-used"}],
+    "no-use-before-define": [2, "nofunc"],
+
+    // Style
+    "array-bracket-spacing": [2, "never"],
+    "brace-style": [2, "1tbs", { "allowSingleLine": false }],
+    "camelcase": [2, {"properties": "never"}],
+    "comma-spacing": [2, {"before": false, "after": true}],
+    "comma-style": [2, "last"],
+    "computed-property-spacing": [2, "never"],
+    "consistent-this": [2, "self"],
+    "func-names": 2,
+    "func-style": [2, "declaration"],
+    "indent": [2, 4, {"SwitchCase": 0}],
+    "jsx-quotes": [2, "prefer-single"],
+    "key-spacing": [2, {"beforeColon": false, "afterColon": true}],
+    "linebreak-style": 2,
+    "lines-around-comment": [2, { "beforeBlockComment": true, "beforeLineComment": true, "allowBlockStart": true, "allowBlockEnd": true }],
+    "new-cap": 2,
+    "new-parens": 2,
+    "no-lonely-if": 2,
+    "no-mixed-spaces-and-tabs": 2,
+    "no-multiple-empty-lines": [2, {"max": 1}],
+    "no-negated-condition": 2,
+    "no-nested-ternary": 2,
+    "no-spaced-func": 2,
+    "no-ternary": 0,
+    "no-trailing-spaces": [2, { "skipBlankLines": false }],
+    "no-underscore-dangle": 2,
+    "no-unneeded-ternary": [2, {"defaultAssignment": false}],
+    "object-curly-spacing": [2, "never"],
+    "one-var": [2, "never"],
+    "operator-linebreak": [2, "after"],
+    "padded-blocks": [2, "never"],
+    "quote-props": [2, "as-needed"],
+    "quotes": [2, "single", "avoid-escape"],
+    "semi": [2, "always"],
+    "semi-spacing": [2, {"before": false, "after": true}],
+    "keyword-spacing": [2, {"before": true, "after": true, "overrides": {}}],
+    "space-before-blocks": [2, "always"],
+    "space-before-function-paren": [2, "never"],
+    "space-in-parens": [2, "never"],
+    "space-infix-ops": 2,
+    "space-unary-ops": [2, { "words": true, "nonwords": false }],
+    "wrap-regex": 2,
+
+    // ES6 stuff
+    "arrow-parens": [2, "always"],
+    "arrow-body-style": 0,
+    "arrow-spacing": [2, { "before": true, "after": true }],
+    "constructor-super": 2,
+    "generator-star-spacing": [2, {"before": false, "after": true}],
+    "no-class-assign": 2,
+    "no-const-assign": 2,
+    "no-dupe-class-members": 2,
+    "no-this-before-super": 2,
+    "no-var": 0,
+    "object-shorthand": [1, "always"],
+    "prefer-arrow-callback": 1,
+    "prefer-const": 1,
+    "prefer-spread": 2,
+    "prefer-reflect": 1,
+    "prefer-template": 0,
+    "require-yield": 2,
+
+    // React Specific
+    "react/display-name": [2, { "ignoreTranspilerName": false }],
+    "react/no-deprecated": 2,
+    "react/no-is-mounted": 2,
+    "react/no-string-refs": 0,
+    "react/jsx-pascal-case": 2,
+    "react/jsx-indent": [1, 4],
+    "react/jsx-equals-spacing": [2, "never"],
+    "react/jsx-handler-names": 0,
+    "react/jsx-boolean-value": [2, "always"],
+    "react/jsx-closing-bracket-location": [2, { "location": "tag-aligned" }],
+    "react/jsx-curly-spacing": [2, "never"],
+    "react/jsx-indent-props": [2, 4],
+    "react/jsx-key": 2,
+    "react/jsx-max-props-per-line": [2, { "maximum": 1 }],
+    "react/jsx-no-bind": 1,
+    "react/jsx-space-before-closing": [2, "never"],
+    "react/jsx-no-duplicate-props": [2, { "ignoreCase": false }],
+    "react/jsx-no-literals": 1,
+    "react/jsx-no-undef": 2,
+    "react/jsx-uses-react": 2,
+    "react/jsx-uses-vars": 2,
+    "react/no-danger": 0,
+    "react/no-did-mount-set-state": 2,
+    "react/no-did-update-set-state": 2,
+    "react/no-direct-mutation-state": 2,
+    "react/no-multi-comp": [2, { "ignoreStateless": true }],
+    "react/no-set-state": 0,
+    "react/no-unknown-property": 2,
+    "react/prefer-es6-class": 2,
+    "react/prop-types": 2,
+    "react/self-closing-comp": 2,
+    "react/sort-comp": 0,
+    "react/wrap-multilines": 2
+  }
+}

.gitattributes

+# Automatically normalize line endings for all text-based files
+# http://git-scm.com/docs/gitattributes#_end_of_line_conversion
+* text=auto
+
+# For the following file types, normalize line endings to LF on
+# checkin and prevent conversion to CRLF when they are checked out
+# (this is required in order to prevent newline related issues like,
+# for example, after the build script is run)
+.*      text eol=lf
+*.css   text eol=lf
+*.html  text eol=lf
+*.jade  text eol=lf
+*.js    text eol=lf
+*.jsx    text eol=lf
+*.json  text eol=lf
+*.less  text eol=lf
+*.scss  text eol=lf
+*.md    text eol=lf
+*.sh    text eol=lf
+*.txt   text eol=lf
+*.xml   text eol=lf

.gitignore

+# Include your project-specific ignores in this file
+# Read about how to use .gitignore: https://help.github.com/articles/ignoring-files
+
+dist
+node_modules
+.npminstall
+ncp-debug.log
+npm-debug.log
+
+### OSX template
+.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+### SublimeText template
+# cache files for sublime text
+*.tmlanguage.cache
+*.tmPreferences.cache
+*.stTheme.cache
+
+# workspace files are user-specific
+*.sublime-workspace
+
+# project files should be checked into the repository, unless a significant
+# proportion of contributors will probably not be using SublimeText
+# *.sublime-project
+
+# sftp configuration file
+sftp-config.json
+
+### JetBrains template
+# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm
+# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
+
+.idea

.scss-lint.yml

+# sass-lint config generated by make-sass-lint-config v0.1.1
+#
+# The following scss-lint Linters are not yet supported by sass-lint:
+# DisableLinterReason, ElsePlacement, PropertyCount, SelectorDepth
+# SpaceAroundOperator, TrailingWhitespace, UnnecessaryParentReference, Compass::*
+#
+# The following settings/values are unsupported by sass-lint:
+# Linter Indentation, option "allow_non_nested_indentation"
+# Linter Indentation, option "character"
+# Linter NestingDepth, option "ignore_parent_selectors"
+# Linter PropertySortOrder, option "min_properties"
+# Linter PropertySortOrder, option "separate_groups"
+# Linter SpaceBeforeBrace, option "allow_single_line_padding"
+# Linter VendorPrefix, option "identifier_list"
+
+files:
+  include: '**/*.scss'
+options:
+  formatter: stylish
+  merge-default-rules: false
+rules:
+  bem-depth:
+    - 1
+    - max-depth: 3
+  border-zero:
+    - 1
+    - convention: none
+  brace-style:
+    - 2
+    - allow-single-line: true
+  class-name-format:
+    - 1
+    - convention: hyphenatedbem
+  clean-import-paths:
+    - 1
+    - filename-extension: false
+      leading-underscore: false
+  empty-line-between-blocks:
+    - 2
+    - ignore-single-line-rulesets: true
+  extends-before-declarations: 1
+  extends-before-mixins: 1
+  final-newline:
+    - 1
+    - include: true
+  force-attribute-nesting: 1
+  force-element-nesting: 1
+  force-pseudo-nesting: 1
+  function-name-format:
+    - 1
+    - allow-leading-underscore: true
+      convention: hyphenatedlowercase
+  hex-length:
+    - 1
+    - style: short
+  hex-notation:
+    - 1
+    - style: lowercase
+  id-name-format:
+    - 1
+    - convention: hyphenatedbem
+  indentation:
+    - 2
+    - size: 4
+  leading-zero:
+    - 1
+    - include: false
+  mixin-name-format:
+    - 0
+    - allow-leading-underscore: true
+      convention: hyphenatedlowercase
+  mixins-before-declarations: 1
+  nesting-depth:
+    - 1
+    - max-depth: 4
+  no-color-keyword: 1
+  no-color-literals: 1
+  no-css-comments: 1
+  no-debug: 1
+  no-duplicate-properties: 1
+  no-empty-rulesets: 1
+  no-extends: 0
+  no-ids: 1
+  no-important: 1
+  no-invalid-hex: 1
+  no-mergeable-selectors: 1
+  no-misspelled-properties:
+    - 1
+    - extra-properties: ['overflow-scrolling', 'font-smoothing']
+  no-qualifying-elements:
+    - 1
+    - allow-element-with-attribute: false
+      allow-element-with-class: false
+      allow-element-with-id: false
+  no-trailing-zero: 1
+  no-transition-all: 0
+  no-url-protocols: 1
+  no-vendor-prefixes:
+    - 1
+    - additional-identifiers: []
+      excluded-identifiers: []
+  placeholder-in-extend: 1
+  placeholder-name-format:
+    - 1
+    - convention: hyphenatedlowercase
+  property-sort-order:
+    - 1
+    - ignore-custom-properties: false
+  property-units:
+    - 1
+    - global:
+        - ch
+        - em
+        - ex
+        - rem
+        - cm
+        - in
+        - mm
+        - pc
+        - pt
+        - px
+        - q
+        - vh
+        - vw
+        - vmin
+        - vmax
+        - deg
+        - grad
+        - rad
+        - turn
+        - ms
+        - s
+        - Hz
+        - kHz
+        - dpi
+        - dpcm
+        - dppx
+        - '%'
+      per-property: {}
+  quotes:
+    - 1
+    - style: single
+  shorthand-values:
+    - 1
+    - allowed-shorthands:
+        - 1
+        - 2
+        - 3
+  single-line-per-selector: 2
+  space-after-bang:
+    - 2
+    - include: false
+  space-after-colon:
+    - 2
+    - include: true
+  space-after-comma:
+    - 1
+    - include: true
+  space-before-bang:
+    - 2
+    - include: true
+  space-before-brace:
+    - 2
+    - include: true
+  space-before-colon: 1
+  space-between-parens:
+    - 2
+    - include: false
+  trailing-semicolon: 2
+  url-quotes: 1
+  variable-for-property:
+    - 0
+    - properties: []
+  variable-name-format:
+    - 1
+    - allow-leading-underscore: true
+      convention: hyphenatedlowercase
+  zero-unit: 1

Makefile

+.PHONY: build test run run-fullmap clean stop nuke
+
+test:
+	@echo Checking for style guide compliance
+
+	@npm run check
+
+.npminstall: package.json
+	@echo Getting dependencies using npm
+
+	@npm install
+
+	@touch $@
+
+build: | .npminstall test
+	@echo Building ZBox Manager Webapp
+
+	@npm run build
+
+run: .npminstall
+	@echo Running ZBox Manager Webapp for development
+
+	@npm run run &
+
+run-fullmap: .npminstall
+	@echo FULL SOURCE MAP Running ZBox Manager Webapp for development FULL SOURCE MAP
+
+	@npm run run-fullmap &
+
+stop:
+	@echo Stopping changes watching
+
+	@for PROCID in $$(ps -ef | grep "[n]ode.*[w]ebpack" | awk '{ print $$2 }'); do \
+		echo stopping webpack watch $$PROCID; \
+		kill $$PROCID; \
+	done
+
+clean:
+	@echo Cleaning Webapp
+
+	@rm -rf dist
+	@rm -f .npminstall
+
+nuke:
+	@rm -rf node_modules

package.json

+{
+  "name": "manager",
+  "version": "0.0.1",
+  "private": true,
+  "dependencies": {
+    "bootstrap": "3.3.6",
+    "compass-mixins": "0.12.7",
+    "flux": "2.1.1",
+    "font-awesome": "4.5.0",
+    "jasny-bootstrap": "3.1.3",
+    "jquery": "2.2.1",
+    "keymirror": "0.1.1",
+    "object-assign": "4.0.1",
+    "perfect-scrollbar": "0.6.10",
+    "react": "0.14.7",
+    "react-bootstrap": "0.28.3",
+    "react-dom": "0.14.7",
+    "react-router": "2.0.1",
+    "react-textarea-autosize": "3.3.0"
+  },
+  "devDependencies": {
+    "babel-eslint": "5.0.0",
+    "babel-loader": "6.2.4",
+    "babel-plugin-transform-runtime": "6.6.0",
+    "babel-polyfill": "6.7.2",
+    "babel-preset-es2015-webpack": "6.4.0",
+    "babel-preset-react": "6.5.0",
+    "babel-preset-stage-0": "6.5.0",
+    "copy-webpack-plugin": "1.1.1",
+    "css-loader": "0.23.1",
+    "eslint": "2.2.0",
+    "eslint-plugin-react": "4.0.0",
+    "exports-loader": "0.6.3",
+    "extract-text-webpack-plugin": "1.0.1",
+    "file-loader": "0.8.5",
+    "html-loader": "0.4.3",
+    "imports-loader": "0.6.5",
+    "js-zimbra": "ZBoxApp/js-zimbra#master",
+    "json-loader": "0.5.4",
+    "node-sass": "3.4.2",
+    "raw-loader": "0.5.1",
+    "sass-loader": "3.2.0",
+    "style-loader": "0.13.0",
+    "url-loader": "0.5.7",
+    "webpack": "webpack/webpack#master"
+  },
+  "scripts": {
+    "check": "eslint --ext \".jsx\" --ignore-pattern node_modules --quiet .",
+    "build": "webpack",
+    "run": "webpack --progress --watch",
+    "run-fullmap": "webpack --progress --watch"
+  }
+}

src/config/manifest.json

+{
+    "name": "ZBox Manager",
+    "icons": [{
+        "src": "/static/images/favicon/android-chrome-36x36.png",
+        "type": "image/png",
+        "sizes": "36x36"
+    }, {
+        "src": "/static/images/favicon/android-chrome-48x48.png",
+        "type": "image/png",
+        "sizes": "48x48"
+    }, {
+        "src": "/static/images/favicon/android-chrome-72x72.png",
+        "type": "image/png",
+        "sizes": "72x72"
+    }, {
+        "src": "/static/images/favicon/android-chrome-96x96.png",
+        "type": "image/png",
+        "sizes": "96x96"
+    }, {
+        "src": "/static/images/favicon/android-chrome-144x144.png",
+        "type": "image/png",
+        "sizes": "144x144"
+    }, {
+        "src": "/static/images/favicon/android-chrome-192x192.png",
+        "type": "image/png",
+        "sizes": "192x192"
+    }, {
+        "src": "/static/images/favicon/android-chrome-256x256.png",
+        "type": "image/png",
+        "sizes": "256x256"
+    }, {
+        "src": "/static/images/favicon/android-chrome-384x384.png",
+        "type": "image/png",
+        "sizes": "384x384"
+    }, {
+        "src": "/static/images/favicon/android-chrome-512x512.png",
+        "type": "image/png",
+        "sizes": "512x512"
+    }]
+}

src/dispatcher/app_dispatcher.jsx

+// Copyright (c) 2016 ZBox, Spa. All Rights Reserved.
+// See License.txt for license information.
+
+import * as Flux from 'flux';
+
+import Constants from 'utils/constants.jsx';
+const PayloadSources = Constants.PayloadSources;
+
+const AppDispatcher = Object.assign(new Flux.Dispatcher(), {
+    handleServerAction: function performServerAction(action) {
+        if (!action.type) {
+            console.warning('handleServerAction called with undefined action type'); // eslint-disable-line no-console
+        }
+
+        var payload = {
+            source: PayloadSources.SERVER_ACTION,
+            action
+        };
+        this.dispatch(payload);
+    },
+
+    handleViewAction: function performViewAction(action) {
+        if (!action.type) {
+            console.warning('handleViewAction called with undefined action type'); // eslint-disable-line no-console
+        }
+
+        var payload = {
+            source: PayloadSources.VIEW_ACTION,
+            action
+        };
+        this.dispatch(payload);
+    }
+});
+
+module.exports = AppDispatcher;

src/index.html

+<!DOCTYPE html>
+<html>
+<head>
+    <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1'>
+    <meta name='robots' content='noindex, nofollow'>
+    <meta name='referrer' content='no-referrer'>
+
+    <title>ZBox Manager</title>
+
+    <!-- iOS add to homescreen -->
+    <meta name='apple-mobile-web-app-capable' content='yes'>
+    <meta name='apple-mobile-web-app-status-bar-style' content='default'>
+    <meta name='mobile-web-app-capable' content='yes'>
+    <meta name='apple-mobile-web-app-title' content='ZBox Manager'>
+    <meta name='application-name' content='ZBox Manager'>
+    <meta name='format-detection' content='telephone=no'>
+    <link rel='apple-touch-icon' sizes='57x57' href='images/favicon/apple-touch-icon-57x57.png'>
+    <link rel='apple-touch-icon' sizes='60x60' href='images/favicon/apple-touch-icon-60x60.png'>
+    <link rel='apple-touch-icon' sizes='72x72' href='images/favicon/apple-touch-icon-72x72.png'>
+    <link rel='apple-touch-icon' sizes='76x76' href='images/favicon/apple-touch-icon-76x76.png'>
+    <link rel='apple-touch-icon' sizes='144x144' href='images/favicon/apple-touch-icon-144x144.png'>
+    <link rel='apple-touch-icon' sizes='120x120' href='images/favicon/apple-touch-icon-120x120.png'>
+    <link rel='apple-touch-icon' sizes='152x152' href='images/favicon/apple-touch-icon-152x152.png'>
+    <!-- iOS add to homescreen -->
+
+    <!-- Android add to homescreen -->
+    <link rel='icon' type='image/png' sizes='16x16' href='images/favicon/favicon-16x16.png'>
+    <link rel='icon' type='image/png' sizes='32x32' href='images/favicon/favicon-32x32.png'>
+    <link rel='icon' type='image/png' sizes='96x96' href='images/favicon/favicon-96x96.png'>
+    <link rel='icon' type='image/png' sizes='192x192' href='images/favicon/android-chrome-192x192.png'>
+    <link rel='manifest' href='config/manifest.json'>
+    <!-- Android add to homescreen -->
+
+    <!-- CSS Should always go first -->
+    <link rel='stylesheet' class='code_theme'>
+    <!--<link rel='stylesheet' href='/static/css/styles.css'>-->
+    <style id='antiClickjack'>body{display:none !important;}</style>
+
+    <script src='bundle.js'></script>
+
+    <script type='text/javascript'>
+        if (self === top) {
+            var blocker = document.getElementById('antiClickjack');
+            blocker.parentNode.removeChild(blocker);
+        }
+    </script>
+</head>
+<body>
+<div id='root'/>
+<script>
+    window.setup_root();
+</script>
+</body>
+</html>

src/index.jsx

+// Copyright (c) 2016 ZBox, Spa. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import './sass/styles.scss';
+
+global.window.setup_root = () => {
+    // Do the pre-render setup and call renderRootComponent when done
+    // preRenderSetup(renderRootComponent);
+};

src/sass/base/_module.scss

+// Only for combining all the files in this folder
+@import 'typography';
+@import 'structure';

src/sass/base/_structure.scss

+@charset 'UTF-8';
+
+html,
+body {
+    height: 100%;
+}
+
+body {
+    background: $bg--gray;
+    height: 100%;
+    position: relative;
+    width: 100%;
+}
+
+.sticky {
+    background: $white;
+
+    > .container-fluid {
+        overflow: auto;
+    }
+
+    .inner-wrap {
+        > .row {
+            &.content {
+                margin-bottom: -89px;
+                min-height: 100%;
+            }
+        }
+    }
+}
+
+.inner-wrap {
+    height: 100%;
+
+    > .row {
+        &.main {
+            height: 100%;
+            position: relative;
+        }
+    }
+}
+
+.container-fluid {
+    @include legacy-pie-clearfix;
+    height: 100%;
+    position: relative;
+}
+
+.channel-view {
+    @include clearfix;
+    height: 100%;
+    position: relative;
+}
+
+img {
+    max-width: 100%;
+
+    &.rounded {
+        @include border-radius(100%);
+    }
+}

src/sass/base/_typography.scss

+@charset 'UTF-8';
+
+b,
+strong {
+    font-weight: 600;
+}
+
+a {
+    color: $primary-color;
+    cursor: pointer;
+    text-decoration: none;
+    word-break: break-word;
+
+    &:focus,
+    &:hover {
+        color: $primary-color--hover;
+    }
+}
+
+body {
+    @include font-smoothing;
+    font-family: 'Open Sans', sans-serif;
+}
+
+.word-break--all {
+    word-break: break-all;
+}

src/sass/styles.scss

+@charset 'UTF-8';
+
+@import 'compass/utilities';
+@import 'compass/css3';
+
+// Dependancies
+@import '~bootstrap/dist/css/bootstrap.css';
+@import '~jasny-bootstrap/dist/css/jasny-bootstrap.css';
+@import '~perfect-scrollbar/dist/css/perfect-scrollbar.css';
+@import '~font-awesome/css/font-awesome.css';
+
+// styles.scss
+@import 'utils/module';
+@import 'base/module';

src/sass/utils/_animations.scss

+@charset 'UTF-8';
+
+@keyframes spin {
+    from {
+        transform: scale(1) rotate(0deg);
+    }
+
+    to {
+        transform: scale(1) rotate(360deg);
+    }
+}
+
+@keyframes highlight {
+    from {
+        @include alpha-property(background, $yellow, .5);
+    }
+
+    to {
+        background: none;
+    }
+}

src/sass/utils/_functions.scss

+@charset "UTF-8";
+
+@function em($pixels, $context: 14px) {
+	@return #{$pixels/$context}em
+}
+
+@function alpha-color($color, $amount) {
+    @return rgba($color, $amount)
+}
+
+%popover-box-shadow {
+    @include box-shadow(rgba(black, .175) 1px -3px 12px);
+}
+
+%font-awesome {
+    display: inline-block;
+    font: normal normal normal 14px/1 FontAwesome;
+    font-size: inherit;
+    text-rendering: auto;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    transform: translate(0, 0);
+}
\ No newline at end of file

src/sass/utils/_mixins.scss

+@charset 'UTF-8';
+
+@mixin file-icon($path) {
+    @include background-size(60px auto);
+    background-color: $white;
+    background-image: url($path);
+    background-position: center;
+    background-repeat: no-repeat;
+}
+
+@mixin alpha-property($property, $color, $opacity) {
+    #{$property}: rgba($color, $opacity);
+}
+
+@mixin font-smoothing($value: antialiased) {
+    @if $value == antialiased {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+    }
+    @else {
+        -webkit-font-smoothing: subpixel-antialiased;
+        -moz-osx-font-smoothing: auto;
+    }
+}
+
+@mixin cursor($value) {
+    cursor: -webkit-$value;
+    cursor: zoom-$value;
+}
\ No newline at end of file

src/sass/utils/_module.scss

+// Only for combining all the files in this folder
+@import 'variables';
+@import 'functions';
+@import 'mixins';
+@import 'animations';

src/sass/utils/_variables.scss

+@charset 'UTF-8';
+
+// Color Variables
+$primary-color: rgb(35, 137, 215);
+$primary-color--hover: darken($primary-color, 10%);
+$bg--gray: rgb(245, 245, 245);
+$white: rgb(255, 255, 255);
+$black: rgb(0, 0, 0);
+$red: rgb(229, 101, 101);
+$yellow: rgb(255, 255, 0);
+$light-gray: rgba(0, 0, 0, .15);
+$gray: rgba(0, 0, 0, .3);
+$dark-gray: rgba(0, 0, 0, .5);
+
+// Page Variables
+$border-gray: 1px solid #ddd;
+
+// Random variables
+$border-rad: 1px;

src/utils/constants.jsx.js

+// Copyright (c) 2016 ZBox, Spa. All Rights Reserved.
+// See License.txt for license information.
+
+import keyMirror from 'keymirror';
+
+export default {
+    ActionTypes: keyMirror({
+        RECEIVED_ERROR: null
+    }),
+
+    PayloadSources: keyMirror({
+        SERVER_ACTION: null,
+        VIEW_ACTION: null
+    }),
+
+    RESERVED_TEAM_NAMES: [
+        'www',
+        'web',
+        'admin',
+        'support',
+        'notify',
+        'test',
+        'demo',
+        'mail',
+        'team',
+        'channel',
+        'internal',
+        'localhost',
+        'dockerhost',
+        'stag',
+        'post',
+        'cluster',
+        'api'
+    ],
+    RESERVED_USERNAMES: [
+        'admin',
+        'root'
+    ],
+    MONTHS: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Juio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
+    KeyCodes: {
+        UP: 38,
+        DOWN: 40,
+        LEFT: 37,
+        RIGHT: 39,
+        BACKSPACE: 8,
+        ENTER: 13,
+        ESCAPE: 27,
+        SPACE: 32,
+        TAB: 9
+    }
+};

webpack.config.js

+const webpack = require('webpack');
+const path = require('path');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+const htmlExtract = new ExtractTextPlugin('html', 'index.html');
+
+const NPM_TARGET = process.env.npm_lifecycle_event; //eslint-disable-line no-process-env
+
+var DEV = false;
+var FULLMAP = false;
+if (NPM_TARGET === 'run' || NPM_TARGET === 'run-fullmap') {
+    DEV = true;
+    if (NPM_TARGET === 'run-fullmap') {
+        FULLMAP = true;
+    }
+}
+
+var config = {
+    entry: ['babel-polyfill', './src/index.jsx', 'src/index.html'],
+    output: {
+        path: 'dist',
+        publicPath: '/',
+        filename: 'bundle.js'
+    },
+    module: {
+        loaders: [
+            {
+                test: /\.jsx?$/,
+                loader: 'babel',
+                exclude: /(node_modules)/,
+                query: {
+                    presets: ['react', 'es2015-webpack', 'stage-0'],
+                    plugins: ['transform-runtime'],
+                    cacheDirectory: DEV
+                }
+            },
+            {
+                test: /\.json$/,
+                loader: 'json'
+            },
+            {
+                test: /(node_modules)\/.+\.(js|jsx)$/,
+                loader: 'imports',
+                query: {
+                    $: 'jquery',
+                    jQuery: 'jquery'
+                }
+            },
+            {
+                test: /\.scss$/,
+                loaders: ['style', 'css', 'sass']
+            },
+            {
+                test: /\.css$/,
+                loaders: ['style', 'css']
+            },
+            {
+                test: /\.(png|eot|tiff|svg|woff2|woff|ttf|gif|mp3|jpg)$/,
+                loader: 'file',
+                query: {
+                    name: 'files/[hash].[ext]'
+                }
+            },
+            {
+                test: /\.html$/,
+                loader: htmlExtract.extract('html?attrs=link:href')
+            }
+        ]
+    },
+    sassLoader: {
+        includePaths: ['node_modules/compass-mixins/lib']
+    },
+    plugins: [
+        new CopyWebpackPlugin([
+            {from: 'src/config', to: 'config'}
+        ]),
+        new webpack.ProvidePlugin({
+            'window.jQuery': 'jquery'
+        }),
+        htmlExtract,
+        new webpack.LoaderOptionsPlugin({
+            minimize: !DEV,
+            debug: false
+        })
+    ],
+    resolve: {
+        alias: {
+            jquery: 'jquery/dist/jquery'
+        },
+        modules: [
+            'node_modules',
+            path.resolve(__dirname)
+        ]
+    }
+};
+
+// Development mode configuration
+if (DEV) {
+    if (FULLMAP) {
+        config.devtool = 'source-map';
+    } else {
+        config.devtool = 'eval-cheap-module-source-map';
+    }
+}
+
+// Production mode configuration
+if (!DEV) {
+    config.devtool = 'source-map';
+    config.plugins.push(
+        new webpack.optimize.UglifyJsPlugin({
+            'screw-ie8': true,
+            mangle: {
+                toplevel: false
+            },
+            compress: {
+                warnings: false
+            },
+            comments: false
+        })
+    );
+    config.plugins.push(
+        new webpack.optimize.AggressiveMergingPlugin()
+    );
+    config.plugins.push(
+        new webpack.optimize.OccurrenceOrderPlugin(true)
+    );
+    config.plugins.push(
+        new webpack.optimize.DedupePlugin()
+    );
+}
+
+module.exports = config;