Skip to content

Commit

Permalink
Data loader (GUI component) (#7572)
Browse files Browse the repository at this point in the history
* data loader init

* fix timecolumn text

* feedback changes

* fixing typos and improving error reporting

* added local firehose warning

* update warning copy

* refine copy

* better copy

* fix tests

* remove console log

* copy change

* add banner message
  • Loading branch information
vogievetsky authored and clintropolis committed May 4, 2019
1 parent afbcb9c commit baf54f3
Show file tree
Hide file tree
Showing 47 changed files with 6,505 additions and 1,010 deletions.
1,536 changes: 712 additions & 824 deletions web-console/package-lock.json

Large diffs are not rendered by default.

15 changes: 12 additions & 3 deletions web-console/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,16 @@
"type": "git",
"url": "https://github.com/apache/druid/"
},
"jest": {
"preset": "ts-jest",
"testEnvironment": "jsdom",
"moduleNameMapper": {
"\\.scss$": "identity-obj-proxy"
},
"testMatch": [
"**/?(*.)+(spec).ts?(x)"
]
},
"scripts": {
"watch": "./script/watch",
"compile": "./script/build",
Expand All @@ -16,7 +26,7 @@
"test": "jest --silent 2>&1",
"tslint": "./node_modules/.bin/tslint -c tslint.json --project tsconfig.json --formatters-dir ./node_modules/awesome-code-style/formatter 'src/**/*.ts?(x)'",
"tslint-fix": "npm run tslint -- --fix",
"tslint-changed-only": "git diff --diff-filter=ACMR --name-only | grep -E \\.tsx\\?$ | xargs ./node_modules/.bin/tslint -c tslint.json --project tsconfig.json --formatters-dir ./node_modules/awesome-code-style/formatter",
"tslint-changed-only": "git diff --diff-filter=ACMR --cached --name-only | grep -E \\.tsx\\?$ | xargs ./node_modules/.bin/tslint -c tslint.json --project tsconfig.json --formatters-dir ./node_modules/awesome-code-style/formatter",
"tslint-fix-changed-only": "npm run tslint-changed-only -- --fix",
"generate-licenses-file": "license-checker --production --json --out licenses.json",
"check-licenses": "license-checker --production --onlyAllow 'Apache-1.1;Apache-2.0;BSD-2-Clause;BSD-3-Clause;MIT;CC0-1.0' --summary",
Expand Down Expand Up @@ -49,7 +59,6 @@
"@types/hjson": "^2.4.1",
"@types/jest": "^24.0.11",
"@types/lodash.debounce": "^4.0.6",
"@types/mocha": "^5.2.6",
"@types/node": "^11.13.4",
"@types/numeral": "^0.0.25",
"@types/react-dom": "^16.8.4",
Expand All @@ -62,7 +71,6 @@
"ignore-styles": "^5.0.1",
"jest": "^24.7.1",
"license-checker": "^25.0.1",
"mocha": "^6.1.3",
"node-sass": "^4.11.0",
"node-sass-chokidar": "^1.3.4",
"postcss-cli": "^6.1.2",
Expand All @@ -81,6 +89,7 @@
"tslint-loader": "^3.5.4",
"typescript": "^3.4.3",
"webpack": "^4.29.6",
"webpack-bundle-analyzer": "^3.3.2",
"webpack-cli": "^3.3.0",
"webpack-dev-server": "^3.3.1"
}
Expand Down
135 changes: 135 additions & 0 deletions web-console/script/mkcomp
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
#!/usr/bin/env node
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

let fs = require('fs-extra');

if (!(process.argv.length === 3 || process.argv.length === 4)) {
console.log('Usage: mkcomp <what?> <component-name>');
process.exit();
}

let name;
let what;
if (process.argv.length === 4) {
what = process.argv[2];
name = process.argv[3];
if (!(what === 'component' || what === 'dialog' || what === 'singleton')) {
console.log(`Bad what, should be on of: component, dialog, singleton`);
process.exit();
}
} else {
what = 'component';
name = process.argv[2];
}

if (!/^([a-z-])+$/.test(name)) {
console.log('must be a hyphen case name');
process.exit();
}

let path = `./src/${what}s/`;
fs.ensureDirSync(path);
console.log('Making path:', path);

const camelName = name.replace(/(^|-)[a-z]/g, (s) => s.replace('-', '').toUpperCase());
const year = (new Date()).getFullYear();

function writeFile(path, data) {
try {
return fs.writeFileSync(path, data, {
flag: 'wx', // x = fail if file exists
encoding: 'utf8'
});
} catch (error) {
return console.log(`Skipping ${path}`);
}
}

// Make the TypeScript file
writeFile(path + name + '.tsx',
`/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Button, InputGroup } from '@blueprintjs/core';
import { IconNames } from '@blueprintjs/icons';
import classNames from 'classnames';
import * as React from 'react';
import './${name}.scss';
export interface ${camelName}Props extends React.Props<any> {
}
export interface ${camelName}State {
}
export class ${camelName} extends React.Component<${camelName}Props, ${camelName}State> {
constructor(props: ${camelName}Props, context: any) {
super(props, context);
// this.state = {};
}
render() {
return <div className="${name}">
</div>;
}
}
`);

// Make the SASS file
writeFile(path + name + '.scss',
`/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
.${name} {
}
`);
58 changes: 58 additions & 0 deletions web-console/src/components/array-input.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/


import { InputGroup, ITagInputProps } from '@blueprintjs/core';
import * as React from 'react';

export interface ArrayInputProps extends ITagInputProps {

}

export class ArrayInput extends React.Component<ArrayInputProps, { stringValue: string }> {
constructor(props: ArrayInputProps) {
super(props);
this.state = {
stringValue: Array.isArray(props.values) ? props.values.join(', ') : ''
};
}

private handleChange = (e: any) => {
const { onChange } = this.props;
const stringValue = e.target.value;
const newValues = stringValue.split(',').map((v: string) => v.trim());
const newValuesFiltered = newValues.filter(Boolean);
this.setState({
stringValue: newValues.length === newValuesFiltered.length ? newValues.join(', ') : stringValue
});
if (onChange) onChange(stringValue === '' ? undefined : newValuesFiltered);
}

render() {
const { className, placeholder, large, disabled } = this.props;
const { stringValue } = this.state;
return <InputGroup
className={className}
value={stringValue}
onChange={this.handleChange}
placeholder={placeholder}
large={large}
disabled={disabled}
/>;
}
}
18 changes: 18 additions & 0 deletions web-console/src/components/auto-form.scss
Original file line number Diff line number Diff line change
Expand Up @@ -20,4 +20,22 @@
.ace_scroller {
background-color: #212c36;
}

// Popover in info label
label.bp3-label {
position: relative;

.bp3-text-muted {
position: absolute;
right: 0;

.bp3-popover-wrapper {
display: inline;

.bp3-popover-target {
display: inline;
}
}
}
}
}
Loading

0 comments on commit baf54f3

Please sign in to comment.