fix: upgrade argo-ui version (fixes stuck logs viewer); properly retr…

…y loading logs if network connection broke (argoproj#5615) Signed-off-by: Alexander Matyushentsev <[email protected]>
jlumme · Feb 25, 2021 · 7433a99 · 7433a99
1 parent 7ad79e5
commit 7433a99
Show file tree

Hide file tree

Showing 6 changed files with 51 additions and 30 deletions.
diff --git a/server/application/application.go b/server/application/application.go
@@ -1147,7 +1147,7 @@ func (s *Server) PodLogs(q *application.ApplicationPodLogsQuery, ws application.
 				return ws.Send(&application.LogEntry{Last: true})
 			}
 			if entry.err != nil {
-				return err
+				return entry.err
 			} else {
 				if q.Filter != nil {
 					lineContainsFilter := strings.Contains(entry.line, literal)

diff --git a/server/application/logs.go b/server/application/logs.go
@@ -24,6 +24,10 @@ func parseLogsStream(podName string, stream io.ReadCloser, ch chan logEntry) {
 		line, err := bufReader.ReadString('\n')
 		if err == io.EOF {
 			eof = true
+			// stop if we reached end of stream and the next line is empty
+			if line == "" {
+				break
+			}
 		} else if err != nil && err != io.EOF {
 			ch <- logEntry{err: err}
 			break

diff --git a/ui/src/app/applications/components/pod-logs-viewer/pod-logs-viewer.tsx b/ui/src/app/applications/components/pod-logs-viewer/pod-logs-viewer.tsx
@@ -160,32 +160,39 @@ export const PodsLogsViewer = (props: PodLogsProps & {fullscreen?: boolean}) =>
                         )}
                         input={props.containerName}
                         load={() => {
-                            return (
-                                services.applications
-                                    .getContainerLogs(
-                                        props.applicationName,
-                                        props.namespace,
-                                        props.podName,
-                                        {group: props.group, kind: props.kind, name: props.name},
-                                        props.containerName,
-                                        maxLines * (page.number + 1),
-                                        prefs.appDetails.followLogs && page.number === 0,
-                                        page.untilTimes[page.untilTimes.length - 1],
-                                        filterQuery()
-                                    )
-                                    // show only current page lines
-                                    .scan((lines, logEntry) => {
+                            let logsSource = services.applications
+                                .getContainerLogs(
+                                    props.applicationName,
+                                    props.namespace,
+                                    props.podName,
+                                    {group: props.group, kind: props.kind, name: props.name},
+                                    props.containerName,
+                                    maxLines * (page.number + 1),
+                                    prefs.appDetails.followLogs && page.number === 0,
+                                    page.untilTimes[page.untilTimes.length - 1],
+                                    filterQuery()
+                                )
+                                // show only current page lines
+                                .scan((lines, logEntry) => {
+                                    // first equal true means retry attempt so we should clear accumulated log entries
+                                    if (logEntry.first) {
+                                        lines = [logEntry];
+                                    } else {
                                         lines.push(logEntry);
-                                        if (lines.length > maxLines) {
-                                            lines.splice(0, lines.length - maxLines);
-                                        }
-                                        return lines;
-                                    }, new Array<models.LogEntry>())
-                                    // accumulate log changes and render only once every 100ms to reduce CPU usage
-                                    .bufferTime(100)
-                                    .filter(batch => batch.length > 0)
-                                    .map(batch => batch[batch.length - 1])
-                            );
+                                    }
+                                    if (lines.length > maxLines) {
+                                        lines.splice(0, lines.length - maxLines);
+                                    }
+                                    return lines;
+                                }, new Array<models.LogEntry>())
+                                // accumulate log changes and render only once every 100ms to reduce CPU usage
+                                .bufferTime(100)
+                                .filter(batch => batch.length > 0)
+                                .map(batch => batch[batch.length - 1]);
+                            if (prefs.appDetails.followLogs) {
+                                logsSource = logsSource.repeat().retryWhen(errors => errors.delay(500));
+                            }
+                            return logsSource;
                         }}>
                         {logs => {
                             logs = logs || [];

diff --git a/ui/src/app/shared/models.ts b/ui/src/app/shared/models.ts
@@ -392,6 +392,8 @@ export interface AppProjectStatus {
 export interface LogEntry {
     content: string;
     timeStamp: models.Time;
+    // first field is inferred on the fly and indicats first log line received from backend
+    first?: boolean;
     last: boolean;
     timeStampStr: string;
     podName: string;

diff --git a/ui/src/app/shared/services/applications-service.ts b/ui/src/app/shared/services/applications-service.ts
@@ -206,18 +206,26 @@ export class ApplicationsService {
             search.set('filter', filter);
         }
         const entries = requests.loadEventSource(`/applications/${applicationName}/logs?${search.toString()}`).map(data => JSON.parse(data).result as models.LogEntry);
+        let first = true;
         return new Observable(observer => {
             const subscription = entries.subscribe(
                 entry => {
                     if (entry.last) {
                         observer.complete();
                         subscription.unsubscribe();
                     } else {
-                        observer.next(entry);
+                        observer.next({...entry, first});
+                        first = false;
                     }
                 },
-                err => observer.error(err),
-                () => observer.complete()
+                err => {
+                    first = true;
+                    observer.error(err);
+                },
+                () => {
+                    first = true;
+                    observer.complete();
+                }
             );
             return () => subscription.unsubscribe();
         });

diff --git a/ui/yarn.lock b/ui/yarn.lock
@@ -1824,7 +1824,7 @@ are-we-there-yet@~1.1.2:
 
 "argo-ui@https://github.com/argoproj/argo-ui.git":
   version "1.0.0"
-  resolved "https://github.com/argoproj/argo-ui.git#a7404f5ab9654b6c941c655759fb6556cb7fe676"
+  resolved "https://github.com/argoproj/argo-ui.git#967c28a377aeef4861b2b97ccf6693d64abef725"
   dependencies:
     "@fortawesome/fontawesome-free" "^5.8.1"
     "@tippy.js/react" "^2.1.2"