\n ![](https://redash.io/assets/images/logo.png "\\"Redash\\""){kind=logo}
\n
![](\"https://raw.githubusercontent.com/getredash/website/8e820cd02c73a8ddf4f946a9d293c54fd3fb08b9/website/_assets/images/redash-anim.gif\")
\n\n## Getting Started\n\n* [Setting up a Redash instance](https://redash.io/help/open-source/setup) (includes links to ready-made AWS/GCE images).\n* [Documentation](https://redash.io/help/).\n\n## Supported Data Sources\n\nRedash supports more than 35 SQL and NoSQL [data sources](https://redash.io/help/data-sources/supported-data-sources). It can also be extended to support more. Below is a list of built-in sources:\n\n- Amazon Athena\n- Amazon CloudWatch / Insights\n- Amazon DynamoDB\n- Amazon Redshift\n- ArangoDB\n- Axibase Time Series Database\n- Apache Cassandra\n- ClickHouse\n- CockroachDB\n- Couchbase\n- CSV\n- Databricks\n- DB2 by IBM\n- Dgraph\n- Apache Drill\n- Apache Druid\n- e6data\n- Eccenca Corporate Memory\n- Elasticsearch\n- Exasol\n- Microsoft Excel\n- Firebolt\n- Databend\n- Google Analytics\n- Google BigQuery\n- Google Spreadsheets\n- Graphite\n- Greenplum\n- Apache Hive\n- Apache Impala\n- InfluxDB\n- InfluxDBv2\n- IBM Netezza Performance Server\n- JIRA (JQL)\n- JSON\n- Apache Kylin\n- OmniSciDB (Formerly MapD)\n- MariaDB\n- MemSQL\n- Microsoft Azure Data Warehouse / Synapse\n- Microsoft Azure SQL Database\n- Microsoft Azure Data Explorer / Kusto\n- Microsoft SQL Server\n- MongoDB\n- MySQL\n- Oracle\n- Apache Phoenix\n- Apache Pinot\n- PostgreSQL\n- Presto\n- Prometheus\n- Python\n- Qubole\n- Rockset\n- RisingWave\n- Salesforce\n- ScyllaDB\n- Shell Scripts\n- Snowflake\n- SPARQL\n- SQLite\n- TiDB\n- Tinybird\n- TreasureData\n- Trino\n- Uptycs\n- Vertica\n- Yandex AppMetrica\n- Yandex Metrica\n\n## Getting Help\n\n* Issues: https://github.com/getredash/redash/issues\n* Discussion Forum: https://github.com/getredash/redash/discussions/\n* Development Discussion: https://discord.gg/tN5MdmfGBp\n\n## Reporting Bugs and Contributing Code\n\n* Want to report a bug or request a feature? Please open [an issue](https://github.com/getredash/redash/issues/new).\n* Want to help us build **_Redash_**? Fork the project, edit in a [dev environment](https://github.com/getredash/redash/wiki/Local-development-setup) and make a pull request. We need all the help we can get!\n\n## Security\n\nPlease email security@redash.io to report any security vulnerabilities. We will acknowledge receipt of your vulnerability and strive to send you regular updates about our progress. If you're curious about the status of your disclosure please feel free to email us again. If you want to encrypt your disclosure email, you can use [this PGP key](https://keybase.io/arikfr/key.asc).\n\n## License\n\nBSD-2-Clause.\n"
},
{
"path": "SECURITY.md",
"content": "# Security Policy\n\n## Reporting a Vulnerability\n\nPlease email security@redash.io to report any security vulnerabilities. We will acknowledge receipt of your vulnerability and strive to send you regular updates about our progress. If you're curious about the status of your disclosure please feel free to email us again. If you want to encrypt your disclosure email, you can use [this PGP key](https://keybase.io/arikfr/key.asc).\n"
},
{
"path": "bin/docker-entrypoint",
"content": "#!/bin/bash\nset -e\n\nscheduler() {\n echo \"Starting RQ scheduler...\"\n\n exec /app/manage.py rq scheduler\n}\n\ndev_scheduler() {\n echo \"Starting dev RQ scheduler...\"\n\n exec watchmedo auto-restart --directory=./redash/ --pattern=*.py --recursive -- ./manage.py rq scheduler\n}\n\nworker() {\n echo \"Starting RQ worker...\"\n\n export WORKERS_COUNT=${WORKERS_COUNT:-2}\n export QUEUES=${QUEUES:-}\n\n exec supervisord -c worker.conf\n}\n\nworkers_healthcheck() {\n WORKERS_COUNT=${WORKERS_COUNT}\n echo \"Checking active workers count against $WORKERS_COUNT...\"\n ACTIVE_WORKERS_COUNT=`echo $(rq info --url $REDASH_REDIS_URL -R | grep workers | grep -oP ^[0-9]+)`\n if [ \"$ACTIVE_WORKERS_COUNT\" -lt \"$WORKERS_COUNT\" ]; then\n echo \"$ACTIVE_WORKERS_COUNT workers are active, Exiting\"\n exit 1\n else\n echo \"$ACTIVE_WORKERS_COUNT workers are active\"\n exit 0\n fi\n}\n\ndev_worker() {\n echo \"Starting dev RQ worker...\"\n\n exec watchmedo auto-restart --directory=./redash/ --pattern=*.py --recursive -- ./manage.py rq worker $QUEUES\n}\n\nserver() {\n # Recycle gunicorn workers every n-th request. See http://docs.gunicorn.org/en/stable/settings.html#max-requests for more details.\n MAX_REQUESTS=${MAX_REQUESTS:-1000}\n MAX_REQUESTS_JITTER=${MAX_REQUESTS_JITTER:-100}\n TIMEOUT=${REDASH_GUNICORN_TIMEOUT:-60}\n BIND_ADDRESS=${REDASH_GUNICORN_BIND:-[::]:5000}\n exec /usr/local/bin/gunicorn -b \"$BIND_ADDRESS\" --name redash -w${REDASH_WEB_WORKERS:-4} redash.wsgi:app --max-requests $MAX_REQUESTS --max-requests-jitter $MAX_REQUESTS_JITTER --timeout $TIMEOUT --limit-request-line ${REDASH_GUNICORN_LIMIT_REQUEST_LINE:-0}\n}\n\ncreate_db() {\n exec /app/manage.py database create_tables\n}\n\nhelp() {\n echo \"Redash Docker.\"\n echo \"\"\n echo \"Usage:\"\n echo \"\"\n\n echo \"server -- start Redash server (with gunicorn)\"\n echo \"worker -- start a single RQ worker\"\n echo \"dev_worker -- start a single RQ worker with code reloading\"\n echo \"scheduler -- start an rq-scheduler instance\"\n echo \"dev_scheduler -- start an rq-scheduler instance with code reloading\"\n echo \"\"\n echo \"shell -- open shell\"\n echo \"dev_server -- start Flask development server with debugger and auto reload\"\n echo \"debug -- start Flask development server with remote debugger via debugpy\"\n echo \"create_db -- create database tables\"\n echo \"manage -- CLI to manage redash\"\n echo \"tests -- run tests\"\n}\n\ntests() {\n export REDASH_DATABASE_URL=\"postgresql://postgres@postgres/tests\"\n\n if [ $# -eq 0 ]; then\n TEST_ARGS=tests/\n else\n TEST_ARGS=$@\n fi\n exec pytest $TEST_ARGS\n}\n\ncase \"$1\" in\n worker)\n shift\n worker\n ;;\n workers_healthcheck)\n shift\n workers_healthcheck\n ;;\n server)\n shift\n server\n ;;\n scheduler)\n shift\n scheduler\n ;;\n dev_scheduler)\n shift\n dev_scheduler\n ;;\n dev_worker)\n shift\n dev_worker\n ;;\n celery_healthcheck)\n shift\n echo \"DEPRECATED: Celery has been replaced with RQ and now performs healthchecks autonomously as part of the 'worker' entrypoint.\"\n ;;\n dev_server)\n export FLASK_DEBUG=1\n exec /app/manage.py runserver --debugger --reload -h 0.0.0.0\n ;;\n debug)\n export FLASK_DEBUG=1\n export REMOTE_DEBUG=1\n exec /app/manage.py runserver --debugger --no-reload -h 0.0.0.0\n ;;\n shell)\n exec /app/manage.py shell\n ;;\n create_db)\n create_db\n ;;\n manage)\n shift\n exec /app/manage.py $*\n ;;\n tests)\n shift\n tests $@\n ;;\n help)\n shift\n help\n ;;\n *)\n exec \"$@\"\n ;;\nesac\n"
},
{
"path": "bin/get_changes.py",
"content": "#!/bin/env python3\n\nimport re\nimport subprocess\nimport sys\n\n\ndef get_change_log(previous_sha):\n args = [\n \"git\",\n \"--no-pager\",\n \"log\",\n \"--merges\",\n \"--grep\",\n \"Merge pull request\",\n '--pretty=format:\"%h|%s|%b|%p\"',\n \"master...{}\".format(previous_sha),\n ]\n log = subprocess.check_output(args)\n changes = []\n\n for line in log.split(\"\\n\"):\n try:\n sha, subject, body, parents = line[1:-1].split(\"|\")\n except ValueError:\n continue\n\n try:\n pull_request = re.match(r\"Merge pull request #(\\d+)\", subject).groups()[0]\n pull_request = \" #{}\".format(pull_request)\n except Exception:\n pull_request = \"\"\n\n author = subprocess.check_output([\"git\", \"log\", \"-1\", '--pretty=format:\"%an\"', parents.split(\" \")[-1]])[1:-1]\n\n changes.append(\"{}{}: {} ({})\".format(sha, pull_request, body.strip(), author))\n\n return changes\n\n\nif __name__ == \"__main__\":\n previous_sha = sys.argv[1]\n changes = get_change_log(previous_sha)\n\n for change in changes:\n print(change)\n"
},
{
"path": "bin/release_manager.py",
"content": "#!/usr/bin/env python3\nimport os\nimport re\nimport subprocess\nimport sys\nfrom urllib.parse import urlparse\n\nimport requests\nimport simplejson\n\ngithub_token = os.environ[\"GITHUB_TOKEN\"]\nauth = (github_token, \"x-oauth-basic\")\nrepo = \"getredash/redash\"\n\n\ndef _github_request(method, path, params=None, headers={}):\n if urlparse(path).hostname != \"api.github.com\":\n url = \"https://api.github.com/{}\".format(path)\n else:\n url = path\n\n if params is not None:\n params = simplejson.dumps(params)\n\n response = requests.request(method, url, data=params, auth=auth)\n return response\n\n\ndef exception_from_error(message, response):\n return Exception(\"({}) {}: {}\".format(response.status_code, message, response.json().get(\"message\", \"?\")))\n\n\ndef rc_tag_name(version):\n return \"v{}-rc\".format(version)\n\n\ndef get_rc_release(version):\n tag = rc_tag_name(version)\n response = _github_request(\"get\", \"repos/{}/releases/tags/{}\".format(repo, tag))\n\n if response.status_code == 404:\n return None\n elif response.status_code == 200:\n return response.json()\n\n raise exception_from_error(\"Unknown error while looking RC release: \", response)\n\n\ndef create_release(version, commit_sha):\n tag = rc_tag_name(version)\n\n params = {\n \"tag_name\": tag,\n \"name\": \"{} - RC\".format(version),\n \"target_commitish\": commit_sha,\n \"prerelease\": True,\n }\n\n response = _github_request(\"post\", \"repos/{}/releases\".format(repo), params)\n\n if response.status_code != 201:\n raise exception_from_error(\"Failed creating new release\", response)\n\n return response.json()\n\n\ndef upload_asset(release, filepath):\n upload_url = release[\"upload_url\"].replace(\"{?name,label}\", \"\")\n filename = filepath.split(\"/\")[-1]\n\n with open(filepath) as file_content:\n headers = {\"Content-Type\": \"application/gzip\"}\n response = requests.post(\n upload_url, file_content, params={\"name\": filename}, headers=headers, auth=auth, verify=False\n )\n\n if response.status_code != 201: # not 200/201/...\n raise exception_from_error(\"Failed uploading asset\", response)\n\n return response\n\n\ndef remove_previous_builds(release):\n for asset in release[\"assets\"]:\n response = _github_request(\"delete\", asset[\"url\"])\n if response.status_code != 204:\n raise exception_from_error(\"Failed deleting asset\", response)\n\n\ndef get_changelog(commit_sha):\n latest_release = _github_request(\"get\", \"repos/{}/releases/latest\".format(repo))\n if latest_release.status_code != 200:\n raise exception_from_error(\"Failed getting latest release\", latest_release)\n\n latest_release = latest_release.json()\n previous_sha = latest_release[\"target_commitish\"]\n\n args = [\n \"git\",\n \"--no-pager\",\n \"log\",\n \"--merges\",\n \"--grep\",\n \"Merge pull request\",\n '--pretty=format:\"%h|%s|%b|%p\"',\n \"{}...{}\".format(previous_sha, commit_sha),\n ]\n log = subprocess.check_output(args)\n changes = [\"Changes since {}:\".format(latest_release[\"name\"])]\n\n for line in log.split(\"\\n\"):\n try:\n sha, subject, body, parents = line[1:-1].split(\"|\")\n except ValueError:\n continue\n\n try:\n pull_request = re.match(r\"Merge pull request #(\\d+)\", subject).groups()[0]\n pull_request = \" #{}\".format(pull_request)\n except Exception:\n pull_request = \"\"\n\n author = subprocess.check_output([\"git\", \"log\", \"-1\", '--pretty=format:\"%an\"', parents.split(\" \")[-1]])[1:-1]\n\n changes.append(\"{}{}: {} ({})\".format(sha, pull_request, body.strip(), author))\n\n return \"\\n\".join(changes)\n\n\ndef update_release_commit_sha(release, commit_sha):\n params = {\n \"target_commitish\": commit_sha,\n }\n\n response = _github_request(\"patch\", \"repos/{}/releases/{}\".format(repo, release[\"id\"]), params)\n\n if response.status_code != 200:\n raise exception_from_error(\"Failed updating commit sha for existing release\", response)\n\n return response.json()\n\n\ndef update_release(version, build_filepath, commit_sha):\n try:\n release = get_rc_release(version)\n if release:\n release = update_release_commit_sha(release, commit_sha)\n else:\n release = create_release(version, commit_sha)\n\n print(\"Using release id: {}\".format(release[\"id\"]))\n\n remove_previous_builds(release)\n response = upload_asset(release, build_filepath)\n\n changelog = get_changelog(commit_sha)\n\n response = _github_request(\"patch\", release[\"url\"], {\"body\": changelog})\n if response.status_code != 200:\n raise exception_from_error(\"Failed updating release description\", response)\n\n except Exception as ex:\n print(ex)\n\n\nif __name__ == \"__main__\":\n commit_sha = sys.argv[1]\n version = sys.argv[2]\n filepath = sys.argv[3]\n\n # TODO: make sure running from git directory & remote = repo\n update_release(version, filepath, commit_sha)\n"
},
{
"path": "bin/run",
"content": "#!/usr/bin/env bash\n\n# Ideally I would use stdin with source, but in older bash versions this\n# wasn't supported properly.\nTEMP_ENV_FILE=`mktemp /tmp/redash_env.XXXXXX`\nsed 's/^REDASH/export REDASH/' .env > $TEMP_ENV_FILE\nsource $TEMP_ENV_FILE\nrm $TEMP_ENV_FILE\n\nexec \"$@\"\n"
},
{
"path": "client/.babelrc",
"content": "{\n \"presets\": [\n [\n \"@babel/preset-env\",\n {\n \"exclude\": [\"@babel/plugin-transform-async-to-generator\", \"@babel/plugin-transform-arrow-functions\"],\n \"corejs\": \"2\",\n \"useBuiltIns\": \"usage\"\n }\n ],\n \"@babel/preset-react\",\n \"@babel/preset-typescript\"\n ],\n \"plugins\": [\n \"@babel/plugin-transform-class-properties\",\n \"@babel/plugin-transform-object-assign\",\n [\n \"babel-plugin-transform-builtin-extend\",\n {\n \"globals\": [\"Error\"]\n }\n ]\n ],\n \"env\": {\n \"test\": {\n \"plugins\": [\"istanbul\"]\n }\n }\n}\n"
},
{
"path": "client/.eslintignore",
"content": "build/*.js\ndist\nconfig/*.js\nclient/dist\n"
},
{
"path": "client/.eslintrc.js",
"content": "module.exports = {\n root: true,\n parser: \"@typescript-eslint/parser\",\n extends: [\n \"react-app\",\n \"plugin:compat/recommended\",\n \"prettier\",\n \"plugin:jsx-a11y/recommended\",\n ],\n plugins: [\"jest\", \"compat\", \"no-only-tests\", \"@typescript-eslint\", \"jsx-a11y\"],\n settings: {\n \"import/resolver\": \"webpack\",\n polyfills: [\n \"document.body\",\n \"Notification\",\n ],\n },\n env: {\n browser: true,\n node: true,\n },\n rules: {\n // allow debugger during development\n \"no-debugger\": process.env.NODE_ENV === \"production\" ? 2 : 0,\n // Pre-existing patterns - anonymous default exports are used throughout\n \"import/no-anonymous-default-export\": \"off\",\n // Some tests verify no-throw behavior without explicit assertions\n \"jest/expect-expect\": \"off\",\n \"jsx-a11y/anchor-is-valid\": [\n // TMP\n \"off\",\n {\n components: [\"Link\"],\n aspects: [\"noHref\", \"invalidHref\", \"preferButton\"],\n },\n ],\n \"jsx-a11y/no-redundant-roles\": \"error\",\n \"jsx-a11y/no-autofocus\": \"off\",\n \"jsx-a11y/click-events-have-key-events\": \"off\", // TMP\n \"jsx-a11y/no-static-element-interactions\": \"off\", // TMP\n \"jsx-a11y/no-noninteractive-element-interactions\": \"off\", // TMP\n \"no-console\": [\"warn\", { allow: [\"warn\", \"error\"] }],\n \"no-restricted-imports\": [\n \"error\",\n {\n paths: [\n {\n name: \"antd\",\n message: \"Please use 'import XXX from antd/lib/XXX' import instead.\",\n },\n {\n name: \"antd/lib\",\n message: \"Please use 'import XXX from antd/lib/XXX' import instead.\",\n },\n ],\n },\n ],\n },\n overrides: [\n {\n // Only run typescript-eslint on TS files\n files: [\"*.ts\", \"*.tsx\", \".*.ts\", \".*.tsx\"],\n extends: [\"plugin:@typescript-eslint/recommended\"],\n rules: {\n // Do not require functions (especially react components) to have explicit returns\n \"@typescript-eslint/explicit-function-return-type\": \"off\",\n // Do not require to type every import from a JS file to speed up development\n \"@typescript-eslint/no-explicit-any\": \"off\",\n // Do not complain about useless contructors in declaration files\n \"no-useless-constructor\": \"off\",\n \"@typescript-eslint/no-useless-constructor\": \"error\",\n // Many API fields and generated types use camelcase\n camelcase: \"off\",\n // Allow {} type - used extensively in existing codebase\n \"@typescript-eslint/ban-types\": [\"error\", { types: { \"{}\": false } }],\n },\n },\n {\n // Cypress test files\n files: [\"**/cypress/**/*.js\"],\n extends: [\"plugin:cypress/recommended\"],\n plugins: [\"cypress\", \"chai-friendly\"],\n env: {\n \"cypress/globals\": true,\n },\n rules: {\n \"no-redeclare\": \"off\",\n \"cypress/unsafe-to-chain-command\": \"off\",\n \"func-names\": [\"error\", \"never\"],\n \"no-unused-expressions\": \"off\",\n \"chai-friendly/no-unused-expressions\": \"error\",\n },\n },\n ],\n};\n"
},
{
"path": "client/.gitignore",
"content": "dist\n"
},
{
"path": "client/app/.eslintrc.js",
"content": "module.exports = {\n extends: [\"plugin:jest/recommended\"],\n plugins: [\"jest\"],\n env: {\n \"jest/globals\": true,\n },\n rules: {\n \"jest/no-focused-tests\": \"off\",\n },\n};\n"
},
{
"path": "client/app/__tests__/enzyme_setup.js",
"content": "import { configure } from \"enzyme\";\nimport Adapter from \"enzyme-adapter-react-16\";\n\nconfigure({ adapter: new Adapter() });\n"
},
{
"path": "client/app/__tests__/mocks.js",
"content": "import MockDate from \"mockdate\";\n\nconst date = new Date(\"2000-01-01T02:00:00.000\");\n\nMockDate.set(date);\n"
},
{
"path": "client/app/assets/css/login.css",
"content": "body {\n padding-top: 0px !important;\n background-color: #FFFFFF;\n}\n\n.logo-container {\n background-color: #668899;\n display: table;\n width: 100%;\n padding: 10px;\n}\n\n.content-container {\n background-color: white;\n display: table;\n width: 100%;\n padding: 10px;\n height: calc(100% - 116px);\n}\n\n@media (min-width: 992px) {\n .content-container {\n height: 100%;\n width: 60%;\n float: left;\n }\n\n .logo-container {\n height: 100%;\n width: 40%;\n float: right;\n }\n}\n\n.login-or {\n position: relative;\n font-size: 18px;\n color: #aaa;\n margin-top: 20px;\n margin-bottom: 20px;\n padding-top: 10px;\n padding-bottom: 10px;\n}\n\n.span-or {\n display: block;\n position: absolute;\n left: 50%;\n top: -2px;\n margin-left: -25px;\n background-color: #fff;\n width: 50px;\n text-align: center;\n}\n\n.hr-or {\n background-color: #cdcdcd;\n height: 1px;\n margin-top: 0px !important;\n margin-bottom: 0px !important;\n}\n\nimg.login-button {\n width: 250px;\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n\n"
},
{
"path": "client/app/assets/images/illustrations/readme.md",
"content": "The illustrations shared in this folder are covered by the CC-BY-SA-NC-ND License v4.0 (or newer). You are allowed to use them when using unmodified versions of the Redash source code for non-commercial purposes (meaning for yourself), but you are not allowed to use for any other use or to distribute them as part of your software or fork of Redash.\n\nFor any questions, please contact us.\n"
},
{
"path": "client/app/assets/less/STYLING-README.md",
"content": "# Styling readme\n\nSome general rules before you add stuff.\n\n- Avoid using inline css\n- If possible, use classes that are already in place instead of adding new\n- Keep less/inc folder untouched, rewrite things in less/redash respectively \n- Try following BEM naming conventions: http://getbem.com/naming/\n"
},
{
"path": "client/app/assets/less/ant.less",
"content": "@import \"~antd/lib/style/core/iconfont\";\n@import \"~antd/lib/style/core/motion\";\n@import \"~antd/lib/alert/style/index\";\n@import \"~antd/lib/input/style/index\";\n@import \"~antd/lib/input-number/style/index\";\n@import \"~antd/lib/date-picker/style/index\";\n@import \"~antd/lib/modal/style/index\";\n@import \"~antd/lib/tooltip/style/index\";\n@import \"~antd/lib/select/style/index\";\n@import \"~antd/lib/checkbox/style/index\";\n@import \"~antd/lib/upload/style/index\";\n@import \"~antd/lib/form/style/index\";\n@import \"~antd/lib/button/style/index\";\n@import \"~antd/lib/radio/style/index\";\n@import \"~antd/lib/time-picker/style/index\";\n@import \"~antd/lib/pagination/style/index\";\n@import \"~antd/lib/table/style/index\";\n@import \"~antd/lib/popover/style/index\";\n@import \"~antd/lib/tag/style/index\";\n@import \"~antd/lib/grid/style/index\";\n@import \"~antd/lib/switch/style/index\";\n@import \"~antd/lib/empty/style/index\";\n@import \"~antd/lib/drawer/style/index\";\n@import \"~antd/lib/card/style/index\";\n@import \"~antd/lib/steps/style/index\";\n@import \"~antd/lib/divider/style/index\";\n@import \"~antd/lib/dropdown/style/index\";\n@import \"~antd/lib/menu/style/index\";\n@import \"~antd/lib/list/style/index\";\n@import \"~antd/lib/badge/style/index\";\n@import \"~antd/lib/card/style/index\";\n@import \"~antd/lib/spin/style/index\";\n@import \"~antd/lib/skeleton/style/index\";\n@import \"~antd/lib/tabs/style/index\";\n@import \"~antd/lib/notification/style/index\";\n@import \"~antd/lib/collapse/style/index\";\n@import \"~antd/lib/progress/style/index\";\n@import \"~antd/lib/typography/style/index\";\n@import \"~antd/lib/descriptions/style/index\";\n@import \"inc/ant-variables\";\n\n// Increase z-indexes to avoid conflicts with some other libraries (e.g. Plotly)\n@zindex-modal: 2000;\n@zindex-modal-mask: 2000;\n@zindex-message: 2010;\n@zindex-notification: 2010;\n@zindex-popover: 2030;\n@zindex-dropdown: 2050;\n@zindex-picker: 2050;\n@zindex-tooltip: 2060;\n@item-hover-bg: #e5f8ff;\n\n.@{drawer-prefix-cls} {\n &.help-drawer {\n z-index: @zindex-tooltip; // help drawer should be topmost\n }\n}\n\n// Remove bold in labels for Ant checkboxes and radio buttons\n.ant-checkbox-wrapper,\n.ant-radio-wrapper {\n font-weight: normal;\n}\n\n.ant-select-dropdown-menu-item em {\n color: @input-color-placeholder;\n font-size: 11px;\n}\n\n// Fix for disabled button styles inside Tooltip component.\n// Tooltip wraps disabled buttons with `` and moves all styles\n// and classes to that ``. This resets all button styles and\n// turns it into simple inline element (because now it's wrapper is a button)\n.btn {\n button[disabled] {\n -moz-appearance: none !important;\n -webkit-appearance: none !important;\n appearance: none !important;\n border: 0 !important;\n outline: none !important;\n background: transparent !important;\n margin: 0 !important;\n padding: 0 !important;\n }\n}\n\n// Button overrides\n.@{btn-prefix-cls} {\n transition-duration: 150ms;\n\n &.icon-button {\n width: 32px;\n padding: 0 10px;\n }\n}\n\n// Fix ant input number showing duplicate arrows\n.ant-input-number-input::-webkit-outer-spin-button,\n.ant-input-number-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n// Pagination overrides (based on existing Bootstrap overrides)\n.@{pagination-prefix-cls} {\n display: inline-block;\n margin-top: 18px;\n margin-bottom: 18px;\n vertical-align: top;\n\n &-item {\n background-color: @pagination-bg;\n border-color: transparent;\n color: @pagination-color;\n font-size: 14px;\n margin-right: 5px;\n\n a {\n color: inherit;\n }\n\n &:focus,\n &:hover {\n background-color: @pagination-hover-bg;\n border-color: transparent;\n color: @pagination-hover-color;\n a {\n color: inherit;\n }\n }\n\n &-active {\n &,\n &:hover,\n &:focus {\n background-color: @pagination-active-bg;\n color: @pagination-active-color;\n border-color: transparent;\n pointer-events: none;\n cursor: default;\n\n a {\n color: inherit;\n }\n }\n }\n }\n\n &-disabled {\n &,\n &:hover,\n &:focus {\n opacity: 0.5;\n pointer-events: none;\n }\n }\n\n &-prev,\n &-next {\n .@{pagination-prefix-cls}-item-link {\n background-color: @pagination-bg;\n border-color: transparent;\n color: @pagination-color;\n line-height: @pagination-item-size - 2px;\n\n .@{pagination-prefix-cls}.mini & {\n line-height: @pagination-item-size-sm - 2px;\n }\n }\n\n &:focus .@{pagination-prefix-cls}-item-link,\n &:hover .@{pagination-prefix-cls}-item-link {\n background-color: @pagination-hover-bg;\n border-color: transparent;\n color: @pagination-hover-color;\n }\n }\n\n &-prev,\n &-jump-prev,\n &-jump-next {\n margin-right: 5px;\n }\n\n &-jump-prev,\n &-jump-next {\n .@{pagination-prefix-cls}-item-container {\n .@{pagination-prefix-cls}-item-link-icon {\n color: @pagination-color;\n }\n }\n }\n}\n\n// Table\n\n.@{table-prefix-cls} {\n color: inherit;\n\n tr,\n th,\n td {\n transition: none !important;\n }\n\n &-thead > tr > th {\n padding: @table-padding-vertical * 2 @table-padding-horizontal;\n }\n\n .@{table-prefix-cls}-column-sorters {\n &:before,\n &:hover:before {\n content: none;\n }\n }\n\n &-thead > tr > th {\n .@{table-prefix-cls}-column-sorter {\n &-up,\n &-down {\n &.on {\n color: @table-header-icon-active-color;\n }\n }\n }\n }\n\n &-tbody > tr&-row {\n &:hover,\n &:focus,\n &:focus-within {\n & > td {\n background: @table-row-hover-bg;\n }\n }\n }\n\n // Custom styles\n\n &-headerless &-tbody > tr:first-child > td {\n border-top: @border-width-base @border-style-base @border-color-split;\n }\n}\n\n// List\n\n.@{list-prefix-cls} {\n &-item {\n // custom rule\n &.selected {\n background-color: #f6f8f9;\n }\n\n &.disabled {\n background-color: fade(#f6f8f9, 40%);\n\n & > * {\n opacity: 0.4;\n }\n }\n }\n}\n\n.@{dialog-prefix-cls} {\n // styling for short modals (no lines)\n &.shortModal {\n .@{dialog-prefix-cls} {\n &-header,\n &-footer {\n border: none;\n padding: 16px;\n }\n\n &-body {\n padding: 10px 16px;\n }\n\n &-close-x {\n width: 46px;\n height: 46px;\n line-height: 46px;\n }\n }\n }\n\n // fullscreen modals\n &-fullscreen {\n .@{dialog-prefix-cls} {\n position: absolute;\n left: 15px;\n top: 15px;\n right: 15px;\n bottom: 15px;\n width: auto !important;\n height: auto !important;\n max-width: none;\n max-height: none;\n margin: 0;\n padding: 0;\n\n .@{dialog-prefix-cls}-content {\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n width: auto;\n height: auto;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n }\n\n .@{dialog-prefix-cls}-body {\n flex: 1 1 auto;\n overflow: auto;\n }\n }\n }\n}\n\n// description in modal header\n.modal-header-desc {\n font-size: @font-size-base;\n color: @text-color-secondary;\n font-weight: normal;\n margin-top: 4px;\n}\n\n// Notification overrides\n.@{notification-prefix-cls} {\n // vertical centering\n &-notice-close {\n top: 20px;\n right: 20px;\n }\n\n &-notice-description {\n max-width: 484px;\n }\n}\n\n.@{btn-prefix-cls} .@{iconfont-css-prefix}-ellipsis {\n margin: 0 -7px 0 -8px;\n}\n\n// Collapse\n\n.@{collapse-prefix-cls} {\n &&-headerless {\n border: 0;\n background: none;\n\n .@{collapse-prefix-cls}-header {\n display: none;\n }\n\n .@{collapse-prefix-cls}-item,\n .@{collapse-prefix-cls}-content {\n border: 0;\n }\n\n .@{collapse-prefix-cls}-content-box {\n padding: 0;\n }\n }\n}\n\n// overrides for tall form components such as ace editor\n.@{form-prefix-cls}-item {\n &-children {\n display: block; // so feeback icon positions correctly\n }\n\n // no change for short components, sticks to body for tall ones\n &-children-icon {\n top: auto !important;\n bottom: 8px;\n\n // makes the icon white instead of see-through\n & svg {\n background: white;\n border-radius: 50%;\n }\n }\n\n // for form items that contain text\n &.form-item-line-height-normal .@{form-prefix-cls}-item-control {\n line-height: 20px;\n margin-top: 9px;\n }\n}\n\n.@{menu-prefix-cls} {\n // invert stripe position with class .invert-stripe-position\n &-inline.invert-stripe-position {\n .@{menu-prefix-cls}-item {\n &::after {\n right: auto;\n left: 0;\n }\n }\n\n &:focus,\n &:focus-within {\n color: @menu-highlight-color;\n }\n }\n}\n\n.@{dropdown-prefix-cls}-menu-item {\n &:focus,\n &:focus-within {\n background-color: @item-hover-bg;\n }\n}\n\n// overrides for checkbox\n@checkbox-prefix-cls: ~\"@{ant-prefix}-checkbox\";\n\n.@{checkbox-prefix-cls}-wrapper + span,\n.@{checkbox-prefix-cls} + span {\n padding-right: 0;\n}\n\n// make sure Multiple select has room for icons\n.@{select-prefix-cls}-multiple {\n &.@{select-prefix-cls}-show-arrow,\n &.@{select-prefix-cls}-show-search,\n &.@{select-prefix-cls}-loading {\n .@{select-prefix-cls}-selector {\n padding-right: 30px;\n }\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/404.less",
"content": ".four-zero {\r\n\tbackground: @white;\r\n\tbox-shadow: 0 1px 11px rgba(0, 0, 0, 0.27);\r\n\tborder-radius: 2px;\r\n\tposition: absolute;\r\n\ttop: 50%;\r\n\tmargin-top: -150px;\r\n\ttext-align: center;\r\n\tpadding: 15px;\r\n\theight: 300px;\r\n\twidth: 500px;\r\n\tleft: 50%;\r\n\tcolor: #333;\r\n\tmargin-left: -250px;\r\n\t\r\n\th2 {\r\n\t\tfont-size: 130px;\r\n\t}\r\n\r\n\t\r\n\t@media (max-width: @screen-xs-max) {\r\n\t\twidth: ~\"calc(100% - 40px)\";\r\n\t\tleft: 20px;\r\n\t\tmargin-left: 0;\r\n\t\theight: 260px;\r\n\t\tmargin-top: -130px;\r\n\t\t\r\n\t\th2 {\r\n\t\t\tfont-size: 90px;\r\n\t\t}\r\n }\r\n\t\r\n\th2 {\r\n\t\tline-height: 100%;\r\n\t\tfont-weight: 100;\r\n\t}\r\n\t\r\n\tsmall {\r\n\t\tdisplay: block;\r\n\t\tfont-size: 26px;\r\n\t\tmargin-top: -10px\r\n\t}\r\n\t\r\n\t\r\n\tfooter {\r\n\t\tbackground: @ace;\r\n\t\tposition: absolute;\r\n\t\tleft: 0;\r\n\t\tbottom: 0;\r\n\t\twidth: 100%;\r\n\t\tpadding: 10px;\r\n\t\t\r\n\t\t& > a {\r\n\t\t\tfont-size: 21px;\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tcolor: #333;\r\n\t\t\tmargin: 0 1px;\r\n\t\t\tline-height: 40px;\r\n\t\t\twidth: 40px;\r\n\t\t\theight: 40px;\r\n\t\t\tbackground: rgba(0, 0, 0, 0.09);\r\n\t\t\tborder-radius: 50%;\r\n\t\t\ttext-align: center;\r\n\t\t\t\r\n\t\t\t&:hover {\r\n\t\t\t\tbackground: rgba(0, 0, 0, 0.2);\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n\r\n\r\n\r\n"
},
{
"path": "client/app/assets/less/inc/ace-editor.less",
"content": ".ace_editor {\n border: 1px solid fade(@redash-gray, 15%);\n height: 100%;\n margin-bottom: 10px;\n\n &.ace_autocomplete .ace_completion-highlight {\n text-shadow: none !important;\n background: #ffff005e;\n font-weight: 600;\n }\n\n &.ace-tm {\n .ace_gutter {\n background: #fff !important;\n }\n\n .ace_gutter-active-line {\n background-color: fade(@redash-gray, 20%) !important;\n }\n\n .ace_marker-layer .ace_active-line {\n background: fade(@redash-gray, 9%) !important;\n }\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/alert.less",
"content": ".alert-page h3 {\r\n flex-grow: 1;\r\n\r\n input {\r\n margin: -0.2em 0;\r\n width: 100%;\r\n min-width: 170px;\r\n }\r\n}\r\n\r\n.btn-create-alert[disabled] {\r\n display: block;\r\n margin-top: -20px;\r\n}\r\n\r\n.alert-state {\r\n border-bottom: 1px solid @input-border;\r\n padding-bottom: 30px;\r\n\r\n .alert-state-indicator {\r\n text-transform: uppercase;\r\n font-size: 14px;\r\n padding: 5px 8px;\r\n }\r\n\r\n .ant-form-item-explain {\r\n margin-top: 10px;\r\n }\r\n\r\n .alert-last-triggered {\r\n color: @headings-color;\r\n }\r\n}\r\n\r\n.alert-query-selector {\r\n min-width: 250px;\r\n width: auto !important;\r\n}\r\n\r\n// allow form item labels to gracefully break line\r\n.alert-form-item label {\r\n white-space: initial;\r\n padding-right: 8px;\r\n line-height: 21px;\r\n\r\n &::after {\r\n margin-right: 0 !important;\r\n }\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/ant-variables.less",
"content": "/* --------------------------------------------------------\n Colors\n-----------------------------------------------------------*/\n@lightblue: #03a9f4;\n@primary-color: #2196f3;\n\n@redash-gray: rgba(102, 136, 153, 1);\n@redash-orange: rgba(255, 120, 100, 1);\n@redash-black: rgba(0, 0, 0, 1);\n@redash-yellow: rgba(252, 252, 161, 0.75);\n\n/* --------------------------------------------------------\n Font\n-----------------------------------------------------------*/\n@redash-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\",\n sans-serif;\n@font-family-no-number: @redash-font;\n@font-family: @redash-font;\n@code-family: @redash-font;\n@font-size-base: 13px;\n\n/* --------------------------------------------------------\n Borders\n-----------------------------------------------------------*/\n@border-color-split: #f0f0f0;\n\n/* --------------------------------------------------------\n Typograpgy\n-----------------------------------------------------------*/\n@text-color: #595959;\n\n/* --------------------------------------------------------\n Form\n-----------------------------------------------------------*/\n@input-height-base: 35px;\n@input-color: #595959;\n@input-color-placeholder: #b4b4b4;\n@border-radius-base: 2px;\n@border-color-base: #e8e8e8;\n\n/* --------------------------------------------------------\n Pagination\n-----------------------------------------------------------*/\n@pagination-item-size: 33px;\n@pagination-font-family: @redash-font;\n@pagination-font-weight-active: normal;\n\n@pagination-bg: fade(@redash-gray, 15%);\n@pagination-color: #7e7e7e;\n@pagination-active-bg: @lightblue;\n@pagination-active-color: #fff;\n@pagination-disabled-bg: fade(@redash-gray, 15%);\n@pagination-hover-color: #333;\n@pagination-hover-bg: fade(@redash-gray, 25%);\n\n/* --------------------------------------------------------\n Table\n-----------------------------------------------------------*/\n@table-border-radius-base: 0;\n@table-header-color: #333;\n@table-header-bg: fade(@redash-gray, 3%);\n@table-header-icon-color: fade(@text-color, 20%);\n@table-header-icon-active-color: @text-color;\n@table-header-sort-bg: @table-header-bg;\n@table-header-sort-active-bg: @table-header-bg;\n@table-header-filter-active-bg: @table-header-bg;\n@table-body-sort-bg: transparent;\n@table-row-hover-bg: fade(@redash-gray, 5%);\n@table-padding-vertical: 7px;\n@table-padding-horizontal: 10px;\n\n/* --------------------------------------------------------\n Notification\n-----------------------------------------------------------*/\n@notification-padding: @notification-padding-vertical 48px @notification-padding-vertical 17px;\n@notification-width: auto;\n"
},
{
"path": "client/app/assets/less/inc/base.less",
"content": "*,\nbutton,\ninput,\ni,\na {\n -webkit-font-smoothing: antialiased;\n}\n\n*,\n*:active,\n*:hover {\n outline: none !important;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;\n}\n\nhtml {\n overflow-x: ~\"hidden\\0/\";\n -ms-overflow-style: auto;\n}\n\nhtml,\nbody {\n height: 100%;\n}\n\nbody {\n padding-top: 0;\n background: #f6f8f9;\n font-family: @redash-font;\n position: relative;\n\n #application-root {\n padding-bottom: 15px;\n }\n}\n\n#application-root {\n height: 100%;\n}\n\n#application-root,\n#app-content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n\nstrong {\n font-weight: 500;\n}\n\n#content {\n position: relative;\n padding-top: 30px;\n padding-bottom: 30px;\n\n @media (min-width: (@screen-sm-min + 1)) {\n padding-right: 15px;\n padding-left: 15px;\n }\n\n @media (min-width: (@screen-lg-min + 80px)) {\n margin-left: @sidebar-left-width;\n }\n\n @media (min-width: @screen-sm-min) and (max-width: (@screen-md-max + 80px)) {\n margin-left: @sidebar-left-mid-width;\n }\n\n @media (max-width: (@screen-sm-min)) {\n margin-left: 0;\n }\n}\n\n.container {\n &.c-boxed {\n max-width: @boxed-width;\n }\n}\n\n.settings-screen,\n.home-page,\n.page-dashboard-list,\n.page-queries-list,\n.page-alerts-list,\n.alert-page,\n.admin-page-layout {\n .container {\n width: 100%;\n max-width: none;\n }\n}\n\n.scrollbox {\n overflow: auto;\n position: relative;\n}\n\n.clickable {\n cursor: pointer;\n\n button&:disabled {\n cursor: not-allowed;\n }\n}\n\n.resize-vertical {\n resize: vertical !important;\n transition: height 0s !important;\n}\n.resize-horizontal {\n resize: horizontal !important;\n transition: width 0s !important;\n}\n.resize-both,\n.resize-vertical.resize-horizontal {\n resize: both !important;\n transition: height 0s, width 0s !important;\n}\n\n.bg-ace {\n background-color: fade(@redash-gray, 12%) !important;\n}\n\n// resizeable\n.rg-top span,\n.rg-bottom span {\n height: 3px;\n border-color: #b1c1ce; // TODO: variable\n}\n\n.rg-bottom {\n bottom: 15px;\n\n span {\n margin: 1.5px 0 0 -10px;\n }\n}\n\n// Plotly\ntext.slicetext {\n text-shadow: 1px 1px 5px #333;\n}\n\n// markdown\n.markdown strong {\n font-weight: bold;\n}\n\n.markdown img {\n max-width: 100%;\n}\n\n.dropdown-menu > li > a:hover,\n.dropdown-menu > li > a:focus {\n background-color: fade(@redash-gray, 15%);\n color: #111;\n}\n\n.profile__image--sidebar {\n border-radius: 100%;\n margin-right: 3px;\n margin-top: -2px;\n}\n\n.profile__image--settings {\n border-radius: 100%;\n}\n\n.profile__image_thumb {\n border-radius: 100%;\n margin-right: 3px;\n margin-top: -2px;\n width: 20px;\n height: 20px;\n}\n\n// Error state\n.error-state {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n text-align: center;\n margin-top: 25vh;\n padding: 35px;\n font-size: 14px;\n line-height: 21px;\n\n .error-state__icon {\n .zmdi {\n font-size: 64px;\n color: @redash-gray;\n }\n }\n\n @media (max-width: 767px) {\n margin-top: 10vh;\n }\n}\n\n.warning-icon-danger {\n color: @red !important;\n}\n\n// page\n.page-title {\n display: flex;\n align-items: center;\n\n .label {\n margin-top: 3px;\n display: inline-block;\n }\n\n .favorites-control {\n font-size: 19px;\n margin-right: 10px;\n }\n}\n\n.page-header--new {\n h3 {\n margin: 0.2em 0;\n line-height: 1.3;\n font-weight: 500;\n }\n}\n\n.select-option-divider {\n margin: 10px 0 !important;\n}\n"
},
{
"path": "client/app/assets/less/inc/bootstrap-overrides.less",
"content": "/** Media - Overriding the Media object to 3.2 version in order to prevent issues like text overflow. **/\n.media {\n margin-top: 0;\n .clearfix();\n\n & > .pull-left {\n padding-right: 15px;\n }\n\n & > .pull-right {\n padding-left: 15px;\n }\n\n overflow: visible;\n}\n\n.media-heading {\n font-size: 14px;\n margin-bottom: 10px;\n}\n\n.media-body {\n zoom: 1;\n display: block;\n width: auto;\n}\n\n.media-object {\n border-radius: 2px;\n}\n\n.collapsing,\n.collapse.in {\n padding: 0;\n transition: all 0.35s ease;\n}\n\n/** LIST **/\n.list-inline > li {\n vertical-align: top;\n margin-left: 0;\n}\n\n// Hide URLs next to links when printing (override `bootstrap` rules)\n@media print {\n a[href]:after {\n content: none !important;\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/breadcrumb.less",
"content": ".breadcrumb {\r\n border-bottom: 1px solid #E5E5E5;\r\n border-radius: 0;\r\n padding-top: 10px;\r\n padding-right: 33px;\r\n padding-bottom: 11px;\r\n \r\n @media (min-width: (@screen-lg-min + 80px)) { \r\n padding-left: (@sidebar-left-width + @grid-gutter-width);\r\n }\r\n \r\n @media (min-width: @screen-sm-min) and (max-width: (@screen-md-max + 80px)) {\r\n padding-left: (@sidebar-left-mid-width + @grid-gutter-width);\r\n }\r\n \r\n @media (max-width: (@screen-sm-min)) {\r\n padding-left: @grid-gutter-width/2;\r\n }\r\n \r\n & > li {\r\n & > a {\r\n color: #A9A9A9;\r\n \r\n &:hover {\r\n color: @breadcrumb-active-color;\r\n }\r\n }\r\n }\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/button.less",
"content": ".btn {\r\n &:not(.btn-alt) {\r\n border: 0;\r\n }\r\n\r\n &[class*=\"bg-\"]:not(.bg-white) {\r\n color: #fff;\r\n }\r\n\r\n .caret {\r\n margin-top: -3px;\r\n }\r\n\r\n &:not(.btn-link) {\r\n &:active,\r\n &.active,\r\n &:hover {\r\n\r\n }\r\n }\r\n}\r\n\r\n.btn-default {\r\n .button-variant(#333, #eee, transparent);\r\n}\r\n\r\n.btn-inverse {\r\n .button-variant(#fff, #454545, transparent);\r\n}\r\n\r\n.btn-link {\r\n color: #333;\r\n}\r\n\r\n.btn-icon {\r\n border-radius: 50%;\r\n width: 40px;\r\n height: 40px;\r\n padding: 0;\r\n text-align: center;\r\n\r\n .zmdi {\r\n font-size: 17px;\r\n }\r\n}\r\n\r\n.btn-icon-text {\r\n & > .zmdi {\r\n font-size: 15px;\r\n vertical-align: top;\r\n display: inline-block;\r\n margin-top: 2px;\r\n line-height: 100%;\r\n margin-right: 5px;\r\n }\r\n}\r\n\r\n.open .btn {\r\n outline: none !important;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;\r\n\r\n &:focus, &:active {\r\n outline: none !important;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;\r\n }\r\n}\r\n\r\n/** ALTERNATIVE BUTTONS **/\r\n.btn-alt(@color) {\r\n border-color: @color;\r\n color: @color;\r\n\r\n &:not(.btn-white) {\r\n &:hover,\r\n &:active,\r\n &:focus {\r\n color: #fff;\r\n background: @color;\r\n }\r\n }\r\n\r\n &.btn-white {\r\n &:hover,\r\n &:active,\r\n &:focus {\r\n color: #333;\r\n background: @color;\r\n }\r\n }\r\n}\r\n\r\n.btn-alt {\r\n background: transparent;\r\n\r\n &.btn-default {\r\n .btn-alt(darken(@brand-default, 30%));\r\n }\r\n\r\n &.btn-info {\r\n .btn-alt(@brand-info);\r\n }\r\n\r\n &.btn-primary {\r\n .btn-alt(@brand-primary);\r\n }\r\n\r\n &.btn-success {\r\n .btn-alt(@brand-success);\r\n }\r\n\r\n &.btn-warning {\r\n .btn-alt(@brand-warning);\r\n }\r\n\r\n &.btn-danger {\r\n .btn-alt(@brand-danger);\r\n }\r\n}\r\n\r\n.btn-xs > .fa {\r\n font-size: 14px;\r\n top: 1px;\r\n position: relative;\r\n}\r\n\r\n\r\n.btn-default {\r\n background-color: fade(@redash-gray, 15%);\r\n}\r\n\r\n.btn-transparent {\r\n background-color: transparent !important;\r\n}\r\n\r\n.btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {\r\n background-color: fade(@redash-gray, 25%);\r\n}\r\n\r\n.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus {\r\n color: #333;\r\n background-color: fade(@redash-gray, 45%);\r\n}"
},
{
"path": "client/app/assets/less/inc/carousel.less",
"content": ".carousel-caption {\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: rgba(0,0,0,0.6);\r\n \r\n h3 {\r\n margin-top: 0;\r\n margin-bottom: 3px;\r\n color: #fff;\r\n }\r\n}\r\n\r\n.carousel-indicators {\r\n bottom: 10px;\r\n \r\n & > li:not(.active) {\r\n border: 0;\r\n background: #000;\r\n }\r\n}\r\n\r\n.carousel-control {\r\n width: 50px;\r\n background: none;\r\n \r\n .fa {\r\n font-size: 50px;\r\n height: 52px;\r\n margin-top: -26px;\r\n position: absolute;\r\n top: 50%;\r\n .margin-left(-9px);\r\n }\r\n}\r\n\r\n@media @max-768 {\r\n .carousel-indicators, .carousel-caption {\r\n display: none;\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/chart.less",
"content": "/* --------------------------------------------------------\r\n Chart Helper Classes\r\n-----------------------------------------------------------*/\r\n.main-chart {\r\n margin: 0px -8px 0 -10px;\r\n overflow: hidden;\r\n position: relative;\r\n bottom: -10px;\r\n}\r\n\r\n.mc-item {\r\n width: 100%;\r\n height: 250px;\r\n}\r\n\r\n.mc-pie {\r\n width: 100%;\r\n height: 300px;\r\n}\r\n\r\n@media (min-width: @screen-sm-min) {\r\n .mc-info {\r\n position: absolute;\r\n bottom: 10px;\r\n z-index: 1;\r\n padding: 10px 20px 15px;\r\n left: 10px;\r\n background-color: rgba(0, 150, 136, 0.55);\r\n color: #fff;\r\n max-width: 270px;\r\n \r\n span {\r\n font-size: 33px;\r\n }\r\n \r\n small {\r\n display: block;\r\n margin-top: -3px;\r\n margin-left: 3px;\r\n line-height: 130%;\r\n }\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Overview Small Charts\r\n-----------------------------------------------------------*/\r\n.o-item {\r\n padding: 0 20px 15px 20px;\r\n color: #fff;\r\n margin-bottom: @grid-gutter-width;\r\n box-shadow: @tile-shadow;\r\n}\r\n\r\n.oi-number {\r\n font-size: 23px;\r\n display: block;\r\n margin-top: 6px;\r\n margin-bottom: 3px; \r\n line-height: 100%;\r\n}\r\n\r\n.oi-title {\r\n text-transform: uppercase;\r\n .text-overflow();\r\n line-height: 100%;\r\n padding: 10px 15px;\r\n width: auto;\r\n margin: 0 -21px 20px;\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Count Box\r\n-----------------------------------------------------------*/\r\n.count-box {\r\n padding: 20px 23px 0;\r\n \r\n [class*=\"col-\"] {\r\n padding-left: 8px;\r\n padding-right: 8px;\r\n }\r\n}\r\n\r\n.cb-item {\r\n background: rgba(255,255,255,0.22);\r\n padding: 10px 0;\r\n text-align: center;\r\n margin-bottom: 16px;\r\n \r\n & > h3 {\r\n margin: 0;\r\n line-height: 100%;\r\n color: #fff;\r\n font-weight: normal;\r\n }\r\n \r\n & > small {\r\n line-height: 100%;\r\n margin-top: 1px;\r\n display: block;\r\n font-size: 11px;\r\n color: #fff;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Flot Charts\r\n-----------------------------------------------------------*/\r\n.flot-legend {\r\n text-align: center;\r\n margin: 10px 0 5px;\r\n \r\n table {\r\n display: inline-block;\r\n }\r\n \r\n .legendColorBox {\r\n & > div {\r\n border: #fff !important;\r\n \r\n & > div {\r\n border-radius: 50%;\r\n }\r\n }\r\n }\r\n \r\n .legendLabel {\r\n padding: 0 8px 0 3px;\r\n }\r\n}\r\n\r\n[class*=\"flc-\"] {\r\n text-align: center;\r\n margin: 20px 0 5px;\r\n \r\n table {\r\n display: inline-block;\r\n }\r\n \r\n .legendColorBox {\r\n & > div {\r\n border: #fff !important;\r\n \r\n & > div {\r\n border-radius: 50%;\r\n }\r\n }\r\n }\r\n \r\n .legendLabel {\r\n padding: 0 8px 0 3px;\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Easy Pie Charts\r\n-----------------------------------------------------------*/\r\n.pie-overviews {\r\n margin-bottom: -15px;\r\n}\r\n\r\n.po-item {\r\n display: inline-block;\r\n position: relative;\r\n margin: 0 5px 10px;\r\n padding-bottom: 13px;\r\n color: #fff;\r\n}\r\n\r\n.poi-percent {\r\n position: absolute;\r\n text-align: center;\r\n width: 100%;\r\n margin-top: 32px;\r\n font-size: 27px;\r\n text-shadow: none;\r\n padding-left: 2px;\r\n \r\n &:after {\r\n content: '%';\r\n font-size: 11px;\r\n }\r\n}\r\n\r\n.poi-title {\r\n position: absolute;\r\n bottom: 0;\r\n width: 100%;\r\n text-align: center;\r\n font-size: 12px;\r\n \r\n i {\r\n font-size: 15px;\r\n font-weight: normal;\r\n -webkit-font-smoothing: antialiased;\r\n .opacity(0.5);\r\n \r\n &:hover {\r\n .opacity(1);\r\n cursor: pointer;\r\n }\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Chart Tooltips\r\n-----------------------------------------------------------*/\r\n#jqstooltip,\r\n.chart-tooltip {\r\n min-width: 21px;\r\n min-height: 23px;\r\n text-align: center;\r\n border: 0;\r\n background: #333;\r\n}\r\n\r\n#jqstooltip .jqsfield,\r\n.chart-tooltip {\r\n font-size: 12px;\r\n font-weight: 500;\r\n font-family: inherit;\r\n text-align: center;\r\n color: #fff;\r\n}\r\n\r\n#jqstooltip .jqsfield {\r\n & > span {\r\n display: none;\r\n }\r\n}\r\n\r\n.chart-tooltip {\r\n position: absolute;\r\n padding: 6px 10px 5px;\r\n}"
},
{
"path": "client/app/assets/less/inc/dropdown.less",
"content": "\n.dropdown-menu {\n z-index: 1000000000;\n box-shadow: @dropdown-shadow;\n margin-top: 1px;\n border-width: 0;\n .animated(fadeIn, 300ms);\n\n > .disabled{\n cursor: not-allowed;\n // The real magic ;)\n > a {\n pointer-events: none;\n color: @dropdown-link-disabled-color;\n }\n }\n\n & > li > a {\n padding: 8px 17px;\n }\n\n &.dm-icon {\n & > li > a > .zmdi {\n line-height: 100%;\n vertical-align: top;\n font-size: 18px;\n width: 28px;\n }\n }\n\n &:not([class*=\"bg-\"]) {\n & > li > a {\n &:hover {\n color: #000;\n }\n }\n }\n\n &[class*=\"bg-\"] {\n & > li > a {\n font-weight: 300;\n color: #fff;\n }\n }\n}\n\n.dropdown-header {\n padding: 10px 15px 9px;\n text-transform: uppercase;\n font-weight: normal;\n border-radius: 1px 1px 0 0;\n line-height: 100%;\n border-radius: 2px 2px 0 0;\n\n &[class*=\"bg-\"] {\n color: #fff;\n }\n\n .actions {\n top: 0;\n right: 0;\n\n & > li > a {\n display: block;\n padding: 6px 0 5px;\n width: 33px;\n text-align: center;\n\n &:hover {\n background: rgba(0,0,0,0.08);\n }\n }\n }\n}\n\n.dropdown-menu {\n >span {\n >li {\n >a {\n display: block;\n padding: 3px 20px;\n clear: both;\n font-weight: normal;\n line-height: 1.428571429;\n color: #333333;\n white-space: nowrap;\n &:hover, &:focus {\n color: #ffffff;\n text-decoration: none;\n background-color: #428bca;\n }\n }\n }\n }\n}\n\n"
},
{
"path": "client/app/assets/less/inc/edit-in-place.less",
"content": ".edit-in-place {\n white-space: pre-line;\n display: inline-block;\n\n p {\n margin-bottom: 0;\n }\n\n .editable {\n display: inline-block;\n cursor: pointer;\n\n &:hover {\n background: @redash-yellow;\n border-radius: @redash-radius;\n }\n }\n\n &.active input,\n &.active textarea {\n display: inline-block;\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/flex.less",
"content": ".d-flex { display: flex !important; }\n.d-inline-flex { display: inline-flex !important; }\n\n.flex-row { flex-direction: row !important; }\n.flex-column { flex-direction: column !important; }\n.flex-row-reverse { flex-direction: row-reverse !important; }\n.flex-column-reverse { flex-direction: column-reverse !important; }\n\n.flex-wrap { flex-wrap: wrap !important; }\n.flex-nowrap { flex-wrap: nowrap !important; }\n.flex-wrap-reverse { flex-wrap: wrap-reverse !important; }\n.flex-fill { flex: 1 1 auto !important; }\n\n.justify-content-start { justify-content: flex-start !important; }\n.justify-content-end { justify-content: flex-end !important; }\n.justify-content-center { justify-content: center !important; }\n.justify-content-between { justify-content: space-between !important; }\n.justify-content-around { justify-content: space-around !important; }\n\n.align-items-start { align-items: flex-start !important; }\n.align-items-end { align-items: flex-end !important; }\n.align-items-center { align-items: center !important; }\n.align-items-baseline { align-items: baseline !important; }\n.align-items-stretch { align-items: stretch !important; }\n\n.align-content-start { align-content: flex-start !important; }\n.align-content-end { align-content: flex-end !important; }\n.align-content-center { align-content: center !important; }\n.align-content-between { align-content: space-between !important; }\n.align-content-around { align-content: space-around !important; }\n.align-content-stretch { align-content: stretch !important; }\n\n.align-self-auto { align-self: auto !important; }\n.align-self-start { align-self: flex-start !important; }\n.align-self-end { align-self: flex-end !important; }\n.align-self-center { align-self: center !important; }\n.align-self-baseline { align-self: baseline !important; }\n.align-self-stretch { align-self: stretch !important; }\n"
},
{
"path": "client/app/assets/less/inc/font.less",
"content": "///* --------------------------------------------------------\n// Roboto Light - 300\n//-----------------------------------------------------------*/\n//.font-face(roboto, 'Roboto-Light-webfont', 300, normal);\n//\n//\n///* --------------------------------------------------------\n// Roboto Regular - 400\n//-----------------------------------------------------------*/\n//.font-face(roboto, 'Roboto-Regular-webfont', 400, normal);\n//\n//\n///* --------------------------------------------------------\n// Roboto Medium - 500\n//-----------------------------------------------------------*/\n//.font-face(roboto, 'Roboto-Medium-webfont', 500, normal);\n//\n//\n///* --------------------------------------------------------\n// Roboto Bold - 700\n//-----------------------------------------------------------*/\n//.font-face(roboto, 'Roboto-Bold-webfont', 700, normal);\n"
},
{
"path": "client/app/assets/less/inc/form.less",
"content": "label {\n font-weight: 500;\n}\n\ntextarea.v-resizable {\n resize: vertical;\n}\n\n.form-group {\n &.required {\n .control-label {\n &:after {\n content: \" *\";\n color: inherit;\n }\n }\n }\n &.has-error {\n .help-block {\n &.error {\n display: block;\n }\n }\n }\n .help-block {\n &.error {\n display: none;\n }\n }\n}\n\n/* --------------------------------------------------------\n Input Fields\n-----------------------------------------------------------*/\n.form-control {\n .transition(all);\n .transition-duration(300ms);\n resize: none;\n box-shadow: 0 0 0 40px rgba(0, 0, 0, 0) !important;\n border-radius: @redash-input-radius;\n\n &:focus {\n box-shadow: none !important;\n border-color: @blue;\n }\n &:hover {\n border-color: @blue;\n }\n}\n\n/* --------------------------------------------------------\n Custom Checkbox + Radio\n-----------------------------------------------------------*/\n.cra-validatation(@color) {\n input[type=\"checkbox\"],\n input[type=\"radio\"] {\n & + .input-helper {\n border-color: @color;\n }\n\n &:checked + .input-helper:before {\n background: @color;\n }\n }\n}\n\n.cr-alt {\n position: relative;\n padding-top: 0;\n margin: 0;\n\n label {\n position: relative;\n padding-left: 28px;\n }\n\n &.has-success {\n .cra-validatation(@green);\n }\n\n &.has-warning {\n .cra-validatation(@orange);\n }\n\n &.has-error {\n .cra-validatation(@red);\n }\n\n input[type=\"checkbox\"],\n input[type=\"radio\"] {\n .opacity(0);\n width: 20px;\n height: 20px;\n position: absolute;\n z-index: 10;\n margin: 0;\n top: 0;\n left: 0;\n cursor: pointer;\n\n & + .input-helper {\n border: 1px solid @input-border;\n width: 19px;\n height: 19px;\n background: #fff;\n position: absolute;\n left: 0;\n top: -1px;\n cursor: pointer;\n }\n\n &:checked + .input-helper:before {\n content: \"\";\n width: 9px;\n height: 9px;\n background: #31acff;\n position: absolute;\n left: 4px;\n top: 4px;\n }\n }\n\n input[type=\"radio\"] {\n & + i {\n border-radius: 50%;\n }\n\n &:checked + i:before {\n border-radius: 50%;\n }\n }\n\n &.disabled {\n .opacity(0.7);\n }\n}\n\n.checkbox-inline,\n.radio-inline {\n padding-left: 27px;\n}\n\n/* --------------------------------------------------------\n Input Addon\n-----------------------------------------------------------*/\n.input-group {\n .input-group-addon {\n min-width: 40px;\n color: #333;\n padding: 0;\n }\n\n &:not([class*=\"input-group-\"]) {\n .input-group-addon {\n font-size: 15px;\n }\n }\n}\n\n/* --------------------------------------------------------\n Toggle Switch\n-----------------------------------------------------------*/\n.ts-color(@color) {\n input {\n &:not(:disabled) {\n &:checked {\n & + .ts-helper {\n background: fade(@color, 50%);\n\n &:before {\n background: @color;\n }\n\n &:active {\n &:before {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px fade(@color, 20%);\n }\n }\n }\n }\n }\n }\n}\n\n.toggle-switch {\n display: inline-block;\n vertical-align: top;\n .user-select(none);\n\n .ts-label {\n display: inline-block;\n margin: 0 20px 0 0;\n vertical-align: top;\n -webkit-transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);\n transition: color 0.56s cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .ts-helper {\n display: inline-block;\n position: relative;\n width: 40px;\n height: 16px;\n border-radius: 8px;\n background: rgba(0, 0, 0, 0.26);\n -webkit-transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n vertical-align: middle;\n cursor: pointer;\n\n &:before {\n content: \"\";\n position: absolute;\n top: -4px;\n left: -4px;\n width: 24px;\n height: 24px;\n background: #fafafa;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);\n border-radius: 50%;\n webkit-transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1),\n box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1),\n box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n }\n }\n\n &:not(.disabled) {\n .ts-helper {\n &:active {\n &:before {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(128, 128, 128, 0.1);\n }\n }\n }\n }\n\n input {\n position: absolute;\n z-index: 1;\n width: 46px;\n margin: 0 0 0 -4px;\n height: 24px;\n .opacity(0);\n cursor: pointer;\n\n &:checked {\n & + .ts-helper {\n &:before {\n left: 20px;\n }\n }\n }\n }\n\n &:not([data-ts-color]) {\n .ts-color(@teal);\n }\n\n &.disabled {\n .opacity(0.6);\n }\n\n &[data-ts-color=\"red\"] {\n .ts-color(@red);\n }\n\n &[data-ts-color=\"blue\"] {\n .ts-color(@blue);\n }\n\n &[data-ts-color=\"amber\"] {\n .ts-color(@amber);\n }\n\n &[data-ts-color=\"purple\"] {\n .ts-color(@purple);\n }\n\n &[data-ts-color=\"pink\"] {\n .ts-color(@pink);\n }\n\n &[data-ts-color=\"lime\"] {\n .ts-color(@lime);\n }\n\n &[data-ts-color=\"cyan\"] {\n .ts-color(@cyan);\n }\n\n &[data-ts-color=\"green\"] {\n .ts-color(@green);\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/generics.less",
"content": "/* --------------------------------------------------------\r\n Generate Margin Classes (0px - 25px)\r\n margin, margin-top, margin-bottom, margin-left, margin-right\r\n-----------------------------------------------------------*/\r\n.margin (@label, @size: 1, @key:1) when (@size =< 30) {\r\n .m-@{key} {\r\n margin: @size !important;\r\n }\r\n\r\n .m-t-@{key} {\r\n margin-top: @size !important;\r\n }\r\n\r\n .m-b-@{key} {\r\n margin-bottom: @size !important;\r\n }\r\n\r\n .m-l-@{key} {\r\n margin-left: @size !important;\r\n }\r\n\r\n .m-r-@{key} {\r\n margin-right: @size !important;\r\n }\r\n\r\n .margin(@label - 5; @size + 5; @key + 5);\r\n}\r\n\r\n.margin(25, 0px, 0);\r\n\r\n.m-2 {\r\n margin: 2px;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Generate Padding Classes (0px - 25px)\r\n padding, padding-top, padding-bottom, padding-left, padding-right\r\n-----------------------------------------------------------*/\r\n.padding (@label, @size: 1, @key:1) when (@size =< 30) {\r\n .p-@{key} {\r\n padding: @size !important;\r\n }\r\n\r\n .p-t-@{key} {\r\n padding-top: @size !important;\r\n }\r\n\r\n .p-b-@{key} {\r\n padding-bottom: @size !important;\r\n }\r\n\r\n .p-l-@{key} {\r\n padding-left: @size !important;\r\n }\r\n\r\n .p-r-@{key} {\r\n padding-right: @size !important;\r\n }\r\n\r\n .padding(@label - 5; @size + 5; @key + 5);\r\n}\r\n\r\n.padding(25, 0px, 0);\r\n\r\n/* --------------------------------------------------------\r\n Generate Font-Size Classes (8px - 20px)\r\n-----------------------------------------------------------*/\r\n.font-size (@label, @size: 8, @key:10) when (@size =< 20) {\r\n .f-@{key} {\r\n font-size: @size !important;\r\n }\r\n\r\n .font-size(@label - 1; @size + 1; @key + 1);\r\n}\r\n\r\n.font-size(20, 8px, 8);\r\n\r\n.f-inherit {\r\n font-size: inherit !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Font Weight\r\n-----------------------------------------------------------*/\r\n.f-300 {\r\n font-weight: 300 !important;\r\n}\r\n.f-400 {\r\n font-weight: 400 !important;\r\n}\r\n.f-500 {\r\n font-weight: 500 !important;\r\n}\r\n.f-700 {\r\n font-weight: 700 !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Position\r\n-----------------------------------------------------------*/\r\n.p-relative {\r\n position: relative !important;\r\n}\r\n.p-absolute {\r\n position: absolute !important;\r\n}\r\n.p-fixed {\r\n position: fixed !important;\r\n}\r\n.p-static {\r\n position: static !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Overflow\r\n-----------------------------------------------------------*/\r\n.o-hidden {\r\n overflow: hidden !important;\r\n}\r\n.o-visible {\r\n overflow: visible !important;\r\n}\r\n.o-auto {\r\n overflow: auto !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Display\r\n-----------------------------------------------------------*/\r\n.di-block {\r\n display: inline-block !important;\r\n}\r\n.d-block {\r\n display: block;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Background Colors and Colors\r\n-----------------------------------------------------------*/\r\n@array: c-white bg-white @white, c-ace bg-ace @ace, c-black bg-black @black, c-brown bg-brown @brown,\r\n c-pink bg-pink @pink, c-red bg-red @red, c-blue bg-blue @blue, c-purple bg-purple @purple,\r\n c-deeppurple bg-deeppurple @deeppurple, c-lightblue bg-lightblue @lightblue, c-cyan bg-cyan @cyan,\r\n c-teal bg-teal @teal, c-green bg-green @green, c-lightgreen bg-lightgreen @lightgreen, c-lime bg-lime @lime,\r\n c-yellow bg-yellow @yellow, c-amber bg-amber @amber, c-orange bg-orange @orange,\r\n c-deeporange bg-deeporange @deeporange, c-gray bg-gray @gray, c-bluegray bg-bluegray @bluegray,\r\n c-indigo bg-indigo @indigo;\r\n\r\n.for(@array);\r\n.-each(@value) {\r\n @name: extract(@value, 1);\r\n @name2: extract(@value, 2);\r\n @color: extract(@value, 3);\r\n &.@{name2} {\r\n background-color: @color !important;\r\n }\r\n\r\n &.@{name} {\r\n color: @color !important;\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Background Colors\r\n-----------------------------------------------------------*/\r\n.bg-brand {\r\n background-color: @brand-bg;\r\n}\r\n.bg-black-trp {\r\n background-color: rgba(0, 0, 0, 0.12) !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Borders\r\n-----------------------------------------------------------*/\r\n.b-0 {\r\n border: 0 !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Width\r\n-----------------------------------------------------------*/\r\n.w-100 {\r\n width: 100% !important;\r\n}\r\n.w-50 {\r\n width: 50% !important;\r\n}\r\n.w-25 {\r\n width: 25% !important;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Border Radius\r\n-----------------------------------------------------------*/\r\n.brd-2 {\r\n border-radius: 2px;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Alignment\r\n-----------------------------------------------------------*/\r\n.va-top {\r\n vertical-align: top;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Screen readers\r\n-----------------------------------------------------------*/\r\n.sr-only {\r\n position: absolute;\r\n width: 1px;\r\n height: 1px;\r\n padding: 0;\r\n margin: -1px;\r\n overflow: hidden;\r\n clip: rect(0, 0, 0, 0);\r\n white-space: nowrap;\r\n border-width: 0;\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/header.less",
"content": "#header {\r\n width: 100%;\r\n z-index: 10;\r\n top: 0;\r\n left: 0;\r\n background-color: #fff;\r\n height: @header-height;\r\n \r\n &.affix {\r\n box-shadow: 0 0 20px rgba(0, 0, 0, 0.23);\r\n }\r\n \r\n &:not(.affix) {\r\n box-shadow: @tile-shadow;\r\n position: fixed;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Top Menu\r\n-----------------------------------------------------------*/\r\n.header-inner {\r\n padding: 0;\r\n margin: 0;\r\n width: 100%;\r\n list-style: none;\r\n\r\n & > li {\r\n &:not(.pull-right) {\r\n float: left;\r\n }\r\n \r\n @media (max-width: @screen-sm-min) {\r\n &:not(.top-search) {\r\n position: static;\r\n }\r\n \r\n .dropdown-menu {\r\n width: ~\"calc(100% - 30px)\";\r\n margin-left: 15px;\r\n }\r\n }\r\n\r\n & > a {\r\n height: @header-height;\r\n color: #333;\r\n min-width: 45px;\r\n display: block;\r\n position: relative;\r\n \r\n & > .zmdi {\r\n font-size: 22px;\r\n line-height: @header-height;\r\n }\r\n }\r\n \r\n &:not(.logo) {\r\n text-align: center;\r\n }\r\n \r\n &.open > a:not([class*=\"hi-\"]):before {\r\n content: \"\";\r\n width: 40px;\r\n height: 40px;\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n margin-top: -21px;\r\n margin-left: -20px;\r\n background: #eee;\r\n border-radius: 50%;\r\n z-index: -1;\r\n }\r\n }\r\n \r\n .dropdown-menu {\r\n margin-top: -5px; \r\n }\r\n \r\n .open {\r\n & > .hi-messages { color: @green; }\r\n & > .hi-notifications { color: @orange; }\r\n & > .hi-projects { color: @green; }\r\n & > .hi-events { color: @blue; }\r\n \r\n .hi-count {\r\n display: none;\r\n }\r\n }\r\n}\r\n\r\n.hi-count {\r\n position: absolute;\r\n font-style: normal;\r\n background-color: @red;\r\n padding: 0 4px;\r\n font-size: 10px;\r\n color: #fff;\r\n line-height: 17px;\r\n height: 17px;\r\n top: 11px;\r\n right: 6px;\r\n border-radius: 50%;\r\n width: 17px;\r\n}\r\n\r\n.hi-dropdown {\r\n padding: 0;\r\n \r\n @media (min-width: @screen-sm-min) {\r\n width: 350px;\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Logo\r\n-----------------------------------------------------------*/\r\n.logo {\r\n position: relative; \r\n z-index: 2;\r\n height: @logo-height;\r\n \r\n @media (min-width: (@screen-lg-min + 80px)) { \r\n width: @logo-width;\r\n background-color: #000;\r\n margin-right: 15px;\r\n \r\n & > a {\r\n padding: 15px 22px;\r\n }\r\n }\r\n \r\n @media (max-width: (@screen-md-max + 80px)) {\r\n width: @sidebar-left-mid-width;\r\n \r\n & > a {\r\n display: none !important;\r\n }\r\n }\r\n \r\n @media (max-width: (@screen-sm-min)) {\r\n padding: 12px;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Sidebar Trigger for mobile\r\n-----------------------------------------------------------*/\r\n#menu-trigger {\r\n font-size: 21px;\r\n text-align: center;\r\n color: #fff;\r\n cursor: pointer;\r\n display: none;\r\n background: #000;\r\n height: 100%;\r\n \r\n &.toggled i:before {\r\n content: '\\f2ea';\r\n }\r\n \r\n @media (min-width: (@screen-sm-min + 1)) {\r\n line-height: @header-height;\r\n }\r\n \r\n @media (max-width: (@screen-md-max + 80px)) {\r\n display: block;\r\n }\r\n \r\n @media (max-width: (@screen-sm-min)) {\r\n border-radius: 2px;\r\n line-height: 39px;\r\n }\r\n}\r\n \r\n\r\n/* --------------------------------------------------------\r\n Top Search\r\n-----------------------------------------------------------*/\r\n.top-search {\r\n position: relative;\r\n background: #fff;\r\n height: @header-height;\r\n \r\n &:not(.toggled) {\r\n width: 80px;\r\n margin-left: 15px;\r\n \r\n &:before {\r\n font-family: @font-icon;\r\n content: \"\\f1c3\";\r\n position: absolute;\r\n left: 0;\r\n top: 15px;\r\n font-size: 22px;\r\n z-index: 1;\r\n color: #333;\r\n }\r\n \r\n .ts-reset {\r\n display: none; \r\n }\r\n \r\n .ts-input {\r\n cursor: pointer;\r\n }\r\n \r\n @media (max-width: (@screen-xs-min - 150px)) {\r\n width: 20px;\r\n }\r\n }\r\n \r\n .ts-input {\r\n height: @header-height - 2px;\r\n padding-left: 25px;\r\n width: 100%;\r\n border: 0;\r\n position: relative;\r\n background: transparent;\r\n z-index: 1;\r\n }\r\n \r\n &.toggled {\r\n position: absolute;\r\n top: 0;\r\n font-size: 20px;\r\n font-weight: normal;\r\n z-index: 1;\r\n width: 100%;\r\n left: 0;\r\n \r\n @media (min-width: (@screen-lg-min + 80px)) {\r\n padding-left: @sidebar-left-width;\r\n }\r\n \r\n @media (min-width: (@screen-sm-min + 1px)) and (max-width: (@screen-md-max + 80px)) { \r\n padding-left: @sidebar-left-mid-width;\r\n }\r\n \r\n .ts-input {\r\n background: #fff;\r\n }\r\n \r\n .ts-reset {\r\n font-size: 11px; \r\n color: #fff; \r\n position: absolute;\r\n top: 50%;\r\n right: 15px;\r\n z-index: 2;\r\n width: 20px;\r\n height: 20px;\r\n background-color: #8E8E8E;\r\n line-height: 20px;\r\n text-align: center;\r\n border-radius: 50%;\r\n margin-top: -10px;\r\n \r\n &:hover {\r\n cursor: pointer;\r\n background: #333;\r\n }\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Events\r\n-----------------------------------------------------------*/\r\n.event-time {\r\n width: 67px; \r\n height: 50px;\r\n text-align: center;\r\n padding: 9px 0;\r\n color: #fff;\r\n border-radius: 2px;\r\n margin-top: 2px;\r\n \r\n & > h2 {\r\n margin: 0;\r\n line-height: 100%;\r\n font-size: 17px;\r\n margin-bottom: -1px;\r\n color: #fff;\r\n font-weight: normal;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Apps\r\n-----------------------------------------------------------*/\r\n@media (min-width: @screen-sm-min) {\r\n #launch-apps { \r\n padding: 0;\r\n text-align: center;\r\n width: 300px;\r\n }\r\n \r\n .la-body {\r\n padding: 20px 10px;\r\n }\r\n \r\n .lab-item {\r\n width: 60px;\r\n display: inline-block;\r\n margin: 10px;\r\n \r\n &:hover {\r\n & > a {\r\n .opacity(0.8);\r\n }\r\n \r\n & > small {\r\n color: #333;\r\n }\r\n }\r\n \r\n & > a {\r\n height: 60px;\r\n display: block;\r\n color: #fff;\r\n line-height: 70px;\r\n border-radius: 50%;\r\n .transition(opacity);\r\n \r\n & > i {\r\n font-size: 25px;\r\n }\r\n }\r\n \r\n & > small { \r\n color: #969696; \r\n display: block;\r\n margin-top: 5px; \r\n .transition(color);\r\n } \r\n \r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Time\r\n-----------------------------------------------------------*/\r\n#time {\r\n font-size: 18px;\r\n font-weight: 400;\r\n background-color: @sidebar;\r\n color: #FBFBFB;\r\n padding: 4px 11px;\r\n border-radius: 2px;\r\n margin: 14px;\r\n \r\n span {\r\n &:not(:last-child):after {\r\n content: \":\";\r\n position: relative;\r\n top: -1px;\r\n right: -1px;\r\n }\r\n }\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/ie-warning.less",
"content": ".ie-warning {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tz-index: 9999;\n\tbackground: @black;\n\twidth: 100%;\n\theight: 100%;\n\ttext-align: center;\n\tcolor: #fff;\n\tfont-family: \"Courier New\", Courier, monospace;\n\tpadding: 50px 0;\n\n\tp {\n\t\tfont-size: 17px;\n\t}\n \n .iew-container {\n min-width: 1024px;\n width: 100%;\n height: 200px;\n background: #fff;\n margin: 50px 0;\n }\n\n\t.iew-download {\n\t\tlist-style: none;\n\t\tpadding: 30px 0;\n\t\tmargin: 0 auto;\n width: 720px;\n\n\t\t& > li {\n\t\t\tfloat: left;\n\t\t\tvertical-align: top;\n\n\t\t\t& > a {\n\t\t\t\tdisplay: block;\n\t\t\t\tcolor: #000;\n\t\t\t\twidth: 140px;\n\t\t\t\tfont-size: 15px;\n\t\t\t\tpadding: 15px 0;\n\n\t\t\t\t& > div {\n\t\t\t\t\tmargin-top: 10px;\n\t\t\t\t}\n\n\t\t\t\t&:hover {\n\t\t\t\t\tbackground-color: #eee;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}"
},
{
"path": "client/app/assets/less/inc/jumbotron.less",
"content": ".jumbotron {\r\n padding-left: 60px;\r\n padding-right: 60px;\r\n}"
},
{
"path": "client/app/assets/less/inc/label.less",
"content": ".label {\r\n border-radius: 2px;\r\n padding: 3px 6px 4px;\r\n font-weight: 500;\r\n font-size: 11px;\r\n}\r\n\r\n.badge {\r\n border-radius: 1px;\r\n}\r\n\r\n.label-default {\r\n background: fade(@redash-gray, 85%);\r\n}\r\n\r\n.label-tag-unpublished {\r\n background: fade(@redash-gray, 85%);\r\n}\r\n\r\n.label-tag-archived {\r\n .label-warning();\r\n}\r\n\r\n.label-tag {\r\n background: fade(@redash-gray, 10%);\r\n color: fade(@redash-gray, 75%);\r\n}\r\n\r\n.label-tag-unpublished,\r\n.label-tag-archived,\r\n.label-tag {\r\n margin-right: 3px;\r\n display: inline;\r\n margin-top: 2px;\r\n max-width: 24ch;\r\n .text-overflow();\r\n}"
},
{
"path": "client/app/assets/less/inc/less-plugins/for.less",
"content": "\r\n.for(@i, @n) {.-each(@i)}\r\n.for(@n) when (isnumber(@n)) {.for(1, @n)}\r\n.for(@i, @n) when not (@i = @n) {\r\n .for((@i + (@n - @i) / abs(@n - @i)), @n);\r\n}\r\n\r\n.for(@array) when (default()) {.for-impl_(length(@array))}\r\n.for-impl_(@i) when (@i > 1) {.for-impl_((@i - 1))}\r\n.for-impl_(@i) when (@i > 0) {.-each(extract(@array, @i))}\r\n"
},
{
"path": "client/app/assets/less/inc/list-group.less",
"content": ".list-group {\n margin-bottom: 0;\n\n &.lg-alt .list-group-item {\n border: 0;\n }\n\n &:not(.lg-alt) {\n &.lg-listview .list-group-item {\n border-left: 0;\n border-right: 0;\n\n &:last-child {\n border-bottom: 0;\n }\n }\n }\n}\n\n.max-character {\n .text-overflow();\n}\n\n.list-group-item {\n &.active {\n button {\n color: white;\n }\n }\n .cr-alt {\n line-height: 100%;\n margin-top: 2px;\n }\n\n &.active, &.active:hover, &.active:focus {\n background-color: #fff;\n box-shadow: inset 3px 0px 0px @brand-primary;\n }\n}\n\n.list-group-item-heading {\n margin-bottom: 2px;\n color: #333;\n\n & > small {\n font-size: 11px;\n color: #C5C5C5;\n margin-left: 10px;\n }\n}\n\n.list-group-item-heading,\n.list-group-item-text {\n .text-overflow();\n}\n\n.list-group-item-text {\n display: block;\n\n &:not(:last-child) {\n margin-bottom: 4px;\n }\n}\n\n.list-group-img {\n width: 38px;\n height: 38px;\n border-radius: 2px;\n}\n\n.ui-select-choices-row.disabled > span {\n background-color: inherit !important;\n}\n\n.list-group-item.inactive,\n.ui-select-choices-row.disabled {\n background-color: #eee !important;\n border-color: transparent;\n opacity: 0.5;\n box-shadow: none;\n color: #333;\n pointer-events: none;\n cursor: not-allowed;\n}"
},
{
"path": "client/app/assets/less/inc/list.less",
"content": ".clist {\r\n list-style: none;\r\n \r\n & > li {\r\n &:before {\r\n font-family: @font-icon;\r\n margin: 0 10px 0 -20px;\r\n vertical-align: middle;\r\n }\r\n }\r\n \r\n &.clist-angle > li:before {\r\n content: \"\\f2fb\";\r\n }\r\n \r\n &.clist-check > li:before {\r\n content: \"\\f26b\";\r\n }\r\n \r\n &.clist-star > li:before { \r\n content: \"\\f27d\";\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/login.less",
"content": ".login-content {\r\n overflow: hidden;\r\n height: 100%;\r\n background: @brand-bg;\r\n padding: 0;\r\n text-align: center;\r\n \r\n &:after {\r\n content: \"\";\r\n vertical-align: middle; \r\n display: inline-block;\r\n width: 1px;\r\n height: 100%;\r\n }\r\n}\r\n\r\n.lc-block {\r\n background: #fff;\r\n box-shadow: 0 1px 11px rgba(0, 0, 0, 0.27);\r\n border-radius: 2px;\r\n width: 300px;\r\n display: inline-block;\r\n vertical-align: middle;\r\n position: relative;\r\n padding: 45px 30px 30px;\r\n \r\n &:not(.toggled) {\r\n display: none;\r\n }\r\n \r\n &.toggled {\r\n .animated(fadeInUp, 300ms);\r\n z-index: 10;\r\n }\r\n \r\n @media (max-width: @screen-xs-max) {\r\n padding: 15px 35px 25px 20px;\r\n width: ~\"calc(100% - 60px)\";\r\n }\r\n \r\n .form-control {\r\n text-align: center;\r\n }\r\n}\r\n\r\n.lcb-float {\r\n width: 60px;\r\n height: 60px;\r\n background: #ffffff;\r\n border-radius: 50%;\r\n box-shadow: 0 -10px 19px rgba(0, 0, 0, 0.38);\r\n position: absolute;\r\n top: -35px;\r\n left: 50%;\r\n margin-left: -30px;\r\n \r\n img {\r\n width: 100%;\r\n height: 100%;\r\n border-radius: 50%;\r\n padding: 4px;\r\n }\r\n \r\n i {\r\n color: #333;\r\n font-size: 25px;\r\n line-height: 60px;\r\n }\r\n}\r\n\r\n.lcb-lockscreen {\r\n position: relative;\r\n \r\n .form-control {\r\n padding-right: 35px;\r\n }\r\n \r\n .lcbl-btn {\r\n background-color: #2196F3;\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n width: 30px;\r\n color: #fff;\r\n font-size: 15px;\r\n height: 27px;\r\n margin: 4px;\r\n line-height: 26px;\r\n border-radius: 2px;\r\n }\r\n}\r\n\r\n.login-navigation { \r\n list-style: none;\r\n padding: 0;\r\n margin: 0;\r\n position: absolute;\r\n width: 100%;\r\n text-align: center;\r\n left: 0%;\r\n bottom: -45px;\r\n\r\n & > li {\r\n display: inline-block;\r\n margin: 0 2px;\r\n .transition(all);\r\n .transition-duration(150ms);\r\n cursor: pointer;\r\n vertical-align: top;\r\n color: #fff;\r\n line-height: 16px;\r\n min-width: 16px; \r\n min-height: 16px;\r\n text-transform: uppercase;\r\n .backface-visibility(hidden); \r\n\r\n & > span {\r\n .opacity(0);\r\n }\r\n\r\n &:not(:hover) {\r\n font-size: 0px;\r\n border-radius: 100%;\r\n }\r\n\r\n &:hover {\r\n border-radius: 10px;\r\n padding: 0 5px;\r\n font-size: 8px; \r\n\r\n & > span {\r\n .opacity(1);\r\n } \r\n }\r\n\r\n }\r\n}\r\n\r\n"
},
{
"path": "client/app/assets/less/inc/media.less",
"content": "/* --------------------------------------------------------\r\n Thumbnail\r\n-----------------------------------------------------------*/\r\n.thumbnail {\r\n\ta&:hover,\r\n\ta&:focus,\r\n\ta&.active {\r\n\t border-color: @thumbnail-border;\r\n\t} \r\n} \r\n\r\n\r\n/* --------------------------------------------------------\r\n Lightbox\r\n-----------------------------------------------------------*/\r\n.lightbox {\r\n & > a {\r\n position: relative;\r\n .transition(opacity);\r\n .transition-duration(300ms);\r\n \r\n & > img {\r\n width: 100%;\r\n }\r\n \r\n &:hover {\r\n .opacity(0.8);\r\n }\r\n }\r\n \r\n & > a:not(.p-item) { //Not for photo items\r\n margin-bottom: 20px;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Carousel\r\n-----------------------------------------------------------*/\r\n.carousel {\r\n\t.carousel-control {\r\n\t\t.transition(all);\r\n\t\t.transition-duration(250ms);\r\n\t\t.opacity(0);\r\n\t\t\r\n\t\t.zmdi {\r\n\t\t\tposition: absolute;\r\n\t\t\ttop: 50%;\r\n\t\t\tleft: 50%;\r\n\t\t\tline-height: 100%;\r\n\t\t\t\r\n\t\t\t@media screen and (min-width: @screen-sm-min) {\r\n\t\t\t\tfont-size: 60px;\r\n\t\t\t\twidth: 60px;\r\n\t\t\t\theight: 60px;\r\n\t\t\t\tmargin-top: -30px;\r\n\t\t\t\tmargin-left: -30px;\r\n\t\t\t}\r\n\t\t\t\r\n\t\t\t@media screen and (max-width: @screen-sm-max) {\r\n\t\t\t\twidth: 24px;\r\n\t\t\t\theight: 24px;\r\n\t\t\t\tmargin-top: -12px;\r\n\t\t\t\tmargin-left: -12px;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\t\r\n\t&:hover {\r\n\t\t.carousel-control {\r\n\t\t\t.opacity(1);\r\n\t\t}\r\n\t}\r\n\t\r\n\t.carousel-caption {\r\n\t\tbackground: rgba(0,0,0,0.6);\r\n\t\tleft: 0;\r\n\t\tright: 0;\r\n\t\tbottom: 0;\r\n\t\twidth: 100%;\r\n\t\tpadding-bottom: 50px;\r\n\t\t\r\n\t\t& > h3 {\r\n\t\t\tcolor: #fff;\r\n\t\t\tmargin: 0 0 5px;\r\n\t\t\tfont-weight: 300;\r\n\t\t}\r\n\t\t\r\n\t\t& > p {\r\n\t\t\tmargin: 0;\r\n\t\t}\r\n\t\t\r\n\t\t@media screen and (max-width: @screen-sm-max) {\r\n\t\t\tdisplay: none;\r\n\t\t}\r\n\t}\r\n\t\r\n\t.carousel-indicators {\r\n\t\tbottom: 10px;\r\n\t\tmargin: 0;\r\n\t\tleft: 0;\r\n\t\tbottom: 0;\r\n\t\twidth: 100%;\r\n\t\tpadding: 0 0 6px;\r\n\t\tbackground: rgba(0,0,0,0.6);\r\n\t\t\r\n\t\tli {\r\n\t\t\tborder-radius: 0;\r\n\t\t\twidth: 15px;\r\n\t\t\tborder: 0;\r\n\t\t\tbackground: #fff;\r\n\t\t\theight: 3px;\r\n\t\t\tmargin: 0;\r\n\t\t\t.transition(all);\r\n\t\t\t.transition-duration(250ms);\r\n\t\t\t\r\n\t\t\t&.active {\r\n\t\t\t\twidth: 25px;\r\n\t\t\t\theight: 3px;\r\n\t\t\t\tbackground: @orange;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}"
},
{
"path": "client/app/assets/less/inc/messages.less",
"content": "#messages-main {\r\n position: relative;\r\n margin: 0 auto;\r\n .clearfix();\r\n \r\n .ms-menu {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n border-right: 1px solid #eee;\r\n padding-bottom: 50px;\r\n height: 100%;\r\n width: 240px;\r\n background: #fff;\r\n\r\n @media (max-width: @screen-xs-max) {\r\n height: ~\"calc(100% - 58px)\";\r\n display: none;\r\n z-index: 1;\r\n top: 58px;\r\n\r\n &.toggled {\r\n display: block;\r\n }\r\n }\r\n }\r\n \r\n .ms-body {\r\n @media (min-width: @screen-sm-min) {\r\n padding-left: 240px;\r\n }\r\n\r\n @media (max-width: @screen-xs-max) {\r\n overflow: hidden;\r\n }\r\n }\r\n \r\n .ms-user {\r\n padding: 15px;\r\n background: @ace;\r\n \r\n & > div {\r\n overflow: hidden;\r\n padding: 3px 5px 0px 15px;\r\n font-size: 11px;\r\n }\r\n }\r\n \r\n #ms-compose {\r\n position: fixed;\r\n bottom: 120px;\r\n z-index: 1;\r\n right: 30px;\r\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.14),0 4px 8px rgba(0, 0, 0, 0.28);\r\n }\r\n}\r\n\r\n#ms-menu-trigger {\r\n .user-select(none);\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n width: 50px;\r\n height: 100%;\r\n text-align: right;\r\n padding-right: 10px;\r\n padding-top: 19px;\r\n \r\n i {\r\n font-size: 21px;\r\n }\r\n\r\n &.toggled {\r\n i:before{\r\n content: '\\f2ea';\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n For Message\r\n-----------------------------------------------------------*/\r\n.message-feed {\r\n padding: 20px;\r\n \r\n &.right {\r\n text-align: right;\r\n \r\n & > .pull-right {\r\n margin-left: 15px;\r\n }\r\n }\r\n \r\n &:not(.right) {\r\n .mf-content {\r\n background: @amber;\r\n color: #fff;\r\n }\r\n \r\n \r\n }\r\n \r\n &.right .mf-content {\r\n background: #eee;\r\n }\r\n}\r\n\r\n.mf-content {\r\n padding: 12px 17px 13px;\r\n border-radius: 2px;\r\n display: inline-block;\r\n max-width: 80%;\r\n}\r\n\r\n.mf-date {\r\n display: block;\r\n color: #B3B3B3;\r\n margin-top: 7px;\r\n \r\n & > i {\r\n font-size: 14px;\r\n line-height: 100%;\r\n position: relative;\r\n top: 1px;\r\n }\r\n}\r\n\r\n.msb-reply {\r\n box-shadow: 0 -20px 20px -5px #fff;\r\n position: relative;\r\n margin-top: 30px;\r\n border-top: 1px solid #eee;\r\n background: @ace;\r\n \r\n textarea {\r\n width: 100%;\r\n font-size: 13px;\r\n border: 0;\r\n padding: 10px 15px;\r\n resize: none;\r\n height: 60px;\r\n background: transparent;\r\n }\r\n \r\n button {\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n border: 0;\r\n height: 100%;\r\n width: 60px;\r\n font-size: 25px;\r\n color: @blue;\r\n background: transparent;\r\n \r\n &:hover {\r\n background: #f2f2f2;\r\n }\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/misc.less",
"content": "/* --------------------------------------------------------\r\n Actions\r\n-----------------------------------------------------------*/\r\n.actions {\r\n position: absolute;\r\n list-style: none;\r\n padding: 0;\r\n margin: 0;\r\n \r\n & > li {\r\n display: inline-block;\r\n \r\n & > a {\r\n display: block;\r\n padding: 0 10px;\r\n \r\n & > i {\r\n font-size: 20px;\r\n }\r\n }\r\n }\r\n\r\n .dropdown-menu {\r\n min-width: 140px;\r\n margin-top: -8px;\r\n margin-right: -1px;\r\n }\r\n \r\n &:not(.a-alt) {\r\n & > li > a > i {\r\n color: #939393;\r\n }\r\n \r\n & > li.open > a > i,\r\n & > li > a:hover > i {\r\n color: #000;\r\n }\r\n }\r\n \r\n &.a-alt {\r\n & > li > a > i {\r\n color: #fff;\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n View More\r\n-----------------------------------------------------------*/\r\n.view-more {\r\n display: block;\r\n padding: 5px 10px;\r\n text-align: center;\r\n border-top: 1px solid darken(@light-gray, 3%);\r\n font-size: 12px;\r\n margin-top: 15px;\r\n color: #777777;\r\n \r\n &:hover {\r\n color: #333;\r\n background-color: @light-gray;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Page Header\r\n-----------------------------------------------------------*/\r\n.page-header {\r\n padding: 0 22px;\r\n font-weight: normal;\r\n font-size: 19px;\r\n margin: 0 0 20px 0;\r\n \r\n small {\r\n text-transform: none;\r\n display: block;\r\n font-size: 12px;\r\n color: #9C9C9C;\r\n margin-top: 7px;\r\n line-height: 140%;\r\n }\r\n \r\n h3 {\r\n margin: 0;\r\n font-weight: normal;\r\n font-size: 15px;\r\n color: #333;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Close\r\n-----------------------------------------------------------*/\r\n.close {\r\n font-weight: normal;\r\n text-shadow: none;\r\n .opacity(0.5);\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Action Header\r\n-----------------------------------------------------------*/\r\n.action-header {\r\n position: relative;\r\n background: @ace;\r\n padding: 15px 13px 15px 17px;\r\n}\r\n\r\n.ah-actions {\r\n z-index: 3;\r\n float: right;\r\n margin-top: 7px;\r\n position: relative;\r\n}\r\n\r\n.ah-label {\r\n color: #818181;\r\n display: inline-block;\r\n margin: 0;\r\n font-size: 14px;\r\n font-weight: normal;\r\n padding: 0 6px;\r\n line-height: 33px;\r\n vertical-align: middle;\r\n float: left;\r\n}\r\n\r\n.ah-search {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n height: 100%;\r\n width: 100%;\r\n z-index: 4;\r\n background: #fff;\r\n display: none;\r\n \r\n &:before {\r\n content: \"\\f1c3\";\r\n font-family: 'Material-Design-Iconic-Font';\r\n position: absolute;\r\n left: 24px;\r\n top: 17px;\r\n font-size: 22px;\r\n }\r\n}\r\n\r\n.ahs-input {\r\n border: 0;\r\n padding: 0 26px 0 55px;\r\n height: 63px;\r\n font-size: 18px;\r\n width: 100%;\r\n font-weight: 100;\r\n background: #fff;\r\n border-bottom: 1px solid #EEE;\r\n}\r\n\r\n.ahs-close {\r\n font-style: normal;\r\n position: absolute;\r\n top: 23px;\r\n right: 22px;\r\n font-size: 17px;\r\n width: 18px;\r\n height: 18px;\r\n background-color: #ADADAD;\r\n line-height: 100%;\r\n color: #fff;\r\n text-align: center;\r\n cursor: pointer;\r\n border-radius: 50%;\r\n \r\n &:hover {\r\n background: #333;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Load More\r\n-----------------------------------------------------------*/\r\n.load-more {\r\n text-align: center;\r\n margin-top: 30px;\r\n \r\n a {\r\n padding: 5px 10px 3px;\r\n display: inline-block;\r\n background-color: @red;\r\n color: #FFF;\r\n border-radius: 2px;\r\n white-space: nowrap;\r\n \r\n i {\r\n font-size: 20px;\r\n vertical-align: middle;\r\n position: relative;\r\n margin-top: -2px;\r\n }\r\n \r\n &:hover {\r\n background-color: darken(@red, 10%);\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Data List\r\n-----------------------------------------------------------*/\r\n.dl-horizontal dt {\r\n text-align: left;\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n User Avatar\r\n-----------------------------------------------------------*/\r\n.img-avatar {\r\n height: 37px;\r\n border-radius: 2px;\r\n width: 37px;\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Percy\r\n-----------------------------------------------------------*/\r\n@media only percy {\r\n .hide-in-percy, .pace {\r\n visibility: hidden;\r\n }\r\n\r\n // hide tooltips in Percy\r\n .ant-tooltip {\r\n display: none !important;\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/mixins.less",
"content": "/* --------------------------------------------------------\r\n Font Face\r\n-----------------------------------------------------------*/\r\n.font-face(@family, @name, @weight: 300, @style){\r\n @font-face{\r\n font-family: @family;\r\n src:url('../fonts/@{family}/@{name}.eot');\r\n src:url('../fonts/@{family}/@{name}.eot?#iefix') format('embedded-opentype'),\r\n url('../fonts/@{family}/@{name}.woff') format('woff'),\r\n url('../fonts/@{family}/@{name}.ttf') format('truetype'),\r\n url('../fonts/@{family}/@{name}.svg#icon') format('svg');\r\n font-weight: @weight;\r\n font-style: @style;\r\n }\r\n}\r\n\r\n/* --------------------------------------------------------\r\n Button Varients\r\n-----------------------------------------------------------*/\r\n.button-variant(@color; @background; @border) {\r\n color: @color;\r\n background-color: @background;\r\n border-color: @border;\r\n \r\n &:hover,\r\n &:focus,\r\n &.focus,\r\n &:active,\r\n &.active,\r\n .open > .dropdown-toggle& {\r\n color: @color;\r\n background-color: darken(@background, 2%);\r\n border-color: darken(@border, 1%);\r\n }\r\n &:active,\r\n &.active,\r\n .open > .dropdown-toggle& {\r\n background-image: none;\r\n }\r\n &.disabled,\r\n &[disabled],\r\n fieldset[disabled] & {\r\n &,\r\n &:hover,\r\n &:focus,\r\n &.focus,\r\n &:active,\r\n &.active {\r\n background-color: @background;\r\n border-color: @border;\r\n }\r\n }\r\n \r\n .badge {\r\n color: @background;\r\n background-color: @color;\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n CSS Transform - Scale and Rotate\r\n-----------------------------------------------------------*/\r\n.scale-rotate(@scale, @rotate) {\r\n -webkit-transform: scale(@scale) rotate(@rotate);\r\n -ms-transform: scale(@scale) rotate(@rotate);\r\n -o-transform: scale(@scale) rotate(@rotate);\r\n transform: scale(@scale) rotate(@rotate);\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n CSS Animations based on animate.css\r\n-----------------------------------------------------------*/\r\n.animated(@name, @duration) {\r\n -webkit-animation-name: @name;\r\n animation-name: @name;\r\n -webkit-animation-duration: @duration;\r\n animation-duration: @duration;\r\n -webkit-animation-fill-mode: both;\r\n animation-fill-mode: both;\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/modal.less",
"content": ".modal-header {\n padding: 23px 26px;\n}\n\n.modal-body {\n padding: 0 26px 10px;\n}\n\n.modal-content {\n box-shadow: 0 5px 20px rgba(0, 0, 0, 0.31);\n}\n\n.modal-footer {\n padding: 20px 26px;\n}\n\n.modal-xl {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n overflow: hidden;\n .modal-dialog {\n position: fixed;\n margin: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n }\n .modal-content {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n border: 2px solid #3c7dcf;\n border-radius: 0;\n box-shadow: none;\n }\n .modal-header {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n height: 50px;\n padding: 10px;\n border: 0;\n }\n .modal-body {\n position: absolute;\n top: 50px;\n bottom: 60px;\n width: 100%;\n overflow: auto;\n }\n .modal-footer {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 60px;\n padding: 10px;\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/panel.less",
"content": ".panel {\r\n box-shadow: none;\r\n border: 0;\r\n}\r\n\r\n.panel-heading {\r\n padding: 0;\r\n >p {\r\n &:last-child {\r\n margin-bottom: 0px;\r\n }\r\n }\r\n >a, .query-link {\r\n color: inherit;\r\n }\r\n .query-link {\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n }\r\n}\r\n\r\n.panel-title {\r\n & > a {\r\n padding: 10px 15px;\r\n display: block;\r\n font-size: 13px;\r\n }\r\n}\r\n\r\n.panel-collapse {\r\n .panel-heading {\r\n position: relative;\r\n\r\n .panel-title {\r\n & > a {\r\n padding: 8px 5px 16px 30px;\r\n color: #000;\r\n position: relative;\r\n border-bottom: 2px solid #eee;\r\n }\r\n }\r\n\r\n &:before {\r\n font-family: @font-icon;\r\n font-size: 17px;\r\n position: absolute;\r\n left: 0;\r\n top: 4px;\r\n content: \"\\f278\";\r\n }\r\n\r\n &.active {\r\n &:before {\r\n content: \"\\f273\";\r\n }\r\n }\r\n }\r\n\r\n\r\n .panel-body {\r\n border-top: 0 !important;\r\n padding-left: 5px;\r\n padding-right: 5px;\r\n }\r\n}\r\n\r\n.panel-collapse-color(@color) {\r\n .panel-collapse {\r\n .panel-heading {\r\n &.active .panel-title > a {\r\n border-bottom-color: @color;\r\n }\r\n }\r\n }\r\n}\r\n\r\n.panel-group {\r\n &:not([data-collapse-color]) {\r\n .panel-collapse-color(@blue);\r\n }\r\n\r\n &[data-collapse-color=\"red\"] {\r\n .panel-collapse-color(@red);\r\n }\r\n\r\n &[data-collapse-color=\"green\"] {\r\n .panel-collapse-color(@green);\r\n }\r\n\r\n &[data-collapse-color=\"amber\"] {\r\n .panel-collapse-color(@amber);\r\n }\r\n\r\n &[data-collapse-color=\"teal\"] {\r\n .panel-collapse-color(@teal);\r\n }\r\n\r\n &[data-collapse-color=\"black\"] {\r\n .panel-collapse-color(@black);\r\n }\r\n\r\n &[data-collapse-color=\"cyan\"] {\r\n .panel-collapse-color(@cyan);\r\n }\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/photos.less",
"content": ".photos {\r\n &:not(.pmb-block) {\r\n margin: 10px 5px 0;\r\n }\r\n \r\n .p-item {\r\n padding: 0 3px;\r\n margin-bottom: 6px;\r\n }\r\n}\r\n\r\n.p-item {\r\n & > img {\r\n border-radius: 2px;\r\n }\r\n}\r\n \r\n.p-timeline {\r\n position: relative;\r\n padding-left: 80px;\r\n margin-bottom: 75px;\r\n \r\n .p-item {\r\n float: left;\r\n width: 70px;\r\n height: 70px;\r\n margin: 0 3px 3px 0;\r\n }\r\n \r\n \r\n &:last-child .pt-line:before {\r\n height: 100%;\r\n }\r\n}\r\n\r\n.ptb-title { \r\n font-size: 15px;\r\n font-weight: 400; \r\n margin-bottom: 20px; \r\n}\r\n\r\n.pt-line {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n height: 100%;\r\n line-height: 14px;\r\n \r\n &:before,\r\n &:after {\r\n content: \"\";\r\n position: absolute;\r\n }\r\n \r\n &:before {\r\n width: 1px;\r\n height: ~\"calc(100% + 63px)\";\r\n background: #E2E2E2;\r\n top: 14px;\r\n right: -20px;\r\n }\r\n \r\n &:after {\r\n top: 2px;\r\n right: -26px;\r\n width: 13px;\r\n height: 13px;\r\n border: 1px solid #C1C1C1;\r\n border-radius: 50%;\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/popover.less",
"content": ".popover {\r\n box-shadow: fade(@redash-gray, 25%) 0px 0px 15px 0px;\r\n}\r\n\r\n.popover-title {\r\n border-bottom: 0;\r\n padding: 15px; \r\n font-size: 12px;\r\n text-transform: uppercase;\r\n \r\n & + .popover-content { \r\n padding-top: 0;\r\n }\r\n} \r\n\r\n.popover-content {\r\n padding: 15px; \r\n \r\n p {\r\n margin-bottom: 0; \r\n }\r\n} "
},
{
"path": "client/app/assets/less/inc/pricing-table.less",
"content": ".pricing-table {\r\n margin-top: 50px;\r\n}\r\n\r\n.pt-inner {\r\n text-align: center;\r\n \r\n .pti-header {\r\n padding: 45px 10px 70px;\r\n color: #fff;\r\n position: relative;\r\n margin-bottom: 15px;\r\n\r\n \r\n & > h2 {\r\n margin: 0;\r\n line-height: 100%;\r\n color: #fff;\r\n font-weight: 100;\r\n font-size: 50px;\r\n\r\n small {\r\n color: #fff;\r\n letter-spacing: 0;\r\n vertical-align: top;\r\n font-size: 16px;\r\n font-weight: 100;\r\n }\r\n }\r\n \r\n .ptih-title {\r\n background-color: rgba(0, 0, 0, 0.1);\r\n padding: 8px 10px 9px;\r\n text-transform: uppercase;\r\n margin: 0 -10px;\r\n position: absolute;\r\n width: 100%;\r\n bottom: 0;\r\n }\r\n }\r\n \r\n .pti-body {\r\n padding: 0 23px;\r\n \r\n .ptib-item {\r\n padding: 15px 0;\r\n font-weight: 400;\r\n\r\n &:not(:last-child) {\r\n border-bottom: 1px solid #eee;\r\n }\r\n }\r\n }\r\n \r\n .pti-footer {\r\n padding: 10px 20px 30px;\r\n \r\n & > a {\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n text-align: center;\r\n color: #fff;\r\n display: inline-block;\r\n line-height: 60px;\r\n font-size: 30px;\r\n \r\n &:hover {\r\n .opacity(0.85);\r\n }\r\n }\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/print.less",
"content": "@media print { \r\n @page {\r\n margin: 0;\r\n padding: 0;\r\n size: auto;\r\n }\r\n \r\n body, #content, .container {\r\n margin: 0mm 0mm 0mm 0mm !important;\r\n padding: 0mm !important;\r\n }\r\n \r\n \r\n #header,\r\n #sidebar,\r\n #chat,\r\n .growl-animated,\r\n [data-action=\"print\"] {\r\n display: none !important;\r\n }\r\n\r\n \r\n /* --------------------------------------------------------\r\n Invoice\r\n -----------------------------------------------------------*/\r\n .invoice {\r\n padding: 30px !important;\r\n -webkit-print-color-adjust: exact !important; \r\n \r\n .card-header {\r\n background: #eee !important;\r\n padding: 20px;\r\n margin-bottom: 20px;\r\n margin: -60px -30px 25px -30px;\r\n }\r\n \r\n \r\n .page-header { \r\n display: none;\r\n } \r\n \r\n .highlight {\r\n background: #eee !important; \r\n }\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/profile.less",
"content": "#profile-main {\r\n min-height: 500px;\r\n position: relative;\r\n}\r\n\r\n.pm-overview {\r\n overflow: hidden !important;\r\n \r\n @media (min-width: 1200px) {\r\n width: 300px;\r\n }\r\n \r\n @media (min-width: @screen-sm-min) and (max-width: 1200px) {\r\n width: 250px;\r\n }\r\n \r\n @media (min-width: @screen-sm-min) {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n height: 100%;\r\n background: #f8f8f8;\r\n border-right: 1px solid #eee;\r\n }\r\n \r\n @media (max-width: @screen-xs-max) {\r\n width: 100%;\r\n background: #333;\r\n text-align: center;\r\n }\r\n \r\n &:hover {\r\n .pmop-edit {\r\n .opacity(1);\r\n color: #fff;\r\n }\r\n }\r\n}\r\n\r\n.pm-body {\r\n @media (min-width: 1200px) {\r\n padding-left: 300px;\r\n }\r\n \r\n @media (min-width: @screen-sm-min) and (max-width: 1200px) {\r\n padding-left: 250px;\r\n }\r\n \r\n @media (max-width: @screen-xs-max) {\r\n padding-left: 0; \r\n }\r\n}\r\n\r\n.pmo-pic {\r\n position: relative;\r\n margin: 20px;\r\n \r\n img { \r\n @media(min-width: @screen-sm-min) {\r\n width: 100%;\r\n border-radius: 2px 2px 0 0;\r\n }\r\n \r\n @media(max-width: @screen-xs-max) {\r\n width: 180px;\r\n display: inline-block;\r\n height: 180px;\r\n border-radius: 50%;\r\n border: 4px solid #fff;\r\n }\r\n }\r\n}\r\n\r\n.pmo-stat {\r\n border-radius: 0 0 2px 2px;\r\n color: #fff;\r\n text-align: center;\r\n padding: 30px 5px 0;\r\n \r\n @media(min-width: @screen-sm-min) {\r\n background: @amber;\r\n padding-bottom: 15px;\r\n }\r\n}\r\n\r\n.pmop-edit {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n color: #fff;\r\n background: rgba(0, 0, 0, 0.38);\r\n text-align: center;\r\n padding: 10px 10px 11px; \r\n \r\n &:hover {\r\n background: rgba(0, 0, 0, 0.8);\r\n }\r\n \r\n i {\r\n font-size: 18px;\r\n vertical-align: middle;\r\n margin-top: -3px;\r\n }\r\n \r\n @media (min-width: @screen-sm-min) {\r\n width: 100%;\r\n .opacity(0);\r\n \r\n i {\r\n margin-right: 4px;\r\n }\r\n }\r\n}\r\n\r\n.pmop-message {\r\n position: absolute;\r\n bottom: 27px;\r\n left: 50%; \r\n margin-left: -25px;\r\n \r\n .dropdown-menu {\r\n padding: 5px 0 55px; \r\n left: -90px;\r\n width: 228px;\r\n height: 150px;\r\n top: -74px;\r\n \r\n textarea {\r\n width: 100%;\r\n height: 95px;\r\n border: 0;\r\n resize: none;\r\n padding: 10px 19px;\r\n }\r\n \r\n button {\r\n position: absolute;\r\n bottom: 5px;\r\n left: 93px;\r\n }\r\n }\r\n}\r\n \r\n.pmb-block {\r\n margin-bottom: 20px;\r\n \r\n @media (min-width: 1200px) {\r\n padding: 40px 42px 0;\r\n }\r\n \r\n @media (max-width: 1199px) {\r\n padding: 30px 20px 0;\r\n }\r\n \r\n &:last-child {\r\n margin-bottom: 50px;\r\n }\r\n \r\n &.toggled {\r\n .pmbb-edit {\r\n display: block;\r\n }\r\n \r\n .pmbb-view {\r\n display: none;\r\n }\r\n }\r\n}\r\n\r\n.pmbb-header {\r\n margin-bottom: 25px;\r\n position: relative;\r\n \r\n .actions {\r\n position: absolute;\r\n top: -2px;\r\n right: 0;\r\n }\r\n \r\n h2 {\r\n margin: 0;\r\n font-weight: 100;\r\n font-size: 20px;\r\n }\r\n}\r\n\r\n.pmbb-edit {\r\n position: relative;\r\n z-index: 1; \r\n display: none;\r\n}\r\n\r\n.pmo-block {\r\n padding: 25px;\r\n \r\n & > h2 {\r\n font-size: 16px;\r\n margin: 0 0 15px;\r\n }\r\n}\r\n\r\n.pmo-items {\r\n .pmob-body {\r\n padding: 0 10px;\r\n }\r\n \r\n a {\r\n display: block;\r\n padding: 4px;\r\n \r\n img {\r\n width: 100%;\r\n }\r\n }\r\n}\r\n\r\n.pmopm-send {\r\n background-color: #fff;\r\n width: 50px;\r\n height: 50px;\r\n font-size: 24px;\r\n line-height: 53px;\r\n border-radius: 50%;\r\n position: absolute;\r\n color: #333;\r\n bottom: -50px;\r\n box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.16);\r\n text-align: center;\r\n \r\n &:hover {\r\n color: #000;\r\n }\r\n}\r\n\r\n.pmo-contact {\r\n ul {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0; \r\n \r\n li {\r\n position: relative;\r\n padding: 8px 0 8px 35px;\r\n \r\n i {\r\n font-size: 18px;\r\n vertical-align: top;\r\n line-height: 100%;\r\n position: absolute;\r\n left: 0;\r\n width: 18px;\r\n text-align: center;\r\n color: #333;\r\n }\r\n }\r\n }\r\n}\r\n\r\n.pmo-map {\r\n margin: 20px -21px -18px;\r\n display: block;\r\n \r\n img {\r\n width: 100%;\r\n }\r\n}\r\n\r\n.p-header {\r\n position: relative;\r\n margin: 0 -7px;\r\n \r\n .actions {\r\n position: absolute;\r\n top: -18px;\r\n right: 0;\r\n }\r\n}\r\n\r\n.p-menu {\r\n list-style: none;\r\n padding: 0 8px;\r\n margin: 0 0 30px;\r\n \r\n & > li {\r\n display: inline-block;\r\n vertical-align: top;\r\n \r\n & > a {\r\n display: block;\r\n padding: 5px 20px 5px 0;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n font-size: 15px;\r\n \r\n & > i {\r\n margin-right: 4px;\r\n font-size: 20px;\r\n vertical-align: middle;\r\n margin-top: -5px;\r\n }\r\n }\r\n \r\n &:not(.active) > a {\r\n color: #4285F4;\r\n \r\n &:hover {\r\n color: #333;\r\n }\r\n }\r\n \r\n &.active > a {\r\n color: #000;\r\n }\r\n }\r\n \r\n .pm-search {\r\n @media(max-width: @screen-sm-max) {\r\n margin: 20px 2px 30px;\r\n display: block;\r\n \r\n input[type=\"text\"] {\r\n width: 100%;\r\n border: 1px solid #ccc;\r\n }\r\n }\r\n }\r\n \r\n .pms-inner {\r\n margin: -2px 0 0;\r\n position: relative;\r\n top: -2px;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n \r\n i {\r\n vertical-align: top;\r\n font-size: 20px;\r\n line-height: 100%;\r\n position: absolute;\r\n left: 9px;\r\n top: 8px;\r\n color: #333;\r\n }\r\n \r\n input[type=\"text\"] {\r\n height: 35px;\r\n border-radius: 2px;\r\n padding: 0 10px 0 40px;\r\n \r\n @media(min-width: @screen-sm-min) {\r\n border: 1px solid #fff; \r\n width: 50px;\r\n background: transparent;\r\n position: relative;\r\n z-index: 1;\r\n .transition(all);\r\n .transition-duration(300ms);\r\n \r\n &:focus {\r\n border-color: #DFDFDF;\r\n width: 200px;\r\n }\r\n }\r\n }\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/progress-bar.less",
"content": ".progress {\r\n box-shadow: none;\r\n border-radius: 0;\r\n height: 5px;\r\n margin-bottom: 0;\r\n \r\n .progress-bar {\r\n box-shadow: none;\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/schema-browser.less",
"content": ".schema-container {\n height: 100%;\n z-index: 10;\n background-color: white;\n\n .schema-browser {\n overflow: hidden;\n border: none;\n padding-top: 10px;\n position: relative;\n height: 100%;\n\n .schema-loading-state {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n }\n\n .collapse.in {\n background: transparent;\n }\n\n .copy-to-editor {\n visibility: hidden;\n color: fade(@redash-gray, 90%);\n width: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: none;\n }\n\n .schema-list-item {\n display: flex;\n border-radius: @redash-radius;\n height: 22px;\n\n .table-name {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n cursor: pointer;\n padding: 2px 22px 2px 10px;\n }\n\n &:hover,\n &:focus,\n &:focus-within {\n background: fade(@redash-gray, 10%);\n\n .copy-to-editor {\n visibility: visible;\n }\n }\n }\n\n .table-open {\n .table-open-item {\n display: flex;\n height: 18px;\n width: calc(100% - 22px);\n padding-left: 22px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n transition: none;\n\n div:first-child {\n flex: 1;\n }\n\n .column-type {\n color: fade(@text-color, 80%);\n font-size: 10px;\n margin-left: 2px;\n text-transform: uppercase;\n }\n\n &:hover,\n &:focus,\n &:focus-within {\n background: fade(@redash-gray, 10%);\n\n .copy-to-editor {\n visibility: visible;\n }\n }\n }\n }\n }\n\n .schema-control {\n display: flex;\n flex-wrap: nowrap;\n padding: 0;\n\n .ant-btn {\n height: auto;\n }\n }\n\n .parameter-label {\n display: block;\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/sidebar.less",
"content": "#sidebar {\r\n background-color: @sidebar;\r\n position: fixed;\r\n left: 0;\r\n top: @header-height;\r\n z-index: 9;\r\n height: ~\"calc(100% - 62px)\";\r\n \r\n @media (min-width: (@screen-lg-min + 80px)), (max-width: (@screen-sm-min)) { \r\n width: @sidebar-left-width;\r\n overflow: auto;\r\n }\r\n \r\n @media (min-width: @screen-sm-min) and (max-width: (@screen-md-max + 80px)) {\r\n &:not(.toggled) {\r\n width: @sidebar-left-mid-width;\r\n overflow: visible;\r\n }\r\n \r\n &.toggled {\r\n width: @sidebar-left-width;\r\n overflow: auto;\r\n }\r\n }\r\n \r\n @media (max-width: @screen-sm-min) {\r\n display: none;\r\n \r\n &.toggled {\r\n display: block;\r\n z-index: 12;\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Profile Menu\r\n-----------------------------------------------------------*/\r\n.sms-profile {\r\n margin: 12px 0 10px;\r\n \r\n & > a {\r\n padding: 15px;\r\n display: block;\r\n color: @color-dark;\r\n \r\n & > img {\r\n width: 28px;\r\n height: 28px;\r\n border-radius: 50%;\r\n float: left;\r\n margin-right: 10px;\r\n margin-top: 3px;\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Sidebar Menu\r\n-----------------------------------------------------------*/\r\n.side-menu {\r\n list-style: none;\r\n padding: 0;\r\n \r\n a {\r\n color: @color-dark;\r\n }\r\n \r\n & > li {\r\n width: 100%;\r\n display: block;\r\n \r\n & > a {\r\n display: block;\r\n padding: 9px 10px 9px 16px;\r\n position: relative;\r\n white-space: nowrap;\r\n .transition(color); \r\n\r\n & > .zmdi {\r\n font-size: 13px;\r\n width: 28px;\r\n height: 28px;\r\n border-radius: 50%;\r\n background-color: #000;\r\n line-height: 29px;\r\n margin-right: 7px;\r\n text-align: center;\r\n }\r\n \r\n .label {\r\n position: absolute;\r\n top: 15px;\r\n right: 12px;\r\n }\r\n }\r\n \r\n &.active > a,\r\n &:hover > a {\r\n color: #fff;\r\n }\r\n \r\n &.active > a {\r\n background: @sidebar-active-bg;\r\n \r\n .zmdi {\r\n background: #2C313A;\r\n color: #fff;\r\n }\r\n }\r\n }\r\n}\r\n\r\n.sm-sub {\r\n position: relative;\r\n \r\n &:not(.active) {\r\n & > ul {\r\n display: none;\r\n }\r\n }\r\n \r\n & > ul {\r\n position: relative;\r\n width: 100%;\r\n padding: 0 0 0 27px;\r\n background: darken(@sidebar, 1.5%);\r\n margin-bottom: 0;\r\n border: 0;\r\n list-style: none;\r\n \r\n &:before {\r\n content: \"\"; \r\n height: 100%;\r\n width: 1px;\r\n position: absolute;\r\n background: #1f2229;\r\n left: 30px;\r\n top: 0;\r\n }\r\n \r\n & > li {\r\n & > a {\r\n padding: 7px 18px 7px 28px;\r\n font-size: 12px;\r\n display: block;\r\n position: relative;\r\n white-space: nowrap;\r\n .transition(color);\r\n \r\n &:hover {\r\n color: #fff; \r\n }\r\n \r\n &:before {\r\n content: \"\";\r\n width: 8px;\r\n height: 1px;\r\n background: #22252d;\r\n position: absolute;\r\n left: 4px; \r\n top: 14px;\r\n }\r\n }\r\n \r\n &.active > a {\r\n color: #fff;\r\n }\r\n \r\n &:first-child > a {\r\n &:before {\r\n top: 20px;\r\n }\r\n \r\n padding-top: 13px;\r\n }\r\n \r\n &:last-child > a {\r\n padding-bottom: 13px;\r\n }\r\n }\r\n }\r\n}\r\n\r\n\r\n/* --------------------------------------------------------\r\n Sidebar for mid size screens\r\n-----------------------------------------------------------*/\r\n@media (min-width: @screen-sm-min) and (max-width: (@screen-md-max + 80px)) {\r\n #sidebar:not(.toggled) {\r\n .side-menu > li {\r\n & > a {\r\n & > span {\r\n position: absolute;\r\n left: @sidebar-left-mid-width;\r\n background-color: @sidebar-active-bg;\r\n width: 180px;\r\n padding: 14px 18px;\r\n display: none;\r\n text-transform: uppercase;\r\n .animated(fadeIn, 300ms);\r\n }\r\n \r\n .label {\r\n display: none;\r\n }\r\n }\r\n \r\n &.sms-bottom > a > span {\r\n bottom: 0;\r\n }\r\n \r\n &:not(.sms-bottom) > a > span {\r\n top: 0;\r\n }\r\n \r\n &:hover {\r\n & a > span {\r\n display: block;\r\n }\r\n }\r\n }\r\n \r\n .sm-sub {\r\n & > ul {\r\n display: none !important;\r\n position: absolute;\r\n left: @sidebar-left-mid-width;\r\n width: 180px;\r\n padding-left: 0;\r\n .animated(fadeIn, 300ms);\r\n \r\n &:before {\r\n display: none;\r\n }\r\n \r\n & > li > a {\r\n padding-left: 18px;\r\n \r\n &:before {\r\n display: none;\r\n }\r\n }\r\n }\r\n \r\n &:not(.sms-bottom) > ul {\r\n top: 46px;\r\n border-top: 1px solid lighten(@sidebar, 5%);\r\n }\r\n \r\n &.sms-bottom > ul {\r\n bottom: 46px;\r\n border-bottom: 1px solid lighten(@sidebar, 5%);\r\n }\r\n \r\n &:hover {\r\n & > ul {\r\n display: block !important;\r\n }\r\n }\r\n }\r\n }\r\n}"
},
{
"path": "client/app/assets/less/inc/table.less",
"content": ".table {\n margin-bottom: 0;\n\n th.sortable-column {\n cursor: pointer;\n }\n\n &:not(.table-striped) > thead > tr > th {\n background-color: #fafafa;\n }\n\n [class*=\"bg-\"] {\n & > tr > th {\n color: #fff;\n border-bottom: 0;\n background: transparent !important;\n }\n\n & + tbody > tr:first-child > td {\n border-top: 0;\n }\n }\n\n & > thead > tr > th {\n vertical-align: middle;\n font-weight: 500;\n color: #333;\n border-width: 1px;\n text-transform: uppercase;\n padding: 15px 10px;\n }\n\n & > thead > tr,\n & > tbody > tr,\n & > tfoot > tr {\n & > th,\n & > td {\n &:first-child {\n padding-left: 30px;\n }\n\n &:last-child {\n padding-right: 30px;\n }\n }\n }\n\n tbody > tr:last-child > td {\n padding-bottom: 20px;\n }\n}\n\n.table-bordered {\n border: 0;\n\n & > tbody > tr {\n & > td,\n & > th {\n border-bottom: 0;\n border-left: 0;\n\n &:last-child {\n border-right: 0;\n }\n }\n }\n\n & > thead > tr > th {\n border-left: 0;\n\n &:last-child {\n border-right: 0;\n }\n }\n}\n\n.table-vmiddle {\n td {\n vertical-align: middle !important;\n }\n}\n\n.table-responsive {\n border: 0;\n}\n\n.tile .table {\n & > thead:not([class*=\"bg-\"]) > tr > th {\n border-top: 1px solid @table-border-color;\n }\n}\n\n.table-hover > tbody > tr:hover {\n background-color: #f4f4f4;\n}\n\n.table-data {\n thead > tr > th {\n white-space: nowrap;\n }\n\n tbody > tr > td {\n padding-top: 5px !important;\n }\n\n .btn-favorite,\n .btn-archive {\n font-size: 15px;\n }\n}\n\n.table-main-title {\n font-weight: 500;\n line-height: 1.7 !important;\n}\n\n.btn-favorite {\n color: #d4d4d4;\n transition: all 0.25s ease-in-out;\n\n .fa-star {\n color: @yellow-darker;\n }\n\n &:hover,\n &:focus {\n color: @yellow-darker;\n cursor: pointer;\n\n .fa-star {\n filter: saturate(75%);\n opacity: 0.75;\n }\n }\n}\n\n.btn-archive {\n color: #d4d4d4;\n transition: all 0.25s ease-in-out;\n\n &:hover,\n &:focus {\n color: @gray-light;\n }\n\n .fa-archive {\n color: @gray-light;\n }\n}\n\n.table > thead > tr > th {\n text-transform: none;\n}\n\n.table-data .label-tag {\n display: inline-block;\n max-width: 135px;\n}\n"
},
{
"path": "client/app/assets/less/inc/tile.less",
"content": ".tile {\r\n background-color: #fff;\r\n margin-bottom: @grid-gutter-width;\r\n position: relative;\r\n border-radius: 3px;\r\n box-shadow: fade(@redash-gray, 15%) 0px 4px 9px -3px;\r\n \r\n &[class*=\"bg-\"] {\r\n color: #fff;\r\n }\r\n \r\n @media (max-width: @screen-sm-min) {\r\n margin-bottom: @grid-gutter-width/2;\r\n }\r\n}\r\n.tiled {\r\n border-radius: 3px;\r\n box-shadow: fade(@redash-gray, 15%) 0px 4px 9px -3px;\r\n}\r\n\r\n.t-header {\r\n .th-title {\r\n line-height: 100%;\r\n }\r\n\r\n &:not(.th-alt) {\r\n padding: 20px 23px;\r\n \r\n .th-title {\r\n font-size: 17px;\r\n font-weight: 400;\r\n color: #333;\r\n \r\n small {\r\n font-size: 12px;\r\n color: #9C9C9C;\r\n margin-top: 3px;\r\n display: block;\r\n }\r\n }\r\n }\r\n\r\n &.widget {\r\n padding: 5px;\r\n }\r\n\r\n\r\n &.th-alt {\r\n padding: 10px 15px 9px;\r\n \r\n .actions {\r\n & > a {\r\n color: #fff;\r\n }\r\n }\r\n \r\n &[class*=\"bg-\"] {\r\n .th-title {\r\n color: #fff;\r\n }\r\n }\r\n }\r\n \r\n .actions {\r\n right: 0;\r\n top: 0; \r\n \r\n & > a {\r\n font-size: 24px;\r\n line-height: 100%;\r\n padding: 4px 10px 3px;\r\n display: block;\r\n }\r\n \r\n & > a:hover,\r\n &.open > a {\r\n background-color: rgba(0, 0, 0, 0.1);\r\n }\r\n }\r\n}\r\n\r\n.t-header:not(.th-alt) {\r\n padding: 15px;\r\n \r\n ul {\r\n margin-bottom: 0;\r\n line-height: 2.2;\r\n }\r\n }\r\n\r\n.tb-padding {\r\n padding: 20px 23px 30px;\r\n}\r\n\r\n.t-body a.actions {\r\n font-size: 24px;\r\n line-height: 100%;\r\n padding: 4px 10px 3px;\r\n display: block;\r\n}\r\n\r\n.t-body a.actions:hover,\r\n.t-body a.actions.open > a {\r\n background-color: rgba(0, 0, 0, 0.1);\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/tooltips.less",
"content": ".tooltip-inner {\r\n border-radius: 1px;\r\n padding: 5px 10px;\r\n font-size: 12px;\r\n}"
},
{
"path": "client/app/assets/less/inc/variables.less",
"content": "/* --------------------------------------------------------\n Paths\n-----------------------------------------------------------*/\n@imgpath: ~'../img';\n@fontpath: ~'../fonts';\n\n\n/* --------------------------------------------------------\n Container\n-----------------------------------------------------------*/\n@container-tablet: 100%;\n@container-desktop: 100%;\n@container-large-desktop: 100%;\n\n\n/* --------------------------------------------------------\n Template Variables\n-----------------------------------------------------------*/\n@header-height: 60px;\n@sidebar-left-width: 240px;\n@sidebar-left-mid-width: 64px;\n@logo-width: @sidebar-left-width;\n@logo-height: @header-height;\n@boxed-width: 1170px;\n@body-bg: #edecec;\n@spacing: 15px;\n@redash-radius: 3px;\n\n\n/* --------------------------------------------------------\n Branding\n-----------------------------------------------------------*/\n@brand-bg: #191C22;\n@sidebar: @brand-bg;\n@sidebar-active-bg: #121419;\n@color-dark: #9BA1B1;\n\n\n/* --------------------------------------------------------\n Font\n-----------------------------------------------------------*/\n@font-icon: 'Material-Design-Iconic-Font';\n@font-family-sans-serif: 'Roboto', sans-serif;\n@redash-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif;\n@font-size-base: 13px;\n\n\n/* --------------------------------------------------------\n Typograpgy\n-----------------------------------------------------------*/\n@text-color: #767676;\n@link: #02a4c4;\n@link-hover-decoration: none;\n@headings-color: #333;\n\n\n/* --------------------------------------------------------\n Form\n-----------------------------------------------------------*/\n@input-color: #595959;\n@input-color-placeholder: #b4b4b4;\n@input-border: #e8e8e8;\n@input-border-radius: 0;\n@input-border-radius-large: 0px;\n@redash-input-radius: 2px;\n@input-height-large: 40px;\n@input-height-base: 35px;\n@input-height-small: 30px;\n@input-border-focus: #79c2ff;\n@input-group-addon-bg: @light-gray;\n\n/* --------------------------------------------------------\n Colors\n-----------------------------------------------------------*/\n@white: #ffffff;\n@black: #000000;\n@blue: #2196F3;\n@red: #F44336;\n@purple: #9C27B0;\n@deeppurple: #673AB7;\n@lightblue: #03A9F4;\n@cyan: #00BCD4;\n@teal: #009688;\n@green: #4CAF50;\n@lightgreen: #8BC34A;\n@lime: #CDDC39;\n@yellow: #FFEB3B;\n@yellow-darker: #fbd208;\n@amber: #FFC107;\n@orange: #FF9800;\n@deeporange: #FF5722;\n@gray: #9E9E9E;\n@bluegray: #607D8B;\n@indigo: #3F51B5;\n@pink: #E91E63;\n@brown: #795548;\n@light-gray: #FCFCFC;\n@gray-light: #828282;\n@ace: #f8f8f8;\n\n@redash-gray: rgba(102, 136, 153, 1);\n@redash-orange: rgba(255, 120, 100, 1);\n@redash-black: rgba(0, 0, 0, 1);\n@redash-yellow: rgba(252, 252, 161, 0.75);\n\n /** Form States **/\n@state-success-text: @green;\n@state-info-text: @blue;\n@state-danger-text: lighten(@red, 5%);\n\n\n/* --------------------------------------------------------\n Alert\n-----------------------------------------------------------*/\n@alert-success-border: transparent;\n@alert-info-border: transparent;\n@alert-danger-border:\t\t \t transparent;\n@alert-inverse-border:\t\t \t transparent;\n\n@alert-success-bg: fade(@green, 70%);\n@alert-info-bg:\t\t \t\t fade(@blue, 70%);\n@alert-danger-bg: fade(@red, 70%);\n@alert-inverse-bg: #333;\n\n@alert-success-text: #fff;\n@alert-info-text: #fff;\n@alert-danger-text: #fff;\n@alert-inverse-text: #fff;\n\n\n/* --------------------------------------------------------\n Bootstrap Brands\n-----------------------------------------------------------*/\n@brand-default: #eee;\n@brand-primary: @blue;\n@brand-info: @cyan;\n@brand-success: @green;\n@brand-warning: @orange;\n@brand-danger: @red;\n\n\n/* --------------------------------------------------------\n Border Radius\n-----------------------------------------------------------*/\n@border-radius-base: 2px;\n@border-radius-large: 2px;\n@border-radius-small: 2px;\n\n\n/* --------------------------------------------------------\n Dropdown\n-----------------------------------------------------------*/\n@dropdown-fallback-border: transparent;\n@dropdown-border: transparent;\n@dropdown-divider-bg: '';\n@dropdown-link-hover-bg: rgba(0,0,0,0.075);\n@dropdown-link-color: #333;\n@dropdown-link-hover-color: #333;\n@dropdown-link-disabled-color: #e4e4e4;\n@dropdown-divider-bg: rgba(0,0,0,0.08);\n@dropdown-link-active-color: #333;\n@dropdown-link-active-bg: rgba(0, 0, 0, 0.075);\n@zindex-dropdown: 9;\n@dropdown-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);\n\n/* --------------------------------------------------------\n Page Header\n-----------------------------------------------------------*/\n@page-header-border-color: transparent;\n\n\n/* --------------------------------------------------------\n Buttons\n-----------------------------------------------------------*/\n@btn-default-border: @input-border;\n@btn-font-weight:\t\t\t\t 400;\n\n\n/* --------------------------------------------------------\n Tables\n-----------------------------------------------------------*/\n@table-bg: #fff;\n@table-border-color: #f0f0f0;\n@table-cell-padding: 10px;\n@table-condensed-cell-padding: 7px;\n@table-bg-accent: @light-gray;\n@table-bg-active: #FFFCBE;\n@table-bg-hover: lighten(@light-gray, 2%);\n\n\n/* --------------------------------------------------------\n Pagination\n-----------------------------------------------------------*/\n@pagination-bg: #E2E2E2;\n@pagination-border: #fff;\n@pagination-color: #7E7E7E;\n@pagination-active-bg: @lightblue;\n@pagination-active-border: @pagination-border;\n@pagination-disabled-bg: #E2E2E2;\n@pagination-disabled-border: @pagination-border;\n@pagination-hover-color: #333;\n@pagination-hover-bg: #d7d7d7;\n@pagination-hover-border: @pagination-border;\n\n\n/* --------------------------------------------------------\n Thumbnail\n-----------------------------------------------------------*/\n@thumbnail-bg: #fff;\n@thumbnail-border: #eee;\n\n/* --------------------------------------------------------\n Carousel\n-----------------------------------------------------------*/\n@carousel-caption-color: #fff;\n\n\n/* --------------------------------------------------------\n Modal\n-----------------------------------------------------------*/\n@modal-content-fallback-border-color:\ttransparent;\n@modal-content-border-color:\t\t\ttransparent;\n@modal-backdrop-bg:\t\t\t\t\t\t#000;\n@modal-header-border-color:\t\t\t\ttransparent;\n@modal-title-line-height:\t\t\t\ttransparent;\n@modal-footer-border-color:\t\t\t\ttransparent;\n@zindex-modal-background: \t\t\t\t10;\n\n\n/* --------------------------------------------------------\n Tooltips\n-----------------------------------------------------------*/\n@tooltip-bg: #333;\n@tooltip-opacity: 1;\n\n\n/* --------------------------------------------------------\n Popobver\n-----------------------------------------------------------*/\n@zindex-popover: 9;\n@popover-title-bg: #fff;\n@popover-border-color: #fff;\n@popover-fallback-border-color: #fff;\n\n\n/* --------------------------------------------------------\n Breacrumb\n-----------------------------------------------------------*/\n@breadcrumb-bg: transparent;\n@breadcrumb-padding-horizontal: 20px;\n@breadcrumb-active-color: #7c7c7c;\n\n\n/* --------------------------------------------------------\n Jumbotron\n-----------------------------------------------------------*/\n@jumbotron-bg: #F7F7F7;\n\n\n/* --------------------------------------------------------\n List Group\n-----------------------------------------------------------*/\n@list-group-border: #f4f4f4;\n@list-group-active-color: #000;\n@list-group-active-bg: #f5f5f5;\n@list-group-active-border: @list-group-border;\n@list-group-disabled-color: #B5B4B4;\n@list-group-disabled-bg: #fff;\n@list-group-disabled-text-color: #B5B4B4;\n\n\n/* --------------------------------------------------------\n Badges\n-----------------------------------------------------------*/\n@badge-color: #fff;\n@badge-bg: @brand-primary;\n@badge-border-radius: 2px;\n@badge-font-weight: 400;\n@badge-active-color: #fff;\n@badge-active-bg: @brand-primary;\n\n\n/* --------------------------------------------------------\n Misc\n-----------------------------------------------------------*/\n@code-bg: transparent;\n@tile-shadow: 0 1px 1px rgba(0,0,0,0.07);\n"
},
{
"path": "client/app/assets/less/inc/visualizations/box.less",
"content": ".box {\r\n font: 10px sans-serif;\r\n line, rect, circle {\r\n fill: #fff;\r\n stroke: #000;\r\n stroke-width: 1.5px;\r\n }\r\n .center {\r\n stroke-dasharray: 3, 3;\r\n }\r\n .outlier {\r\n fill: none;\r\n stroke: #000;\r\n }\r\n}\r\n\r\n.axis text {\r\n font: 10px sans-serif;\r\n}\r\n\r\n.axis path,\r\n.axis line {\r\n fill: none;\r\n stroke: #000;\r\n shape-rendering: crispEdges;\r\n}\r\n\r\n.grid-background {\r\n fill: #ddd;\r\n}\r\n\r\n.grid path,\r\n.grid line {\r\n fill: none;\r\n stroke: #fff;\r\n shape-rendering: crispEdges;\r\n}\r\n\r\n.grid .minor line {\r\n stroke-opacity: .5;\r\n}\r\n\r\n.grid text {\r\n display: none;\r\n}\r\n"
},
{
"path": "client/app/assets/less/inc/visualizations/map.less",
"content": ".map-visualization-container {\n height: 500px;\n\n > div:first-child {\n width: 100%;\n height: 100%;\n z-index: 0;\n }\n}\n\n.leaflet-popup-content img {\n max-width: 100%;\n height: auto;\n}\n"
},
{
"path": "client/app/assets/less/inc/visualizations/misc.less",
"content": ".visualization-renderer {\n display: block;\n\n .pagination,\n .ant-pagination {\n margin: 0;\n }\n}\n"
},
{
"path": "client/app/assets/less/inc/visualizations/pivot-table.less",
"content": ".pivot-table-visualization-container > table,\n.visualization-renderer > .visualization-renderer-wrapper {\n overflow: auto;\n}\n"
},
{
"path": "client/app/assets/less/inc/well.less",
"content": ".well {\r\n border-radius: 0;\r\n background: #fff;\r\n box-shadow: none;\r\n}"
},
{
"path": "client/app/assets/less/inc/widgets.less",
"content": "/* --------------------------------------------------------\r\n User Signups\r\n-----------------------------------------------------------*/\r\n.rounded-thumbs {\r\n padding: 15px 25px 0;\r\n}\r\n\r\n.rt-item {\r\n display: block;\r\n padding-top: 10px;\r\n padding-bottom: 10px;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n border-radius: 50%;\r\n }\r\n\r\n small {\r\n .text-overflow();\r\n text-align: center;\r\n display: block;\r\n color: #777;\r\n margin-top: 3px;\r\n }\r\n\r\n &:hover {\r\n background-color: @light-gray;\r\n }\r\n}\r\n"
},
{
"path": "client/app/assets/less/main.less",
"content": "/** LESS Plugins **/\n@import \"inc/less-plugins/for\";\n\n/** Load Main Bootstrap LESS files **/\n@import \"~bootstrap/less/bootstrap\";\n\n/** Load Vendors Dependencies **/\n@import \"~font-awesome/less/font-awesome\";\n@import \"~material-design-iconic-font/dist/css/material-design-iconic-font.css\";\n\n@import \"inc/variables\";\n@import \"inc/mixins\";\n@import \"inc/font\";\n@import \"inc/print\";\n\n@import \"inc/bootstrap-overrides\";\n@import \"inc/base\";\n@import \"inc/generics\";\n@import \"inc/form\";\n@import \"inc/button\";\n@import \"inc/list\";\n@import \"inc/header\";\n@import \"inc/tile\";\n@import \"inc/label\";\n@import \"inc/dropdown\";\n@import \"inc/list-group\";\n@import \"inc/misc\";\n@import \"inc/progress-bar\";\n@import \"inc/widgets\";\n@import \"inc/table\";\n@import \"inc/alert\";\n@import \"inc/media\";\n@import \"inc/modal\";\n@import \"inc/panel\";\n@import \"inc/tooltips\";\n@import \"inc/popover\";\n@import \"inc/breadcrumb\";\n@import \"inc/jumbotron\";\n@import \"inc/profile\";\n@import \"inc/404\";\n@import \"inc/ie-warning\";\n@import \"inc/edit-in-place\";\n@import \"inc/flex\";\n@import \"inc/ace-editor\";\n@import \"inc/schema-browser\";\n@import \"inc/visualizations/box\";\n@import \"inc/visualizations/pivot-table\";\n@import \"inc/visualizations/map\";\n@import \"inc/visualizations/misc\";\n\n/** REDASH STYLING **/\n@import \"redash/redash-table\";\n@import \"redash/query\";\n@import \"redash/tags-control\";\n@import \"redash/css-logo\";\n@import \"redash/loading-indicator\";\n"
},
{
"path": "client/app/assets/less/redash/css-logo.less",
"content": "// based on https://github.com/outbrain/tech-companies-logos-in-css/pull/28\n\n@primary: #ff7964;\n@shadow: #ef6c58;\n@bar: white;\n\n#css-logo {\n width: 100px;\n height: 100px;\n position: relative;\n \n #circle {\n width: 79px;\n height: 79px;\n background-color: @shadow;\n border-radius: 50%;\n margin: auto;\n overflow: hidden;\n position: relative;\n\n & > div {\n width: 79px;\n height: 73px;\n background-color: @primary;\n border-radius: 50%;\n position: absolute;\n top: 0;\n }\n }\n \n #bars {\n position: absolute;\n left: 0;\n top: 24px;\n right: 0;\n height: 33px;\n display: flex;\n padding: 0 22px 0;\n\n .bar {\n background: @bar;\n box-shadow: 0px 2px 0 0 @shadow;\n display: inline-block;\n border-radius: 1px;\n align-self: flex-end;\n flex: 1;\n margin: 0 2px;\n border-radius: 3px;\n\n &:nth-child(1) {\n height: 32%;\n }\n \n &:nth-child(2) {\n height: 71%;\n }\n \n &:nth-child(3) {\n height: 50%;\n }\n \n &:nth-child(4) {\n height: 100%;\n }\n }\n }\n \n #point,\n #point > div {\n position: absolute;\n width: 0;\n height: 0;\n border: 17px solid @shadow;\n border-right-color: transparent !important;\n border-bottom-color: transparent !important;\n bottom: 0;\n left: 48px;\n transform: scaleX(0.87);\n transform-origin: left;\n }\n \n #point > div {\n bottom: -12px;\n border-color: @primary;\n transform: scaleX(1.04);\n left: -17px;\n }\n}\n"
},
{
"path": "client/app/assets/less/redash/loading-indicator.less",
"content": ".loading-indicator {\n position: fixed;\n top: 50%;\n left: 50%;\n margin: -50px 0 0 -50px; // center\n width: 100px;\n height: 100px;\n transition-duration: 150ms;\n transition-timing-function: linear;\n transition-property: opacity, transform;\n\n #css-logo {\n animation: hover 2s infinite;\n }\n\n #shadow {\n width: 33px;\n height: 12px;\n border-radius: 50%;\n background-color: black;\n opacity: 0.25;\n display: block;\n position: absolute;\n left: 34px;\n top: 115px;\n animation: shadow 2s infinite;\n }\n\n @keyframes hover {\n 50% {\n transform: translateY(-5px);\n }\n }\n @keyframes shadow {\n 50% {\n transform: scaleX(0.9);\n opacity: 0.2;\n }\n }\n}\n\n// hide indicator when application has content\n#application-root:not(:empty) ~ .loading-indicator {\n opacity: 0;\n transform: scale(0.9);\n pointer-events: none;\n\n * {\n animation: none !important;\n }\n}\n"
},
{
"path": "client/app/assets/less/redash/query.less",
"content": "body.fixed-layout {\n padding: 0;\n overflow: hidden;\n\n #application-root {\n display: flex;\n flex-direction: row;\n padding-bottom: 0;\n\n width: 100vw;\n height: 100%;\n\n .application-layout-content > div {\n display: flex;\n }\n }\n}\n\n.p-b-60 {\n padding-bottom: 60px !important;\n}\n\n.bottom-controller-container {\n box-shadow: 0 0 9px 0 rgba(102, 136, 153, 0.15);\n z-index: 1;\n border: none !important;\n flex-shrink: 0;\n}\n\n// Editor\n.filter-container {\n margin-bottom: 5px;\n}\n\n.schema-container {\n background: transparent;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n}\n\n.editor__left {\n height: 100% !important;\n width: calc(~\"25% - 10px\");\n margin-right: 10px;\n\n .form-control {\n height: 30px;\n }\n}\n\n.query-alerts {\n .alert {\n margin-bottom: 15px;\n }\n}\n\n.query-log-line {\n font-family: monospace;\n white-space: pre;\n margin: 0;\n}\n\n.paginator-container {\n text-align: center;\n}\n\n.tile {\n .paginator-container {\n text-align: center;\n margin-top: 10px;\n }\n}\n\n.query__vis {\n table {\n border: 1px solid #f0f0f0;\n }\n\n .paginator-container {\n text-align: center;\n margin-top: 10px;\n\n li:first-of-type {\n margin-left: 0;\n }\n }\n}\n\n.embed__vis {\n display: flex;\n flex-flow: column;\n height: calc(~'100% - 25px');\n\n > .embed-heading {\n flex: 0 0 auto;\n }\n\n > .query__vis {\n flex: 1 1 auto;\n\n .chart-visualization-container, .visualization-renderer-wrapper, .visualization-renderer {\n height: 100%\n }\n }\n\n > .tile__bottom-control {\n flex: 0 0 auto;\n }\n width: 100%;\n}\n\n.embed-heading {\n h3 {\n line-height: 1.75;\n margin: 0;\n }\n}\n\n.widget-wrapper {\n .body-container {\n .filters-wrapper {\n display: block;\n padding-left: 15px;\n }\n }\n}\n\n// Don't let filters take all visualization space on query fixed layout\n.query-fixed-layout {\n .filters-wrapper {\n max-height: 40%;\n overflow: auto;\n }\n}\n\n.page-header--new {\n .query-tags,\n .query-tags__mobile {\n .label-default,\n .label-warning {\n margin-right: 3px;\n }\n }\n}\n\n.label-tag {\n background: fade(@redash-gray, 15%);\n color: darken(@redash-gray, 15%);\n\n &:hover,\n &:focus,\n &:active {\n color: darken(@redash-gray, 15%);\n background: fade(@redash-gray, 25%);\n }\n}\n\n.query-page-wrapper {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n position: relative;\n}\n\n.query-fullscreen {\n background: #fff;\n padding: 0;\n box-shadow: rgba(102, 136, 153, 0.15) 0 4px 9px -3px;\n flex-grow: 1;\n display: flex;\n\n .resizable-component.react-resizable {\n .react-resizable-handle-horizontal {\n border-right: 1px solid #efefef;\n }\n\n .react-resizable-handle-vertical {\n border-bottom: 1px solid #efefef;\n }\n }\n\n .query-metadata.query-metadata-horizontal {\n border-bottom: 1px solid #efefef;\n }\n\n .tile,\n .tiled {\n box-shadow: none;\n padding: 15px 0 !important;\n }\n\n nav {\n position: relative;\n display: flex;\n flex-flow: column;\n flex-basis: 25%;\n flex-shrink: 0;\n max-width: 600px;\n min-width: 10px;\n overflow-x: hidden;\n\n .editor__left__data-source,\n .schema-control,\n .editor {\n flex-shrink: 0;\n }\n\n .editor__left__schema,\n .editor__left__data-source {\n padding: 15px;\n }\n\n .editor__left__data-source {\n .ant-select {\n .ant-select-selection-selected-value {\n img,\n span {\n vertical-align: middle;\n }\n }\n }\n }\n\n .editor__left__schema {\n min-height: 120px;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n padding-bottom: 0;\n padding-top: 0 !important;\n position: relative;\n\n .schema-container {\n position: absolute;\n left: 15px;\n top: 0;\n right: 15px;\n bottom: 0;\n }\n }\n }\n .content {\n background: #fff;\n flex-grow: 1;\n display: flex;\n flex-flow: column nowrap;\n justify-content: space-around;\n align-content: space-around;\n padding: 0;\n overflow-x: hidden;\n }\n .row {\n background: #fff;\n min-height: 50px;\n\n &.resizable {\n flex: 0 0 300px;\n }\n\n &.editor {\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-around;\n align-content: space-around;\n overflow: hidden;\n\n min-height: 10px;\n max-height: 70vh;\n flex: 0 0 300px;\n }\n\n .row {\n display: block;\n min-height: 0;\n }\n }\n\n section {\n box-sizing: border-box;\n flex: 1;\n min-width: 30px;\n &.resizable {\n flex: 0 0 300px;\n }\n }\n\n // **********************************************************************\n // directive styles\n // **********************************************************************\n .resizable {\n position: relative;\n &.no-transition {\n transition: none !important;\n }\n }\n .rg-right,\n .rg-left,\n .rg-top,\n .rg-bottom {\n display: block;\n width: 10px;\n height: 10px;\n line-height: @spacing;\n position: absolute;\n z-index: 99;\n\n span {\n position: absolute;\n box-sizing: border-box;\n display: block;\n border: 1px solid #ccc;\n }\n }\n .rg-right,\n .rg-left {\n span {\n border-width: 0 1px;\n top: 50%;\n margin: -10px 0 0 @spacing / 4;\n height: 20px;\n width: 3px;\n }\n }\n .rg-top,\n .rg-bottom {\n span {\n border-width: 1px 0;\n left: 50%;\n margin: @spacing / 4 0 0 -10px;\n width: 20px;\n height: 3px;\n }\n }\n .rg-top {\n cursor: row-resize;\n width: 100%;\n top: 0;\n left: 0;\n margin-top: -@spacing / 2;\n }\n .rg-right {\n cursor: col-resize;\n border-right: 1px solid #efefef;\n height: 100%;\n right: 0;\n top: 0;\n margin-right: 0px;\n\n &:hover {\n background: fade(@redash-gray, 6%);\n }\n }\n .rg-bottom {\n cursor: row-resize;\n background: #fff;\n width: 100%;\n bottom: 0;\n left: 0;\n margin-bottom: 0;\n\n &:hover {\n background: fade(@redash-gray, 6%);\n }\n }\n .rg-left {\n cursor: col-resize;\n height: 100%;\n left: 0;\n top: 0;\n margin-left: -@spacing;\n }\n}\n\n.datasource-small {\n visibility: hidden;\n}\n\n// Visualization editor\n.modal-xl .modal-content {\n border: none;\n}\n\n.visualization-editor {\n .modal-title {\n font-weight: 600;\n font-size: 20px;\n }\n\n .modal-body {\n bottom: 50px;\n }\n\n .modal-footer {\n height: auto;\n }\n\n .visualization-editor__right {\n margin-top: 23px;\n border: 1px solid #eee;\n border-radius: 3px;\n\n .parameter-container {\n padding-left: 25px;\n margin-top: 10px;\n }\n }\n}\n\n// Left nav fixes for filling all the space\nnav .rg-bottom {\n visibility: hidden;\n}\n\n.query-tags {\n display: inline-block;\n vertical-align: middle;\n}\n\n.query-tags__mobile {\n display: none;\n}\n\n.table--permission {\n .profile__image {\n margin-right: 0;\n }\n}\n\n.mp__permission-type {\n text-transform: capitalize;\n}\n\n.edit-visualization {\n margin-right: 5px;\n}\n\n@media (min-width: 880px) {\n .query-fullscreen {\n .query-metadata.query-metadata-horizontal {\n display: none;\n }\n }\n}\n\n// Smaller screens\n\n@media (max-width: 880px) {\n .btn--showhide,\n .query-actions-menu .dropdown-toggle {\n margin-bottom: 5px;\n }\n\n .btn-publish {\n display: none;\n }\n\n .query-fullscreen {\n flex-direction: column;\n overflow: hidden;\n\n nav {\n display: none;\n }\n\n .schema-container {\n display: none;\n }\n\n main {\n flex-direction: column-reverse;\n\n nav {\n width: 100%;\n max-width: 100%;\n border-right: none;\n\n .editor__left__schema {\n height: 300px !important;\n }\n\n .rg-right {\n display: none;\n }\n }\n }\n\n .content {\n width: 100%;\n height: 100%;\n\n .static-position__mobile {\n position: static !important;\n }\n }\n\n .bottom-controller-container {\n z-index: 9;\n }\n }\n\n .datasource-small {\n visibility: visible;\n }\n}\n\n@media (max-width: 768px) {\n .editor__left__schema,\n .editor__left__data-source {\n display: none;\n }\n\n .filter-container {\n padding-right: 0;\n }\n}\n"
},
{
"path": "client/app/assets/less/redash/redash-table.less",
"content": ".table {\n margin-bottom: 0;\n\n [class*=\"bg-\"] {\n & > tr > th {\n color: #fff;\n border-bottom: 0;\n background: transparent !important;\n }\n\n & + tbody > tr:first-child > td {\n border-top: 0;\n }\n }\n\n & > thead > tr > th {\n vertical-align: middle;\n font-weight: 500;\n color: #333;\n border-width: 1px;\n text-transform: none;\n padding: 15px 10px;\n }\n\n & > thead > tr,\n & > tbody > tr,\n & > tfoot > tr {\n\n & > th, & > td {\n\n &:first-child {\n padding-left: 15px;\n }\n\n &:last-child {\n padding-right: 15px;\n }\n\n }\n }\n\n tbody > tr:last-child > td {\n padding-bottom: 10px;\n }\n}\n\n.table.table-condensed {\n tbody > tr:last-child > td {\n padding-bottom: 7px;\n }\n}\n\n.table-bordered {\n border: 0;\n\n & > tbody > tr {\n & > td, & > th {\n border-bottom: 0;\n border-left: 0;\n\n &:last-child {\n border-right: 0;\n }\n }\n }\n\n & > thead > tr > th {\n border-left: 0;\n\n &:last-child {\n border-right: 0;\n }\n }\n}\n\n.table-vmiddle {\n td {\n vertical-align: middle !important;\n }\n}\n\n.table-responsive {\n border: 0;\n}\n\n.tile .table {\n\n & > thead:not([class*=\"bg-\"]) > tr > th {\n border-top: 1px solid @table-border-color;\n\n }\n}\n\n.table-hover > tbody > tr:hover {\n background-color: #fff !important;\n background-color: fade(@redash-gray, 5%) !important;\n}\n\n.table:not(.table-striped) > thead > tr > th {\n background-color: #fff !important;\n background-color: fade(@redash-gray, 3%) !important;\n}\n\n\n.table > thead > tr > th,\n.table > tbody > tr > th,\n.table > tfoot > tr > th,\n.table > thead > tr > td,\n.table > tbody > tr > td,\n.table > tfoot > tr > td {\n vertical-align: middle;\n}\n\n\n.table-condensed > tbody > tr > td {\n padding: 7px 10px;\n}\n\n.table-border {\n border: 1px solid rgb(240, 240, 240);\n}\n\n"
},
{
"path": "client/app/assets/less/redash/tags-control.less",
"content": ".tags-control {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n align-items: stretch;\n justify-content: flex-start;\n line-height: 1em;\n\n &.inline-tags-control {\n display: inline-block;\n }\n\n .tag-separator {\n margin: 4px 3px 0 0;\n }\n\n &.disabled {\n opacity: 0.4;\n }\n}\n"
},
{
"path": "client/app/assets/less/server.less",
"content": "/** LESS Plugins **/\n@import 'inc/less-plugins/for';\n\n/** Load Main Bootstrap LESS files **/\n@import '~bootstrap/less/bootstrap';\n@import '~material-design-iconic-font/dist/css/material-design-iconic-font.css';\n\n@import 'inc/variables';\n@import 'inc/mixins';\n@import 'inc/font';\n@import 'inc/print';\n\n@import 'inc/bootstrap-overrides';\n@import 'inc/base';\n@import 'inc/generics';\n@import 'inc/form';\n@import 'inc/button';\n@import 'inc/404';\n@import 'inc/ie-warning';\n@import 'inc/flex';\n\nhtml, body {\n height: 100%;\n margin: 0;\n padding: 0;\n background: #F6F8F9;\n}\n\n.signed-out {\n\n}\n\nhr {\n border-top-width: 2px;\n margin: 25px 0;\n}\n\n.tiled {\n padding: 25px;\n}\n\n.header {\n margin-top: 25px;\n\n img {\n height: 40px;\n }\n}\n\n.fixed-width-page {\n width: 500px;\n}\n\n@media (max-width: 767px) {\n .fixed-width-page {\n width: 80vw;\n }\n}\n\n.login-button {\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 20px 0;\n\n &:first-of-type {\n margin-top: 0;\n }\n &:last-of-type {\n margin-bottom: 0;\n }\n\n img {\n height: 25px;\n margin-right: 5px;\n }\n\n &:before {\n content: \"\";\n display: inline-block;\n height: 25px;\n }\n}\n"
},
{
"path": "client/app/assets/robots.txt",
"content": "# robotstxt.org\n\nUser-agent: *\n"
},
{
"path": "client/app/components/AceEditorInput.jsx",
"content": "import React, { forwardRef } from \"react\";\nimport AceEditor from \"react-ace\";\n\nimport \"./AceEditorInput.less\";\n\nfunction AceEditorInput(props, ref) {\n return (\n \n
\n );\n}\n\nexport default forwardRef(AceEditorInput);\n"
},
{
"path": "client/app/components/AceEditorInput.less",
"content": ".ace-editor-input {\n // hide ghost cursor when not focused\n .ace_hidden-cursors {\n opacity: 0;\n }\n\n // allow Ant Form feedback icon to hover scrollbar\n .ace_scrollbar {\n z-index: auto;\n }\n}\n"
},
{
"path": "client/app/components/ApplicationArea/ApplicationLayout/DesktopNavbar.jsx",
"content": "import React, { useMemo } from \"react\";\nimport { first, includes } from \"lodash\";\nimport Menu from \"antd/lib/menu\";\nimport Link from \"@/components/Link\";\nimport PlainButton from \"@/components/PlainButton\";\nimport HelpTrigger from \"@/components/HelpTrigger\";\nimport CreateDashboardDialog from \"@/components/dashboards/CreateDashboardDialog\";\nimport { useCurrentRoute } from \"@/components/ApplicationArea/Router\";\nimport { Auth, currentUser } from \"@/services/auth\";\nimport settingsMenu from \"@/services/settingsMenu\";\nimport logoUrl from \"@/assets/images/redash_icon_small.png\";\n\nimport DesktopOutlinedIcon from \"@ant-design/icons/DesktopOutlined\";\nimport CodeOutlinedIcon from \"@ant-design/icons/CodeOutlined\";\nimport AlertOutlinedIcon from \"@ant-design/icons/AlertOutlined\";\nimport PlusOutlinedIcon from \"@ant-design/icons/PlusOutlined\";\nimport QuestionCircleOutlinedIcon from \"@ant-design/icons/QuestionCircleOutlined\";\nimport SettingOutlinedIcon from \"@ant-design/icons/SettingOutlined\";\nimport VersionInfo from \"./VersionInfo\";\n\nimport \"./DesktopNavbar.less\";\n\nfunction NavbarSection({ children, ...props }) {\n return (\n \n );\n}\n\nfunction useNavbarActiveState() {\n const currentRoute = useCurrentRoute();\n\n return useMemo(\n () => ({\n dashboards: includes(\n [\n \"Dashboards.List\",\n \"Dashboards.Favorites\",\n \"Dashboards.My\",\n \"Dashboards.ViewOrEdit\",\n \"Dashboards.LegacyViewOrEdit\",\n ],\n currentRoute.id\n ),\n queries: includes(\n [\n \"Queries.List\",\n \"Queries.Favorites\",\n \"Queries.Archived\",\n \"Queries.My\",\n \"Queries.View\",\n \"Queries.New\",\n \"Queries.Edit\",\n ],\n currentRoute.id\n ),\n dataSources: includes([\"DataSources.List\"], currentRoute.id),\n alerts: includes([\"Alerts.List\", \"Alerts.New\", \"Alerts.View\", \"Alerts.Edit\"], currentRoute.id),\n }),\n [currentRoute.id]\n );\n}\n\nexport default function DesktopNavbar() {\n const firstSettingsTab = first(settingsMenu.getAvailableItems());\n\n const activeState = useNavbarActiveState();\n\n const canCreateQuery = currentUser.hasPermission(\"create_query\");\n const canCreateDashboard = currentUser.hasPermission(\"create_dashboard\");\n const canCreateAlert = currentUser.hasPermission(\"list_alerts\");\n\n return (\n \n }>\n \n
\n );\n}\n\nMobileNavbar.propTypes = {\n getPopupContainer: PropTypes.func,\n};\n\nMobileNavbar.defaultProps = {\n getPopupContainer: null,\n};\n"
},
{
"path": "client/app/components/ApplicationArea/ApplicationLayout/MobileNavbar.less",
"content": "@backgroundColor: #001529;\n@dividerColor: rgba(255, 255, 255, 0.5);\n@textColor: rgba(255, 255, 255, 0.75);\n\n.mobile-navbar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n background: @backgroundColor;\n box-shadow: 0 4px 9px -3px rgba(102, 136, 153, 0.15);\n padding: 0 15px;\n height: 100%;\n\n &-logo {\n img {\n height: 40px;\n width: 40px;\n }\n }\n\n .ant-btn.mobile-navbar-toggle-button {\n padding: 0 10px;\n }\n}\n\n.mobile-navbar-menu {\n .ant-dropdown-menu-item {\n font-weight: 500;\n color: @textColor;\n }\n\n .ant-dropdown-menu-item-divider {\n background: @dividerColor;\n }\n}\n"
},
{
"path": "client/app/components/ApplicationArea/ApplicationLayout/VersionInfo.jsx",
"content": "import React from \"react\";\nimport Link from \"@/components/Link\";\nimport { clientConfig, currentUser } from \"@/services/auth\";\nimport frontendVersion from \"@/version.json\";\n\nexport default function VersionInfo() {\n return (\n \n \n 
\n \n
\n \n \n {currentUser.hasPermission(\"list_dashboards\") && (\n \n Dashboards\n \n )}\n {currentUser.hasPermission(\"view_query\") && (\n \n Queries\n \n )}\n {currentUser.hasPermission(\"list_alerts\") && (\n \n Alerts\n \n )}\n \n Edit Profile\n \n \n Settings\n \n )}\n {currentUser.hasPermission(\"super_admin\") && (\n \n System Status\n \n )}\n {currentUser.hasPermission(\"super_admin\") && \n {/* eslint-disable-next-line react/jsx-no-target-blank */}\n \n Help\n \n \n Auth.logout()}>\n Log out\n \n \n }>\n \n \n
\n \n Version: {clientConfig.version}\n {frontendVersion !== clientConfig.version && ` (${frontendVersion.substring(0, 8)})`}\n
\n {clientConfig.newVersionAvailable && currentUser.hasPermission(\"super_admin\") && (\n \n {/* eslint-disable react/jsx-no-target-blank */}\n \n Update Available \n (opens in a new tab)\n \n
\n )}\n \n \n \n
\n \n \n {children}\n
\n \n
\n );\n}\n\nErrorMessage.propTypes = {\n error: PropTypes.object.isRequired,\n message: PropTypes.string,\n};\n"
},
{
"path": "client/app/components/ApplicationArea/ErrorMessage.less",
"content": ".error-message-container {\n width: 100%;\n padding: 0 15px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n\n .error-state {\n max-width: 1200px;\n width: 100%;\n\n @media (min-width: 768px) {\n width: 65%;\n }\n }\n}\n"
},
{
"path": "client/app/components/ApplicationArea/ErrorMessage.test.js",
"content": "import React from \"react\";\nimport { mount } from \"enzyme\";\nimport ErrorMessage from \"./ErrorMessage\";\n\nconst ErrorMessages = {\n UNAUTHORIZED: \"It seems like you donât have permission to see this page.\",\n NOT_FOUND: \"It seems like the page you're looking for cannot be found.\",\n GENERIC: \"It seems like we encountered an error. Try refreshing this page or contact your administrator.\",\n};\n\nfunction mockAxiosError(status = 500, response = {}) {\n const error = new Error(`Failed with code ${status}.`);\n error.isAxiosError = true;\n error.response = { status, ...response };\n return error;\n}\n\ndescribe(\"Error Message\", () => {\n const spyError = jest.spyOn(console, \"error\");\n\n beforeEach(() => {\n spyError.mockReset();\n });\n\n function expectErrorMessageToBe(error, errorMessage) {\n const component = mount(\n
\n \n \n
\n \n
\n {props.message}
;\n}\n\nErrorMessageDetails.propTypes = {\n error: PropTypes.instanceOf(Error).isRequired,\n message: PropTypes.string.isRequired,\n};\n" }, { "path": "client/app/components/ApplicationArea/Router.jsx", "content": "import { isFunction, startsWith, trimStart, trimEnd } from \"lodash\";\nimport React, { useState, useEffect, useRef, useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport UniversalRouter from \"universal-router\";\nimport ErrorBoundary from \"@redash/viz/lib/components/ErrorBoundary\";\nimport location from \"@/services/location\";\nimport url from \"@/services/url\";\n\nimport ErrorMessage from \"./ErrorMessage\";\n\nfunction generateRouteKey() {\n return Math.random()\n .toString(32)\n .substr(2);\n}\n\nexport const CurrentRouteContext = React.createContext(null);\n\nexport function useCurrentRoute() {\n return useContext(CurrentRouteContext);\n}\n\nexport function stripBase(href) {\n // Resolve provided link and '' (root) relative to document's base.\n // If provided href is not related to current document (does not\n // start with resolved root) - return false. Otherwise\n // strip root and return relative url.\n\n const baseHref = trimEnd(url.normalize(\"\"), \"/\") + \"/\";\n href = url.normalize(href);\n\n if (startsWith(href, baseHref)) {\n return \"/\" + trimStart(href.substr(baseHref.length), \"/\");\n }\n\n return false;\n}\n\nexport default function Router({ routes, onRouteChange }) {\n const [currentRoute, setCurrentRoute] = useState(null);\n\n const currentPathRef = useRef(null);\n const errorHandlerRef = useRef();\n\n useEffect(() => {\n let isAbandoned = false;\n\n const router = new UniversalRouter(routes, {\n resolveRoute({ route }, routeParams) {\n if (isFunction(route.render)) {\n return { ...route, routeParams };\n }\n },\n });\n\n function resolve(action) {\n if (!isAbandoned) {\n if (errorHandlerRef.current) {\n errorHandlerRef.current.reset();\n }\n\n const pathname = stripBase(location.path) || \"/\";\n\n // This is a optimization for route resolver: if current route was already resolved\n // from this path - do nothing. It also prevents router from using outdated route in a case\n // when user navigated to another path while current one was still resolving.\n // Note: this lock uses only `path` fragment of URL to distinguish routes because currently\n // all pages depend only on this fragment and handle search/hash on their own. If router\n // should reload page on search/hash change - this fragment (and few checks below) should be updated\n if (pathname === currentPathRef.current) {\n return;\n }\n currentPathRef.current = pathname;\n\n // Don't reload controller if URL was replaced\n if (action === \"REPLACE\") {\n return;\n }\n\n router\n .resolve({ pathname })\n .then(route => {\n if (!isAbandoned && currentPathRef.current === pathname) {\n setCurrentRoute({ ...route, key: generateRouteKey() });\n }\n })\n .catch(error => {\n if (!isAbandoned && currentPathRef.current === pathname) {\n setCurrentRoute({\n render: currentRoute =>= {\n pageTitle?: string;\n onError: (error: Error) => void;\n} & P;\n\nexport interface UserSessionWrapperProps
{\n render: (props: UserSessionWrapperRenderChildrenProps
) => React.ReactNode;\n currentRoute: CurrentRoute
;\n bodyClass?: string;\n}\n\n// This wrapper modifies `route.render` function and instead of passing `currentRoute` passes an object\n// that contains:\n// - `currentRoute.routeParams`\n// - `pageTitle` field which is equal to `currentRoute.title`\n// - `onError` field which is a `handleError` method of nearest error boundary\n\nexport function UserSessionWrapper
({ bodyClass, currentRoute, render }: UserSessionWrapperProps
) {\n const [isAuthenticated, setIsAuthenticated] = useState(!!Auth.isAuthenticated());\n useEffect(() => {\n let isCancelled = false;\n Promise.all([Auth.requireSession(), organizationStatus.refresh(), policy.refresh()])\n .then(() => {\n if (!isCancelled) {\n setIsAuthenticated(!!Auth.isAuthenticated());\n }\n })\n .catch(() => {\n if (!isCancelled) {\n setIsAuthenticated(false);\n }\n });\n return () => {\n isCancelled = true;\n };\n }, []);\n\n useEffect(() => {\n if (bodyClass) {\n document.body.classList.toggle(bodyClass, true);\n return () => {\n document.body.classList.toggle(bodyClass, false);\n };\n }\n }, [bodyClass]);\n\n if (!isAuthenticated) {\n return null;\n }\n\n return (\n [\"onError\"] } FIXME bring back type */\n ) => render({ ...currentRoute.routeParams, pageTitle: currentRoute.title, onError: handleError })}\n
= {\n render: (props: UserSessionWrapperRenderChildrenProps
) => React.ReactNode;\n bodyClass?: string;\n title: string;\n path: string;\n};\n\nexport const UserSessionWrapperDynamicComponentName = \"UserSessionWrapper\";\n\nexport default function routeWithUserSession
({\n render: originalRender,\n bodyClass,\n ...rest\n}: RouteWithUserSessionOptions
) {\n return {\n ...rest,\n render: (currentRoute: CurrentRoute
) => {\n const props = {\n render: originalRender,\n bodyClass,\n currentRoute,\n };\n return (\n \n \n \n \n \n
\n \n \n \n \n \n \n \n \n \n
\n
\n {message}\n {children}\n \n );\n}\n\nBigMessage.propTypes = {\n message: PropTypes.string,\n icon: PropTypes.string.isRequired,\n children: PropTypes.node,\n className: PropTypes.string,\n};\n\nBigMessage.defaultProps = {\n message: \"\",\n children: null,\n className: \"tiled bg-white\",\n};\n\nexport default BigMessage;\n"
},
{
"path": "client/app/components/CodeBlock.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Button from \"antd/lib/button\";\nimport Tooltip from \"@/components/Tooltip\";\nimport CopyOutlinedIcon from \"@ant-design/icons/CopyOutlined\";\nimport \"./CodeBlock.less\";\n\nexport default class CodeBlock extends React.Component {\n static propTypes = {\n copyable: PropTypes.bool,\n children: PropTypes.node,\n };\n\n static defaultProps = {\n copyable: false,\n children: null,\n };\n\n state = { copied: null };\n\n constructor(props) {\n super(props);\n this.ref = React.createRef();\n this.copyFeatureEnabled = props.copyable && document.queryCommandSupported(\"copy\");\n this.resetCopyState = null;\n }\n\n componentWillUnmount() {\n if (this.resetCopyState) {\n clearTimeout(this.resetCopyState);\n }\n }\n\n copy = () => {\n // select text\n window.getSelection().selectAllChildren(this.ref.current);\n\n // copy\n try {\n const success = document.execCommand(\"copy\");\n if (!success) {\n throw new Error();\n }\n this.setState({ copied: \"Copied!\" });\n } catch (err) {\n this.setState({\n copied: \"Copy failed\",\n });\n }\n\n // reset selection\n window.getSelection().removeAllRanges();\n\n // reset tooltip\n this.resetCopyState = setTimeout(() => this.setState({ copied: null }), 2000);\n };\n\n render() {\n const { copyable, children, ...props } = this.props;\n\n const copyButton = (\n \n \n );\n }\n}\n"
},
{
"path": "client/app/components/CodeBlock.less",
"content": "@import (reference, less) \"~@/assets/less/ant\";\n\n.code-block {\n background: rgba(0, 0, 0, 0.06);\n border: 1px solid rgba(0, 0, 0, 0.06);\n border-radius: 2px;\n padding: 3px 27px 3px 3px;\n position: relative;\n min-height: 32px;\n\n code {\n padding: 0;\n font-size: 85%;\n }\n\n .@{btn-prefix-cls} {\n position: absolute;\n right: 3px;\n bottom: 3px;\n padding-left: 3px !important;\n padding-right: 3px !important;\n }\n}\n"
},
{
"path": "client/app/components/Collapse.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport cx from \"classnames\";\nimport AntCollapse from \"antd/lib/collapse\";\n\nexport default function Collapse({ collapsed, children, className, ...props }) {\n return (\n \n {children}\n \n {this.copyFeatureEnabled && copyButton}\n \n \n );\n }\n\n renderForm() {\n const { imageFolder, helpTriggerPrefix } = this.props;\n const { selectedType } = this.state;\n const fields = helper.getFields(selectedType);\n const helpTriggerType = `${helpTriggerPrefix}${toUpper(selectedType.type)}`;\n return (\n \n {isEmpty(filteredTypes) ? (\n \n this.renderItem(item)} />\n )}\n
\n \n );\n }\n\n renderItem(item) {\n const { imageFolder } = this.props;\n return (\n \n \n 
\n {selectedType.name}
\n \n {HELP_TRIGGER_TYPES[helpTriggerType] && (\n \n \n \n \n );\n }\n}\n\nexport default wrapDialog(CreateSourceDialog);\n"
},
{
"path": "client/app/components/DateInput.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport DatePicker from \"antd/lib/date-picker\";\nimport { clientConfig } from \"@/services/auth\";\nimport { Moment } from \"@/components/proptypes\";\n\nconst DateInput = React.forwardRef(({ defaultValue, value, onSelect, className, ...props }, ref) => {\n const format = clientConfig.dateFormat || \"YYYY-MM-DD\";\n const additionalAttributes = {};\n if (defaultValue && defaultValue.isValid()) {\n additionalAttributes.defaultValue = defaultValue;\n }\n if (value === null || (value && value.isValid())) {\n additionalAttributes.value = value;\n }\n return (\n
{`{{${name}.start}} {{${name}.end}}`}\n \n
\n \n );\n}\n\nFilters.propTypes = {\n filters: FiltersType.isRequired,\n onChange: PropTypes.func, // (name, value) => void\n};\n\nFilters.defaultProps = {\n onChange: () => {},\n};\n\nexport default Filters;\n"
},
{
"path": "client/app/components/HelpTrigger.jsx",
"content": "import { startsWith, get, some, mapValues } from \"lodash\";\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport cx from \"classnames\";\nimport Tooltip from \"@/components/Tooltip\";\nimport Drawer from \"antd/lib/drawer\";\nimport Link from \"@/components/Link\";\nimport PlainButton from \"@/components/PlainButton\";\nimport CloseOutlinedIcon from \"@ant-design/icons/CloseOutlined\";\nimport BigMessage from \"@/components/BigMessage\";\nimport DynamicComponent, { registerComponent } from \"@/components/DynamicComponent\";\n\nimport \"./HelpTrigger.less\";\n\nconst DOMAIN = \"https://redash.io\";\nconst HELP_PATH = \"/help\";\nconst IFRAME_TIMEOUT = 20000;\nconst IFRAME_URL_UPDATE_MESSAGE = \"iframe_url\";\n\nexport const TYPES = mapValues(\n {\n HOME: [\"\", \"Help\"],\n VALUE_SOURCE_OPTIONS: [\"/user-guide/querying/query-parameters#Value-Source-Options\", \"Guide: Value Source Options\"],\n SHARE_DASHBOARD: [\"/user-guide/dashboards/sharing-dashboards\", \"Guide: Sharing and Embedding Dashboards\"],\n AUTHENTICATION_OPTIONS: [\"/user-guide/users/authentication-options\", \"Guide: Authentication Options\"],\n USAGE_DATA_SHARING: [\"/open-source/admin-guide/usage-data\", \"Help: Anonymous Usage Data Sharing\"],\n DS_ATHENA: [\"/data-sources/amazon-athena-setup\", \"Guide: Help Setting up Amazon Athena\"],\n DS_BIGQUERY: [\"/data-sources/bigquery-setup\", \"Guide: Help Setting up BigQuery\"],\n DS_URL: [\"/data-sources/querying-urls\", \"Guide: Help Setting up URL\"],\n DS_MONGODB: [\"/data-sources/mongodb-setup\", \"Guide: Help Setting up MongoDB\"],\n DS_GOOGLE_SPREADSHEETS: [\n \"/data-sources/querying-a-google-spreadsheet\",\n \"Guide: Help Setting up Google Spreadsheets\",\n ],\n DS_GOOGLE_ANALYTICS: [\"/data-sources/google-analytics-setup\", \"Guide: Help Setting up Google Analytics\"],\n DS_AXIBASETSD: [\"/data-sources/axibase-time-series-database\", \"Guide: Help Setting up Axibase Time Series\"],\n DS_RESULTS: [\"/user-guide/querying/query-results-data-source\", \"Guide: Help Setting up Query Results\"],\n ALERT_SETUP: [\"/user-guide/alerts/setting-up-an-alert\", \"Guide: Setting Up a New Alert\"],\n MAIL_CONFIG: [\"/open-source/setup/#Mail-Configuration\", \"Guide: Mail Configuration\"],\n ALERT_NOTIF_TEMPLATE_GUIDE: [\"/user-guide/alerts/custom-alert-notifications\", \"Guide: Custom Alerts Notifications\"],\n FAVORITES: [\"/user-guide/querying/favorites-tagging/#Favorites\", \"Guide: Favorites\"],\n MANAGE_PERMISSIONS: [\n \"/user-guide/querying/writing-queries#Managing-Query-Permissions\",\n \"Guide: Managing Query Permissions\",\n ],\n NUMBER_FORMAT_SPECS: [\"/user-guide/visualizations/formatting-numbers\", \"Formatting Numbers\"],\n GETTING_STARTED: [\"/user-guide/getting-started\", \"Guide: Getting Started\"],\n DASHBOARDS: [\"/user-guide/dashboards\", \"Guide: Dashboards\"],\n QUERIES: [\"/user-guide/querying\", \"Guide: Queries\"],\n ALERTS: [\"/user-guide/alerts\", \"Guide: Alerts\"],\n },\n ([url, title]) => [DOMAIN + HELP_PATH + url, title]\n);\n\nconst HelpTriggerPropTypes = {\n type: PropTypes.string,\n href: PropTypes.string,\n title: PropTypes.node,\n className: PropTypes.string,\n showTooltip: PropTypes.bool,\n renderAsLink: PropTypes.bool,\n children: PropTypes.node,\n};\n\nconst HelpTriggerDefaultProps = {\n type: null,\n href: null,\n title: null,\n className: null,\n showTooltip: true,\n renderAsLink: false,\n children: ,\n};\n\nexport function helpTriggerWithTypes(types, allowedDomains = [], drawerClassName = null) {\n return class HelpTrigger extends React.Component {\n static propTypes = {\n ...HelpTriggerPropTypes,\n type: PropTypes.oneOf(Object.keys(types)),\n };\n\n static defaultProps = HelpTriggerDefaultProps;\n\n iframeRef = React.createRef();\n\n iframeLoadingTimeout = null;\n\n state = {\n visible: false,\n loading: false,\n error: false,\n currentUrl: null,\n };\n\n componentDidMount() {\n window.addEventListener(\"message\", this.onPostMessageReceived, false);\n }\n\n componentWillUnmount() {\n window.removeEventListener(\"message\", this.onPostMessageReceived);\n clearTimeout(this.iframeLoadingTimeout);\n }\n\n loadIframe = (url) => {\n clearTimeout(this.iframeLoadingTimeout);\n this.setState({ loading: true, error: false });\n\n this.iframeRef.current.src = url;\n this.iframeLoadingTimeout = setTimeout(() => {\n this.setState({ error: url, loading: false });\n }, IFRAME_TIMEOUT); // safety\n };\n\n onIframeLoaded = () => {\n this.setState({ loading: false });\n clearTimeout(this.iframeLoadingTimeout);\n };\n\n onPostMessageReceived = (event) => {\n if (!some(allowedDomains, (domain) => startsWith(event.origin, domain))) {\n return;\n }\n\n const { type, message: currentUrl } = event.data || {};\n if (type !== IFRAME_URL_UPDATE_MESSAGE) {\n return;\n }\n\n this.setState({ currentUrl });\n };\n\n getUrl = () => {\n const helpTriggerType = get(types, this.props.type);\n return helpTriggerType ? helpTriggerType[0] : this.props.href;\n };\n\n openDrawer = (e) => {\n // keep \"open in new tab\" behavior\n if (!e.shiftKey && !e.ctrlKey && !e.metaKey) {\n e.preventDefault();\n this.setState({ visible: true });\n // wait for drawer animation to complete so there's no animation jank\n setTimeout(() => this.loadIframe(this.getUrl()), 300);\n }\n };\n\n closeDrawer = (event) => {\n if (event) {\n event.preventDefault();\n }\n this.setState({ visible: false });\n this.setState({ visible: false, currentUrl: null });\n };\n\n render() {\n const targetUrl = this.getUrl();\n if (!targetUrl) {\n return null;\n }\n\n const tooltip = get(types, `${this.props.type}[1]`, this.props.title);\n const className = cx(\"help-trigger\", this.props.className);\n const url = this.state.currentUrl;\n const isAllowedDomain = some(allowedDomains, (domain) => startsWith(url || targetUrl, domain));\n const shouldRenderAsLink = this.props.renderAsLink || !isAllowedDomain;\n\n return (\n \n
\n \n {map(filters, filter => {\n const options = map(filter.values, (value, index) => (\n {formatColumnValue(value, get(filter, \"column.type\"))} \n ));\n\n return (\n \n \n {options.length === 0 && }\n {options.length > 0 && (\n ({\n key: `${indexOf(filter.values, value)}`,\n label: formatColumnValue(value),\n }))\n : { key: `${indexOf(filter.values, filter.current)}`, label: formatColumnValue(filter.current) }\n }\n allowClear={filter.multiple}\n optionFilterProp=\"children\"\n showSearch\n maxTagCount={3}\n maxTagTextLength={10}\n maxTagPlaceholder={num => `+${num.length} more`}\n onChange={values => onChange(filter, values)}>\n {!filter.multiple && options}\n {filter.multiple && [\n \n \n Clear\n ,\n \n \n Select All\n ,\n \n {options}\n ,\n ]}\n \n )}\n
\n );\n })}\n \n \n Something went wrong.\n
\n {/* eslint-disable-next-line react/jsx-no-target-blank */}\n \n Click here\n {\" \"}\n to open the page in a new window.\n \n )}\n
\n\n {/* extra content */}\n \n {url && (\n \n {/* eslint-disable-next-line react/jsx-no-target-blank */}\n \n \n (opens in a new tab)\n \n \n )}\n \n \n \n \n
\n\n {/* iframe */}\n {!this.state.error && (\n \n {/* eslint-disable-next-line react/jsx-no-target-blank */}\n \n Click here\n {\" \"}\n to open the page in a new window.\n
\n
\n );\n}\n\nPageHeader.propTypes = {\n title: PropTypes.string,\n actions: PropTypes.node,\n};\n\nPageHeader.defaultProps = {\n title: \"\",\n actions: null,\n};\n"
},
{
"path": "client/app/components/PageHeader/index.less",
"content": ".page-header-wrapper {\n margin: 15px 0 10px 0;\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n align-items: center;\n justify-content: stretch;\n\n h3 {\n margin: 0;\n line-height: 1.3;\n font-weight: 500;\n flex: 1 1 auto;\n }\n\n .page-header-actions {\n flex: 0 0 auto;\n padding: 0 0 0 15px;\n }\n}\n"
},
{
"path": "client/app/components/Paginator.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Pagination from \"antd/lib/pagination\";\n\nconst MIN_ITEMS_PER_PAGE = 5;\n\nexport default function Paginator({ page, showPageSizeSelect, pageSize, onPageSizeChange, totalCount, onChange }) {\n if (totalCount <= (showPageSizeSelect ? MIN_ITEMS_PER_PAGE : pageSize)) {\n return null;\n }\n return (\n {title}
\n {actions &&{actions}
}\n \n onPageSizeChange(size)}\n defaultCurrent={page}\n pageSize={pageSize}\n total={totalCount}\n onChange={onChange}\n />\n
\n );\n}\n\nPaginator.propTypes = {\n page: PropTypes.number.isRequired,\n showPageSizeSelect: PropTypes.bool,\n pageSize: PropTypes.number.isRequired,\n totalCount: PropTypes.number.isRequired,\n onPageSizeChange: PropTypes.func,\n onChange: PropTypes.func,\n};\n\nPaginator.defaultProps = {\n showPageSizeSelect: false,\n onChange: () => {},\n onPageSizeChange: () => {},\n};\n"
},
{
"path": "client/app/components/ParameterApplyButton.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Button from \"antd/lib/button\";\nimport Badge from \"antd/lib/badge\";\nimport Tooltip from \"@/components/Tooltip\";\nimport KeyboardShortcuts from \"@/services/KeyboardShortcuts\";\n\nfunction ParameterApplyButton({ paramCount, onClick }) {\n // show spinner when count is empty so the fade out is consistent\n const icon = !paramCount ? (\n \n \n Loading...\n \n ) : (\n \n );\n\n return (\n \n \n \n \n \n \n \n \n
\n );\n}\n\nParameterApplyButton.propTypes = {\n onClick: PropTypes.func.isRequired,\n paramCount: PropTypes.number.isRequired,\n};\n\nexport default ParameterApplyButton;\n"
},
{
"path": "client/app/components/ParameterMappingInput.jsx",
"content": "/* eslint-disable react/no-multi-comp */\n\nimport { isString, extend, each, has, map, includes, findIndex, find, fromPairs, clone, isEmpty } from \"lodash\";\nimport React, { Fragment } from \"react\";\nimport PropTypes from \"prop-types\";\nimport classNames from \"classnames\";\nimport Select from \"antd/lib/select\";\nimport Table from \"antd/lib/table\";\nimport Popover from \"antd/lib/popover\";\nimport Button from \"antd/lib/button\";\nimport Tag from \"antd/lib/tag\";\nimport Input from \"antd/lib/input\";\nimport Radio from \"antd/lib/radio\";\nimport Form from \"antd/lib/form\";\nimport Tooltip from \"@/components/Tooltip\";\nimport ParameterValueInput from \"@/components/ParameterValueInput\";\nimport { ParameterMappingType } from \"@/services/widget\";\nimport { Parameter, cloneParameter } from \"@/services/parameters\";\nimport HelpTrigger from \"@/components/HelpTrigger\";\n\nimport QuestionCircleFilledIcon from \"@ant-design/icons/QuestionCircleFilled\";\nimport EditOutlinedIcon from \"@ant-design/icons/EditOutlined\";\nimport CloseOutlinedIcon from \"@ant-design/icons/CloseOutlined\";\nimport CheckOutlinedIcon from \"@ant-design/icons/CheckOutlined\";\n\nimport \"./ParameterMappingInput.less\";\n\nexport const MappingType = {\n DashboardAddNew: \"dashboard-add-new\",\n DashboardMapToExisting: \"dashboard-map-to-existing\",\n WidgetLevel: \"widget-level\",\n StaticValue: \"static-value\",\n};\n\nexport function parameterMappingsToEditableMappings(mappings, parameters, existingParameterNames = []) {\n return map(mappings, (mapping) => {\n const result = extend({}, mapping);\n const alreadyExists = includes(existingParameterNames, mapping.mapTo);\n result.param = find(parameters, (p) => p.name === mapping.name);\n switch (mapping.type) {\n case ParameterMappingType.DashboardLevel:\n result.type = alreadyExists ? MappingType.DashboardMapToExisting : MappingType.DashboardAddNew;\n result.value = null;\n break;\n case ParameterMappingType.StaticValue:\n result.type = MappingType.StaticValue;\n result.param = cloneParameter(result.param);\n result.param.setValue(result.value);\n break;\n case ParameterMappingType.WidgetLevel:\n result.type = MappingType.WidgetLevel;\n result.value = null;\n break;\n // no default\n }\n return result;\n });\n}\n\nexport function editableMappingsToParameterMappings(mappings) {\n return fromPairs(\n map(\n // convert to map\n mappings,\n (mapping) => {\n const result = extend({}, mapping);\n switch (mapping.type) {\n case MappingType.DashboardAddNew:\n result.type = ParameterMappingType.DashboardLevel;\n result.value = null;\n break;\n case MappingType.DashboardMapToExisting:\n result.type = ParameterMappingType.DashboardLevel;\n result.value = null;\n break;\n case MappingType.StaticValue:\n result.type = ParameterMappingType.StaticValue;\n result.param = cloneParameter(mapping.param);\n result.param.setValue(result.value);\n result.value = result.param.value;\n break;\n case MappingType.WidgetLevel:\n result.type = ParameterMappingType.WidgetLevel;\n result.value = null;\n break;\n // no default\n }\n delete result.param;\n return [result.name, result];\n }\n )\n );\n}\n\nexport function synchronizeWidgetTitles(sourceMappings, widgets) {\n const affectedWidgets = [];\n\n each(sourceMappings, (sourceMapping) => {\n if (sourceMapping.type === ParameterMappingType.DashboardLevel) {\n each(widgets, (widget) => {\n const widgetMappings = widget.options.parameterMappings;\n each(widgetMappings, (widgetMapping) => {\n // check if mapped to the same dashboard-level parameter\n if (\n widgetMapping.type === ParameterMappingType.DashboardLevel &&\n widgetMapping.mapTo === sourceMapping.mapTo\n ) {\n // dirty check - update only when needed\n if (widgetMapping.title !== sourceMapping.title) {\n widgetMapping.title = sourceMapping.title;\n affectedWidgets.push(widget);\n }\n }\n });\n });\n }\n });\n\n return affectedWidgets;\n}\n\nexport class ParameterMappingInput extends React.Component {\n static propTypes = {\n mapping: PropTypes.object, // eslint-disable-line react/forbid-prop-types\n existingParamNames: PropTypes.arrayOf(PropTypes.string),\n onChange: PropTypes.func,\n inputError: PropTypes.string,\n };\n\n static defaultProps = {\n mapping: {},\n existingParamNames: [],\n onChange: () => {},\n inputError: null,\n };\n\n formItemProps = {\n labelCol: { span: 5 },\n wrapperCol: { span: 16 },\n className: \"form-item\",\n };\n\n updateSourceType = (type) => {\n let {\n mapping: { mapTo },\n } = this.props;\n const { existingParamNames } = this.props;\n\n // if mapped name doesn't already exists\n // default to first select option\n if (type === MappingType.DashboardMapToExisting && !includes(existingParamNames, mapTo)) {\n mapTo = existingParamNames[0];\n }\n\n this.updateParamMapping({ type, mapTo });\n };\n\n updateParamMapping = (update) => {\n const { onChange, mapping } = this.props;\n const newMapping = extend({}, mapping, update);\n if (newMapping.value !== mapping.value) {\n newMapping.param = cloneParameter(newMapping.param);\n newMapping.param.setValue(newMapping.value);\n }\n if (has(update, \"type\")) {\n if (update.type === MappingType.StaticValue) {\n newMapping.value = newMapping.param.value;\n } else {\n newMapping.value = null;\n }\n }\n onChange(newMapping);\n };\n\n renderMappingTypeSelector() {\n const noExisting = isEmpty(this.props.existingParamNames);\n return (\n \n
\n Users with permissions
\n {loadingGrantees && (\n \n \n Loading...\n \n )}\n\n (\n \n \n {user.id === author.id ? (\n Author \n ) : (\n \n removePermission(user.id).then(loadUsersWithPermissions)}\n >\n \n \n \n )}\n \n \n )}\n />\n
\n \n );\n}\n\nPermissionsEditorDialog.propTypes = {\n dialog: DialogPropType.isRequired,\n author: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n context: PropTypes.oneOf([\"query\", \"dashboard\"]),\n aclUrl: PropTypes.string.isRequired,\n};\n\nPermissionsEditorDialog.defaultProps = { context: \"query\" };\n\nexport default wrapDialog(PermissionsEditorDialog);\n"
},
{
"path": "client/app/components/PermissionsEditorDialog/index.less",
"content": ".permissions-editor-dialog {\n .ant-select-dropdown-menu-item-disabled {\n // make sure .text-muted has the disabled color\n &, .text-muted {\n color: rgba(0, 0, 0, 0.25);\n }\n }\n}"
},
{
"path": "client/app/components/PlainButton.less",
"content": "@import (reference, less) \"~@/assets/less/ant\";\n\n.plain-button {\n all: unset;\n transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n\n .@{dropdown-prefix-cls}-menu-item > & {\n width: 100%;\n margin: -5px -12px;\n padding: 5px 12px;\n }\n\n .@{menu-prefix-cls}-item > & {\n width: 100%;\n margin: 0 -16px;\n padding: 0 16px;\n }\n}\n\n.plain-button-link {\n .btn-link();\n}\n"
},
{
"path": "client/app/components/PlainButton.tsx",
"content": "import classNames from \"classnames\";\nimport React from \"react\";\n\nimport \"./PlainButton.less\";\n\nexport interface PlainButtonProps extends Omit\n
\n );\n}\n\nPreviewCard.propTypes = {\n imageUrl: PropTypes.string.isRequired,\n title: PropTypes.node.isRequired,\n body: PropTypes.node,\n roundedImage: PropTypes.bool,\n className: PropTypes.string,\n children: PropTypes.node,\n};\n\nPreviewCard.defaultProps = {\n body: null,\n roundedImage: true,\n className: \"\",\n children: null,\n};\n\n// UserPreviewCard\n\nexport function UserPreviewCard({ user, withLink, children, ...props }) {\n const title = withLink ? {user.name} : user.name;\n return (\n \n
\n {children}\n {title}
\n {body && {body}
}\n No results matching search term.
;\n }\n\n return (\n - \n {searchResults.map(q => (\n
\n {searchResults && renderResults()}\n
\n \n
\n\n \n search(event.target.value)}\n placeholder={inputPlaceholder}\n aria-label={inputPlaceholder}\n autoFocus\n />\n
\n {renderStagedItem && (\n \n
\n )}\n {selectedItemsTitle}
\n\n
\n \n );\n}\n\nSelectItemsDialog.propTypes = {\n dialog: DialogPropType.isRequired,\n dialogTitle: PropTypes.string,\n inputPlaceholder: PropTypes.string,\n selectedItemsTitle: PropTypes.string,\n searchItems: PropTypes.func.isRequired, // (searchTerm: string): Promise\n {isLoading && renderItem(item, { isSelected: isItemSelected(item) })}\n onItemClick={toggleItem}\n />\n )}\n
\n {renderStagedItem && (\n \n {selectedItems.length > 0 && (\n renderStagedItem(item, { isSelected: true })}\n onItemClick={toggleItem}\n />\n )}\n
\n )}\n \n
\n );\n };\n}\n\nexport default wrapSettingsTab;\n"
},
{
"path": "client/app/components/TagsList.less",
"content": "@import (reference, less) \"~@/assets/less/ant\";\n\n.tags-list {\n .tags-list-title {\n margin: 15px 5px 5px 5px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n .tags-list-label {\n display: block;\n white-space: nowrap;\n margin: 0;\n }\n\n a,\n .plain-button {\n display: block;\n white-space: nowrap;\n cursor: pointer;\n\n .anticon {\n font-size: 75%;\n margin-right: 2px;\n }\n }\n }\n\n .ant-badge-count {\n background-color: fade(@redash-gray, 10%);\n color: fade(@redash-gray, 75%);\n }\n\n .ant-menu.ant-menu-inline {\n border: none;\n\n .ant-menu-item {\n width: 100%;\n }\n\n .ant-menu-item-selected {\n .ant-badge-count {\n background-color: @primary-color;\n color: white;\n }\n }\n\n .ant-menu-item {\n &:hover,\n &:active,\n &:focus,\n &:focus-within {\n color: @primary-color;\n transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n }\n }\n }\n}\n"
},
{
"path": "client/app/components/TagsList.tsx",
"content": "import { map, includes, difference } from \"lodash\";\nimport React, { useState, useCallback, useEffect } from \"react\";\nimport Badge from \"antd/lib/badge\";\nimport Menu from \"antd/lib/menu\";\nimport CloseOutlinedIcon from \"@ant-design/icons/CloseOutlined\";\nimport getTags from \"@/services/getTags\";\nimport PlainButton from \"@/components/PlainButton\";\n\nimport \"./TagsList.less\";\n\ntype Tag = {\n name: string;\n count?: number;\n};\n\ntype TagsListProps = {\n tagsUrl: string;\n showUnselectAll: boolean;\n onUpdate?: (selectedTags: string[]) => void;\n};\n\nfunction TagsList({ tagsUrl, showUnselectAll = false, onUpdate }: TagsListProps): JSX.Element | null {\n const [allTags, setAllTags] = useState\n
\n \n \n
\n \n
\n \n
\n \n
\n );\n}\n\nexport default TagsList;\n"
},
{
"path": "client/app/components/TimeAgo.jsx",
"content": "import moment from \"moment\";\nimport { isNil } from \"lodash\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Moment } from \"@/components/proptypes\";\nimport { clientConfig } from \"@/services/auth\";\nimport Tooltip from \"@/components/Tooltip\";\n\nfunction toMoment(value) {\n value = !isNil(value) ? moment(value) : null;\n return value && value.isValid() ? value : null;\n}\n\nexport default function TimeAgo({ date, placeholder, autoUpdate, variation }) {\n const startDate = toMoment(date);\n const [value, setValue] = useState(null);\n const title = useMemo(() => (startDate ? startDate.format(clientConfig.dateTimeFormat) : null), [startDate]);\n\n useEffect(() => {\n function update() {\n setValue(startDate ? startDate.fromNow() : placeholder);\n }\n update();\n\n if (autoUpdate) {\n const timer = setInterval(update, 30 * 1000);\n return () => clearInterval(timer);\n }\n }, [autoUpdate, startDate, placeholder]);\n\n if (variation === \"timeAgoInTooltip\") {\n return (\n \n Tags\n {showUnselectAll && selectedTags.length > 0 && (\n \n \n )}\n
\n\n \n \n
\n \n {map(groups, group => (\n {linkGroups ? {group.name} : group.name} \n ))}\n
\n );\n}\n\nUserGroups.propTypes = {\n groups: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n name: PropTypes.string,\n })\n ),\n linkGroups: PropTypes.bool,\n};\n\nUserGroups.defaultProps = {\n groups: [],\n linkGroups: true,\n};\n"
},
{
"path": "client/app/components/UserGroups.less",
"content": ".user-groups {\n margin: -5px 0 0 -5px;\n\n .ant-tag {\n margin: 5px 0 0 5px;\n }\n}\n"
},
{
"path": "client/app/components/admin/Layout.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Menu from \"antd/lib/menu\";\nimport PageHeader from \"@/components/PageHeader\";\nimport Link from \"@/components/Link\";\n\nimport \"./layout.less\";\n\nexport default function Layout({ activeTab, children }) {\n return (\n \n
\n );\n}\n\nLayout.propTypes = {\n activeTab: PropTypes.string,\n children: PropTypes.node,\n};\n\nLayout.defaultProps = {\n activeTab: \"system_status\",\n children: null,\n};\n"
},
{
"path": "client/app/components/admin/RQStatus.jsx",
"content": "import { map } from \"lodash\";\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport Badge from \"antd/lib/badge\";\nimport Card from \"antd/lib/card\";\nimport Spin from \"antd/lib/spin\";\nimport Table from \"antd/lib/table\";\nimport { Columns } from \"@/components/items-list/components/ItemsTable\";\n\n// CounterCard\n\nexport function CounterCard({ title, value, loading }) {\n return (\n \n
\n \n \n {children}\n
\n {value}
\n No data
}\n {info.length > 0 && (\n No data
}\n {info.length > 0 && (\n No data
}\n {info.length > 0 && (\n No data
}\n {info && - item} />}\n
{item.title}
\n \n ),\n };\n\n return item.href ? :\n {showSearch && (\n
\n );\n}\n\nCardsList.propTypes = {\n items: PropTypes.arrayOf(\n PropTypes.shape({\n title: PropTypes.string.isRequired,\n imgSrc: PropTypes.string.isRequired,\n onClick: PropTypes.func,\n href: PropTypes.string,\n })\n ),\n showSearch: PropTypes.bool,\n};\n"
},
{
"path": "client/app/components/dashboards/AddWidgetDialog.jsx",
"content": "import { map, includes, groupBy, first, find } from \"lodash\";\nimport React, { useState, useMemo, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport Select from \"antd/lib/select\";\nimport Modal from \"antd/lib/modal\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\nimport { MappingType, ParameterMappingListInput } from \"@/components/ParameterMappingInput\";\nimport QuerySelector from \"@/components/QuerySelector\";\nimport notification from \"@/services/notification\";\nimport { Query } from \"@/services/query\";\nimport { useUniqueId } from \"@/lib/hooks/useUniqueId\";\n\nfunction VisualizationSelect({ query, visualization, onChange }) {\n const visualizationGroups = useMemo(() => {\n return query ? groupBy(query.visualizations, \"type\") : {};\n }, [query]);\n\n const vizSelectId = useUniqueId(\"visualization-select\");\n\n const handleChange = useCallback(\n visualizationId => {\n const selectedVisualization = query ? find(query.visualizations, { id: visualizationId }) : null;\n onChange(selectedVisualization || null);\n },\n [query, onChange]\n );\n\n if (!query) {\n return null;\n }\n\n return (\n \n
\n )}\n {isEmpty(filteredItems) ? (\n \n ) => setSearchText(e.target.value)}\n autoFocus\n />\n
\n \n
\n )}\n \n {filteredItems.map((item: CardsListItem, index: number) => (\n
\n \n
\n );\n}\n\nVisualizationSelect.propTypes = {\n query: PropTypes.object,\n visualization: PropTypes.object,\n onChange: PropTypes.func,\n};\n\nVisualizationSelect.defaultProps = {\n query: null,\n visualization: null,\n onChange: () => {},\n};\n\nfunction AddWidgetDialog({ dialog, dashboard }) {\n const [selectedQuery, setSelectedQuery] = useState(null);\n const [selectedVisualization, setSelectedVisualization] = useState(null);\n const [parameterMappings, setParameterMappings] = useState([]);\n\n const selectQuery = useCallback(\n queryId => {\n // Clear previously selected query (if any)\n setSelectedQuery(null);\n setSelectedVisualization(null);\n setParameterMappings([]);\n\n if (queryId) {\n Query.get({ id: queryId }).then(query => {\n if (query) {\n const existingParamNames = map(dashboard.getParametersDefs(), param => param.name);\n setSelectedQuery(query);\n setParameterMappings(\n map(query.getParametersDefs(), param => ({\n name: param.name,\n type: includes(existingParamNames, param.name)\n ? MappingType.DashboardMapToExisting\n : MappingType.DashboardAddNew,\n mapTo: param.name,\n value: param.normalizedValue,\n title: \"\",\n param,\n }))\n );\n if (query.visualizations.length > 0) {\n setSelectedVisualization(first(query.visualizations));\n }\n }\n });\n }\n },\n [dashboard]\n );\n\n const saveWidget = useCallback(() => {\n dialog.close({ visualization: selectedVisualization, parameterMappings }).catch(() => {\n notification.error(\"Widget could not be added\");\n });\n }, [dialog, selectedVisualization, parameterMappings]);\n\n const existingParams = dashboard.getParametersDefs();\n const parameterMappingsId = useUniqueId(\"parameter-mappings\");\n\n return (\n \n \n \n {map(visualizationGroups, (visualizations, groupKey) => (\n \n {map(visualizations, visualization => (\n \n {visualization.name}\n \n ))}\n \n ))}\n \n
\n \n selectQuery(query ? query.id : null)} />\n\n {selectedQuery && (\n
\n \n );\n}\n\nAddWidgetDialog.propTypes = {\n dialog: DialogPropType.isRequired,\n dashboard: PropTypes.object.isRequired,\n};\n\nexport default wrapDialog(AddWidgetDialog);\n"
},
{
"path": "client/app/components/dashboards/AutoHeightController.js",
"content": "import { includes, reduce, some } from \"lodash\";\n\n// TODO: Revisit this implementation when migrating widget component to React\n\nconst WIDGET_SELECTOR = '[data-widgetid=\"{0}\"]';\nconst WIDGET_CONTENT_SELECTOR = [\n \".widget-header\", // header\n \".visualization-renderer\", // visualization\n \".scrollbox .alert\", // error state\n \".spinner-container\", // loading state\n \".tile__bottom-control\", // footer\n].join(\",\");\nconst INTERVAL = 200;\n\nexport default class AutoHeightController {\n widgets = {};\n\n interval = null;\n\n onHeightChange = null;\n\n constructor(handler) {\n this.onHeightChange = handler;\n }\n\n update(widgets) {\n const newWidgetIds = widgets\n .filter(widget => widget.options.position.autoHeight)\n .map(widget => widget.id.toString());\n\n // added\n newWidgetIds.filter(id => !includes(Object.keys(this.widgets), id)).forEach(this.add);\n\n // removed\n Object.keys(this.widgets)\n .filter(id => !includes(newWidgetIds, id))\n .forEach(this.remove);\n }\n\n add = id => {\n if (this.isEmpty()) {\n this.start();\n }\n\n const selector = WIDGET_SELECTOR.replace(\"{0}\", id);\n this.widgets[id] = [\n function getHeight() {\n const widgetEl = document.querySelector(selector);\n if (!widgetEl) {\n return undefined; // safety\n }\n\n // get all content elements\n const els = widgetEl.querySelectorAll(WIDGET_CONTENT_SELECTOR);\n\n // calculate accumulated height\n return reduce(\n els,\n (acc, el) => {\n const height = el ? el.getBoundingClientRect().height : 0;\n return acc + height;\n },\n 0\n );\n },\n ];\n };\n\n remove = id => {\n // ignore if not an active autoHeight widget\n if (!this.exists(id)) {\n return;\n }\n\n // not actually deleting from this.widgets to prevent case of unwanted re-adding\n this.widgets[id.toString()] = false;\n\n if (this.isEmpty()) {\n this.stop();\n }\n };\n\n exists = id => !!this.widgets[id.toString()];\n\n isEmpty = () => !some(this.widgets);\n\n checkHeightChanges = () => {\n Object.keys(this.widgets)\n .filter(this.exists) // reject already removed items\n .forEach(id => {\n const [getHeight, prevHeight] = this.widgets[id];\n const height = getHeight();\n if (height && height !== prevHeight) {\n this.widgets[id][1] = height; // save\n this.onHeightChange(id, height); // dispatch\n }\n });\n };\n\n start = () => {\n this.stop();\n this.interval = setInterval(this.checkHeightChanges, INTERVAL);\n };\n\n stop = () => {\n clearInterval(this.interval);\n };\n\n resume = () => {\n if (!this.isEmpty()) {\n this.start();\n }\n };\n\n destroy = () => {\n this.stop();\n this.widgets = null;\n };\n}\n"
},
{
"path": "client/app/components/dashboards/CreateDashboardDialog.jsx",
"content": "import { trim } from \"lodash\";\nimport React, { useState } from \"react\";\nimport Modal from \"antd/lib/modal\";\nimport Input from \"antd/lib/input\";\nimport DynamicComponent from \"@/components/DynamicComponent\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\nimport navigateTo from \"@/components/ApplicationArea/navigateTo\";\nimport recordEvent from \"@/services/recordEvent\";\nimport { policy } from \"@/services/policy\";\nimport { Dashboard } from \"@/services/dashboard\";\n\nfunction CreateDashboardDialog({ dialog }) {\n const [name, setName] = useState(\"\");\n const [isValid, setIsValid] = useState(false);\n const [saveInProgress, setSaveInProgress] = useState(false);\n const isCreateDashboardEnabled = policy.isCreateDashboardEnabled();\n\n function handleNameChange(event) {\n const value = trim(event.target.value);\n setName(value);\n setIsValid(value !== \"\");\n }\n\n function save() {\n if (name !== \"\") {\n setSaveInProgress(true);\n\n Dashboard.save({ name }).then(data => {\n dialog.close();\n navigateTo(`${data.url}?edit`);\n });\n recordEvent(\"create\", \"dashboard\");\n }\n }\n\n return (\n \n \n {widgets.map(widget => (\n \n
\n ))}\n \n \n );\n }\n}\n\nexport default DashboardGrid;\n"
},
{
"path": "client/app/components/dashboards/EditParameterMappingsDialog.jsx",
"content": "import { isMatch, map, find, sortBy } from \"lodash\";\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Modal from \"antd/lib/modal\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\nimport {\n MappingType,\n ParameterMappingListInput,\n parameterMappingsToEditableMappings,\n editableMappingsToParameterMappings,\n synchronizeWidgetTitles,\n} from \"@/components/ParameterMappingInput\";\nimport notification from \"@/services/notification\";\n\nexport function getParamValuesSnapshot(mappings, dashboardParameters) {\n return map(\n sortBy(mappings, m => m.name),\n m => {\n let param;\n switch (m.type) {\n case MappingType.StaticValue:\n return [m.name, m.value];\n case MappingType.WidgetLevel:\n return [m.name, m.param.value];\n case MappingType.DashboardAddNew:\n case MappingType.DashboardMapToExisting:\n param = find(dashboardParameters, p => p.name === m.mapTo);\n return [m.name, param ? param.value : null];\n // no default\n }\n }\n );\n}\n\nclass EditParameterMappingsDialog extends React.Component {\n static propTypes = {\n dashboard: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n widget: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n dialog: DialogPropType.isRequired,\n };\n\n originalParamValuesSnapshot = null;\n\n constructor(props) {\n super(props);\n\n const parameterMappings = parameterMappingsToEditableMappings(\n props.widget.options.parameterMappings,\n props.widget.query.getParametersDefs(),\n map(this.props.dashboard.getParametersDefs(), p => p.name)\n );\n\n this.originalParamValuesSnapshot = getParamValuesSnapshot(\n parameterMappings,\n this.props.dashboard.getParametersDefs()\n );\n\n this.state = {\n saveInProgress: false,\n parameterMappings,\n };\n }\n\n saveWidget() {\n const widget = this.props.widget;\n\n this.setState({ saveInProgress: true });\n\n const newMappings = editableMappingsToParameterMappings(this.state.parameterMappings);\n widget.options.parameterMappings = newMappings;\n\n const valuesChanged = !isMatch(\n this.originalParamValuesSnapshot,\n getParamValuesSnapshot(this.state.parameterMappings, this.props.dashboard.getParametersDefs())\n );\n\n const widgetsToSave = [\n widget,\n ...synchronizeWidgetTitles(widget.options.parameterMappings, this.props.dashboard.widgets),\n ];\n\n Promise.all(map(widgetsToSave, w => w.save()))\n .then(() => {\n this.props.dialog.close(valuesChanged);\n })\n .catch(() => {\n notification.error(\"Widget cannot be updated\");\n })\n .finally(() => {\n this.setState({ saveInProgress: false });\n });\n }\n\n updateParamMappings(parameterMappings) {\n this.setState({ parameterMappings });\n }\n\n render() {\n const { dialog } = this.props;\n return (\n \n \n Markdown \n \n .\n \n {text && (\n \n {preview} \n \n )}\n
\n \n );\n}\n\nTextboxDialog.propTypes = {\n dialog: DialogPropType.isRequired,\n isNew: PropTypes.bool,\n text: PropTypes.string,\n};\n\nTextboxDialog.defaultProps = {\n isNew: false,\n text: \"\",\n};\n\nexport default wrapDialog(TextboxDialog);\n"
},
{
"path": "client/app/components/dashboards/TextboxDialog.less",
"content": ".textbox-dialog {\n small {\n display: block;\n margin-top: 4px;\n }\n\n .preview {\n padding: 9px 9px 1px;\n background-color: #f7f7f7;\n margin-top: 8px;\n word-wrap: break-word\n }\n\n .preview-title {\n display: block;\n margin-top: -5px;\n }\n}"
},
{
"path": "client/app/components/dashboards/dashboard-grid.less",
"content": ".dashboard-wrapper {\n flex-grow: 1;\n margin-bottom: 70px;\n\n .layout {\n margin: -15px -15px 0;\n }\n\n .tile {\n display: flex;\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n width: auto;\n height: auto;\n overflow: hidden;\n margin: 0;\n padding: 0;\n }\n\n .pivot-table-visualization-container > table,\n .visualization-renderer > .visualization-renderer-wrapper {\n overflow: visible;\n }\n\n &.preview-mode {\n .widget-menu-regular {\n display: block;\n }\n .widget-menu-remove {\n display: none;\n }\n }\n\n &.editing-mode {\n /* Y axis lines */\n background: linear-gradient(to right, transparent, transparent 1px, #f6f8f9 1px, #f6f8f9),\n linear-gradient(to bottom, #b3babf, #b3babf 1px, transparent 1px, transparent);\n background-size: 5px 50px;\n background-position-y: -8px;\n\n /* X axis lines */\n &::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n bottom: 85px;\n right: 0;\n background: linear-gradient(to bottom, transparent, transparent 2px, #f6f8f9 2px, #f6f8f9 5px),\n linear-gradient(to left, #b3babf, #b3babf 1px, transparent 1px, transparent);\n background-size: calc((100% + 15px) / 12) 5px;\n background-position: -7px 1px;\n }\n }\n\n .widget-auto-height-enabled {\n .spinner {\n position: static;\n }\n\n .scrollbox {\n overflow-y: hidden;\n }\n }\n}\n\n.react-grid-layout {\n &.disable-animations {\n & > .react-grid-item {\n transition: none !important;\n }\n }\n}\n\n.dashboard-wrapper .dashboard-widget-wrapper:not(.widget-auto-height-enabled),\n.query-fixed-layout {\n .visualization-renderer {\n display: flex;\n flex-direction: column;\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n\n > .visualization-renderer-wrapper {\n flex-grow: 1;\n position: relative;\n }\n\n > .filters-wrapper {\n flex-grow: 0;\n flex-shrink: 0;\n }\n }\n\n .sunburst-visualization-container,\n .sankey-visualization-container,\n .map-visualization-container,\n .word-cloud-visualization-container,\n .box-plot-deprecated-visualization-container,\n .chart-visualization-container {\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n width: auto;\n height: auto;\n overflow: hidden;\n }\n\n .counter-visualization-container {\n height: 100%;\n\n .counter-visualization-content {\n position: absolute;\n left: 10px;\n top: 15px;\n right: 10px;\n bottom: 15px;\n height: auto;\n overflow: hidden;\n padding: 0;\n }\n }\n}\n\n.query-fixed-layout {\n .visualization-renderer > .visualization-renderer-wrapper {\n .counter-visualization-container {\n // counter is too large on Query pages, so let's add some constraints\n max-width: 600px;\n max-height: 400px;\n // center it\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n }\n }\n}\n\n// react-grid-layout overrides\n.react-grid-item {\n touch-action: initial !important; // react-draggable disables touch by default\n\n &.react-draggable {\n touch-action: none !important;\n }\n\n // placeholder color\n &.react-grid-placeholder {\n border-radius: 3px;\n background-color: #e0e6eb;\n opacity: 0.5;\n }\n\n // resize placeholder behind widget, the lib's default is above đ€·ââïž\n &.resizing {\n z-index: 3;\n }\n\n // auto-height animation\n &.cssTransforms:not(.resizing) {\n transition-property: transform, height; // added \", height\"\n }\n\n // resize handle size\n & > .react-resizable-handle {\n background: none;\n &:after {\n width: 11px;\n height: 11px;\n right: 5px;\n bottom: 5px;\n }\n }\n}\n"
},
{
"path": "client/app/components/dashboards/dashboard-widget/RestrictedWidget.jsx",
"content": "import React from \"react\";\nimport Widget from \"./Widget\";\n\nfunction RestrictedWidget(props) {\n return (\n \n
\n \n
\n \n \n
\nThis widget requires access to a data source you don't have access to.
\n\n
\n );\n}\n\nRefreshIndicator.propTypes = { refreshStartedAt: Moment };\nRefreshIndicator.defaultProps = { refreshStartedAt: null };\n\nfunction VisualizationWidgetHeader({\n widget,\n refreshStartedAt,\n parameters,\n isEditing,\n onParametersUpdate,\n onParametersEdit,\n}) {\n const canViewQuery = currentUser.hasPermission(\"view_query\");\n\n return (\n <>\n \n \n Refreshing...\n
\n \n
\n {!isEmpty(parameters) && (\n \n \n {markdown.toHTML(widget.getQuery().description || \"\")}\n \n )}\n
\n \n
\n
\n )}\n \n );\n}\n\nVisualizationWidgetHeader.propTypes = {\n widget: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n refreshStartedAt: Moment,\n parameters: PropTypes.arrayOf(PropTypes.object),\n isEditing: PropTypes.bool,\n onParametersUpdate: PropTypes.func,\n onParametersEdit: PropTypes.func,\n};\n\nVisualizationWidgetHeader.defaultProps = {\n refreshStartedAt: null,\n onParametersUpdate: () => {},\n onParametersEdit: () => {},\n isEditing: false,\n parameters: [],\n};\n\nfunction VisualizationWidgetFooter({ widget, isPublic, onRefresh, onExpand }) {\n const widgetQueryResult = widget.getQueryResult();\n const updatedAt = invoke(widgetQueryResult, \"getUpdatedAt\");\n const [refreshClickButtonId, setRefreshClickButtonId] = useState();\n\n const refreshWidget = buttonId => {\n if (!refreshClickButtonId) {\n setRefreshClickButtonId(buttonId);\n onRefresh().finally(() => setRefreshClickButtonId(null));\n }\n };\n\n return widgetQueryResult ? (\n <>\n \n {!isPublic && !!widgetQueryResult && (\n \n {widgetQueryResult.getError() && (\n
\n );\n case \"done\":\n return (\n \n Error running query: {widgetQueryResult.getError()}\n
\n )}\n \n
\n );\n default:\n return (\n \n \n Loading...\n
\n \n );\n }\n }\n\n render() {\n const { widget, isLoading, isPublic, canEdit, isEditing, onRefresh } = this.props;\n const { localParameters } = this.state;\n const widgetQueryResult = widget.getQueryResult();\n const isRefreshing = isLoading && !!(widgetQueryResult && widgetQueryResult.getStatus());\n const onParametersEdit = parameters => {\n const paramOrder = map(parameters, \"name\");\n widget.options.paramOrder = paramOrder;\n widget.save(\"options\", { paramOrder });\n };\n\n return (\n \n \n \n \n \n \n
\n );\n}\n\nWidgetDropdownButton.propTypes = {\n extraOptions: PropTypes.node,\n showDeleteOption: PropTypes.bool,\n onDelete: PropTypes.func,\n};\n\nWidgetDropdownButton.defaultProps = {\n extraOptions: null,\n showDeleteOption: false,\n onDelete: () => {},\n};\n\nfunction WidgetDeleteButton({ onClick }) {\n return (\n \n \n \n \n
\n );\n}\n\nWidgetDeleteButton.propTypes = { onClick: PropTypes.func };\nWidgetDeleteButton.defaultProps = { onClick: () => {} };\n\nclass Widget extends React.Component {\n static propTypes = {\n widget: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n className: PropTypes.string,\n children: PropTypes.node,\n header: PropTypes.node,\n footer: PropTypes.node,\n canEdit: PropTypes.bool,\n isPublic: PropTypes.bool,\n refreshStartedAt: Moment,\n menuOptions: PropTypes.node,\n tileProps: PropTypes.object, // eslint-disable-line react/forbid-prop-types\n onDelete: PropTypes.func,\n };\n\n static defaultProps = {\n className: \"\",\n children: null,\n header: null,\n footer: null,\n canEdit: false,\n isPublic: false,\n refreshStartedAt: null,\n menuOptions: null,\n tileProps: {},\n onDelete: () => {},\n };\n\n componentDidMount() {\n const { widget } = this.props;\n recordEvent(\"view\", \"widget\", widget.id);\n }\n\n deleteWidget = () => {\n const { widget, onDelete } = this.props;\n\n Modal.confirm({\n title: \"Delete Widget\",\n content: \"Are you sure you want to remove this widget from the dashboard?\",\n okText: \"Delete\",\n okType: \"danger\",\n onOk: () => widget.delete().then(onDelete),\n maskClosable: true,\n autoFocusButton: null,\n });\n };\n\n render() {\n const { className, children, header, footer, canEdit, isPublic, menuOptions, tileProps } = this.props;\n const showDropdownButton = !isPublic && (canEdit || !isEmpty(menuOptions));\n return (\n \n
\n );\n }\n}\n\nexport default Widget;\n"
},
{
"path": "client/app/components/dashboards/dashboard-widget/Widget.less",
"content": "@import (reference, less) \"~@/assets/less/inc/variables\";\n\n.widget-wrapper {\n .widget-actions {\n display: flex;\n position: absolute;\n top: 0;\n right: 0;\n z-index: 1;\n\n .action {\n font-size: 24px;\n cursor: pointer;\n line-height: 100%;\n display: block;\n padding: 4px 10px 3px;\n\n &:focus {\n background-color: rgba(0, 0, 0, 0.1);\n }\n\n &:hover {\n background-color: transparent;\n color: @blue;\n }\n\n &:active {\n filter: brightness(75%);\n }\n }\n }\n\n .parameter-container {\n margin: 0 15px;\n }\n\n .body-container {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n\n .body-row {\n flex: 0 1 auto;\n }\n\n .body-row-auto {\n flex: 1 1 auto;\n }\n }\n\n .spinner-container {\n position: relative;\n\n .spinner {\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n }\n }\n\n .scrollbox:empty {\n padding: 0 !important;\n font-size: 1px !important;\n }\n\n .widget-text {\n :first-child {\n margin-top: 0;\n }\n :last-child {\n margin-bottom: 0;\n }\n }\n}\n\n.editing-mode {\n .widget-menu-remove {\n display: block;\n }\n\n .query-link {\n pointer-events: none;\n cursor: move;\n }\n\n .th-title {\n cursor: move;\n }\n\n .refresh-indicator {\n transition-duration: 0s;\n\n .rd-timer {\n display: none;\n }\n\n .refresh-indicator-mini();\n }\n}\n\n.refresh-indicator {\n font-size: 18px;\n color: #86a1af;\n transition: all 100ms linear;\n transition-delay: 150ms; // waits for widget-menu to fade out before moving back over it\n transform: translateX(22px);\n position: absolute;\n right: 29px;\n top: 8px;\n display: flex;\n flex-direction: row-reverse;\n\n .refresh-icon {\n position: relative;\n\n &:before {\n content: \"\";\n position: absolute;\n top: 0px;\n right: 0;\n width: 24px;\n height: 24px;\n background-color: #e8ecf0;\n border-radius: 50%;\n transition: opacity 100ms linear;\n transition-delay: 150ms;\n }\n\n i {\n height: 24px;\n width: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n }\n\n .rd-timer {\n font-size: 13px;\n display: inline-block;\n font-variant-numeric: tabular-nums;\n opacity: 0;\n transform: translateX(-6px);\n transition: all 100ms linear;\n transition-delay: 150ms;\n color: #bbbbbb;\n background-color: rgba(255, 255, 255, 0.9);\n padding-left: 2px;\n padding-right: 1px;\n margin-right: -4px;\n margin-top: 2px;\n }\n\n .widget-visualization[data-refreshing=\"false\"] & {\n display: none;\n }\n}\n\n.refresh-indicator-mini() {\n font-size: 13px;\n transition-delay: 0s;\n color: #bbbbbb;\n transform: translateY(-4px);\n\n .refresh-icon:before {\n transition-delay: 0s;\n opacity: 0;\n }\n\n .rd-timer {\n transition-delay: 0s;\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n.tile {\n .widget-menu-regular,\n .btn__refresh {\n opacity: 0 !important;\n transition: opacity 0.35s ease-in-out;\n }\n\n .t-header {\n .th-title {\n padding-right: 23px; // no overlap on RefreshIndicator\n\n .hidden-print {\n margin-bottom: 0;\n }\n\n .query-link {\n color: fade(@redash-black, 80%);\n font-size: 15px;\n font-weight: 500;\n\n &:not(.visualization-name) {\n color: fade(@redash-black, 50%);\n }\n }\n }\n\n .query--description {\n font-size: 14px;\n line-height: 1.5;\n font-style: italic;\n\n p {\n margin-bottom: 0;\n }\n }\n }\n\n .t-header.widget {\n padding: 15px;\n }\n\n &:hover,\n &:focus,\n &:active,\n &:focus-within {\n .widget-menu-regular,\n .btn__refresh {\n opacity: 1 !important;\n transition: opacity 0.35s ease-in-out;\n }\n\n .refresh-indicator {\n .refresh-indicator-mini();\n }\n }\n\n .tile__bottom-control {\n padding: 10px 15px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n .btn-transparent {\n &:first-child {\n margin-left: -10px;\n }\n\n &:last-child {\n margin-right: -10px;\n }\n }\n\n a,\n .plain-button {\n color: fade(@redash-black, 65%);\n\n &:hover,\n &:focus {\n color: fade(@redash-black, 95%);\n }\n }\n }\n}\n"
},
{
"path": "client/app/components/dashboards/dashboard-widget/index.js",
"content": "export { default as VisualizationWidget } from \"./VisualizationWidget\";\nexport { default as TextboxWidget } from \"./TextboxWidget\";\nexport { default as RestrictedWidget } from \"./RestrictedWidget\";\n"
},
{
"path": "client/app/components/dynamic-form/DynamicForm.jsx",
"content": "import React, { useState, useReducer, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport cx from \"classnames\";\nimport Form from \"antd/lib/form\";\nimport Button from \"antd/lib/button\";\nimport { includes, isFunction, filter, find, difference, isEmpty, mapValues } from \"lodash\";\nimport notification from \"@/services/notification\";\nimport Collapse from \"@/components/Collapse\";\nimport DynamicFormField, { FieldType } from \"./DynamicFormField\";\nimport getFieldLabel from \"./getFieldLabel\";\nimport helper from \"./dynamicFormHelper\";\n\nimport \"./DynamicForm.less\";\n\nconst ActionType = PropTypes.shape({\n name: PropTypes.string.isRequired,\n callback: PropTypes.func.isRequired,\n type: PropTypes.string,\n pullRight: PropTypes.bool,\n disabledWhenDirty: PropTypes.bool,\n});\n\nconst AntdFormType = PropTypes.shape({\n validateFieldsAndScroll: PropTypes.func,\n});\n\nconst fieldRules = ({ type, required, minLength }) => {\n const requiredRule = required;\n const minLengthRule = minLength && includes([\"text\", \"email\", \"password\"], type);\n const emailTypeRule = type === \"email\";\n\n return [\n requiredRule && { required, message: \"This field is required.\" },\n minLengthRule && { min: minLength, message: \"This field is too short.\" },\n emailTypeRule && { type: \"email\", message: \"This field must be a valid email.\" },\n ].filter(rule => rule);\n};\n\nfunction normalizeEmptyValuesToNull(fields, values) {\n return mapValues(values, (value, key) => {\n const { initialValue } = find(fields, { name: key }) || {};\n if ((initialValue === null || initialValue === undefined || initialValue === \"\") && value === \"\") {\n return null;\n }\n return value;\n });\n}\n\nfunction DynamicFormFields({ fields, feedbackIcons, form }) {\n return fields.map(field => {\n const { name, type, initialValue, contentAfter } = field;\n const fieldLabel = getFieldLabel(field);\n\n const formItemProps = {\n name,\n className: \"m-b-10\",\n hasFeedback: type !== \"checkbox\" && type !== \"file\" && feedbackIcons,\n label: type === \"checkbox\" ? \"\" : fieldLabel,\n rules: fieldRules(field),\n valuePropName: type === \"checkbox\" ? \"checked\" : \"value\",\n initialValue,\n };\n\n if (type === \"file\") {\n formItemProps.valuePropName = \"data-value\";\n formItemProps.getValueFromEvent = e => {\n if (e && e.fileList[0]) {\n helper.getBase64(e.file).then(value => {\n form.setFieldsValue({ [name]: value });\n });\n }\n return undefined;\n };\n }\n\n return (\n \n
\n \n {showDropdownButton && (\n
\n {header}
\n {children}\n {footer && {footer}
}\n \n setShowExtraFields(currentShowExtraFields => !currentShowExtraFields)}>\n Additional Settings\n \n \n
\n )}\n {!hideSubmitButton && (\n \n )}\n \n
\n );\n}\n\nDynamicButton.propTypes = {\n options: PropTypes.arrayOf(PropTypes.object), // eslint-disable-line react/forbid-prop-types\n selectedDynamicValue: PropTypes.oneOfType([DynamicDateType, DynamicDateRangeType]),\n onSelect: PropTypes.func,\n enabled: PropTypes.bool,\n staticValueLabel: PropTypes.string,\n};\n\nDynamicButton.defaultProps = {\n options: [],\n selectedDynamicValue: null,\n onSelect: () => {},\n enabled: false,\n staticValueLabel: \"Back to Static Value\",\n};\n\nexport default DynamicButton;\n"
},
{
"path": "client/app/components/dynamic-parameters/DynamicButton.less",
"content": ".dynamic-button {\n height: 100%;\n position: absolute !important;\n right: 1px;\n top: 0;\n\n .ant-dropdown-trigger {\n height: 100%;\n }\n\n button {\n border: none;\n padding: 0;\n box-shadow: none;\n background-color: transparent !important;\n }\n\n &:after {\n content: \"\";\n position: absolute;\n width: 1px;\n height: 19px;\n left: 0;\n top: 8px;\n border-left: 1px dotted rgba(0, 0, 0, 0.12);\n }\n}\n\n.dynamic-menu {\n width: 187px;\n\n em {\n color: #ccc;\n font-size: 11px;\n }\n}\n\n.dynamic-icon {\n display: flex !important;\n align-items: center;\n justify-content: center;\n}\n"
},
{
"path": "client/app/components/dynamic-parameters/DynamicDatePicker.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classNames from \"classnames\";\nimport moment from \"moment\";\nimport { includes } from \"lodash\";\nimport { isDynamicDate } from \"@/services/parameters/DateParameter\";\nimport DateInput from \"@/components/DateInput\";\nimport DateTimeInput from \"@/components/DateTimeInput\";\nimport DynamicButton from \"@/components/dynamic-parameters/DynamicButton\";\n\nimport \"./DynamicParameters.less\";\n\nclass DynamicDatePicker extends React.Component {\n static propTypes = {\n type: PropTypes.string,\n className: PropTypes.string,\n value: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n parameter: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n onSelect: PropTypes.func,\n dynamicButtonOptions: PropTypes.shape({\n staticValueLabel: PropTypes.string,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n name: PropTypes.string,\n value: PropTypes.object,\n label: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n })\n ),\n }),\n dateOptions: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n };\n\n static defaultProps = {\n type: \"\",\n className: \"\",\n value: null,\n parameter: null,\n dynamicButtonOptions: {\n options: [],\n },\n onSelect: () => {},\n };\n\n constructor(props) {\n super(props);\n this.dateComponentRef = React.createRef();\n }\n\n onDynamicValueSelect = dynamicValue => {\n const { onSelect, parameter } = this.props;\n if (dynamicValue === \"static\") {\n const parameterValue = parameter.getExecutionValue();\n if (parameterValue) {\n onSelect(moment(parameterValue));\n } else {\n onSelect(null);\n }\n } else {\n onSelect(dynamicValue.value);\n }\n // give focus to the DatePicker to get keyboard shortcuts to work\n this.dateComponentRef.current.focus();\n };\n\n render() {\n const { type, value, className, dateOptions, dynamicButtonOptions, onSelect } = this.props;\n const hasDynamicValue = isDynamicDate(value);\n const isDateTime = includes(type, \"datetime\");\n\n const additionalAttributes = {};\n\n let DateComponent = DateInput;\n if (isDateTime) {\n DateComponent = DateTimeInput;\n if (includes(type, \"with-seconds\")) {\n additionalAttributes.withSeconds = true;\n }\n }\n\n if (moment.isMoment(value) || value === null) {\n additionalAttributes.value = value;\n }\n\n if (hasDynamicValue) {\n const dynamicDate = value;\n additionalAttributes.placeholder = dynamicDate && dynamicDate.name;\n additionalAttributes.value = null;\n }\n\n return (\n e.stopPropagation()}>\n
\n \n
\n );\n }\n}\n\nexport default DynamicDatePicker;\n"
},
{
"path": "client/app/components/dynamic-parameters/DynamicDateRangePicker.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classNames from \"classnames\";\nimport moment from \"moment\";\nimport { includes, isArray, isObject } from \"lodash\";\nimport { isDynamicDateRange } from \"@/services/parameters/DateRangeParameter\";\nimport DateRangeInput from \"@/components/DateRangeInput\";\nimport DateTimeRangeInput from \"@/components/DateTimeRangeInput\";\nimport DynamicButton from \"@/components/dynamic-parameters/DynamicButton\";\n\nimport \"./DynamicParameters.less\";\n\nfunction isValidDateRangeValue(value) {\n return isArray(value) && value.length === 2 && moment.isMoment(value[0]) && moment.isMoment(value[1]);\n}\n\nclass DynamicDateRangePicker extends React.Component {\n static propTypes = {\n type: PropTypes.oneOf([\"date-range\", \"datetime-range\", \"datetime-range-with-seconds\"]).isRequired,\n className: PropTypes.string,\n value: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n parameter: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n onSelect: PropTypes.func,\n dynamicButtonOptions: PropTypes.shape({\n staticValueLabel: PropTypes.string,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n name: PropTypes.string,\n value: PropTypes.object,\n label: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n })\n ),\n }),\n dateRangeOptions: PropTypes.any, // eslint-disable-line react/forbid-prop-types\n };\n\n static defaultProps = {\n type: \"date-range\",\n className: \"\",\n value: null,\n parameter: null,\n dynamicButtonOptions: {\n options: [],\n },\n onSelect: () => {},\n };\n\n constructor(props) {\n super(props);\n this.dateRangeComponentRef = React.createRef();\n }\n\n onDynamicValueSelect = dynamicValue => {\n const { onSelect, parameter } = this.props;\n if (dynamicValue === \"static\") {\n const parameterValue = parameter.getExecutionValue();\n if (isObject(parameterValue) && parameterValue.start && parameterValue.end) {\n onSelect([moment(parameterValue.start), moment(parameterValue.end)]);\n } else {\n onSelect(null);\n }\n } else {\n onSelect(dynamicValue.value);\n }\n // give focus to the DatePicker to get keyboard shortcuts to work\n this.dateRangeComponentRef.current.focus();\n };\n\n render() {\n const { type, value, onSelect, className, dynamicButtonOptions, dateRangeOptions, parameter, ...rest } = this.props;\n const isDateTimeRange = includes(type, \"datetime-range\");\n const hasDynamicValue = isDynamicDateRange(value);\n\n const additionalAttributes = {};\n\n let DateRangeComponent = DateRangeInput;\n if (isDateTimeRange) {\n DateRangeComponent = DateTimeRangeInput;\n if (includes(type, \"with-seconds\")) {\n additionalAttributes.withSeconds = true;\n }\n }\n\n if (isValidDateRangeValue(value) || value === null) {\n additionalAttributes.value = value;\n }\n\n if (hasDynamicValue) {\n additionalAttributes.placeholder = [value && value.name];\n additionalAttributes.value = null;\n }\n\n return (\n \n
\n );\n }\n}\n\nexport default DynamicDateRangePicker;\n"
},
{
"path": "client/app/components/dynamic-parameters/DynamicParameters.less",
"content": "@import (reference, less) \"~@/assets/less/inc/variables\";\n\n.date-range-parameter,\n.date-parameter {\n position: relative;\n}\n\n.redash-datepicker {\n padding-right: 35px !important;\n\n &.date-range {\n width: 294px;\n }\n &.datetime-range {\n width: 352px;\n }\n &.datetime-range-with-seconds {\n width: 382px;\n }\n &.dynamic-value {\n width: 195px;\n }\n\n &.ant-picker-range .ant-picker-clear {\n right: 35px !important;\n background: transparent;\n }\n\n &.date-range-input {\n transition: width 100ms ease-in-out;\n }\n\n &.dynamic-value {\n & ::placeholder {\n color: @input-color !important;\n }\n\n &.date-range-input {\n .ant-picker-active-bar {\n opacity: 0;\n }\n\n .ant-picker-separator,\n .ant-picker-range-separator {\n display: none;\n }\n\n .ant-picker-input:not(:first-child) {\n width: 0;\n }\n }\n }\n}\n"
},
{
"path": "client/app/components/empty-state/EmptyState.d.ts",
"content": "import React from \"react\";\n\ntype DefaultStepKey = \"dataSources\" | \"queries\" | \"alerts\" | \"dashboards\" | \"users\";\nexport type StepKey\n Need more support?{\" \"}\n
\n \n \n )}\n
\n );\n}\n\nEmptyState.propTypes = {\n icon: PropTypes.string,\n header: PropTypes.string,\n description: PropTypes.string.isRequired,\n illustration: PropTypes.string.isRequired,\n illustrationPath: PropTypes.string,\n helpMessage: PropTypes.node,\n closable: PropTypes.bool,\n onClose: PropTypes.func,\n\n onboardingMode: PropTypes.bool,\n showAlertStep: PropTypes.bool,\n showDashboardStep: PropTypes.bool,\n showDataSourceStep: PropTypes.bool,\n showInviteStep: PropTypes.bool,\n\n getStepItems: PropTypes.func,\n};\n\nEmptyState.defaultProps = {\n icon: null,\n header: null,\n helpMessage: null,\n closable: false,\n onClose: () => {},\n\n onboardingMode: false,\n showAlertStep: false,\n showDashboardStep: false,\n showDataSourceStep: true,\n showInviteStep: false,\n};\n\nexport default EmptyState;\n"
},
{
"path": "client/app/components/empty-state/empty-state.less",
"content": "@import (reference, less) \"~@/assets/less/ant\";\n\n// Empty states\n.empty-state {\n width: 100%;\n margin: 0 auto 10px;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n font-size: 14px;\n line-height: 21px;\n\n .empty-state__summary,\n .empty-state__steps {\n width: 48%;\n padding: 35px;\n padding-bottom: 25px;\n }\n\n .empty-state__steps {\n padding-left: 0;\n }\n\n .empty-state__summary {\n align-self: flex-start;\n text-align: center;\n background: rgba(102, 136, 153, 0.025);\n\n p {\n margin-bottom: 0;\n }\n }\n\n ol {\n margin-bottom: 15px;\n padding: 17px;\n }\n\n li.done {\n text-decoration: line-through;\n }\n\n h2 {\n margin: 0 0 15px;\n }\n\n h4 {\n margin-top: 0;\n margin-bottom: 15px;\n }\n\n a:hover {\n cursor: pointer;\n }\n\n @media (max-width: 767px) {\n flex-direction: column;\n\n .empty-state__summary {\n margin-bottom: 25px;\n padding-bottom: 15px;\n }\n\n .empty-state__summary,\n .empty-state__steps {\n width: 100%;\n }\n\n .empty-state__steps {\n padding-left: 35px;\n padding-top: 15px;\n }\n }\n}\n\n// close button\n.empty-state-wrapper {\n position: relative;\n\n .close-button {\n position: absolute;\n top: 15px;\n right: 25px;\n font-size: 15px;\n color: @text-color-secondary;\n cursor: pointer;\n transition: color @animation-duration-slow;\n\n &:hover,\n &:focus {\n color: @text-color;\n }\n\n &:active {\n filter: contrast(200%);\n }\n }\n}\n"
},
{
"path": "client/app/components/groups/CreateGroupDialog.jsx",
"content": "import React from \"react\";\nimport Modal from \"antd/lib/modal\";\nimport Input from \"antd/lib/input\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\n\nclass CreateGroupDialog extends React.Component {\n static propTypes = {\n dialog: DialogPropType.isRequired,\n };\n\n state = {\n name: \"\",\n };\n\n save = () => {\n this.props.dialog.close({\n name: this.state.name,\n });\n };\n\n render() {\n const { dialog } = this.props;\n return (\n \n
\n {closable && (\n \n {header && 
\n
\n {header}
}\n\n \n
\n{description}
\n\n
\n Let's get started
\n- {stepsItems.map((item) => item.node)}
\n updateGroupName(group, name, onChange)}\n value={group.name}\n />\n
\n );\n}\n\nGroupName.propTypes = {\n group: PropTypes.shape({\n name: PropTypes.string.isRequired,\n }),\n onChange: PropTypes.func,\n};\n\nGroupName.defaultProps = {\n group: null,\n onChange: () => {},\n};\n"
},
{
"path": "client/app/components/groups/ListItemAddon.jsx",
"content": "import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport Tooltip from \"@/components/Tooltip\";\n\nexport default function ListItemAddon({ isSelected, isStaged, alreadyInGroup, deselectedIcon }) {\n if (isStaged) {\n return (\n <>\n \n Remove\n \n );\n }\n if (alreadyInGroup) {\n return (\n \n
\n );\n}\n"
},
{
"path": "client/app/components/items-list/components/ItemsTable.jsx",
"content": "import { isFunction, map, filter, extend, omit, identity, range, isEmpty } from \"lodash\";\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classNames from \"classnames\";\nimport Table from \"antd/lib/table\";\nimport Skeleton from \"antd/lib/skeleton\";\nimport FavoritesControl from \"@/components/FavoritesControl\";\nimport TimeAgo from \"@/components/TimeAgo\";\nimport { durationHumanize, formatDate, formatDateTime } from \"@/lib/utils\";\n\n// `this` refers to previous function in the chain (`Columns.***`).\n// Adds `sorter: true` field to column definition\nfunction sortable(...args) {\n return extend(this(...args), { sorter: true });\n}\n\nexport const Columns = {\n favorites(overrides) {\n return extend(\n {\n width: \"1%\",\n render: (text, item) => \n
\n );\n}\n"
},
{
"path": "client/app/components/items-list/components/Sidebar.jsx",
"content": "import { isFunction, isString, filter, map } from \"lodash\";\nimport React, { useState, useCallback, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport Input from \"antd/lib/input\";\nimport AntdMenu from \"antd/lib/menu\";\nimport Link from \"@/components/Link\";\nimport TagsList from \"@/components/TagsList\";\n\n/*\n SearchInput\n */\n\nexport function SearchInput({ placeholder, value, showIcon, onChange, label }) {\n const [currentValue, setCurrentValue] = useState(value);\n\n useEffect(() => {\n setCurrentValue(value);\n }, [value]);\n\n const onInputChange = useCallback(\n event => {\n const newValue = event.target.value;\n setCurrentValue(newValue);\n onChange(newValue);\n },\n [onChange]\n );\n\n const InputControl = showIcon ? Input.Search : Input;\n return (\n \n
\n );\n}\n\nSearchInput.propTypes = {\n value: PropTypes.string.isRequired,\n placeholder: PropTypes.string,\n showIcon: PropTypes.bool,\n onChange: PropTypes.func.isRequired,\n label: PropTypes.string,\n};\n\nSearchInput.defaultProps = {\n placeholder: \"Search...\",\n showIcon: false,\n label: \"Search\",\n};\n\n/*\n Menu\n */\n\nexport function Menu({ items, selected }) {\n items = filter(items, item => (isFunction(item.isAvailable) ? item.isAvailable() : true));\n if (items.length === 0) {\n return null;\n }\n return (\n \n \n {map(items, item => (\n \n \n {isString(item.icon) && item.icon !== \"\" && (\n \n \n \n )}\n {isFunction(item.icon) && (item.icon(item) || null)}\n {item.title}\n \n \n ))}\n \n
\n );\n}\n\nMenu.propTypes = {\n items: PropTypes.arrayOf(\n PropTypes.shape({\n key: PropTypes.string.isRequired,\n href: PropTypes.string.isRequired,\n title: PropTypes.string.isRequired,\n icon: PropTypes.func, // function to render icon\n isAvailable: PropTypes.func, // return `true` to show item and `false` to hide; if omitted: show item\n })\n ),\n selected: PropTypes.string,\n};\n\nMenu.defaultProps = {\n items: [],\n selected: null,\n};\n\n/*\n MenuIcon\n */\n\nexport function MenuIcon({ icon }) {\n return (\n \n \n \n );\n}\n\nMenuIcon.propTypes = {\n icon: PropTypes.string.isRequired,\n};\n\n/*\n ProfileImage\n */\n\nexport function ProfileImage({ user }) {\n if (!isString(user.profile_image_url) || user.profile_image_url === \"\") {\n return null;\n }\n return \n
\n );\n}\n\nTags.propTypes = {\n url: PropTypes.string.isRequired,\n onChange: PropTypes.func.isRequired,\n showUnselectAll: PropTypes.bool,\n unselectAllButtonTitle: PropTypes.string,\n};\n"
},
{
"path": "client/app/components/items-list/hooks/useItemsListExtraActions.js",
"content": "import { filter, includes, intersection } from \"lodash\";\nimport React, { useState, useMemo, useEffect, useCallback } from \"react\";\nimport Checkbox from \"antd/lib/checkbox\";\nimport { Columns } from \"../components/ItemsTable\";\n\nexport default function useItemsListExtraActions(controller, listColumns, ExtraActionsComponent) {\n const [actionsState, setActionsState] = useState({ isAvailable: false });\n const [selectedItems, setSelectedItems] = useState([]);\n\n // clear selection when page changes\n useEffect(() => {\n setSelectedItems([]);\n }, [controller.pageItems, actionsState.isAvailable]);\n\n const areAllItemsSelected = useMemo(() => {\n const allItems = controller.pageItems;\n if (allItems.length === 0 || selectedItems.length === 0) {\n return false;\n }\n return intersection(selectedItems, allItems).length === allItems.length;\n }, [selectedItems, controller.pageItems]);\n\n const toggleAllItems = useCallback(() => {\n if (areAllItemsSelected) {\n setSelectedItems([]);\n } else {\n setSelectedItems(controller.pageItems);\n }\n }, [areAllItemsSelected, controller.pageItems]);\n\n const toggleItem = useCallback(\n item => {\n if (includes(selectedItems, item)) {\n setSelectedItems(filter(selectedItems, s => s !== item));\n } else {\n setSelectedItems([...selectedItems, item]);\n }\n },\n [selectedItems]\n );\n\n const checkboxColumn = useMemo(\n () =>\n Columns.custom(\n (text, item) => \n
\n );\n}\n\nSidebar.propTypes = propTypes;\nSidebar.defaultProps = defaultProps;\n\n// Content\n\nfunction Content({ className, children, ...props }) {\n return (\n {children}
\n \n
\n );\n}\n\nContent.propTypes = propTypes;\nContent.defaultProps = defaultProps;\n\n// Layout\n\nexport default function Layout({ children, className = undefined, ...props }) {\n return (\n {children}
\n \n {children}\n
\n );\n}\n\nLayout.propTypes = propTypes;\nLayout.defaultProps = defaultProps;\n\nLayout.Sidebar = Sidebar;\nLayout.Content = Content;\n"
},
{
"path": "client/app/components/layouts/content-with-sidebar.less",
"content": ".layout-with-sidebar {\n @spacing: 15px;\n position: relative;\n\n display: flex;\n align-items: stretch;\n justify-content: stretch;\n flex-direction: row;\n margin: 0;\n\n > .layout-content {\n flex: 1 0 auto;\n width: 75%;\n order: 1;\n margin: 0;\n padding: 0 0 0 @spacing\n }\n\n > .layout-sidebar {\n flex: 0 0 auto;\n width: 25%;\n max-width: 350px;\n order: 0;\n margin: 0;\n }\n\n @media (max-width: 990px) {\n flex-direction: column;\n\n > .layout-content {\n width: 100%;\n order: 1;\n margin: 0;\n padding: 0;\n }\n\n > .layout-sidebar {\n width: 100%;\n max-width: none;\n order: 0;\n margin: 0 0 @spacing 0;\n }\n }\n}\n"
},
{
"path": "client/app/components/proptypes.js",
"content": "import PropTypes from \"prop-types\";\nimport { wrap } from \"lodash\";\nimport moment from \"moment\";\n\nexport const DataSource = PropTypes.shape({\n syntax: PropTypes.string,\n options: PropTypes.shape({\n doc: PropTypes.string,\n doc_url: PropTypes.string,\n }),\n type_name: PropTypes.string,\n});\n\nexport const Table = PropTypes.shape({\n columns: PropTypes.arrayOf(PropTypes.string).isRequired,\n});\n\nexport const Schema = PropTypes.arrayOf(Table);\n\nexport const RefreshScheduleType = PropTypes.shape({\n interval: PropTypes.number,\n time: PropTypes.string,\n day_of_week: PropTypes.string,\n until: PropTypes.string,\n});\n\nexport const RefreshScheduleDefault = {\n interval: null,\n time: null,\n day_of_week: null,\n until: null,\n};\n\nexport const UserProfile = PropTypes.shape({\n id: PropTypes.number.isRequired,\n name: PropTypes.string.isRequired,\n email: PropTypes.string.isRequired,\n profileImageUrl: PropTypes.string,\n apiKey: PropTypes.string,\n isDisabled: PropTypes.bool,\n});\n\nexport const Destination = PropTypes.shape({\n id: PropTypes.number.isRequired,\n name: PropTypes.string.isRequired,\n icon: PropTypes.string.isRequired,\n type: PropTypes.string.isRequired,\n});\n\nexport const Query = PropTypes.shape({\n id: PropTypes.any.isRequired,\n name: PropTypes.string.isRequired,\n description: PropTypes.string,\n data_source_id: PropTypes.any.isRequired,\n created_at: PropTypes.string.isRequired,\n updated_at: PropTypes.string,\n user: UserProfile,\n query: PropTypes.string,\n queryHash: PropTypes.string,\n is_safe: PropTypes.bool.isRequired,\n is_draft: PropTypes.bool.isRequired,\n is_archived: PropTypes.bool.isRequired,\n api_key: PropTypes.string.isRequired,\n});\n\nexport const AlertOptions = PropTypes.shape({\n column: PropTypes.string,\n selector: PropTypes.oneOf([\"first\", \"min\", \"max\"]),\n op: PropTypes.oneOf([\">\", \">=\", \"<\", \"<=\", \"==\", \"!=\"]),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n custom_subject: PropTypes.string,\n custom_body: PropTypes.string,\n});\n\nexport const Alert = PropTypes.shape({\n id: PropTypes.any,\n name: PropTypes.string,\n created_at: PropTypes.string,\n last_triggered_at: PropTypes.string,\n updated_at: PropTypes.string,\n rearm: PropTypes.number,\n state: PropTypes.oneOf([\"ok\", \"triggered\", \"unknown\"]),\n user: UserProfile,\n query: Query,\n options: PropTypes.shape({\n column: PropTypes.string,\n selector: PropTypes.string,\n op: PropTypes.string,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n }).isRequired,\n});\n\nfunction checkMoment(isRequired, props, propName, componentName) {\n const value = props[propName];\n const isRequiredValid = isRequired && value !== null && value !== undefined && moment.isMoment(value);\n const isOptionalValid = !isRequired && (value === null || value === undefined || moment.isMoment(value));\n if (!isRequiredValid && !isOptionalValid) {\n return new Error(\"Prop `\" + propName + \"` supplied to `\" + componentName + \"` should be a Moment.js instance.\");\n }\n}\n\nexport const Moment = wrap(false, checkMoment);\nMoment.isRequired = wrap(true, checkMoment);\n"
},
{
"path": "client/app/components/queries/AddToDashboardDialog.jsx",
"content": "import { isString } from \"lodash\";\nimport React, { useState, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport Modal from \"antd/lib/modal\";\nimport Input from \"antd/lib/input\";\nimport List from \"antd/lib/list\";\nimport Link from \"@/components/Link\";\nimport PlainButton from \"@/components/PlainButton\";\nimport CloseOutlinedIcon from \"@ant-design/icons/CloseOutlined\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\nimport { QueryTagsControl } from \"@/components/tags-control/TagsControl\";\nimport { Dashboard } from \"@/services/dashboard\";\nimport notification from \"@/services/notification\";\nimport useSearchResults from \"@/lib/hooks/useSearchResults\";\n\nimport \"./add-to-dashboard-dialog.less\";\n\nfunction AddToDashboardDialog({ dialog, visualization }) {\n const [searchTerm, setSearchTerm] = useState(\"\");\n\n const [doSearch, dashboards, isLoading] = useSearchResults(\n term => {\n if (isString(term) && term !== \"\") {\n return Dashboard.query({ q: term })\n .then(results => results.results)\n .catch(() => []);\n }\n return Promise.resolve([]);\n },\n { initialResults: [] }\n );\n\n const [selectedDashboard, setSelectedDashboard] = useState(null);\n\n const [saveInProgress, setSaveInProgress] = useState(false);\n\n useEffect(() => {\n doSearch(searchTerm);\n }, [doSearch, searchTerm]);\n\n function addWidgetToDashboard() {\n // Load dashboard with all widgets\n Dashboard.get(selectedDashboard)\n .then(dashboard => {\n dashboard.addWidget(visualization);\n return dashboard;\n })\n .then(dashboard => {\n dialog.close();\n const key = `notification-${Math.random()\n .toString(36)\n .substr(2, 10)}`;\n notification.success(\n \"Widget added to dashboard\",\n \n {d.name}\n
\n \n )}\n />\n )}\n \n );\n}\n\nAddToDashboardDialog.propTypes = {\n dialog: DialogPropType.isRequired,\n visualization: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types\n};\n\nexport default wrapDialog(AddToDashboardDialog);\n"
},
{
"path": "client/app/components/queries/ApiKeyDialog/index.jsx",
"content": "import { extend } from \"lodash\";\nimport React, { useMemo, useState, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport Modal from \"antd/lib/modal\";\nimport Input from \"antd/lib/input\";\nimport Button from \"antd/lib/button\";\nimport { wrap as wrapDialog, DialogPropType } from \"@/components/DialogWrapper\";\nimport CodeBlock from \"@/components/CodeBlock\";\nimport { axios } from \"@/services/axios\";\nimport { clientConfig } from \"@/services/auth\";\nimport notification from \"@/services/notification\";\nimport { useUniqueId } from \"@/lib/hooks/useUniqueId\";\n\nimport \"./index.less\";\nimport { policy } from \"@/services/policy\";\n\nfunction ApiKeyDialog({ dialog, ...props }) {\n const [query, setQuery] = useState(props.query);\n const [updatingApiKey, setUpdatingApiKey] = useState(false);\n\n const regenerateQueryApiKey = useCallback(() => {\n setUpdatingApiKey(true);\n axios\n .post(`api/queries/${query.id}/regenerate_api_key`)\n .then(data => {\n setUpdatingApiKey(false);\n setQuery(extend(query.clone(), { api_key: data.api_key }));\n })\n .catch(() => {\n setUpdatingApiKey(false);\n notification.error(\"Failed to update API key\");\n });\n }, [query]);\n\n const { csvUrl, jsonUrl } = useMemo(\n () => ({\n csvUrl: `${clientConfig.basePath}api/queries/${query.id}/results.csv?api_key=${query.api_key}`,\n jsonUrl: `${clientConfig.basePath}api/queries/${query.id}/results.json?api_key=${query.api_key}`,\n }),\n [query.id, query.api_key]\n );\n\n const csvResultsLabelId = useUniqueId(\"csv-results-label\");\n const jsonResultsLabelId = useUniqueId(\"json-results-label\");\n\n return (\n \n
\n API Key
\n\n \n \n {policy.canEdit(query) && (\n \n )}\n \n
\n\n Example API Calls:
\n\n Results in CSV format:\n \n {csvUrl}\n \n
\n \n Results in JSON format:\n \n {jsonUrl}\n \n
\n \n Public URL\n
\n\n \n {this.embedUrl}\n \n
\n \n IFrame Embed\n
\n\n \n {``}\n \n \n
\n {this.snapshotUrl && (\n Image Embed
\n\n {addParameterButtonProps !== false && (\n \n \n {\"{{\"} {\"}}\"}\n \n \n )}\n {formatButtonProps !== false && (\n \n \n \n {formatButtonProps.text}\n \n \n )}\n {autocompleteToggleProps !== false && (\n \n {map(dataSourceSelectorProps.options, option => (\n \n {option.label}\n \n ))}\n \n )}\n {saveButtonProps !== false && (\n \n \n {!saveButtonProps.loading && }\n {saveButtonProps.text}\n \n \n )}\n {executeButtonProps !== false && (\n \n \n \n {executeButtonProps.text}\n \n \n )}\n
\n );\n}\n\nconst ButtonPropsPropType = PropTypes.oneOfType([\n PropTypes.bool, // `false` to hide button\n PropTypes.shape({\n title: PropTypes.node,\n disabled: PropTypes.bool,\n loading: PropTypes.bool,\n onClick: PropTypes.func,\n text: PropTypes.node,\n shortcut: PropTypes.string,\n }),\n]);\n\nEditorControl.propTypes = {\n addParameterButtonProps: ButtonPropsPropType,\n formatButtonProps: ButtonPropsPropType,\n saveButtonProps: ButtonPropsPropType,\n executeButtonProps: ButtonPropsPropType,\n autocompleteToggleProps: PropTypes.oneOfType([\n PropTypes.bool, // `false` to hide\n PropTypes.shape({\n available: PropTypes.bool,\n enabled: PropTypes.bool,\n onToggle: PropTypes.func,\n }),\n ]),\n autoLimitCheckboxProps: PropTypes.oneOfType([\n PropTypes.bool, // `false` to hide\n PropTypes.shape(AutoLimitCheckbox.propTypes),\n ]),\n dataSourceSelectorProps: PropTypes.oneOfType([\n PropTypes.bool, // `false` to hide\n PropTypes.shape({\n disabled: PropTypes.bool,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n options: PropTypes.arrayOf(\n PropTypes.shape({\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n label: PropTypes.node,\n })\n ),\n onChange: PropTypes.func,\n }),\n ]),\n};\n\nEditorControl.defaultProps = {\n addParameterButtonProps: false,\n formatButtonProps: false,\n saveButtonProps: false,\n executeButtonProps: false,\n autocompleteToggleProps: false,\n autoLimitCheckboxProps: false,\n dataSourceSelectorProps: false,\n};\n"
},
{
"path": "client/app/components/queries/QueryEditor/QueryEditorControls.less",
"content": ".query-editor-controls {\n display: flex;\n flex-wrap: nowrap;\n align-items: stretch;\n justify-content: stretch;\n\n // Styles for a wrapper that `Tooltip` adds for disabled `Button`s\n span.query-editor-controls-button {\n display: flex !important;\n align-items: stretch;\n justify-content: stretch;\n }\n\n .ant-btn {\n height: auto;\n\n .fa + span,\n .zmdi + span {\n // if button has icon and label - add some space between them\n margin-left: 5px;\n }\n }\n\n .query-editor-controls-checkbox {\n display: inline-block;\n white-space: nowrap;\n margin: auto 5px;\n }\n\n .query-editor-controls-spacer {\n flex: 1 1 auto;\n height: 35px; // same as Antd \n \n\n`;\n\nexports[`ScheduleDialog Sets correct schedule settings Sets to \"1 Day 22:15\" Sets to correct time 1`] = `\n