diff --git a/CHANGELOG.md b/CHANGELOG.md index 9fab8d401e..90f832dec2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +[unreleased] + +* Better descriptions of the joining process + [2.0.3-alpha.5] * Fix network data proceeding when using custom protocol multiple times #1847 diff --git a/packages/backend/src/nest/tor/tor.service.ts b/packages/backend/src/nest/tor/tor.service.ts index 6e3c334b02..ca8af5febc 100644 --- a/packages/backend/src/nest/tor/tor.service.ts +++ b/packages/backend/src/nest/tor/tor.service.ts @@ -227,28 +227,6 @@ export class Tor extends EventEmitter implements OnModuleInit { this.process.stdout.on('data', (data: any) => { this.logger(data.toString()) - const info = data.toString() - - const textIndex = info.indexOf('):') + 2 - const text = info.slice(textIndex).trim() - - switch (text) { - case ConnectionProcessInfo.TOR_1: - this.emit(SocketActionTypes.CONNECTION_PROCESS_INFO, ConnectionProcessInfo.TOR_1) - break - case ConnectionProcessInfo.TOR_2: - this.emit(SocketActionTypes.CONNECTION_PROCESS_INFO, ConnectionProcessInfo.TOR_2) - break - case ConnectionProcessInfo.TOR_3: - this.emit(SocketActionTypes.CONNECTION_PROCESS_INFO, ConnectionProcessInfo.TOR_3) - break - case ConnectionProcessInfo.TOR_4: - this.emit(SocketActionTypes.CONNECTION_PROCESS_INFO, ConnectionProcessInfo.TOR_4) - break - case ConnectionProcessInfo.TOR_5: - this.emit(SocketActionTypes.CONNECTION_PROCESS_INFO, ConnectionProcessInfo.TOR_5) - break - } const regexp = /Bootstrapped 0/ if (regexp.test(data.toString())) { diff --git a/packages/desktop/src/renderer/components/LoadingPanel/JoiningPanelComponent.test.tsx b/packages/desktop/src/renderer/components/LoadingPanel/JoiningPanelComponent.test.tsx index 310b30325e..83b3ac84a7 100644 --- a/packages/desktop/src/renderer/components/LoadingPanel/JoiningPanelComponent.test.tsx +++ b/packages/desktop/src/renderer/components/LoadingPanel/JoiningPanelComponent.test.tsx @@ -71,7 +71,7 @@ describe('Create JoiningPanelComponent', () => { style="width: 600px;" >
{
+

- Initializing storage + Initialized backend modules

{ style="width: 600px;" >

{
+

- Initializing storage + Initialized backend modules

= ({ connectionProcess, openUrl }) => { const animationValue = useRef(new Animated.Value(0)).current @@ -25,6 +26,28 @@ const ConnectionProcessComponent: FC = ({ conne outputRange: ['0deg', '360deg'], }) + const processAnimation = useRef(new Animated.Value(0)).current + + useEffect(() => { + if (connectionProcess.text === ConnectionProcessInfo.CONNECTING_TO_COMMUNITY) { + Animated.loop( + Animated.timing(processAnimation, { + toValue: 1, + duration: 6000, + easing: Easing.linear, + useNativeDriver: false, + }) + ).start() + } else { + processAnimation.stopAnimation() + } + }, [processAnimation, connectionProcess]) + + const processAnimationWidth = processAnimation.interpolate({ + inputRange: [0, 1], + outputRange: [150, 300], + }) + return ( = ({ conne Joining now! - + + + {connectionProcess.text === ConnectionProcessInfo.CONNECTING_TO_COMMUNITY && ( + + )} ( console.log('open')} /> diff --git a/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.test.tsx b/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.test.tsx index aa7ce33a0b..bfb2a28158 100644 --- a/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.test.tsx +++ b/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.test.tsx @@ -85,17 +85,21 @@ describe('ConnectionProcessComponent', () => { "backgroundColor": "#F0F0F0", "borderRadius": 4, "height": 4, + "position": "relative", "width": 300, + "zIndex": 1, } } > diff --git a/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.types.ts b/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.types.ts index 537899221e..9c790b13e2 100644 --- a/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.types.ts +++ b/packages/mobile/src/components/ConnectionProcess/ConnectionProcess.types.ts @@ -1,4 +1,6 @@ +import { ConnectionProcessInfo } from '@quiet/types' + export interface ConnectionProcessComponentProps { - connectionProcess: { number: number; text: string } + connectionProcess: { number: number; text: ConnectionProcessInfo } openUrl: (url: string) => void } diff --git a/packages/mobile/src/tests/joining.process.test.tsx b/packages/mobile/src/tests/joining.process.test.tsx index c93bef81ff..36500a0ad2 100644 --- a/packages/mobile/src/tests/joining.process.test.tsx +++ b/packages/mobile/src/tests/joining.process.test.tsx @@ -54,12 +54,12 @@ describe('Joining process', () => { const processText = screen.getByTestId('connection-process-text') expect(processText.props.children).toEqual('Connecting process started') - store.dispatch(connection.actions.setConnectionProcess(ConnectionProcessInfo.INITIALIZING_LIBP2P)) + store.dispatch(connection.actions.setConnectionProcess(ConnectionProcessInfo.INITIALIZING_IPFS)) await act(async () => {}) const processText2 = screen.getByTestId('connection-process-text') console.log(processText2.props) - expect(processText2.props.children).toEqual('Initializing libp2p') + expect(processText2.props.children).toEqual('Initialized backend modules') store.dispatch(connection.actions.setConnectionProcess(ConnectionProcessInfo.LAUNCHED_COMMUNITY)) await act(async () => {}) diff --git a/packages/state-manager/src/sagas/appConnection/connection.slice.ts b/packages/state-manager/src/sagas/appConnection/connection.slice.ts index d4b11145a5..faee8221d8 100644 --- a/packages/state-manager/src/sagas/appConnection/connection.slice.ts +++ b/packages/state-manager/src/sagas/appConnection/connection.slice.ts @@ -56,7 +56,7 @@ export const connectionSlice = createSlice({ switch (info) { case ConnectionProcessInfo.REGISTERING_OWNER_CERTIFICATE: - state.connectionProcess = { number: 30, text: ConnectionProcessInfo.REGISTERING_OWNER_CERTIFICATE } + state.connectionProcess = { number: 50, text: ConnectionProcessInfo.REGISTERING_OWNER_CERTIFICATE } break case ConnectionProcessInfo.INITIALIZING_IPFS: if (state.connectionProcess.number > 30) break diff --git a/packages/types/src/connection.ts b/packages/types/src/connection.ts index adba74fa8e..60e00d6224 100644 --- a/packages/types/src/connection.ts +++ b/packages/types/src/connection.ts @@ -16,11 +16,7 @@ export interface NetworkStats { } export enum ConnectionProcessInfo { - CONNECTING_TO_COMMUNITY = 'Connecting to community members via Tor', REGISTERING_USER_CERTIFICATE = 'Registering user certificate', - // SAVING_USER_CSR = 'Saving user csr', - // WAITING_FOR_METADATA = 'Waiting for metadata', - REGISTERING_OWNER_CERTIFICATE = 'Registering owner certificate', LAUNCHING_COMMUNITY = 'Launching community', SPAWNING_HIDDEN_SERVICE = 'Spawning hidden service for community', INITIALIZING_STORAGE = 'Initializing storage', @@ -32,16 +28,12 @@ export enum ConnectionProcessInfo { LAUNCHED_COMMUNITY = 'Launched community', CHANNELS_REPLICATED = 'Channels replicated', CERTIFICATES_REPLICATED = 'Certificates replicated', - // ____ + CONNECTION_STARTED = 'Connecting process started', LOADING_MESSAGES = 'Loading messages', BACKEND_MODULES = 'Initialized backend modules', - // ____ - TOR_1 = 'Handshaking with a relay', - TOR_2 = 'Loading authority key certs', - TOR_3 = 'Loaded enough directory info to build circuits', - TOR_4 = 'Handshake finished with a relay to build circuits', - TOR_5 = 'Establishing a Tor circuit', + REGISTERING_OWNER_CERTIFICATE = 'Registering owner certificate', + CONNECTING_TO_COMMUNITY = 'Connecting to community members via Tor', } export const TOR_BOOTSTRAP_COMPLETE = 'Bootstrapped 100% (done)'