feat: use IPC and Redux store for transfering socketIOSecret

packages/desktop/src/main/main.ts

@@ -332,6 +332,7 @@ app.on('ready', async () => {
   await createWindow()
 
   mainWindow?.webContents.on('did-finish-load', () => {
+    mainWindow?.webContents.send('socketIOSecret', SOCKET_IO_SECRET)
     if (splash && !splash.isDestroyed()) {
       const [width, height] = splash.getSize()
       mainWindow?.setSize(width, height)

packages/desktop/src/renderer/index.tsx

@@ -1,11 +1,10 @@
 import React from 'react'
 import { createRoot } from 'react-dom/client'
 import { ipcRenderer } from 'electron'
-
 import Root, { persistor } from './Root'
 import store from './store'
 import updateHandlers from './store/handlers/update'
-import { communities } from '@quiet/state-manager'
+import { communities, connection } from '@quiet/state-manager'
 
 if (window && process.env.DEBUG) {
   window.localStorage.setItem('debug', process.env.DEBUG)
@@ -25,6 +24,10 @@ ipcRenderer.on('invitation', (_event, invitation) => {
   store.dispatch(communities.actions.handleInvitationCode(invitation.code))
 })
 
+ipcRenderer.on('socketIOSecret', (_event, socketIOSecret) => {
+  store.dispatch(connection.actions.setSocketIOSecret(socketIOSecret))
+})
+
 const container = document.getElementById('root')
 if (!container) throw new Error('No root html element!')
 let root = createRoot(container)

packages/desktop/src/renderer/sagas/index.saga.ts

@@ -6,13 +6,11 @@ import { socketActions } from './socket/socket.slice'
 
 export default function* root(): Generator {
   const dataPort = new URLSearchParams(window.location.search).get('dataPort') || ''
-  const socketIOSecret = new URLSearchParams(window.location.search).get('socketIOSecret') || ''
   yield all([
     takeEvery(communities.actions.handleInvitationCode.type, handleInvitationCodeSaga),
     startConnectionSaga(
       socketActions.startConnection({
         dataPort: parseInt(dataPort),
-        socketIOSecret,
       })
     ),
   ])

packages/desktop/src/renderer/sagas/socket/socket.saga.ts

@@ -1,7 +1,7 @@
 import { io, Socket } from 'socket.io-client'
-import { all, fork, takeEvery, call, put, cancel, FixedTask } from 'typed-redux-saga'
+import { all, fork, takeEvery, call, put, cancel, FixedTask, select, take } from 'typed-redux-saga'
 import { PayloadAction } from '@reduxjs/toolkit'
-import { socket as stateManager, messages } from '@quiet/state-manager'
+import { socket as stateManager, messages, connection } from '@quiet/state-manager'
 import { socketActions } from './socket.slice'
 import { eventChannel } from 'redux-saga'
 import { displayMessageNotificationSaga } from '../notifications/notifications.saga'
@@ -13,10 +13,20 @@ const log = logger('socket')
 export function* startConnectionSaga(
   action: PayloadAction<ReturnType<typeof socketActions.startConnection>['payload']>
 ): Generator {
-  const { dataPort, socketIOSecret } = action.payload
+  const { dataPort } = action.payload
   if (!dataPort) {
     log.error('About to start connection but no dataPort found')
   }
+
+  let socketIOSecret = yield* select(connection.selectors.socketIOSecret)
+
+  if (!socketIOSecret) {
+    yield* take(connection.actions.setSocketIOSecret)
+    socketIOSecret = yield* select(connection.selectors.socketIOSecret)
+  }
+
+  if (!socketIOSecret) return
+
   const token = encodeSecret(socketIOSecret)
   const socket = yield* call(io, `http://127.0.0.1:${dataPort}`, {
     withCredentials: true,

packages/desktop/src/renderer/sagas/socket/socket.slice.ts

@@ -9,7 +9,6 @@ export class SocketState {
 
 export interface WebsocketConnectionPayload {
   dataPort: number
-  socketIOSecret: string
 }
 
 export interface CloseConnectionPayload {

packages/desktop/src/renderer/testUtils/prepareStore.ts

@@ -119,5 +119,6 @@ function* mockSocketConnectionSaga(socket: MockedSocket): Generator {
       socket.socketClient.emit('connect')
     })
   })
-  yield* put(socketActions.startConnection({ dataPort: 4677, socketIOSecret: '010101010' }))
+  yield* put(connection.actions.setSocketIOSecret('socketIOSecret'))
+  yield* put(socketActions.startConnection({ dataPort: 4677 }))
 }

packages/state-manager/src/sagas/appConnection/connection.selectors.ts

@@ -19,6 +19,8 @@ export const isTorInitialized = createSelector(connectionSlice, reducerState =>
 
 export const torConnectionProcess = createSelector(connectionSlice, reducerState => reducerState.torConnectionProcess)
 
+export const socketIOSecret = createSelector(connectionSlice, reducerState => reducerState.socketIOSecret)
+
 export const peerList = createSelector(
   connectionSlice,
   communitiesSelectors.currentCommunity,
@@ -59,4 +61,5 @@ export const connectionSelectors = {
   torBootstrapProcess,
   torConnectionProcess,
   isTorInitialized,
+  socketIOSecret,
 }

packages/state-manager/src/sagas/appConnection/connection.slice.ts

@@ -8,6 +8,7 @@ export class ConnectionState {
   public uptime = 0
   public peersStats: EntityState<NetworkStats> = peersStatsAdapter.getInitialState()
   public isTorInitialized = false
+  public socketIOSecret: string | null = null
   public torBootstrapProcess = 'Bootstrapped 0% (starting)'
   public torConnectionProcess: { number: number; text: string } = {
     number: 5,
@@ -51,6 +52,10 @@ export const connectionSlice = createSlice({
     setTorInitialized: state => {
       state.isTorInitialized = true
     },
+    setSocketIOSecret: (state, action: PayloadAction<string>) => {
+      state.socketIOSecret = action.payload
+    },
+
     setTorConnectionProcess: (state, action: PayloadAction<string>) => {
       const info = action.payload
       switch (info) {

packages/state-manager/src/sagas/appConnection/connection.transform.ts

@@ -15,6 +15,7 @@ export const ConnectionTransform = createTransform(
         text: 'Connecting process started',
       },
       isTorInitialized: false,
+      socketIOSecret: null,
     }
   },
   { whitelist: [StoreKeys.Connection] }