Web console: allow link overrides for docs, and more (#10100)

* link overrides

* change doc version

* fix snapshots

web-console/lib/keywords.js

@@ -40,7 +40,7 @@ exports.SQL_KEYWORDS = [
   'ON',
   'RIGHT',
   'OUTER',
-  'FULL'
+  'FULL',
 ];
 
 exports.SQL_EXPRESSION_PARTS = [

web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap

@@ -159,7 +159,7 @@ exports[`header bar matches snapshot 1`] = `
           />
           <Blueprint3.MenuItem
             disabled={false}
-            href="https://druid.apache.org/docs/0.17.0"
+            href="https://druid.apache.org/docs/0.19.0"
             icon="th"
             multiline={false}
             popoverProps={Object {}}

web-console/src/components/header-bar/header-bar.tsx

@@ -32,20 +32,14 @@ import {
 import { IconNames } from '@blueprintjs/icons';
 import React, { useState } from 'react';
 
-import { AboutDialog } from '../../dialogs/about-dialog/about-dialog';
-import { CoordinatorDynamicConfigDialog } from '../../dialogs/coordinator-dynamic-config-dialog/coordinator-dynamic-config-dialog';
-import { DoctorDialog } from '../../dialogs/doctor-dialog/doctor-dialog';
-import { OverlordDynamicConfigDialog } from '../../dialogs/overlord-dynamic-config-dialog/overlord-dynamic-config-dialog';
-import { Capabilities } from '../../utils/capabilities';
 import {
-  DRUID_ASF_SLACK,
+  AboutDialog,
-  DRUID_DOCS,
+  CoordinatorDynamicConfigDialog,
-  DRUID_DOCS_API,
+  DoctorDialog,
-  DRUID_DOCS_SQL,
+  OverlordDynamicConfigDialog,
-  DRUID_DOCS_VERSION,
+} from '../../dialogs';
-  DRUID_GITHUB,
+import { getLink } from '../../links';
-  DRUID_USER_GROUP,
+import { Capabilities } from '../../utils/capabilities';
-} from '../../variables';
 import { ExternalLink } from '../external-link/external-link';
 import { PopoverText } from '../popover-text/popover-text';
 
@@ -137,9 +131,10 @@ const RestrictedMode = React.memo(function RestrictedMode(props: RestrictedModeP
       message = (
         <p>
           It appears that the SQL endpoint is disabled. The console will fall back to{' '}
-          <ExternalLink href={DRUID_DOCS_API}>native Druid APIs</ExternalLink> and will be limited
+          <ExternalLink href={getLink('DOCS_API')}>native Druid APIs</ExternalLink> and will be
-          in functionality. Look at <ExternalLink href={DRUID_DOCS_SQL}>the SQL docs</ExternalLink>{' '}
+          limited in functionality. Look at{' '}
-          to enable the SQL endpoint.
+          <ExternalLink href={getLink('DOCS_SQL')}>the SQL docs</ExternalLink> to enable the SQL
+          endpoint.
         </p>
       );
       break;
@@ -205,9 +200,7 @@ const RestrictedMode = React.memo(function RestrictedMode(props: RestrictedModeP
           {message}
           <p>
             For more info check out the{' '}
-            <ExternalLink
+            <ExternalLink href={`${getLink('DOCS')}/operations/management-uis.html#druid-console`}>
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/operations/management-uis.html#druid-console`}
-            >
               console documentation
             </ExternalLink>
             .
@@ -239,15 +232,25 @@ export const HeaderBar = React.memo(function HeaderBar(props: HeaderBarProps) {
   const helpMenu = (
     <Menu>
       <MenuItem icon={IconNames.GRAPH} text="About" onClick={() => setAboutDialogOpen(true)} />
-      <MenuItem icon={IconNames.TH} text="Docs" href={DRUID_DOCS} target="_blank" />
+      <MenuItem icon={IconNames.TH} text="Docs" href={getLink('DOCS')} target="_blank" />
-      <MenuItem icon={IconNames.USER} text="User group" href={DRUID_USER_GROUP} target="_blank" />
+      <MenuItem
+        icon={IconNames.USER}
+        text="User group"
+        href={getLink('USER_GROUP')}
+        target="_blank"
+      />
       <MenuItem
         icon={IconNames.CHAT}
         text="ASF Slack channel"
-        href={DRUID_ASF_SLACK}
+        href={getLink('SLACK')}
+        target="_blank"
+      />
+      <MenuItem
+        icon={IconNames.GIT_BRANCH}
+        text="GitHub"
+        href={getLink('GITHUB')}
         target="_blank"
       />
-      <MenuItem icon={IconNames.GIT_BRANCH} text="GitHub" href={DRUID_GITHUB} target="_blank" />
     </Menu>
   );
 

web-console/src/dialogs/about-dialog/about-dialog.tsx

@@ -21,12 +21,7 @@ import { IconNames } from '@blueprintjs/icons';
 import React from 'react';
 
 import { ExternalLink } from '../../components';
-import {
+import { getLink } from '../../links';
-  DRUID_COMMUNITY,
-  DRUID_DEVELOPER_GROUP,
-  DRUID_USER_GROUP,
-  DRUID_WEBSITE,
-} from '../../variables';
 
 export interface AboutDialogProps {
   onClose: () => void;
@@ -50,19 +45,19 @@ export const AboutDialog = React.memo(function AboutDialog(props: AboutDialogPro
         </p>
         <p>
           For help and support with Druid, please refer to the{' '}
-          <ExternalLink href={DRUID_COMMUNITY}>community page</ExternalLink> and the{' '}
+          <ExternalLink href={getLink('COMMUNITY')}>community page</ExternalLink> and the{' '}
-          <ExternalLink href={DRUID_USER_GROUP}>user groups</ExternalLink>.
+          <ExternalLink href={getLink('USER_GROUP')}>user groups</ExternalLink>.
         </p>
         <p>
           Druid is made with ❤️ by a community of passionate developers. To contribute, join in the
           discussion on the{' '}
-          <ExternalLink href={DRUID_DEVELOPER_GROUP}>developer group</ExternalLink>.
+          <ExternalLink href={getLink('DEVELOPER_GROUP')}>developer group</ExternalLink>.
         </p>
       </div>
       <div className={Classes.DIALOG_FOOTER}>
         <div className={Classes.DIALOG_FOOTER_ACTIONS}>
           <Button onClick={onClose}>Close</Button>
-          <AnchorButton intent={Intent.PRIMARY} href={DRUID_WEBSITE} target="_blank">
+          <AnchorButton intent={Intent.PRIMARY} href={getLink('WEBSITE')} target="_blank">
             Visit Druid
           </AnchorButton>
         </div>

web-console/src/dialogs/compaction-dialog/compaction-dialog.tsx

@@ -20,7 +20,7 @@ import { Button, Classes, Dialog, Intent } from '@blueprintjs/core';
 import React from 'react';
 
 import { AutoForm, ExternalLink } from '../../components';
-import { DRUID_DOCS_VERSION } from '../../variables';
+import { getLink } from '../../links';
 
 import './compaction-dialog.scss';
 
@@ -116,9 +116,7 @@ export class CompactionDialog extends React.PureComponent<
               type: 'json',
               info: (
                 <p>
-                  <ExternalLink
+                  <ExternalLink href={`${getLink('DOCS')}/ingestion/tasks.html#task-context`}>
-                    href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/tasks.html#task-context`}
-                  >
                     Task context
                   </ExternalLink>{' '}
                   for compaction tasks.
@@ -137,7 +135,7 @@ export class CompactionDialog extends React.PureComponent<
               info: (
                 <p>
                   <ExternalLink
-                    href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/configuration/index.html#compact-task-tuningconfig`}
+                    href={`${getLink('DOCS')}/configuration/index.html#compact-task-tuningconfig`}
                   >
                     Tuning config
                   </ExternalLink>{' '}

web-console/src/dialogs/coordinator-dynamic-config-dialog/__snapshots__/coordinator-dynamic-config-dialog.spec.tsx.snap

@@ -58,7 +58,7 @@ exports[`coordinator dynamic config matches snapshot 1`] = `
             Edit the coordinator dynamic configuration on the fly. For more information please refer to the
              
             <a
-              href="https://druid.apache.org/docs/0.17.0/configuration/index.html#dynamic-configuration"
+              href="https://druid.apache.org/docs/0.19.0/configuration/index.html#dynamic-configuration"
               rel="noopener noreferrer"
               target="_blank"
             >

web-console/src/dialogs/coordinator-dynamic-config-dialog/coordinator-dynamic-config-dialog.tsx

@@ -21,11 +21,11 @@ import { IconNames } from '@blueprintjs/icons';
 import axios from 'axios';
 import React from 'react';
 
+import { SnitchDialog } from '..';
 import { AutoForm, ExternalLink } from '../../components';
+import { getLink } from '../../links';
 import { AppToaster } from '../../singletons/toaster';
 import { getDruidErrorMessage, QueryManager } from '../../utils';
-import { DRUID_DOCS_VERSION } from '../../variables';
-import { SnitchDialog } from '../snitch-dialog/snitch-dialog';
 
 import './coordinator-dynamic-config-dialog.scss';
 
@@ -127,9 +127,7 @@ export class CoordinatorDynamicConfigDialog extends React.PureComponent<
         <p>
           Edit the coordinator dynamic configuration on the fly. For more information please refer
           to the{' '}
-          <ExternalLink
+          <ExternalLink href={`${getLink('DOCS')}/configuration/index.html#dynamic-configuration`}>
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/configuration/index.html#dynamic-configuration`}
-          >
             documentation
           </ExternalLink>
           .

web-console/src/dialogs/index.ts

@@ -17,6 +17,7 @@
  */
 
 export * from './about-dialog/about-dialog';
+export * from './doctor-dialog/doctor-dialog';
 export * from './async-action-dialog/async-action-dialog';
 export * from './compaction-dialog/compaction-dialog';
 export * from './coordinator-dynamic-config-dialog/coordinator-dynamic-config-dialog';

web-console/src/dialogs/overlord-dynamic-config-dialog/__snapshots__/overload-dynamic-config-dialog.spec.tsx.snap

@@ -58,7 +58,7 @@ exports[`overload dynamic config matches snapshot 1`] = `
             Edit the overlord dynamic configuration on the fly. For more information please refer to the
              
             <a
-              href="https://druid.apache.org/docs/0.17.0/configuration/index.html#overlord-dynamic-configuration"
+              href="https://druid.apache.org/docs/0.19.0/configuration/index.html#overlord-dynamic-configuration"
               rel="noopener noreferrer"
               target="_blank"
             >

web-console/src/dialogs/overlord-dynamic-config-dialog/overlord-dynamic-config-dialog.tsx

@@ -21,11 +21,11 @@ import { IconNames } from '@blueprintjs/icons';
 import axios from 'axios';
 import React from 'react';
 
+import { SnitchDialog } from '..';
 import { AutoForm, ExternalLink } from '../../components';
+import { getLink } from '../../links';
 import { AppToaster } from '../../singletons/toaster';
 import { getDruidErrorMessage, QueryManager } from '../../utils';
-import { DRUID_DOCS_VERSION } from '../../variables';
-import { SnitchDialog } from '../snitch-dialog/snitch-dialog';
 
 import './overlord-dynamic-config-dialog.scss';
 
@@ -128,7 +128,7 @@ export class OverlordDynamicConfigDialog extends React.PureComponent<
           Edit the overlord dynamic configuration on the fly. For more information please refer to
           the{' '}
           <ExternalLink
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/configuration/index.html#overlord-dynamic-configuration`}
+            href={`${getLink('DOCS')}/configuration/index.html#overlord-dynamic-configuration`}
           >
             documentation
           </ExternalLink>

web-console/src/dialogs/retention-dialog/__snapshots__/retention-dialog.spec.tsx.snap

@@ -58,7 +58,7 @@ exports[`retention dialog matches snapshot 1`] = `
             Druid uses rules to determine what data should be retained in the cluster. The rules are evaluated in order from top to bottom. For more information please refer to the
              
             <a
-              href="https://druid.apache.org/docs/0.17.0/operations/rule-configuration.html"
+              href="https://druid.apache.org/docs/0.19.0/operations/rule-configuration.html"
               rel="noopener noreferrer"
               target="_blank"
             >

web-console/src/dialogs/retention-dialog/retention-dialog.tsx

@@ -21,10 +21,10 @@ import { IconNames } from '@blueprintjs/icons';
 import axios from 'axios';
 import React from 'react';
 
+import { SnitchDialog } from '..';
 import { ExternalLink, RuleEditor } from '../../components';
+import { getLink } from '../../links';
 import { QueryManager } from '../../utils';
-import { DRUID_DOCS_VERSION } from '../../variables';
-import { SnitchDialog } from '../snitch-dialog/snitch-dialog';
 
 import './retention-dialog.scss';
 
@@ -183,9 +183,7 @@ export class RetentionDialog extends React.PureComponent<
         <p>
           Druid uses rules to determine what data should be retained in the cluster. The rules are
           evaluated in order from top to bottom. For more information please refer to the{' '}
-          <ExternalLink
+          <ExternalLink href={`${getLink('DOCS')}/operations/rule-configuration.html`}>
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/operations/rule-configuration.html`}
-          >
             documentation
           </ExternalLink>
           .

web-console/src/entry.ts

@@ -29,6 +29,7 @@ import './ace-modes/dsql';
 import './ace-modes/hjson';
 import './bootstrap/react-table-defaults';
 import { ConsoleApplication } from './console-application';
+import { Links, setLinkOverrides } from './links';
 import { UrlBaser } from './singletons/url-baser';
 
 import './entry.scss';
@@ -58,6 +59,9 @@ interface ConsoleConfig {
 
   // Extra context properties that will be added to all query requests
   mandatoryQueryContext?: Record<string, any>;
+
+  // Allow for link overriding to different docs
+  linkOverrides?: Links;
 }
 
 const consoleConfig: ConsoleConfig = (window as any).consoleConfig;
@@ -75,6 +79,9 @@ if (consoleConfig.customHeaderName && consoleConfig.customHeaderValue) {
 if (consoleConfig.customHeaders) {
   Object.assign(axios.defaults.headers, consoleConfig.customHeaders);
 }
+if (consoleConfig.linkOverrides) {
+  setLinkOverrides(consoleConfig.linkOverrides);
+}
 
 ReactDOM.render(
   React.createElement(ConsoleApplication, {

web-console/src/links.ts

@@ -0,0 +1,94 @@
+/*
+ * 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.
+ */
+
+// This is set to the latest available version and should be updated to the next version before release
+import hasOwnProp from 'has-own-prop';
+
+const DRUID_DOCS_VERSION = '0.19.0';
+
+function fillVersion(str: string): string {
+  return str.replace(/\{\{VERSION}}/g, DRUID_DOCS_VERSION);
+}
+
+export interface Links {
+  websiteHref: string;
+  githubHref: string;
+  docsHref: string;
+  communityHref: string;
+  slackHref: string;
+  userGroup: string;
+  developerGroup: string;
+}
+
+const DEFAULT_LINKS: Links = {
+  websiteHref: 'https://druid.apache.org',
+  githubHref: 'https://github.com/apache/druid',
+  docsHref: fillVersion('https://druid.apache.org/docs/{{VERSION}}'),
+  communityHref: 'https://druid.apache.org/community/',
+  slackHref: 'https://druid.apache.org/community/join-slack',
+  userGroup: 'https://groups.google.com/forum/#!forum/druid-user',
+  developerGroup: 'https://lists.apache.org/list.html?dev@druid.apache.org',
+};
+
+const links = DEFAULT_LINKS;
+
+export function setLinkOverrides(linkOverrides: Links) {
+  const keys = Object.keys(DEFAULT_LINKS) as (keyof Links)[];
+  for (const k of keys) {
+    if (hasOwnProp(linkOverrides, k)) {
+      links[k] = fillVersion(String(linkOverrides[k]));
+    }
+  }
+}
+
+export type LinkNames =
+  | 'WEBSITE'
+  | 'GITHUB'
+  | 'DOCS'
+  | 'DOCS_SQL'
+  | 'DOCS_RUNE'
+  | 'DOCS_API'
+  | 'COMMUNITY'
+  | 'SLACK'
+  | 'USER_GROUP'
+  | 'DEVELOPER_GROUP';
+
+export function getLink(linkName: LinkNames): string {
+  switch (linkName) {
+    case 'WEBSITE':
+      return links.websiteHref;
+    case 'GITHUB':
+      return links.githubHref;
+    case 'DOCS':
+      return links.docsHref;
+    case 'DOCS_SQL':
+      return `${links.docsHref}/querying/sql.html`;
+    case 'DOCS_RUNE':
+      return `${links.docsHref}/querying/querying.html`;
+    case 'DOCS_API':
+      return `${links.docsHref}/operations/api-reference.html`;
+    case 'COMMUNITY':
+      return links.communityHref;
+    case 'SLACK':
+      return links.slackHref;
+    case 'USER_GROUP':
+      return links.userGroup;
+    case 'DEVELOPER_GROUP':
+      return links.developerGroup;
+  }
+}

web-console/src/utils/ingestion-spec.tsx

@@ -21,7 +21,7 @@ import React from 'react';
 
 import { Field } from '../components/auto-form/auto-form';
 import { ExternalLink } from '../components/external-link/external-link';
-import { DRUID_DOCS_VERSION } from '../variables';
+import { getLink } from '../links';
 
 import {
   BASIC_TIME_FORMATS,
@@ -175,13 +175,13 @@ export function getIngestionDocLink(spec: IngestionSpec): string {
 
   switch (type) {
     case 'kafka':
-      return `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/kafka-ingestion.html`;
+      return `${getLink('DOCS')}/development/extensions-core/kafka-ingestion.html`;
 
     case 'kinesis':
-      return `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/kinesis-ingestion.html`;
+      return `${getLink('DOCS')}/development/extensions-core/kinesis-ingestion.html`;
 
     default:
-      return `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/native-batch.html#firehoses`;
+      return `${getLink('DOCS')}/ingestion/native-batch.html#firehoses`;
   }
 }
 
@@ -317,9 +317,7 @@ const INPUT_FORMAT_FORM_FIELDS: Field<InputFormat>[] = [
         <p>The parser used to parse the data.</p>
         <p>
           For more information see{' '}
-          <ExternalLink
+          <ExternalLink href={`${getLink('DOCS')}/ingestion/data-formats.html`}>
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/data-formats.html`}
-          >
             the documentation
           </ExternalLink>
           .
@@ -609,12 +607,7 @@ const FLATTEN_FIELD_FORM_FIELDS: Field<FlattenField>[] = [
     info: (
       <>
         Specify a flatten{' '}
-        <ExternalLink
+        <ExternalLink href={`${getLink('DOCS')}/ingestion/flatten-json`}>expression</ExternalLink>.
-          href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/flatten-json`}
-        >
-          expression
-        </ExternalLink>
-        .
       </>
     ),
   },
@@ -656,12 +649,7 @@ const TRANSFORM_FORM_FIELDS: Field<Transform>[] = [
     info: (
       <>
         A valid Druid{' '}
-        <ExternalLink
+        <ExternalLink href={`${getLink('DOCS')}/misc/math-expr.html`}>expression</ExternalLink>.
-          href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/misc/math-expr.html`}
-        >
-          expression
-        </ExternalLink>
-        .
       </>
     ),
   },
@@ -931,7 +919,9 @@ const METRIC_SPEC_FORM_FIELDS: Field<MetricSpec>[] = [
         <p>
           Supported modes are <Code>ignore</Code>, <Code>overflow</Code>, and <Code>clip</Code>. See
           <ExternalLink
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/approximate-histograms.html#outlier-handling-modes`}
+            href={`${getLink(
+              'DOCS',
+            )}/development/extensions-core/approximate-histograms.html#outlier-handling-modes`}
           >
             outlier handling modes
           </ExternalLink>{' '}
@@ -1024,9 +1014,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
     info: (
       <p>
         Druid connects to raw data through{' '}
-        <ExternalLink
+        <ExternalLink href={`${getLink('DOCS')}/ingestion/firehose.html`}>
-          href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/firehose.html`}
-        >
           inputSources
         </ExternalLink>
         . You can change your selected inputSource here.
@@ -1079,9 +1067,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           required: true,
           info: (
             <>
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/ingestion/firehose.html#localfirehose`}>
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/firehose.html#localfirehose`}
-              >
                 inputSource.baseDir
               </ExternalLink>
               <p>Specifies the directory to search recursively for files to be ingested.</p>
@@ -1105,9 +1091,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           ],
           info: (
             <>
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/ingestion/firehose.html#localfirehose`}>
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/firehose.html#localfirehose`}
-              >
                 inputSource.filter
               </ExternalLink>
               <p>
@@ -1177,11 +1161,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           info: (
             <p>
               The{' '}
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/querying/filters.html`}>filter</ExternalLink>{' '}
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/filters.html`}
-              >
-                filter
-              </ExternalLink>{' '}
               to apply to the data as part of querying.
             </p>
           ),
@@ -1241,9 +1221,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
             <>
               <p>
                 JSON array of{' '}
-                <ExternalLink
+                <ExternalLink href={`${getLink('DOCS')}/development/extensions-core/s3.html`}>
-                  href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/s3.html`}
-                >
                   S3 Objects
                 </ExternalLink>
                 .
@@ -1405,9 +1383,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
             <>
               <p>
                 JSON array of{' '}
-                <ExternalLink
+                <ExternalLink href={`${getLink('DOCS')}/development/extensions-core/azure.html`}>
-                  href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/azure.html`}
-                >
                   S3 Objects
                 </ExternalLink>
                 .
@@ -1465,9 +1441,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
             <>
               <p>
                 JSON array of{' '}
-                <ExternalLink
+                <ExternalLink href={`${getLink('DOCS')}/development/extensions-core/google.html`}>
-                  href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/google.html`}
-                >
                   Google Cloud Storage Objects
                 </ExternalLink>
                 .
@@ -1500,7 +1474,9 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           info: (
             <>
               <ExternalLink
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/kafka-ingestion#kafkasupervisorioconfig`}
+                href={`${getLink(
+                  'DOCS',
+                )}/development/extensions-core/kafka-ingestion#kafkasupervisorioconfig`}
               >
                 consumerProperties
               </ExternalLink>
@@ -1524,7 +1500,9 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           info: (
             <>
               <ExternalLink
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/development/extensions-core/kafka-ingestion#kafkasupervisorioconfig`}
+                href={`${getLink(
+                  'DOCS',
+                )}/development/extensions-core/kafka-ingestion#kafkasupervisorioconfig`}
               >
                 consumerProperties
               </ExternalLink>
@@ -1575,9 +1553,7 @@ export function getIoConfigFormFields(ingestionComboType: IngestionComboType): F
           info: (
             <>
               The Amazon Kinesis stream endpoint for a region. You can find a list of endpoints{' '}
-              <ExternalLink
+              <ExternalLink href={`https://docs.aws.amazon.com/general/latest/gr/ak.html`}>
-                href={`http://docs.aws.amazon.com/general/${DRUID_DOCS_VERSION}/gr/rande.html#ak_region`}
-              >
                 here
               </ExternalLink>
               .

web-console/src/variables.ts

@@ -1,31 +0,0 @@
-/*
- * 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.
- */
-
-// This is set to the latest available version and should be updated to the next version before release
-export const DRUID_DOCS_VERSION = '0.17.0';
-
-export const DRUID_WEBSITE = 'https://druid.apache.org';
-export const DRUID_GITHUB = 'https://github.com/apache/druid';
-export const DRUID_DOCS = `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}`;
-export const DRUID_DOCS_SQL = `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/sql.html`;
-export const DRUID_DOCS_RUNE = `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/querying.html`;
-export const DRUID_COMMUNITY = 'https://druid.apache.org/community/';
-export const DRUID_USER_GROUP = 'https://groups.google.com/forum/#!forum/druid-user';
-export const DRUID_ASF_SLACK = 'https://druid.apache.org/community/join-slack';
-export const DRUID_DEVELOPER_GROUP = 'https://lists.apache.org/list.html?dev@druid.apache.org';
-export const DRUID_DOCS_API = `https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/operations/api-reference.html`;

web-console/src/views/load-data-view/load-data-view.tsx

@@ -54,6 +54,7 @@ import {
 } from '../../components';
 import { FormGroupWithInfo } from '../../components/form-group-with-info/form-group-with-info';
 import { AsyncActionDialog } from '../../dialogs';
+import { getLink } from '../../links';
 import { AppToaster } from '../../singletons/toaster';
 import { UrlBaser } from '../../singletons/url-baser';
 import {
@@ -146,7 +147,6 @@ import {
   SampleStrategy,
 } from '../../utils/sampler';
 import { computeFlattenPathsForData } from '../../utils/spec-utils';
-import { DRUID_DOCS_VERSION } from '../../variables';
 
 import { ExamplePicker } from './example-picker/example-picker';
 import { FilterTable, filterTableSelectedColumnName } from './filter-table/filter-table';
@@ -811,9 +811,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
         return (
           <p>
             If you do not see your source of raw data here, you can try to ingest it by submitting a{' '}
-            <ExternalLink
+            <ExternalLink href={`${getLink('DOCS')}/ingestion/index.html`}>
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html`}
-            >
               JSON task or supervisor spec
             </ExternalLink>
             .
@@ -916,9 +914,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
         </p>
         <p>
           For more information please refer to the{' '}
-          <ExternalLink
+          <ExternalLink href={`${getLink('DOCS')}/operations/including-extensions`}>
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/operations/including-extensions`}
-          >
             documentation on loading extensions
           </ExternalLink>
           .
@@ -1060,9 +1056,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
           <Callout className="intro">
             <p>
               Druid ingests raw data and converts it into a custom,{' '}
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/design/segments.html`}>
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/design/segments.html`}
-              >
                 indexed format
               </ExternalLink>{' '}
               that is optimized for analytic queries.
@@ -1311,9 +1305,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
             {canFlatten && (
               <p>
                 If you have nested data, you can{' '}
-                <ExternalLink
+                <ExternalLink href={`${getLink('DOCS')}/ingestion/index.html#flattenspec`}>
-                  href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#flattenspec`}
-                >
                   flatten
                 </ExternalLink>{' '}
                 it here. If the provided flattening capabilities are not sufficient, please
@@ -1321,9 +1313,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
               </p>
             )}
             <p>Ensure that your data appears correctly in a row/column orientation.</p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/data-formats.html`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/data-formats.html`}
-            />
           </Callout>
           {!selectedFlattenField && (
             <>
@@ -1462,7 +1452,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
           />
           <AnchorButton
             icon={IconNames.INFO_SIGN}
-            href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/flatten-json.html`}
+            href={`${getLink('DOCS')}/ingestion/flatten-json.html`}
             target="_blank"
             minimal
           />
@@ -1574,9 +1564,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
               column. If you do not have any time columns, you can choose "Constant value" to create
               a default one.
             </p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/index.html#timestampspec`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#timestampspec`}
-            />
           </Callout>
           <FormGroup label="Timestamp spec">
             <ButtonGroup>
@@ -1724,16 +1712,12 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
             <p className="optional">Optional</p>
             <p>
               Druid can perform per-row{' '}
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/ingestion/transform-spec.html#transforms`}>
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/transform-spec.html#transforms`}
-              >
                 transforms
               </ExternalLink>{' '}
               of column values allowing you to create new derived columns or alter existing column.
             </p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/index.html#transforms`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#transforms`}
-            />
           </Callout>
           {Boolean(transformQueryState.error && transforms.length) && (
             <FormGroup>
@@ -1964,16 +1948,10 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
             <p className="optional">Optional</p>
             <p>
               Druid can{' '}
-              <ExternalLink
+              <ExternalLink href={`${getLink('DOCS')}/querying/filters.html`}>filter</ExternalLink>{' '}
-                href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/filters.html`}
-              >
-                filter
-              </ExternalLink>{' '}
               out unwanted data by applying per-row filters.
             </p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/index.html#filter`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#filter`}
-            />
           </Callout>
           {!showGlobalFilter && this.renderColumnFilterControls()}
           {!selectedFilter && this.renderGlobalFilterControls()}
@@ -2239,9 +2217,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
                 want to change the type, click on the column header.
               </p>
             )}
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/schema-design.html`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/schema-design.html`}
-            />
           </Callout>
           {!somethingSelected && (
             <>
@@ -2252,14 +2228,12 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
                     <p>
                       Select whether or not you want to set an explicit list of{' '}
                       <ExternalLink
-                        href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/ingestion-spec.html#dimensionsspec`}
+                        href={`${getLink('DOCS')}/ingestion/ingestion-spec.html#dimensionsspec`}
                       >
                         dimensions
                       </ExternalLink>{' '}
                       and{' '}
-                      <ExternalLink
+                      <ExternalLink href={`${getLink('DOCS')}/querying/aggregations.html`}>
-                        href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/aggregations.html`}
-                      >
                         metrics
                       </ExternalLink>
                       . Explicitly setting dimensions and metrics can lead to better compression and
@@ -2304,9 +2278,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
                   <PopoverText>
                     <p>
                       If you enable{' '}
-                      <ExternalLink
+                      <ExternalLink href={`${getLink('DOCS')}/tutorials/tutorial-rollup.html`}>
-                        href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/tutorials/tutorial-rollup.html`}
-                      >
                         roll-up
                       </ExternalLink>
                       , Druid will try to pre-aggregate data before indexing it to conserve storage.
@@ -2315,18 +2287,12 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
                     </p>
                     <p>
                       If you enable rollup, you must specify which columns are{' '}
-                      <a
+                      <a href={`${getLink('DOCS')}/ingestion/ingestion-spec.html#dimensionsspec`}>
-                        href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/ingestion-spec.html#dimensionsspec`}
-                      >
                         dimensions
                       </a>{' '}
                       (fields you want to group and filter on), and which are{' '}
-                      <a
+                      <a href={`${getLink('DOCS')}/querying/aggregations.html`}>metrics</a> (fields
-                        href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/querying/aggregations.html`}
+                      you want to aggregate on).
-                      >
-                        metrics
-                      </a>{' '}
-                      (fields you want to aggregate on).
                     </p>
                   </PopoverText>
                 }
@@ -2779,9 +2745,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
           <Callout className="intro">
             <p className="optional">Optional</p>
             <p>Configure how Druid will partition data.</p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/index.html#partitioning`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#partitioning`}
-            />
           </Callout>
         </div>
         {this.renderNextBar({
@@ -2845,9 +2809,7 @@ export class LoadDataView extends React.PureComponent<LoadDataViewProps, LoadDat
           <Callout className="intro">
             <p className="optional">Optional</p>
             <p>Fine tune how Druid will ingest data.</p>
-            <LearnMore
+            <LearnMore href={`${getLink('DOCS')}/ingestion/index.html#tuningconfig`} />
-              href={`https://druid.apache.org/docs/${DRUID_DOCS_VERSION}/ingestion/index.html#tuningconfig`}
-            />
           </Callout>
         </div>
         {this.renderNextBar({

web-console/src/views/query-view/run-button/run-button.tsx

@@ -33,6 +33,7 @@ import { IconNames } from '@blueprintjs/icons';
 import React from 'react';
 
 import { MenuCheckbox } from '../../../components';
+import { getLink } from '../../../links';
 import { pluralIfNeeded } from '../../../utils';
 import {
   getUseApproximateCountDistinct,
@@ -43,7 +44,6 @@ import {
   setUseApproximateTopN,
   setUseCache,
 } from '../../../utils/query-context';
-import { DRUID_DOCS_RUNE, DRUID_DOCS_SQL } from '../../../variables';
 
 export interface RunButtonProps {
   runeMode: boolean;
@@ -100,7 +100,7 @@ export class RunButton extends React.PureComponent<RunButtonProps> {
         <MenuItem
           icon={IconNames.HELP}
           text={runeMode ? 'Native query documentation' : 'DruidSQL documentation'}
-          href={runeMode ? DRUID_DOCS_RUNE : DRUID_DOCS_SQL}
+          href={getLink(runeMode ? 'DOCS_RUNE' : 'DOCS_SQL')}
           target="_blank"
         />
         <MenuItem icon={IconNames.HISTORY} text="Query history" onClick={onHistory} />