Merge branch 'master' into release_6.1

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:10.24 AS build
+FROM node:14.18 AS build
 ARG app_version=0.0.0
 RUN apt-get update \
     && apt-get install --yes --no-install-recommends make build-essential

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "th2-rpt-viewer",
-	"version": "3.1.93",
+	"version": "3.1.144",
 	"description": "",
 	"main": "index.tsx",
 	"private": true,
@@ -49,7 +49,7 @@
 		"react-text-mask": "^5.4.3",
 		"react-timeago": "^4.4.0",
 		"react-toast-notifications": "^2.4.0",
-		"react-virtuoso": "^1.8.6",
+		"react-virtuoso": "^2.6.0",
 		"recharts": "^1.8.5",
 		"regenerator-runtime": "^0.13.5",
 		"resize-observer-polyfill": "^1.5.1",
@@ -110,9 +110,10 @@
 		"ts-jest": "^24.1.0",
 		"typescript": "^3.7.7",
 		"wait-for-expect": "^3.0.2",
-		"webpack": "^4.41.2",
+		"webpack": "^4.44.0",
 		"webpack-cli": "^4.9.1",
 		"webpack-dev-server": "^4.3.1",
+		"webpack-manifest-plugin": "^4.0.2",
 		"webpack-merge": "^4.2.2",
 		"worker-loader": "^3.0.8"
 	}

src/api/ApiSchema.ts

@@ -29,6 +29,7 @@ import {
 } from './sse';
 import { IndexedDB } from './indexedDb';
 import { MatchMessageParams } from './message';
+import { DirectionalStreamInfo } from '../models/StreamInfo';
 
 export default interface ApiSchema {
 	events: EventApiSchema;
@@ -87,6 +88,12 @@ export interface MessageApiSchema {
 		filter: MatchMessageParams,
 		abortSignal?: AbortSignal,
 	) => Promise<boolean>;
+	getResumptionMessageIds: (params: {
+		streams: string[];
+		startTimestamp?: number;
+		messageId?: string;
+		abortSignal?: AbortSignal;
+	}) => Promise<DirectionalStreamInfo>;
 }
 
 export interface SSESchema {

src/api/indexedDb.ts

@@ -176,6 +176,7 @@ export class IndexedDB {
 		const db = await this.getDb();
 		const tx = await db.transaction(storeName, 'readwrite');
 		const store = await tx.objectStore(storeName);
+
 		await store.add(data);
 		await tx.done;
 	};

src/api/message.ts

@@ -121,6 +121,18 @@ const messageHttpApi: MessageApiSchema = {
 
 		if (res.ok) return res.json();
 
+		console.error(res.statusText);
+		return [];
+	},
+	getResumptionMessageIds: async ({ streams, startTimestamp, messageId, abortSignal: signal }) => {
+		if (!startTimestamp && !messageId) {
+			throw new Error('One of startTimestamp or messageId must be specified');
+		}
+
+		const params = createURLSearchParams({ stream: streams, startTimestamp, messageId });
+		const res = await fetch(`backend/messageIds/?${params}`, { signal });
+		if (res.ok) return res.json();
+
 		console.error(res.statusText);
 		return [];
 	},

src/api/sse.ts

@@ -14,7 +14,6 @@
  * limitations under the License.
  ***************************************************************************** */
 
-import moment from 'moment';
 import { SSESchema } from './ApiSchema';
 import { createURLSearchParams } from '../helpers/url';
 import EventsFilter from '../models/filter/EventsFilter';
@@ -25,9 +24,7 @@ interface BaseSSEParams {
 	startTimestamp?: number;
 	endTimestamp?: number | null;
 	resultCountLimit?: number;
-	resumeFromId?: string;
 	searchDirection?: 'next' | 'previous'; // defaults to next
-	keepOpen?: boolean;
 }
 
 export interface SSEHeartbeat {
@@ -49,8 +46,8 @@ export interface SSEFilterParameter {
 	type: { value: 'string' | 'boolean' | 'string[]' | 'switcher' };
 }
 
-export type EventSSEFilters = 'attachedMessageId' | 'type' | 'name' | 'body' | 'status';
-export type MessagesSSEFilters = 'attachedEventIds' | 'type' | 'body';
+export type EventSSEFilters = 'attachedMessageId' | 'type' | 'name' | 'body' | 'status' | 'text';
+export type MessagesSSEFilters = 'attachedEventIds' | 'type' | 'body' | 'text';
 
 export interface EventsFiltersInfo {
 	name: EventSSEFilters;
@@ -76,6 +73,7 @@ export interface EventSSEParams extends BaseSSEParams {
 	'name-values'?: string[];
 	'name-negative'?: boolean;
 	'name-conjunct'?: boolean;
+	resumeFromId?: string;
 }
 
 export interface MessagesSSEParams extends BaseSSEParams {
@@ -101,7 +99,7 @@ export interface SSEParamsEvents {
 	limitForParent?: number;
 }
 
-export interface MessagesIdsEvent {
+export interface MessageIdsEvent {
 	reason: string;
 	// session: messageId
 	messageIds: {
@@ -146,7 +144,7 @@ export function getMessagesSSEParamsFromFilter(
 	filter: MessageFilterState | null,
 	streams: string[],
 	startTimestamp: number | null,
-	endTimestamp: number | null = null,
+	endTimestamp: number | null,
 	searchDirection = 'previous',
 	resultCountLimit?: number,
 ): URLSearchParams {
@@ -172,11 +170,8 @@ export function getMessagesSSEParamsFromFilter(
 			: [],
 	);
 
-	const timestampTo = moment().utc().subtract(30, 'minutes').valueOf();
-	const defaultStartTimestamp = moment(timestampTo).add(5, 'minutes').valueOf();
-
 	const queryParams: MessagesSSEParams = {
-		startTimestamp: startTimestamp || defaultStartTimestamp,
+		startTimestamp,
 		endTimestamp: endTimestamp || undefined,
 		stream: streams,
 		searchDirection,

src/components/embedded/EmbeddedMessages.tsx

@@ -144,8 +144,8 @@ interface Props {
 	scrolledIndex: Number | null;
 	className?: string;
 	overscan?: number;
-	loadNextMessages: (resumeFromId?: string) => Promise<EventMessage[]>;
-	loadPrevMessages: (resumeFromId?: string) => Promise<EventMessage[]>;
+	loadNextMessages: () => Promise<EventMessage[]>;
+	loadPrevMessages: () => Promise<EventMessage[]>;
 }
 
 const MessagesVirtualizedList = observer((props: Props) => {
@@ -182,7 +182,7 @@ const MessagesVirtualizedList = observer((props: Props) => {
 					!messagesStore.dataStore.updateStore.isLoading &&
 					(wheelScrollDirection === undefined || wheelScrollDirection === 'next')
 				) {
-					loadNextMessages(messagesStore.dataStore.messages[0]?.messageId).then(messages =>
+					loadNextMessages().then(messages =>
 						messagesStore.dataStore.onNextChannelResponse(messages),
 					);
 				}
@@ -194,10 +194,9 @@ const MessagesVirtualizedList = observer((props: Props) => {
 					!messagesStore.dataStore.searchChannelPrev.isEndReached &&
 					(wheelScrollDirection === undefined || wheelScrollDirection === 'previous')
 				) {
-					loadPrevMessages(
-						messagesStore.dataStore.messages[messagesStore.dataStore.messages.length - 1]
-							?.messageId,
-					).then(messages => messagesStore.dataStore.onPrevChannelResponse(messages));
+					loadPrevMessages().then(messages =>
+						messagesStore.dataStore.onPrevChannelResponse(messages),
+					);
 				}
 			}
 		},

src/components/embedded/EmbeddedMessagesFilterPanel.tsx

@@ -15,7 +15,6 @@
  ***************************************************************************** */
 
 import React from 'react';
-import { computed } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import {
 	CompoundFilterRow,
@@ -54,6 +53,7 @@ const EmbeddedMessagesFilterPanel = ({
 		body: '',
 		attachedEventIds: '',
 		bodyBinary: '',
+		text: '',
 	});
 
 	React.useEffect(() => {
@@ -70,6 +70,7 @@ const EmbeddedMessagesFilterPanel = ({
 			body: '',
 			attachedEventIds: '',
 			bodyBinary: '',
+			text: '',
 		});
 	}, []);
 
@@ -83,10 +84,6 @@ const EmbeddedMessagesFilterPanel = ({
 		);
 	}, [filter, filterStore.filter, streams]);
 
-	const isLoading = computed(
-		() => messagesDataStore.messages.length === 0 && messagesDataStore.isLoading,
-	).get();
-
 	const compoundFilterRow: Array<CompoundFilterRow> = React.useMemo(() => {
 		if (!filter || Object.keys(filter).length === 0) return [];
 		// eslint-disable-next-line no-underscore-dangle
@@ -202,15 +199,20 @@ const EmbeddedMessagesFilterPanel = ({
 	return (
 		<>
 			<FilterPanel
-				isLoading={isLoading}
 				isFilterApplied={messagesStore.filterStore.isMessagesFilterApplied}
 				setShowFilter={setShowFilter}
 				showFilter={showFilter}
 				config={filterConfig}
 				onSubmit={submitChanges}
 				onClearAll={messagesStore.clearFilters}
+				isLoading={false}
+			/>
+			<MessagesFilterSessionFilter
+				config={sessionFilterConfig}
+				submitChanges={submitChanges}
+				stopLoading={messagesDataStore.stopMessagesLoading}
+				isLoading={messagesDataStore.isLoading}
 			/>
-			<MessagesFilterSessionFilter config={sessionFilterConfig} submitChanges={submitChanges} />
 		</>
 	);
 };