Add Dockerfile

.dockerignore

@@ -0,0 +1,16 @@
+*.md
+**/node_modules
+
+.git
+.github
+media
+.gitignore
+.nvmrc
+DCO
+LICENSE
+
+packages/jaeger-ui/build
+packages/jaeger-ui/stats.html
+packages/plexus/dist
+packages/plexus/lib
+packages/plexus/libtsconfig.tsbuildinfo

Dockerfile

@@ -0,0 +1,23 @@
+FROM node:16.20.0 AS build
+
+WORKDIR /app
+
+COPY package.json ./
+COPY yarn.lock ./
+COPY packages/jaeger-ui/package.json ./packages/jaeger-ui/
+COPY . .
+RUN yarn install --frozen-lockfile
+# RUN yarn prettier-lint
+# RUN yarn eslint 
+
+WORKDIR /app/packages/jaeger-ui
+
+# RUN yarn test
+RUN yarn build
+
+FROM nginx:1.25.0
+
+COPY --from=build /app/packages/jaeger-ui/build/ /usr/share/nginx/html/
+COPY ./nginx.conf.template /etc/nginx/conf.d/default.conf.template
+
+CMD ["/bin/sh" , "-c" , "envsubst '${JAEGER_QUERY_URL}' < /etc/nginx/conf.d/default.conf.template > /etc/nginx/conf.d/default.conf && exec nginx -g 'daemon off;'"]

nginx.conf.template

@@ -0,0 +1,13 @@
+server {
+  listen  80;
+  root  /usr/share/nginx/html;
+
+  location / {
+    index index.html;
+    try_files $uri /index.html;
+  }
+
+  location /api {
+    proxy_pass ${JAEGER_QUERY_URL}/api;
+  }
+}

packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.tsx

@@ -63,7 +63,7 @@ export default class SpanDetail extends React.Component<SpanDetailProps, SpanDet
     this._updateSpanInfo = this._updateSpanInfo.bind(this);
     this._handleCodeButtonClick = this._handleCodeButtonClick.bind(this);
     this._handleSpanNameLinkClick = this._handleSpanNameLinkClick.bind(this);
-    this._getSpanTags = this._getSpanTags.bind(this);
+    this._prepareSpanInfo = this._prepareSpanInfo.bind(this);
     const span = globalState.spans[props.span.spanID];
     this.state = {
       hasCodeLocation: Boolean(span && span.hasCodeLocation),
@@ -96,39 +96,42 @@ export default class SpanDetail extends React.Component<SpanDetailProps, SpanDet
     });
   }
 
-  _getSpanTags(tags: KeyValuePair[]) {
-    const otelLibraryNameTag = tags.find((tag: any) => tag.key === 'otel.library.name');
-    const functionTag = tags.find((tag: any) => tag.key === 'code.function');
-    const namespaceTag = tags.find((tag: any) => tag.key === 'code.namespace');
-    const spanCodeObjectIdTag = tags.find((tag: any) => tag.key === 'digma.span.code.object.id');
-    const methodCodeObjectIdTag = tags.find((tag: any) => tag.key === 'digma.method.code.object.id');
+  _prepareSpanInfo() {
+    const tagsToGet = {
+      instrumentationLibrary: 'otel.library.name',
+      function: 'code.function',
+      namespace: 'code.namespace',
+      spanCodeObjectIdTag: 'digma.span.code.object.id',
+      methodCodeObjectId: 'digma.method.code.object.id',
+    };
+
+    const tagsValues = Object.entries(tagsToGet).reduce((acc, [key, value]) => {
+      const tag = this.props.span.tags.find((x: any) => x.key === value);
+      return tag ? { ...acc, [key]: tag.value } : acc;
+    }, {});
 
     return {
+      ...tagsValues,
       id: this.props.span.spanID,
       name: this.props.span.operationName,
-      ...(otelLibraryNameTag ? { instrumentationLibrary: otelLibraryNameTag.value } : {}),
-      ...(functionTag ? { function: functionTag.value } : {}),
-      ...(namespaceTag ? { namespace: namespaceTag.value } : {}),
-      ...(spanCodeObjectIdTag ? { spanCodeObjectId: spanCodeObjectIdTag.value } : {}),
-      ...(methodCodeObjectIdTag ? { methodCodeObjectId: methodCodeObjectIdTag.value } : {}),
     };
   }
 
   _handleCodeButtonClick() {
-    const spanTags = this._getSpanTags(this.props.span.tags);
+    const spanInfo = this._prepareSpanInfo();
 
     window.sendMessageToDigma({
       action: actions.GO_TO_SPAN,
-      payload: spanTags,
+      payload: spanInfo,
     });
   }
 
   _handleSpanNameLinkClick() {
-    const spanTags = this._getSpanTags(this.props.span.tags);
+    const spanInfo = this._prepareSpanInfo();
 
     window.sendMessageToDigma({
       action: actions.GO_TO_INSIGHTS,
-      payload: spanTags,
+      payload: spanInfo,
     });
   }
 
@@ -167,13 +170,16 @@ export default class SpanDetail extends React.Component<SpanDetailProps, SpanDet
       },
     ];
     const deepLinkCopyText = `${window.location.origin}${window.location.pathname}?uiFind=${spanID}`;
-    const otelLibraryNameTag = this._getSpanTags(this.props.span.tags).instrumentationLibrary;
+    const isInstrumentationLibraryPresent = Object.prototype.hasOwnProperty.call(
+      this._prepareSpanInfo(),
+      'instrumentationLibrary'
+    );
 
     return (
       <div>
         <div className="SpanDetail--header">
           <div className="ub-flex ub-items-center">
-            {otelLibraryNameTag && this.state.insights.length > 0 ? (
+            {isInstrumentationLibraryPresent && this.state.insights.length > 0 ? (
               <RouterLink
                 to="#"
                 onClick={this._handleSpanNameLinkClick}