diff --git a/public/components/getting_started/components/getting_started_collectData.tsx b/public/components/getting_started/components/getting_started_collectData.tsx index 13eadedf1..9a5d7b99e 100644 --- a/public/components/getting_started/components/getting_started_collectData.tsx +++ b/public/components/getting_started/components/getting_started_collectData.tsx @@ -82,6 +82,10 @@ export const CollectAndShipData: React.FC = ({ java: javaJson, }; + useEffect(() => { + handleCollectionMethodChange(cardOne); + }, []); + useEffect(() => { let isMounted = true; @@ -192,11 +196,8 @@ export const CollectAndShipData: React.FC = ({ return ( <> - -

{collectionMethod}

-
- Select collector + Select telemetry source
= ({ }; const renderSchema = (schemas: any[]) => - schemas.map((schema, idx) => ( -
- -

{schema.type} Schema

-
- - {schema.description} -
- {schema.alias && ( - <> - Alias: {schema.alias} -
- - )} - Index Pattern Name: {schema['index-pattern-name']} -
- {Array.isArray(schema.info) && - schema.info.map((link: any, linkIdx: number) => - link && typeof link.url === 'string' ? ( - - {typeof link.title === 'string' && link.title.trim() !== '' - ? link.title - : 'More Info'} - - ) : ( - - Invalid URL - - ) + schemas.map((schema, idx) => { + const indexPatternName = schema['index-pattern-name'] || ''; + + return ( +
+ +

{schema.type} Schema

+
+ + {schema.description} +
+ {schema.alias && ( + <> + Alias: {schema.alias} +
+ )} -
- {schema.content && ( - - {schema.content} - - )} - {schema['index-template'] && ( - - Index Template - - )} - -
- )); + {indexPatternName && ( + <> + Index Pattern Name: {indexPatternName} +
+ + )} + {Array.isArray(schema.info) && + schema.info.map((link: any, linkIdx: number) => + link && typeof link.url === 'string' ? ( + + {typeof link.title === 'string' && link.title.trim() !== '' + ? link.title + : 'More Info'} + + ) : ( + + Invalid URL + + ) + )} +
+ {schema.content && ( + + {schema.content} + + )} + {schema['index-template'] && ( + + {`${indexPatternName} Index Template`} + + )} + +
+ ); + }); const renderIndex = (indexPatterns: any) => ( <> @@ -361,29 +370,11 @@ export const CollectAndShipData: React.FC = ({ const baseUrl = `${window.location.origin}/app`; const cardData = { - otelLogs: { - title: 'Otel Dashboard', - description: 'Analyze logs with pre-packaged dashboards', - icon: Otel Icon, - url: `${baseUrl}/integrations#/available/otel-services`, - }, - otelMetrics: { - title: 'Otel Dashboard', - description: 'Analyze logs with pre-packaged dashboards', - icon: Otel Icon, - url: `${baseUrl}/integrations#/available/otel-services`, - }, - otelTraces: { - title: 'Otel Dashboard', - description: 'Analyze logs with pre-packaged dashboards', - icon: Otel Icon, - url: `${baseUrl}/integrations#/available/otel-services`, - }, nginx: { title: 'Nginx Dashboard', description: 'Analyze logs with pre-packaged dashboards', icon: Nginx Icon, - url: `${baseUrl}/integrations#/available/nginx`, + url: `${baseUrl}/integrations#/available/nginx/setup`, }, }; @@ -429,70 +420,73 @@ export const CollectAndShipData: React.FC = ({ }; const renderSteps = (workflow: any) => { - const steps = workflow.steps.map((step: any) => ({ - title: step.name, - children: ( -
- {step.description} - {step['input-params'] && step['input-params'].length > 0 && ( -
- -

Input Parameters:

-
- {step['input-params'].map((param: any, idx: number) => ( - - {param.name}: {param.description} ({param.type}) - - ))} -
- )} - - {Array.isArray(step.info) && - step.info.map((link: any, linkIndex: number) => { - if (link && typeof link.url === 'string') { - return ( - - {typeof link.title === 'string' && link.title.trim() !== '' - ? link.title - : 'More Info'} - - ); - } else { - return ( - - Invalid URL + const steps = [ + { + title: 'Schema', + children: renderSchema( + technologyJsonMap[specificMethod]?.['getting-started']?.schema || + technologyJsonMap[specificMethod]?.schema || + [] + ), + }, + { + title: 'Index Patterns', + children: renderIndex( + technologyJsonMap[specificMethod]?.['getting-started']?.['index-patterns'] || + technologyJsonMap[specificMethod]?.['index-patterns'] || + {} + ), + }, + ]; + + steps.push( + ...workflow.steps.map((step: any) => ({ + title: step.name, + children: ( +
+ {step.description} + {step['input-params'] && step['input-params'].length > 0 && ( +
+ +

Input Parameters:

+
+ {step['input-params'].map((param: any, idx: number) => ( + + {param.name}: {param.description} - ); - } - })} - - {step.content && ( - - {step.content} - - )} - -
- ), - })); - - steps.push({ - title: 'Schema', - children: renderSchema( - technologyJsonMap[specificMethod]?.['getting-started']?.schema || - technologyJsonMap[specificMethod]?.schema || - [] - ), - }); + ))} +
+ )} - steps.push({ - title: 'Index Patterns', - children: renderIndex( - technologyJsonMap[specificMethod]?.['getting-started']?.['index-patterns'] || - technologyJsonMap[specificMethod]?.['index-patterns'] || - {} - ), - }); + {Array.isArray(step.info) && + step.info.map((link: any, linkIndex: number) => { + if (link && typeof link.url === 'string') { + return ( + + {typeof link.title === 'string' && link.title.trim() !== '' + ? link.title + : 'More Info'} + + ); + } else { + return ( + + Invalid URL + + ); + } + })} + + {step.content && ( + + {step.content} + + )} + +
+ ), + })) + ); steps.push({ title: 'Explore your data', @@ -520,9 +514,6 @@ export const CollectAndShipData: React.FC = ({ return ( - -

Ingest data by signal type

-
@@ -567,9 +558,9 @@ export const CollectAndShipData: React.FC = ({ {tabs.length > 0 && ( <> - +

- How to ingest{' '} + Steps to integrate{' '} {specificMethod.startsWith('otel') ? 'OpenTelemetry' : specificMethod.charAt(0).toUpperCase() + specificMethod.slice(1)}{' '} diff --git a/public/components/getting_started/getting_started_artifacts/golang_client/golang_client-1.0.0.json b/public/components/getting_started/getting_started_artifacts/golang_client/golang_client-1.0.0.json index b5f21e377..2e7aaad4c 100644 --- a/public/components/getting_started/getting_started_artifacts/golang_client/golang_client-1.0.0.json +++ b/public/components/getting_started/getting_started_artifacts/golang_client/golang_client-1.0.0.json @@ -154,12 +154,6 @@ "schema": [ { "type": "logs", - "info": [ - { - "url": "https://opensearch.org/docs/latest/im-plugin/index-templates", - "title": "Index Template Documentation" - } - ], "content": "PUT _index_template/application_logs_template", "description": "Setup applicative logs index template in the dev console", "index-template": "https://github.com/opensearch-project/opensearch-catalog/blob/main/integrations/observability/golang_client/schemas/applicative-logs-1.0.0.mapping.json", diff --git a/public/components/getting_started/getting_started_artifacts/java_client/java_client-1.0.0.json b/public/components/getting_started/getting_started_artifacts/java_client/java_client-1.0.0.json index a165ea6e5..6198f4558 100644 --- a/public/components/getting_started/getting_started_artifacts/java_client/java_client-1.0.0.json +++ b/public/components/getting_started/getting_started_artifacts/java_client/java_client-1.0.0.json @@ -119,9 +119,6 @@ "schema": [ { "type": "logs", - "info": [ - { "url": "https://opensearch.org/docs/latest/im-plugin/index-templates", "title": "Index Template Documentation" } - ], "content": "PUT _index_template/application_logs_template", "description": "Setup applicative logs index template in the dev console", "index-template": "https://github.com/opensearch-project/opensearch-catalog/blob/main/integrations/observability/java_client/schemas/applicative-logs-1.0.0.mapping.json", diff --git a/public/components/getting_started/getting_started_artifacts/nginx/nginx-1.0.0.json b/public/components/getting_started/getting_started_artifacts/nginx/nginx-1.0.0.json index 380a38dc6..edd71fa49 100644 --- a/public/components/getting_started/getting_started_artifacts/nginx/nginx-1.0.0.json +++ b/public/components/getting_started/getting_started_artifacts/nginx/nginx-1.0.0.json @@ -134,7 +134,7 @@ } ], "description": "Setup Fluent-Bit parser config file parsing Nginx access log fields", - "content": "[PARSER]\n Name apache\n Format regex\n Regex ^(?[^ ]*) [^ ]* (?[^ ]*) \\[(?