workadventure/front/src/Stores/ErrorStore.ts
David Négrier fcf0888864 Adding a reconnect feature in case first Pusher request fails
Now, if the first pusher request fails, a waiting message will be displayed and the application will reconnect when the pusher comes back alive or the network connection is established again.
2021-12-01 14:14:02 +01:00

62 lines
1.9 KiB
TypeScript

import {derived, writable} from "svelte/store";
interface ErrorMessage {
id: string|undefined;
closable: boolean; // Whether it can be closed by a user action or not
message: string | number | boolean | undefined;
}
/**
* A store that contains a list of error messages to be displayed.
*/
function createErrorStore() {
const { subscribe, set, update } = writable<ErrorMessage[]>([]);
return {
subscribe,
addErrorMessage: (e: string | Error, options?: {
closable?: boolean,
id?: string
}): void => {
update((messages: ErrorMessage[]) => {
let message: string;
if (e instanceof Error) {
message = e.message;
} else {
message = e;
}
if (!messages.find(errorMessage => errorMessage.message === message)) {
messages.push({
message,
closable: options?.closable ?? true,
id: options?.id
});
}
return messages;
});
},
clearMessageById: (id: string): void => {
update((messages: ErrorMessage[]) => {
messages = messages.filter(message => message.id !== id);
return messages;
});
},
clearClosableMessages: (): void => {
update((messages: ErrorMessage[]) => {
messages = messages.filter(message => message.closable);
return messages;
});
},
};
}
export const errorStore = createErrorStore();
export const hasClosableMessagesInErrorStore = derived(errorStore, ($errorStore) => {
const closableMessage = $errorStore.find(errorMessage => errorMessage.closable);
return !!closableMessage;
});