You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@druid.apache.org by GitBox <gi...@apache.org> on 2019/06/26 22:57:31 UTC
[GitHub] [incubator-druid] vogievetsky commented on a change in pull request
#7947: Web console: Power up the data loader init step
vogievetsky commented on a change in pull request #7947: Web console: Power up the data loader init step
URL: https://github.com/apache/incubator-druid/pull/7947#discussion_r297898675
##########
File path: web-console/src/views/load-data-view/load-data-view.tsx
##########
@@ -484,79 +492,234 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
// ==================================================================
- initWith(comboType: IngestionComboType) {
- this.setState({
- spec: getBlankSpec(comboType),
- });
- setTimeout(() => {
- this.updateStep('connect');
- }, 10);
- }
-
- renderIngestionCard(title: string, comboType: IngestionComboType, requiredModule?: string) {
- const { overlordModules } = this.state;
+ renderIngestionCard(comboType: IngestionComboTypeWithExtra) {
+ const { overlordModules, selectedComboType } = this.state;
if (!overlordModules) return null;
+ const requiredModule = getRequiredModule(comboType);
const goodToGo = !requiredModule || overlordModules.includes(requiredModule);
return (
<Card
- className={classNames({ disabled: !goodToGo })}
+ className={classNames({ disabled: !goodToGo, active: selectedComboType === comboType })}
interactive
onClick={() => {
- if (goodToGo) {
- this.initWith(comboType);
- } else {
- this.setState({
- overlordModuleNeededMessage: `${title} ingestion requires the '${requiredModule}' to be loaded.`,
- });
- }
+ this.setState({ selectedComboType: selectedComboType !== comboType ? comboType : null });
}}
>
- {title}
+ <img src={UrlBaser.base(`/assets/${getIngestionImage(comboType)}.png`)} />
+ <p>{getIngestionTitle(comboType)}</p>
</Card>
);
}
- renderInitStep() {
- const { goToTask } = this.props;
- const { overlordModuleNeededMessage } = this.state;
+ renderWelcomeStep() {
+ const { spec } = this.state;
return (
<>
- <div className="intro">Please specify where your raw data is located</div>
-
- <div className="cards">
- {this.renderIngestionCard('Apache Kafka', 'kafka', 'druid-kafka-indexing-service')}
- {this.renderIngestionCard('AWS Kinesis', 'kinesis', 'druid-kinesis-indexing-service')}
- {this.renderIngestionCard('HTTP(s)', 'index:http')}
- {this.renderIngestionCard('AWS S3', 'index:static-s3', 'druid-s3-extensions')}
- {this.renderIngestionCard(
- 'Google Cloud Storage',
- 'index:static-google-blobstore',
- 'druid-google-extensions',
+ <div className="main">
+ {this.renderIngestionCard('kafka')}
+ {this.renderIngestionCard('kinesis')}
+ {this.renderIngestionCard('index:static-s3')}
+ {this.renderIngestionCard('index:static-google-blobstore')}
+ {this.renderIngestionCard('hadoop')}
+ {this.renderIngestionCard('index:http')}
+ {this.renderIngestionCard('index:local')}
+ {/* this.renderIngestionCard('example') */}
+ {this.renderIngestionCard('other')}
+ </div>
+ <div className="control">
+ <Callout className="intro">{this.renderWelcomeStepMessage()}</Callout>
+ {this.renderWelcomeStepControls()}
+ {!isEmptyIngestionSpec(spec) && (
+ <Button icon={IconNames.RESET} text="Reset spec" onClick={this.handleResetConfirm} />
)}
- {this.renderIngestionCard('Local disk', 'index:local')}
- <Card interactive onClick={() => goToTask(null, 'supervisor')}>
- Other (streaming)
- </Card>
- <Card interactive onClick={() => goToTask(null, 'task')}>
- Other (batch)
- </Card>
</div>
-
- <Alert
- icon={IconNames.WARNING_SIGN}
- intent={Intent.WARNING}
- isOpen={Boolean(overlordModuleNeededMessage)}
- confirmButtonText="Close"
- onConfirm={() => this.setState({ overlordModuleNeededMessage: null })}
- >
- <p>{overlordModuleNeededMessage}</p>
- </Alert>
</>
);
}
+ renderWelcomeStepMessage() {
+ const { selectedComboType } = this.state;
+
+ if (!selectedComboType) {
+ return <p>Please specify where your raw data is located</p>;
+ }
+
+ const issue = this.selectedIngestionTypeIssue();
+ if (issue) return issue;
+
+ switch (selectedComboType) {
+ case 'index:http':
+ return (
+ <>
+ <p>Load data accessible through HTTP(s).</p>
+ <p>
+ Data must be in a text format and the HTTP(s) endpoint must be reachable by every
+ Druid process in the cluster.
+ </p>
+ </>
+ );
+
+ case 'index:local':
+ return (
+ <>
+ <p>
+ <em>Recommended only in single server deployments.</em>
+ </p>
+ <p>Load data directly from a local file.</p>
+ <p>
+ Files must be in a text format and must be accessible to all the Druid processes in
+ the cluster.
+ </p>
+ </>
+ );
+
+ case 'index:static-s3':
+ return <p>Load text based data from Amazon S3.</p>;
+
+ case 'index:static-google-blobstore':
+ return <p>Load text based data from the Google Blobstore.</p>;
Review comment:
Hmm, good point!
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@druid.apache.org
For additional commands, e-mail: commits-help@druid.apache.org