--wip-- [skip ci]

Author: v-tarasevich-blitz-brain

datahub-web-react/src/alchemy-components/components/Icon/Icon.tsx

@@ -17,6 +17,8 @@ export const iconDefaults: IconPropsDefaults = {
     tooltipText: '',
 };
 
+const ICON_NAMES = getIconNames();
+
 export const Icon = ({
     icon,
     source = iconDefaults.source,
@@ -29,7 +31,7 @@ export const Icon = ({
     tooltipText,
     ...props
 }: IconProps) => {
-    const { filled, outlined } = getIconNames();
+    const { filled, outlined } = ICON_NAMES;
     const { theme } = useCustomTheme();
 
     // Return early if no icon is provided

datahub-web-react/src/alchemy-components/components/Input/Input.tsx

@@ -19,7 +19,7 @@ import { getInputType } from '@components/components/Input/utils';
 export const inputDefaults: InputProps = {
     value: '',
     setValue: () => {},
-    label: 'Label',
+    label: '',
     placeholder: 'Placeholder',
     error: '',
     warning: '',

datahub-web-react/src/alchemy-components/components/TextArea/TextArea.tsx

@@ -14,7 +14,7 @@ import {
 import { TextAreaProps } from '@components/components/TextArea/types';
 
 export const textAreaDefaults: TextAreaProps = {
-    label: 'Label',
+    label: '',
     placeholder: 'Placeholder',
     error: '',
     warning: '',

datahub-web-react/src/app/ingestV2/source/builder/IngestionSourceBuilderModal.tsx

@@ -10,11 +10,12 @@ import { CreateScheduleStep } from '@app/ingestV2/source/builder/CreateScheduleS
 import { DefineRecipeStep } from '@app/ingestV2/source/builder/DefineRecipeStep';
 import { NameSourceStep } from '@app/ingestV2/source/builder/NameSourceStep';
 import { SelectTemplateStep } from '@app/ingestV2/source/builder/SelectTemplateStep';
-import sourcesJson from '@app/ingestV2/source/builder/sources.json';
 import { SourceBuilderState, StepProps } from '@app/ingestV2/source/builder/types';
 
 import { IngestionSource } from '@types';
 
+import { useIngestionSources } from './useIngestionSources';
+
 const StepsContainer = styled.div`
     margin-right: 20px;
     margin-left: 20px;
@@ -87,7 +88,7 @@ export const IngestionSourceBuilderModal = ({
         },
     });
 
-    const ingestionSources = JSON.parse(JSON.stringify(sourcesJson)); // TODO: replace with call to server once we have access to dynamic list of sources
+    const { ingestionSources } = useIngestionSources();
 
     const sendAnalyticsStepViewedEvent = useCallback(
         (step: IngestionSourceBuilderStep) => {

datahub-web-react/src/app/ingestV2/source/builder/RecipeForm/azure.ts

@@ -4,6 +4,7 @@ import { validateURL } from '@app/ingestV2/source/utils';
 export const AZURE_CLIENT_ID: RecipeField = {
     name: 'client_id',
     label: 'Client ID',
+    helper: 'Application ID from Azure AD',
     tooltip: 'Application ID. Found in your app registration on Azure AD Portal',
     type: FieldType.TEXT,
     fieldPath: 'source.config.client_id',
@@ -15,6 +16,7 @@ export const AZURE_CLIENT_ID: RecipeField = {
 export const AZURE_TENANT_ID: RecipeField = {
     name: 'tenant_id',
     label: 'Tenant ID',
+    helper: 'Directory ID from Azure AD',
     tooltip: 'Directory ID. Found in your app registration on Azure AD Portal',
     type: FieldType.TEXT,
     fieldPath: 'source.config.tenant_id',
@@ -26,6 +28,7 @@ export const AZURE_TENANT_ID: RecipeField = {
 export const AZURE_CLIENT_SECRET: RecipeField = {
     name: 'client_secret',
     label: 'Client Secret',
+    helper: 'Azure client secret',
     tooltip: 'The Azure client secret.',
     type: FieldType.SECRET,
     fieldPath: 'source.config.client_secret',
@@ -37,6 +40,7 @@ export const AZURE_CLIENT_SECRET: RecipeField = {
 export const AZURE_REDIRECT_URL: RecipeField = {
     name: 'redirect',
     label: 'Redirect URL',
+    helper: 'Redirect URL from Azure AD',
     tooltip: 'Redirect URL. Found in your app registration on Azure AD Portal.',
     type: FieldType.TEXT,
     fieldPath: 'source.config.redirect',
@@ -48,6 +52,7 @@ export const AZURE_REDIRECT_URL: RecipeField = {
 export const AZURE_AUTHORITY_URL: RecipeField = {
     name: 'authority',
     label: 'Authority URL',
+    helper: 'URL for MSAL token requests',
     tooltip: 'Is a URL that indicates a directory that MSAL can request tokens from..',
     type: FieldType.TEXT,
     fieldPath: 'source.config.authority',
@@ -59,6 +64,7 @@ export const AZURE_AUTHORITY_URL: RecipeField = {
 export const AZURE_TOKEN_URL: RecipeField = {
     name: 'token_url',
     label: 'Token URL',
+    helper: 'URL to acquire Azure tokens',
     tooltip:
         'The token URL that acquires a token from Azure AD for authorizing requests. This source will only work with v1.0 endpoint.',
     type: FieldType.TEXT,
@@ -71,6 +77,7 @@ export const AZURE_TOKEN_URL: RecipeField = {
 export const AZURE_GRAPH_URL: RecipeField = {
     name: 'graph_url',
     label: 'Graph URL',
+    helper: 'Microsoft Graph API endpoint',
     tooltip: 'Microsoft Graph API endpoint',
     type: FieldType.TEXT,
     fieldPath: 'source.config.graph_url',
@@ -82,6 +89,7 @@ export const AZURE_GRAPH_URL: RecipeField = {
 export const AZURE_INGEST_USERS: RecipeField = {
     name: 'ingest_users',
     label: 'Ingest Users',
+    helper: 'Ingest users from Azure AD',
     tooltip: 'Flag to determine whether to ingest users from Azure AD or not.',
     type: FieldType.BOOLEAN,
     fieldPath: 'source.config.ingest_users',
@@ -91,6 +99,7 @@ export const AZURE_INGEST_USERS: RecipeField = {
 export const AZURE_INGEST_GROUPS: RecipeField = {
     name: 'ingest_groups',
     label: 'Ingest Groups',
+    helper: 'Ingest groups from Azure AD',
     tooltip: 'Flag to determine whether to ingest groups from Azure AD or not.',
     type: FieldType.BOOLEAN,
     fieldPath: 'source.config.ingest_groups',
@@ -101,6 +110,7 @@ const schemaAllowFieldPathGroup = 'source.config.groups_pattern.allow';
 export const GROUP_ALLOW: RecipeField = {
     name: 'groups.allow',
     label: 'Allow Patterns',
+    helper: 'Include specific groups',
     tooltip:
         'Only include specific schemas by providing the name of a schema, or a regular expression (regex) to include specific schemas. If not provided, all schemas inside allowed databases will be included.',
     placeholder: 'group_pattern',
@@ -117,6 +127,7 @@ const schemaDenyFieldPathGroup = 'source.config.groups_pattern.deny';
 export const GROUP_DENY: RecipeField = {
     name: 'groups.deny',
     label: 'Deny Patterns',
+    helper: 'Exclude specific groups',
     tooltip:
         'Exclude specific schemas by providing the name of a schema, or a regular expression (regex). If not provided, all schemas inside allowed databases will be included. Deny patterns always take precedence over allow patterns.',
     placeholder: 'user_pattern',
@@ -133,6 +144,7 @@ const schemaAllowFieldPathUser = 'source.config.users_pattern.allow';
 export const USER_ALLOW: RecipeField = {
     name: 'user.allow',
     label: 'Allow Patterns',
+    helper: 'Include specific users',
     tooltip:
         'Exclude specific schemas by providing the name of a schema, or a regular expression (regex). If not provided, all schemas inside allowed databases will be included. Deny patterns always take precedence over allow patterns.',
     placeholder: 'user_pattern',
@@ -149,6 +161,7 @@ const schemaDenyFieldPathUser = 'source.config.users_pattern.deny';
 export const USER_DENY: RecipeField = {
     name: 'user.deny',
     label: 'Deny Patterns',
+    helper: 'Exclude specific users',
     tooltip:
         'Exclude specific schemas by providing the name of a schema, or a regular expression (regex). If not provided, all schemas inside allowed databases will be included. Deny patterns always take precedence over allow patterns.',
     placeholder: 'user_pattern',
@@ -164,6 +177,7 @@ export const USER_DENY: RecipeField = {
 export const SKIP_USERS_WITHOUT_GROUP: RecipeField = {
     name: 'skip_users_without_a_group',
     label: 'Skip users without group',
+    helper: 'Skip users without group',
     tooltip: 'Whether to skip users without group from Okta.',
     type: FieldType.BOOLEAN,
     fieldPath: 'source.config.skip_users_without_a_group',

datahub-web-react/src/app/ingestV2/source/builder/RecipeForm/bigquery.ts

@@ -3,6 +3,7 @@ import { FieldType, RecipeField } from '@app/ingestV2/source/builder/RecipeForm/
 export const BIGQUERY_PROJECT_ID: RecipeField = {
     name: 'project_id',
     label: 'Project ID',
+    helper: 'Project ID for queries',
     tooltip: 'Project ID where you have rights to run queries and create tables.',
     placeholder: 'my-project-123',
     type: FieldType.TEXT,
@@ -14,6 +15,7 @@ export const BIGQUERY_PROJECT_ID: RecipeField = {
 export const BIGQUERY_CREDENTIAL_PROJECT_ID: RecipeField = {
     name: 'credential.project_id',
     label: 'Credentials Project ID',
+    helper: 'Project ID from service account',
     tooltip: "The Project ID, which can be found in your service account's JSON Key (project_id)",
     placeholder: 'my-project-123',
     type: FieldType.TEXT,
@@ -24,6 +26,7 @@ export const BIGQUERY_CREDENTIAL_PROJECT_ID: RecipeField = {
 export const BIGQUERY_PRIVATE_KEY_ID: RecipeField = {
     name: 'credential.private_key_id',
     label: 'Private Key Id',
+    helper: 'Private Key ID from service account',
     tooltip: "The Private Key id, which can be found in your service account's JSON Key (private_key_id)",
     type: FieldType.SECRET,
     fieldPath: 'source.config.credential.private_key_id',
@@ -35,6 +38,7 @@ export const BIGQUERY_PRIVATE_KEY_ID: RecipeField = {
 export const BIGQUERY_PRIVATE_KEY: RecipeField = {
     name: 'credential.private_key',
     label: 'Private Key',
+    helper: 'Private key from service account',
     tooltip: "The Private key, which can be found in your service account's JSON Key (private_key).",
     placeholder: '-----BEGIN PRIVATE KEY-----....\n-----END PRIVATE KEY-----',
     type: FieldType.SECRET,
@@ -46,6 +50,7 @@ export const BIGQUERY_PRIVATE_KEY: RecipeField = {
 export const BIGQUERY_CLIENT_EMAIL: RecipeField = {
     name: 'credential.client_email',
     label: 'Client Email',
+    helper: 'Client email from service account',
     tooltip: "The Client Email, which can be found in your service account's JSON Key (client_email).",
     placeholder: '[email protected]',
     type: FieldType.TEXT,
@@ -57,9 +62,10 @@ export const BIGQUERY_CLIENT_EMAIL: RecipeField = {
 export const BIGQUERY_CLIENT_ID: RecipeField = {
     name: 'credential.client_id',
     label: 'Client ID',
+    helper: 'Client ID from service account',
     tooltip: "The Client ID, which can be found in your service account's JSON Key (client_id).",
     placeholder: '123456789098765432101',
-    type: FieldType.TEXTAREA,
+    type: FieldType.TEXT,
     fieldPath: 'source.config.credential.client_id',
     rules: null,
     required: true,

datahub-web-react/src/app/ingestV2/source/builder/RecipeForm/bigqueryBeta.ts

@@ -3,6 +3,7 @@ import { FieldType, RecipeField, setListValuesOnRecipe } from '@app/ingestV2/sou
 export const BIGQUERY_BETA_PROJECT_ID: RecipeField = {
     name: 'credential.project_id',
     label: 'Project ID',
+    helper: 'Project ID from service account',
     tooltip: "The Project ID, which can be found in your service account's JSON Key (project_id)",
     placeholder: 'my-project-123',
     type: FieldType.TEXT,
@@ -15,6 +16,7 @@ const projectIdAllowFieldPath = 'source.config.project_id_pattern.allow';
 export const PROJECT_ALLOW: RecipeField = {
     name: 'project_id_pattern.allow',
     label: 'Allow Patterns',
+    helper: 'Filter for project IDs',
     tooltip: 'Use regex here to filter for project IDs.',
     placeholder: '^my_db$',
     type: FieldType.LIST,
@@ -30,6 +32,7 @@ const projectIdDenyFieldPath = 'source.config.project_id_pattern.deny';
 export const PROJECT_DENY: RecipeField = {
     name: 'project_id_pattern.deny',
     label: 'Deny Patterns',
+    helper: 'Filter out project IDs',
     tooltip: 'Use regex here to filter for project IDs.',
     placeholder: '^my_db$',
     type: FieldType.LIST,
@@ -45,6 +48,7 @@ const datasetAllowFieldPath = 'source.config.dataset_pattern.allow';
 export const DATASET_ALLOW: RecipeField = {
     name: 'dataset_pattern.allow',
     label: 'Allow Patterns',
+    helper: 'Allow specific datasets',
     tooltip: 'Use regex here.',
     placeholder: '^my_db$',
     type: FieldType.LIST,
@@ -60,6 +64,7 @@ const datasetDenyFieldPath = 'source.config.dataset_pattern.deny';
 export const DATASET_DENY: RecipeField = {
     name: 'dataset_pattern.deny',
     label: 'Deny Patterns',
+    helper: 'Deny specific datasets',
     tooltip: 'Use regex here.',
     placeholder: '^my_db$',
     type: FieldType.LIST,