Webatrice: show loading screen until protobuf initializes (#4559)

* show loading screen until protobuf initializes

* cleanup

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>

webclient/src/store/server/server.actions.ts

@@ -4,6 +4,9 @@ import { WebSocketConnectOptions } from 'types';
 import { Types } from './server.types';
 
 export const Actions = {
+  initialized: () => ({
+    type: Types.INITIALIZED
+  }),
   clearStore: () => ({
     type: Types.CLEAR_STORE
   }),

webclient/src/store/server/server.dispatch.ts

@@ -3,6 +3,9 @@ import { Actions } from './server.actions';
 import { store } from 'store';
 
 export const Dispatch = {
+  initialized: () => {
+    store.dispatch(Actions.initialized());
+  },
   clearStore: () => {
     store.dispatch(Actions.clearStore());
   },

webclient/src/store/server/server.interfaces.ts

@@ -39,6 +39,7 @@ export interface AccountActivationParams extends ServerRegisterParams {
 }
 
 export interface ServerState {
+  initialized: boolean;
   buddyList: User[];
   ignoreList: User[];
   info: ServerStateInfo;

webclient/src/store/server/server.reducer.ts

@@ -6,6 +6,7 @@ import { ServerState } from './server.interfaces'
 import { Types } from './server.types';
 
 const initialState: ServerState = {
+  initialized: false,
   buddyList: [],
   ignoreList: [],
 
@@ -33,6 +34,12 @@ const initialState: ServerState = {
 
 export const serverReducer = (state = initialState, action: any) => {
   switch (action.type) {
+    case Types.INITIALIZED: {
+      return {
+        ...initialState,
+        initialized: true
+      }
+    }
     case Types.CLEAR_STORE: {
       return {
         ...initialState,

webclient/src/store/server/server.selectors.ts

@@ -5,6 +5,7 @@ interface State {
 }
 
 export const Selectors = {
+  getInitialized: ({ server }: State) => server.initialized,
   getMessage: ({ server }: State) => server.info.message,
   getName: ({ server }: State) => server.info.name,
   getVersion: ({ server }: State) => server.info.version,

webclient/src/store/server/server.types.ts

@@ -1,4 +1,5 @@
 export const Types = {
+  INITIALIZED: '[Server] Initialized',
   CLEAR_STORE: '[Server] Clear Store',
   LOGIN_SUCCESSFUL: '[Server] Login Successful',
   LOGIN_FAILED: '[Server] Login Failed',