diff --git a/CHANGELOG.md b/CHANGELOG.md
index 58ad0674ad..52f37031e6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,7 @@
 [unreleased]
 
+* Replaced greying out inputs with splash screen on joining/creating screens.
+
 * Fixes empty space between chat's input and a soft keyboard on iOS devices.
 
 * Changed registration process - user connects to the libp2p network directly instead of using registrar. Invitation link format changed. User csr is now saved to database.
diff --git a/packages/mobile/ios/Podfile.lock b/packages/mobile/ios/Podfile.lock
index ec0ed03b2c..a17b190d87 100644
--- a/packages/mobile/ios/Podfile.lock
+++ b/packages/mobile/ios/Podfile.lock
@@ -248,6 +248,8 @@ PODS:
     - react-native-config/App (= 1.5.0)
   - react-native-config/App (1.5.0):
     - React-Core
+  - react-native-document-picker (9.0.1):
+    - React-Core
   - react-native-randombytes (3.6.1):
     - React-Core
   - react-native-safe-area-context (4.4.1):
@@ -357,7 +359,7 @@ PODS:
     - SDWebImageWebPCoder (~> 0.8.4)
   - RNFS (2.20.0):
     - React-Core
-  - RNGestureHandler (2.8.0):
+  - RNGestureHandler (2.12.0):
     - React-Core
   - RNScreens (3.18.2):
     - React-Core
@@ -406,6 +408,7 @@ DEPENDENCIES:
   - React-logger (from `../node_modules/react-native/ReactCommon/logger`)
   - react-native-blob-util (from `../node_modules/react-native-blob-util`)
   - react-native-config (from `../node_modules/react-native-config`)
+  - react-native-document-picker (from `../node_modules/react-native-document-picker`)
   - react-native-randombytes (from `../node_modules/react-native-randombytes`)
   - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
   - react-native-webview (from `../node_modules/react-native-webview`)
@@ -488,6 +491,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-blob-util"
   react-native-config:
     :path: "../node_modules/react-native-config"
+  react-native-document-picker:
+    :path: "../node_modules/react-native-document-picker"
   react-native-randombytes:
     :path: "../node_modules/react-native-randombytes"
   react-native-safe-area-context:
@@ -573,6 +578,7 @@ SPEC CHECKSUMS:
   React-logger: 9332c3e7b4ef007a0211c0a9868253aac3e1da82
   react-native-blob-util: 99f4d79189252f597fe0d810c57a3733b1b1dea6
   react-native-config: 5330c8258265c1e5fdb8c009d2cabd6badd96727
+  react-native-document-picker: 2b8f18667caee73a96708a82b284a4f40b30a156
   react-native-randombytes: 421f1c7d48c0af8dbcd471b0324393ebf8fe7846
   react-native-safe-area-context: 99b24a0c5acd0d5dcac2b1a7f18c49ea317be99a
   react-native-webview: 994b9f8fbb504d6314dc40d83f94f27c6831b3bf
@@ -596,7 +602,7 @@ SPEC CHECKSUMS:
   RNDevMenu: 72807568fe4188bd4c40ce32675d82434b43c45d
   RNFastImage: 5c9c9fed9c076e521b3f509fe79e790418a544e8
   RNFS: 4ac0f0ea233904cb798630b3c077808c06931688
-  RNGestureHandler: 62232ba8f562f7dea5ba1b3383494eb5bf97a4d3
+  RNGestureHandler: dec4645026e7401a0899f2846d864403478ff6a5
   RNScreens: 34cc502acf1b916c582c60003dc3089fa01dc66d
   RNShare: eaee3dd5a06dad397c7d3b14762007035c5de405
   RNSVG: c1e76b81c76cdcd34b4e1188852892dc280eb902
diff --git a/packages/mobile/package.json b/packages/mobile/package.json
index eaed278441..22c8535d1b 100644
--- a/packages/mobile/package.json
+++ b/packages/mobile/package.json
@@ -132,7 +132,8 @@
   "jest": {
     "preset": "react-native",
     "modulePathIgnorePatterns": [
-      "<rootDir>/codegen/"
+      "<rootDir>/codegen/",
+      "__snapshots__"
     ],
     "setupFiles": [
       "./src/setupTests.tsx",
diff --git a/packages/mobile/src/components/CreateCommunity/CreateCommunity.component.tsx b/packages/mobile/src/components/CreateCommunity/CreateCommunity.component.tsx
index cac87fb4b9..0d42a2c11a 100644
--- a/packages/mobile/src/components/CreateCommunity/CreateCommunity.component.tsx
+++ b/packages/mobile/src/components/CreateCommunity/CreateCommunity.component.tsx
@@ -7,6 +7,7 @@ import { Typography } from '../Typography/Typography.component'
 import { TextWithLink } from '../TextWithLink/TextWithLink.component'
 
 import { CreateCommunityProps } from './CreateCommunity.types'
+import { Loading } from '../Loading/Loading.component'
 
 export const CreateCommunity: FC<CreateCommunityProps> = ({
   createCommunityAction,
@@ -46,46 +47,52 @@ export const CreateCommunity: FC<CreateCommunityProps> = ({
   }, [networkCreated])
 
   return (
-    <View
-      style={{ flex: 1, backgroundColor: defaultTheme.palette.background.white }}
-      testID={'create-community-component'}
-    >
-      <KeyboardAvoidingView
-        behavior='height'
-        style={{
-          flex: 1,
-          justifyContent: 'center',
-          paddingLeft: 20,
-          paddingRight: 20,
-        }}
-      >
-        <Typography fontSize={24} fontWeight={'medium'} style={{ marginBottom: 30 }}>
-          {'Create a community'}
-        </Typography>
-        <Input
-          onChangeText={onChangeText}
-          label={'Add a name for your community'}
-          placeholder={'Community name'}
-          disabled={loading || !ready}
-          validation={inputError}
-          ref={inputRef}
-        />
-        <View style={{ marginTop: 32 }}>
-          <TextWithLink
-            text={'You can %a instead'}
-            links={[
-              {
-                tag: 'a',
-                label: 'join a community',
-                action: redirectionAction,
-              },
-            ]}
-          />
+    <>
+      {ready ? (
+        <View
+          style={{ flex: 1, backgroundColor: defaultTheme.palette.background.white }}
+          testID={'create-community-component'}
+        >
+          <KeyboardAvoidingView
+            behavior='height'
+            style={{
+              flex: 1,
+              justifyContent: 'center',
+              paddingLeft: 20,
+              paddingRight: 20,
+            }}
+          >
+            <Typography fontSize={24} fontWeight={'medium'} style={{ marginBottom: 30 }}>
+              {'Create a community'}
+            </Typography>
+            <Input
+              onChangeText={onChangeText}
+              label={'Add a name for your community'}
+              placeholder={'Community name'}
+              disabled={loading}
+              validation={inputError}
+              ref={inputRef}
+            />
+            <View style={{ marginTop: 32 }}>
+              <TextWithLink
+                text={'You can %a instead'}
+                links={[
+                  {
+                    tag: 'a',
+                    label: 'join a community',
+                    action: redirectionAction,
+                  },
+                ]}
+              />
+            </View>
+            <View style={{ marginTop: 32 }}>
+              <Button onPress={onPress} title={'Continue'} loading={loading} />
+            </View>
+          </KeyboardAvoidingView>
         </View>
-        <View style={{ marginTop: 32 }}>
-          <Button onPress={onPress} title={'Continue'} loading={loading} />
-        </View>
-      </KeyboardAvoidingView>
-    </View>
+      ) : (
+        <Loading />
+      )}
+    </>
   )
 }
diff --git a/packages/mobile/src/components/CreateCommunity/CreateCommunity.test.tsx b/packages/mobile/src/components/CreateCommunity/CreateCommunity.test.tsx
deleted file mode 100644
index cbded4cb3f..0000000000
--- a/packages/mobile/src/components/CreateCommunity/CreateCommunity.test.tsx
+++ /dev/null
@@ -1,378 +0,0 @@
-import { renderComponent } from '../../utils/functions/renderComponent/renderComponent'
-import { CreateCommunity } from './CreateCommunity.component'
-
-describe('Spinner component', () => {
-  it('renders component', () => {
-    const { toJSON } = renderComponent(
-      <CreateCommunity createCommunityAction={jest.fn()} redirectionAction={jest.fn()} networkCreated={false} />
-    )
-    expect(toJSON()).toMatchInlineSnapshot(`
-      <View
-        style={
-          {
-            "backgroundColor": "#ffffff",
-            "flex": 1,
-          }
-        }
-        testID="create-community-component"
-      >
-        <View
-          onLayout={[Function]}
-          style={
-            {
-              "flex": 1,
-              "justifyContent": "center",
-              "paddingLeft": 20,
-              "paddingRight": 20,
-            }
-          }
-        >
-          <Text
-            color="main"
-            fontSize={24}
-            fontWeight="medium"
-            horizontalTextAlign="left"
-            style={
-              [
-                {
-                  "color": "#000000",
-                  "fontFamily": "Rubik-Medium",
-                  "fontSize": 24,
-                  "textAlign": "left",
-                  "textAlignVertical": "center",
-                },
-                {
-                  "marginBottom": 30,
-                },
-              ]
-            }
-            verticalTextAlign="center"
-          >
-            Create a community
-          </Text>
-          <View>
-            <Text
-              color="main"
-              fontSize={14}
-              horizontalTextAlign="left"
-              style={
-                [
-                  {
-                    "color": "#000000",
-                    "fontFamily": "Rubik-Regular",
-                    "fontSize": 14,
-                    "textAlign": "left",
-                    "textAlignVertical": "center",
-                  },
-                  {
-                    "color": "#4C4C4C",
-                    "paddingBottom": 10,
-                  },
-                ]
-              }
-              verticalTextAlign="center"
-            >
-              Add a name for your community
-            </Text>
-            <View
-              accessibilityState={
-                {
-                  "busy": undefined,
-                  "checked": undefined,
-                  "disabled": false,
-                  "expanded": undefined,
-                  "selected": undefined,
-                }
-              }
-              accessibilityValue={
-                {
-                  "max": undefined,
-                  "min": undefined,
-                  "now": undefined,
-                  "text": undefined,
-                }
-              }
-              accessible={true}
-              collapsable={false}
-              focusable={true}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onResponderGrant={[Function]}
-              onResponderMove={[Function]}
-              onResponderRelease={[Function]}
-              onResponderTerminate={[Function]}
-              onResponderTerminationRequest={[Function]}
-              onStartShouldSetResponder={[Function]}
-              style={
-                [
-                  {
-                    "backgroundColor": "#ffffff",
-                    "borderColor": "#B3B3B3",
-                    "borderRadius": 4,
-                    "borderWidth": 1,
-                    "flexGrow": 1,
-                    "height": 60,
-                    "justifyContent": "center",
-                    "paddingLeft": 15,
-                    "paddingRight": 15,
-                  },
-                ]
-              }
-            >
-              <TextInput
-                editable={true}
-                onChangeText={[Function]}
-                placeholder="Community name"
-                style={
-                  [
-                    {
-                      "paddingBottom": 12,
-                      "paddingTop": 12,
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                testID="input"
-              />
-            </View>
-          </View>
-          <View
-            style={
-              {
-                "marginTop": 32,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "flex-start",
-                  "display": "flex",
-                  "flex": 1,
-                  "flexDirection": "row",
-                  "flexWrap": "wrap",
-                  "minHeight": 500,
-                }
-              }
-            >
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                You
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                can
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                <Text
-                  color="link"
-                  fontSize={14}
-                  horizontalTextAlign="left"
-                  onPress={[Function]}
-                  style={
-                    [
-                      {
-                        "color": "#67BFD3",
-                        "fontFamily": "Rubik-Regular",
-                        "fontSize": 14,
-                        "textAlign": "left",
-                        "textAlignVertical": "center",
-                      },
-                    ]
-                  }
-                  verticalTextAlign="center"
-                >
-                  join a community
-                </Text>
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                instead
-              </Text>
-            </View>
-          </View>
-          <View
-            style={
-              {
-                "marginTop": 32,
-              }
-            }
-          >
-            <View
-              accessibilityState={
-                {
-                  "busy": undefined,
-                  "checked": undefined,
-                  "disabled": undefined,
-                  "expanded": undefined,
-                  "selected": undefined,
-                }
-              }
-              accessible={true}
-              focusable={true}
-              onClick={[Function]}
-              onResponderGrant={[Function]}
-              onResponderMove={[Function]}
-              onResponderRelease={[Function]}
-              onResponderTerminate={[Function]}
-              onResponderTerminationRequest={[Function]}
-              onStartShouldSetResponder={[Function]}
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#521C74",
-                  "borderRadius": 5,
-                  "justifyContent": "center",
-                  "marginVertical": 12,
-                  "minHeight": 45,
-                  "paddingVertical": 12,
-                  "width": undefined,
-                }
-              }
-              testID="button"
-            >
-              <Text
-                color="white"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#ffffff",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                Continue
-              </Text>
-            </View>
-          </View>
-        </View>
-      </View>
-    `)
-  })
-})
diff --git a/packages/mobile/src/components/CreateCommunity/__tests__/CreateCommunity.test.tsx b/packages/mobile/src/components/CreateCommunity/__tests__/CreateCommunity.test.tsx
new file mode 100644
index 0000000000..ec63074d33
--- /dev/null
+++ b/packages/mobile/src/components/CreateCommunity/__tests__/CreateCommunity.test.tsx
@@ -0,0 +1,23 @@
+import { renderComponent } from '../../../utils/functions/renderComponent/renderComponent'
+import { CreateCommunity } from '../CreateCommunity.component'
+
+describe('Spinner component', () => {
+  it('renders component', () => {
+    const { toJSON } = renderComponent(
+      <CreateCommunity createCommunityAction={jest.fn()} redirectionAction={jest.fn()} networkCreated={false} />
+    )
+    expect(toJSON()).toMatchSnapshot()
+  })
+
+  it('renders loading screen if not ready', () => {
+    const { toJSON } = renderComponent(
+      <CreateCommunity
+        createCommunityAction={jest.fn()}
+        redirectionAction={jest.fn()}
+        networkCreated={false}
+        ready={false}
+      />
+    )
+    expect(toJSON()).toMatchSnapshot()
+  })
+})
diff --git a/packages/mobile/src/components/CreateCommunity/__tests__/__snapshots__/CreateCommunity.test.tsx.snap b/packages/mobile/src/components/CreateCommunity/__tests__/__snapshots__/CreateCommunity.test.tsx.snap
new file mode 100644
index 0000000000..440ebbd134
--- /dev/null
+++ b/packages/mobile/src/components/CreateCommunity/__tests__/__snapshots__/CreateCommunity.test.tsx.snap
@@ -0,0 +1,477 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Spinner component renders component 1`] = `
+<View
+  style={
+    {
+      "backgroundColor": "#ffffff",
+      "flex": 1,
+    }
+  }
+  testID="create-community-component"
+>
+  <View
+    onLayout={[Function]}
+    style={
+      {
+        "flex": 1,
+        "justifyContent": "center",
+        "paddingLeft": 20,
+        "paddingRight": 20,
+      }
+    }
+  >
+    <Text
+      color="main"
+      fontSize={24}
+      fontWeight="medium"
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#000000",
+            "fontFamily": "Rubik-Medium",
+            "fontSize": 24,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+          {
+            "marginBottom": 30,
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      Create a community
+    </Text>
+    <View>
+      <Text
+        color="main"
+        fontSize={14}
+        horizontalTextAlign="left"
+        style={
+          [
+            {
+              "color": "#000000",
+              "fontFamily": "Rubik-Regular",
+              "fontSize": 14,
+              "textAlign": "left",
+              "textAlignVertical": "center",
+            },
+            {
+              "color": "#4C4C4C",
+              "paddingBottom": 10,
+            },
+          ]
+        }
+        verticalTextAlign="center"
+      >
+        Add a name for your community
+      </Text>
+      <View
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": false,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessibilityValue={
+          {
+            "max": undefined,
+            "min": undefined,
+            "now": undefined,
+            "text": undefined,
+          }
+        }
+        accessible={true}
+        collapsable={false}
+        focusable={true}
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
+        style={
+          [
+            {
+              "backgroundColor": "#ffffff",
+              "borderColor": "#B3B3B3",
+              "borderRadius": 4,
+              "borderWidth": 1,
+              "flexGrow": 1,
+              "height": 60,
+              "justifyContent": "center",
+              "paddingLeft": 15,
+              "paddingRight": 15,
+            },
+          ]
+        }
+      >
+        <TextInput
+          editable={true}
+          onChangeText={[Function]}
+          placeholder="Community name"
+          style={
+            [
+              {
+                "paddingBottom": 12,
+                "paddingTop": 12,
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          testID="input"
+        />
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "marginTop": 32,
+        }
+      }
+    >
+      <View
+        style={
+          {
+            "alignItems": "flex-start",
+            "display": "flex",
+            "flex": 1,
+            "flexDirection": "row",
+            "flexWrap": "wrap",
+            "minHeight": 500,
+          }
+        }
+      >
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          You
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          can
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          <Text
+            color="link"
+            fontSize={14}
+            horizontalTextAlign="left"
+            onPress={[Function]}
+            style={
+              [
+                {
+                  "color": "#67BFD3",
+                  "fontFamily": "Rubik-Regular",
+                  "fontSize": 14,
+                  "textAlign": "left",
+                  "textAlignVertical": "center",
+                },
+              ]
+            }
+            verticalTextAlign="center"
+          >
+            join a community
+          </Text>
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          instead
+        </Text>
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "marginTop": 32,
+        }
+      }
+    >
+      <View
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessible={true}
+        focusable={true}
+        onClick={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
+        style={
+          {
+            "alignItems": "center",
+            "backgroundColor": "#521C74",
+            "borderRadius": 5,
+            "justifyContent": "center",
+            "marginVertical": 12,
+            "minHeight": 45,
+            "paddingVertical": 12,
+            "width": undefined,
+          }
+        }
+        testID="button"
+      >
+        <Text
+          color="white"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#ffffff",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          Continue
+        </Text>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`Spinner component renders loading screen if not ready 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "backgroundColor": "#ffffff",
+      "flex": 1,
+      "justifyContent": "center",
+    }
+  }
+  testID="loading"
+>
+  <Image
+    source={
+      {
+        "testUri": "../../../assets/icons/quiet_icon.png",
+      }
+    }
+    style={
+      {
+        "borderRadius": 16,
+        "height": 84,
+        "marginBottom": 46,
+        "marginTop": 20,
+        "resizeMode": "cover",
+        "width": 84,
+      }
+    }
+  />
+  <View
+    style={
+      {
+        "alignItems": "center",
+        "gap": 6,
+      }
+    }
+  >
+    <Text
+      color="main"
+      fontSize={14}
+      fontWeight="medium"
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#000000",
+            "fontFamily": "Rubik-Medium",
+            "fontSize": 14,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      Starting backend
+    </Text>
+    <Text
+      color="gray50"
+      fontSize={12}
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#7F7F7F",
+            "fontFamily": "Rubik-Regular",
+            "fontSize": 12,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      This can take some time
+    </Text>
+  </View>
+  <View
+    style={
+      {
+        "margin": 20,
+      }
+    }
+  >
+    <Text
+      color="grayDark"
+      fontSize={12}
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#999999",
+            "fontFamily": "Rubik-Regular",
+            "fontSize": 12,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      v 1.0.0
+    </Text>
+  </View>
+</View>
+`;
diff --git a/packages/mobile/src/components/JoinCommunity/JoinCommunity.component.tsx b/packages/mobile/src/components/JoinCommunity/JoinCommunity.component.tsx
index 96dbf5f5fe..9fcd084dbd 100644
--- a/packages/mobile/src/components/JoinCommunity/JoinCommunity.component.tsx
+++ b/packages/mobile/src/components/JoinCommunity/JoinCommunity.component.tsx
@@ -10,6 +10,8 @@ import { JoinCommunityProps } from './JoinCommunity.types'
 import { getInvitationCodes } from '@quiet/state-manager'
 import { ONION_ADDRESS_REGEX } from '@quiet/common'
 
+import { Loading } from '../Loading/Loading.component'
+
 export const JoinCommunity: FC<JoinCommunityProps> = ({
   joinCommunityAction,
   redirectionAction,
@@ -65,46 +67,52 @@ export const JoinCommunity: FC<JoinCommunityProps> = ({
   }, [networkCreated])
 
   return (
-    <View
-      style={{ flex: 1, backgroundColor: defaultTheme.palette.background.white }}
-      testID={'join-community-component'}
-    >
-      <KeyboardAvoidingView
-        behavior='height'
-        style={{
-          flex: 1,
-          justifyContent: 'center',
-          paddingLeft: 20,
-          paddingRight: 20,
-        }}
-      >
-        <Typography fontSize={24} fontWeight={'medium'} style={{ marginBottom: 30 }}>
-          {'Join community'}
-        </Typography>
-        <Input
-          onChangeText={onChangeText}
-          label={'Paste your invite link to join an existing community'}
-          placeholder={'Invite link'}
-          disabled={loading || !ready}
-          validation={inputError}
-          ref={inputRef}
-        />
-        <View style={{ marginTop: 32 }}>
-          <TextWithLink
-            text={'You can %a instead'}
-            links={[
-              {
-                tag: 'a',
-                label: 'create a new community',
-                action: redirectionAction,
-              },
-            ]}
-          />
-        </View>
-        <View style={{ marginTop: 32 }}>
-          <Button onPress={onPress} title={'Continue'} loading={loading} />
+    <>
+      {ready ? (
+        <View
+          style={{ flex: 1, backgroundColor: defaultTheme.palette.background.white }}
+          testID={'join-community-component'}
+        >
+          <KeyboardAvoidingView
+            behavior='height'
+            style={{
+              flex: 1,
+              justifyContent: 'center',
+              paddingLeft: 20,
+              paddingRight: 20,
+            }}
+          >
+            <Typography fontSize={24} fontWeight={'medium'} style={{ marginBottom: 30 }}>
+              {'Join community'}
+            </Typography>
+            <Input
+              onChangeText={onChangeText}
+              label={'Paste your invite link to join an existing community'}
+              placeholder={'Invite link'}
+              disabled={loading}
+              validation={inputError}
+              ref={inputRef}
+            />
+            <View style={{ marginTop: 32 }}>
+              <TextWithLink
+                text={'You can %a instead'}
+                links={[
+                  {
+                    tag: 'a',
+                    label: 'create a new community',
+                    action: redirectionAction,
+                  },
+                ]}
+              />
+            </View>
+            <View style={{ marginTop: 32 }}>
+              <Button onPress={onPress} title={'Continue'} loading={loading} />
+            </View>
+          </KeyboardAvoidingView>
         </View>
-      </KeyboardAvoidingView>
-    </View>
+      ) : (
+        <Loading />
+      )}
+    </>
   )
 }
diff --git a/packages/mobile/src/components/JoinCommunity/JoinCommunity.test.tsx b/packages/mobile/src/components/JoinCommunity/JoinCommunity.test.tsx
deleted file mode 100644
index 3ec4d8031b..0000000000
--- a/packages/mobile/src/components/JoinCommunity/JoinCommunity.test.tsx
+++ /dev/null
@@ -1,378 +0,0 @@
-import { renderComponent } from '../../utils/functions/renderComponent/renderComponent'
-import { JoinCommunity } from './JoinCommunity.component'
-
-describe('JoinCommunity component', () => {
-  it('renders component', () => {
-    const { toJSON } = renderComponent(
-      <JoinCommunity joinCommunityAction={jest.fn()} redirectionAction={jest.fn()} networkCreated={false} />
-    )
-    expect(toJSON()).toMatchInlineSnapshot(`
-      <View
-        style={
-          {
-            "backgroundColor": "#ffffff",
-            "flex": 1,
-          }
-        }
-        testID="join-community-component"
-      >
-        <View
-          onLayout={[Function]}
-          style={
-            {
-              "flex": 1,
-              "justifyContent": "center",
-              "paddingLeft": 20,
-              "paddingRight": 20,
-            }
-          }
-        >
-          <Text
-            color="main"
-            fontSize={24}
-            fontWeight="medium"
-            horizontalTextAlign="left"
-            style={
-              [
-                {
-                  "color": "#000000",
-                  "fontFamily": "Rubik-Medium",
-                  "fontSize": 24,
-                  "textAlign": "left",
-                  "textAlignVertical": "center",
-                },
-                {
-                  "marginBottom": 30,
-                },
-              ]
-            }
-            verticalTextAlign="center"
-          >
-            Join community
-          </Text>
-          <View>
-            <Text
-              color="main"
-              fontSize={14}
-              horizontalTextAlign="left"
-              style={
-                [
-                  {
-                    "color": "#000000",
-                    "fontFamily": "Rubik-Regular",
-                    "fontSize": 14,
-                    "textAlign": "left",
-                    "textAlignVertical": "center",
-                  },
-                  {
-                    "color": "#4C4C4C",
-                    "paddingBottom": 10,
-                  },
-                ]
-              }
-              verticalTextAlign="center"
-            >
-              Paste your invite link to join an existing community
-            </Text>
-            <View
-              accessibilityState={
-                {
-                  "busy": undefined,
-                  "checked": undefined,
-                  "disabled": false,
-                  "expanded": undefined,
-                  "selected": undefined,
-                }
-              }
-              accessibilityValue={
-                {
-                  "max": undefined,
-                  "min": undefined,
-                  "now": undefined,
-                  "text": undefined,
-                }
-              }
-              accessible={true}
-              collapsable={false}
-              focusable={true}
-              onBlur={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onResponderGrant={[Function]}
-              onResponderMove={[Function]}
-              onResponderRelease={[Function]}
-              onResponderTerminate={[Function]}
-              onResponderTerminationRequest={[Function]}
-              onStartShouldSetResponder={[Function]}
-              style={
-                [
-                  {
-                    "backgroundColor": "#ffffff",
-                    "borderColor": "#B3B3B3",
-                    "borderRadius": 4,
-                    "borderWidth": 1,
-                    "flexGrow": 1,
-                    "height": 60,
-                    "justifyContent": "center",
-                    "paddingLeft": 15,
-                    "paddingRight": 15,
-                  },
-                ]
-              }
-            >
-              <TextInput
-                editable={true}
-                onChangeText={[Function]}
-                placeholder="Invite link"
-                style={
-                  [
-                    {
-                      "paddingBottom": 12,
-                      "paddingTop": 12,
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                testID="input"
-              />
-            </View>
-          </View>
-          <View
-            style={
-              {
-                "marginTop": 32,
-              }
-            }
-          >
-            <View
-              style={
-                {
-                  "alignItems": "flex-start",
-                  "display": "flex",
-                  "flex": 1,
-                  "flexDirection": "row",
-                  "flexWrap": "wrap",
-                  "minHeight": 500,
-                }
-              }
-            >
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                You
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                can
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                <Text
-                  color="link"
-                  fontSize={14}
-                  horizontalTextAlign="left"
-                  onPress={[Function]}
-                  style={
-                    [
-                      {
-                        "color": "#67BFD3",
-                        "fontFamily": "Rubik-Regular",
-                        "fontSize": 14,
-                        "textAlign": "left",
-                        "textAlignVertical": "center",
-                      },
-                    ]
-                  }
-                  verticalTextAlign="center"
-                >
-                  create a new community
-                </Text>
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                 
-              </Text>
-              <Text
-                color="main"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#000000",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                instead
-              </Text>
-            </View>
-          </View>
-          <View
-            style={
-              {
-                "marginTop": 32,
-              }
-            }
-          >
-            <View
-              accessibilityState={
-                {
-                  "busy": undefined,
-                  "checked": undefined,
-                  "disabled": undefined,
-                  "expanded": undefined,
-                  "selected": undefined,
-                }
-              }
-              accessible={true}
-              focusable={true}
-              onClick={[Function]}
-              onResponderGrant={[Function]}
-              onResponderMove={[Function]}
-              onResponderRelease={[Function]}
-              onResponderTerminate={[Function]}
-              onResponderTerminationRequest={[Function]}
-              onStartShouldSetResponder={[Function]}
-              style={
-                {
-                  "alignItems": "center",
-                  "backgroundColor": "#521C74",
-                  "borderRadius": 5,
-                  "justifyContent": "center",
-                  "marginVertical": 12,
-                  "minHeight": 45,
-                  "paddingVertical": 12,
-                  "width": undefined,
-                }
-              }
-              testID="button"
-            >
-              <Text
-                color="white"
-                fontSize={14}
-                horizontalTextAlign="left"
-                style={
-                  [
-                    {
-                      "color": "#ffffff",
-                      "fontFamily": "Rubik-Regular",
-                      "fontSize": 14,
-                      "textAlign": "left",
-                      "textAlignVertical": "center",
-                    },
-                  ]
-                }
-                verticalTextAlign="center"
-              >
-                Continue
-              </Text>
-            </View>
-          </View>
-        </View>
-      </View>
-    `)
-  })
-})
diff --git a/packages/mobile/src/components/JoinCommunity/__tests__/JoinCommunity.test.tsx b/packages/mobile/src/components/JoinCommunity/__tests__/JoinCommunity.test.tsx
new file mode 100644
index 0000000000..48de71b442
--- /dev/null
+++ b/packages/mobile/src/components/JoinCommunity/__tests__/JoinCommunity.test.tsx
@@ -0,0 +1,23 @@
+import { renderComponent } from '../../../utils/functions/renderComponent/renderComponent'
+import { JoinCommunity } from '../JoinCommunity.component'
+
+describe('JoinCommunity component', () => {
+  it('renders component', () => {
+    const { toJSON } = renderComponent(
+      <JoinCommunity joinCommunityAction={jest.fn()} redirectionAction={jest.fn()} networkCreated={false} />
+    )
+    expect(toJSON()).toMatchSnapshot()
+  })
+
+  it('renders loading screen if not ready', () => {
+    const { toJSON } = renderComponent(
+      <JoinCommunity
+        joinCommunityAction={jest.fn()}
+        redirectionAction={jest.fn()}
+        networkCreated={false}
+        ready={false}
+      />
+    )
+    expect(toJSON()).toMatchSnapshot()
+  })
+})
diff --git a/packages/mobile/src/components/JoinCommunity/__tests__/__snapshots__/JoinCommunity.test.tsx.snap b/packages/mobile/src/components/JoinCommunity/__tests__/__snapshots__/JoinCommunity.test.tsx.snap
new file mode 100644
index 0000000000..8a83be2f7e
--- /dev/null
+++ b/packages/mobile/src/components/JoinCommunity/__tests__/__snapshots__/JoinCommunity.test.tsx.snap
@@ -0,0 +1,477 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`JoinCommunity component renders component 1`] = `
+<View
+  style={
+    {
+      "backgroundColor": "#ffffff",
+      "flex": 1,
+    }
+  }
+  testID="join-community-component"
+>
+  <View
+    onLayout={[Function]}
+    style={
+      {
+        "flex": 1,
+        "justifyContent": "center",
+        "paddingLeft": 20,
+        "paddingRight": 20,
+      }
+    }
+  >
+    <Text
+      color="main"
+      fontSize={24}
+      fontWeight="medium"
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#000000",
+            "fontFamily": "Rubik-Medium",
+            "fontSize": 24,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+          {
+            "marginBottom": 30,
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      Join community
+    </Text>
+    <View>
+      <Text
+        color="main"
+        fontSize={14}
+        horizontalTextAlign="left"
+        style={
+          [
+            {
+              "color": "#000000",
+              "fontFamily": "Rubik-Regular",
+              "fontSize": 14,
+              "textAlign": "left",
+              "textAlignVertical": "center",
+            },
+            {
+              "color": "#4C4C4C",
+              "paddingBottom": 10,
+            },
+          ]
+        }
+        verticalTextAlign="center"
+      >
+        Paste your invite link to join an existing community
+      </Text>
+      <View
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": false,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessibilityValue={
+          {
+            "max": undefined,
+            "min": undefined,
+            "now": undefined,
+            "text": undefined,
+          }
+        }
+        accessible={true}
+        collapsable={false}
+        focusable={true}
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
+        style={
+          [
+            {
+              "backgroundColor": "#ffffff",
+              "borderColor": "#B3B3B3",
+              "borderRadius": 4,
+              "borderWidth": 1,
+              "flexGrow": 1,
+              "height": 60,
+              "justifyContent": "center",
+              "paddingLeft": 15,
+              "paddingRight": 15,
+            },
+          ]
+        }
+      >
+        <TextInput
+          editable={true}
+          onChangeText={[Function]}
+          placeholder="Invite link"
+          style={
+            [
+              {
+                "paddingBottom": 12,
+                "paddingTop": 12,
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          testID="input"
+        />
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "marginTop": 32,
+        }
+      }
+    >
+      <View
+        style={
+          {
+            "alignItems": "flex-start",
+            "display": "flex",
+            "flex": 1,
+            "flexDirection": "row",
+            "flexWrap": "wrap",
+            "minHeight": 500,
+          }
+        }
+      >
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          You
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          can
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          <Text
+            color="link"
+            fontSize={14}
+            horizontalTextAlign="left"
+            onPress={[Function]}
+            style={
+              [
+                {
+                  "color": "#67BFD3",
+                  "fontFamily": "Rubik-Regular",
+                  "fontSize": 14,
+                  "textAlign": "left",
+                  "textAlignVertical": "center",
+                },
+              ]
+            }
+            verticalTextAlign="center"
+          >
+            create a new community
+          </Text>
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+           
+        </Text>
+        <Text
+          color="main"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#000000",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          instead
+        </Text>
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "marginTop": 32,
+        }
+      }
+    >
+      <View
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessible={true}
+        focusable={true}
+        onClick={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
+        style={
+          {
+            "alignItems": "center",
+            "backgroundColor": "#521C74",
+            "borderRadius": 5,
+            "justifyContent": "center",
+            "marginVertical": 12,
+            "minHeight": 45,
+            "paddingVertical": 12,
+            "width": undefined,
+          }
+        }
+        testID="button"
+      >
+        <Text
+          color="white"
+          fontSize={14}
+          horizontalTextAlign="left"
+          style={
+            [
+              {
+                "color": "#ffffff",
+                "fontFamily": "Rubik-Regular",
+                "fontSize": 14,
+                "textAlign": "left",
+                "textAlignVertical": "center",
+              },
+            ]
+          }
+          verticalTextAlign="center"
+        >
+          Continue
+        </Text>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`JoinCommunity component renders loading screen if not ready 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "backgroundColor": "#ffffff",
+      "flex": 1,
+      "justifyContent": "center",
+    }
+  }
+  testID="loading"
+>
+  <Image
+    source={
+      {
+        "testUri": "../../../assets/icons/quiet_icon.png",
+      }
+    }
+    style={
+      {
+        "borderRadius": 16,
+        "height": 84,
+        "marginBottom": 46,
+        "marginTop": 20,
+        "resizeMode": "cover",
+        "width": 84,
+      }
+    }
+  />
+  <View
+    style={
+      {
+        "alignItems": "center",
+        "gap": 6,
+      }
+    }
+  >
+    <Text
+      color="main"
+      fontSize={14}
+      fontWeight="medium"
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#000000",
+            "fontFamily": "Rubik-Medium",
+            "fontSize": 14,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      Starting backend
+    </Text>
+    <Text
+      color="gray50"
+      fontSize={12}
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#7F7F7F",
+            "fontFamily": "Rubik-Regular",
+            "fontSize": 12,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      This can take some time
+    </Text>
+  </View>
+  <View
+    style={
+      {
+        "margin": 20,
+      }
+    }
+  >
+    <Text
+      color="grayDark"
+      fontSize={12}
+      horizontalTextAlign="left"
+      style={
+        [
+          {
+            "color": "#999999",
+            "fontFamily": "Rubik-Regular",
+            "fontSize": 12,
+            "textAlign": "left",
+            "textAlignVertical": "center",
+          },
+        ]
+      }
+      verticalTextAlign="center"
+    >
+      v 1.0.0
+    </Text>
+  </View>
+</View>
+`;
diff --git a/packages/mobile/src/components/Loading/Loading.component.tsx b/packages/mobile/src/components/Loading/Loading.component.tsx
index df5837d84f..0c2a6f957a 100644
--- a/packages/mobile/src/components/Loading/Loading.component.tsx
+++ b/packages/mobile/src/components/Loading/Loading.component.tsx
@@ -1,15 +1,11 @@
 import React, { FC } from 'react'
 import { Image, View } from 'react-native'
 import deviceInfoModule from 'react-native-device-info'
-import * as Progress from 'react-native-progress'
-import { appImages } from '../../assets'
-import { defaultTheme } from '../../styles/themes/default.theme'
-import { InitCheck } from '../InitCheck/InitCheck.component'
 import { Typography } from '../Typography/Typography.component'
+import { defaultTheme } from '../../styles/themes/default.theme'
+import { appImages } from '../../assets'
 
-import { LoadingProps } from './Loading.types'
-
-export const Loading: FC<LoadingProps> = ({ progress, description, checks }) => {
+export const Loading: FC = () => {
   return (
     <View
       style={{
@@ -18,28 +14,26 @@ export const Loading: FC<LoadingProps> = ({ progress, description, checks }) =>
         justifyContent: 'center',
         backgroundColor: defaultTheme.palette.background.white,
       }}
+      testID='loading'
     >
       <Image
-        source={appImages.quiet_icon_round}
+        source={appImages.quiet_icon}
         style={{
-          margin: 20,
+          marginTop: 20,
+          marginBottom: 46,
           resizeMode: 'cover',
           width: 84,
           height: 84,
+          borderRadius: 16,
         }}
       />
-      <Typography fontSize={14} horizontalTextAlign={'center'} style={{ margin: 10, maxWidth: 200 }}>
-        {description}
-      </Typography>
-      <View>
-        {progress > 0 && progress < 0.95 && (
-          <Progress.Bar progress={progress} color={defaultTheme.palette.main.brand} />
-        )}
-      </View>
-      <View style={{ marginTop: 40, alignItems: 'flex-start' }}>
-        {checks?.map(item => (
-          <InitCheck key={item.event} event={item.event} passed={item.passed} />
-        ))}
+      <View style={{ gap: 6, alignItems: 'center' }}>
+        <Typography fontSize={14} fontWeight={'medium'}>
+          Starting backend
+        </Typography>
+        <Typography fontSize={12} color={'gray50'}>
+          This can take some time
+        </Typography>
       </View>
       <View style={{ margin: 20 }}>
         <Typography fontSize={12} color={'grayDark'}>
diff --git a/packages/mobile/src/components/Loading/Loading.stories.tsx b/packages/mobile/src/components/Loading/Loading.stories.tsx
index eacb545fbe..d148245de0 100644
--- a/packages/mobile/src/components/Loading/Loading.stories.tsx
+++ b/packages/mobile/src/components/Loading/Loading.stories.tsx
@@ -3,34 +3,4 @@ import React from 'react'
 
 import { Loading } from './Loading.component'
 
-storiesOf('Loading', module)
-  .add('Default', () => (
-    <Loading
-      progress={0.3}
-      description={'Downloading tools to protect your privacy'}
-      checks={[
-        {
-          event: 'native services started',
-          passed: true,
-        },
-        {
-          event: 'tor connected',
-          passed: true,
-        },
-        {
-          event: 'onion address added',
-          passed: false,
-        },
-        {
-          event: 'backend started',
-          passed: false,
-        },
-        {
-          event: 'websocket connected',
-          passed: false,
-        },
-      ]}
-    />
-  ))
-  .add('0', () => <Loading progress={0} description={'Downloading tools to protect your privacy'} />)
-  .add('99', () => <Loading progress={1} description={'Downloading tools to protect your privacy'} />)
+storiesOf('Loading', module).add('Default', () => <Loading />)
diff --git a/packages/mobile/src/components/Loading/Loading.types.ts b/packages/mobile/src/components/Loading/Loading.types.ts
deleted file mode 100644
index d62dd383de..0000000000
--- a/packages/mobile/src/components/Loading/Loading.types.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { InitCheck } from '../../store/init/init.types'
-
-export interface LoadingProps {
-  progress: number
-  description: string
-  checks?: InitCheck[]
-}
diff --git a/packages/mobile/src/screens/Splash/Splash.screen.tsx b/packages/mobile/src/screens/Splash/Splash.screen.tsx
index 6d59fc4656..94b97b11cf 100644
--- a/packages/mobile/src/screens/Splash/Splash.screen.tsx
+++ b/packages/mobile/src/screens/Splash/Splash.screen.tsx
@@ -1,6 +1,5 @@
 import React, { FC, useEffect } from 'react'
-import { useDispatch, useSelector } from 'react-redux'
-import { initSelectors } from '../../store/init/init.selectors'
+import { useDispatch } from 'react-redux'
 import { initActions } from '../../store/init/init.slice'
 import { SplashScreenProps } from './Splash.types'
 import { Loading } from '../../components/Loading/Loading.component'
@@ -8,9 +7,6 @@ import { Loading } from '../../components/Loading/Loading.component'
 export const SplashScreen: FC<SplashScreenProps> = ({ route }) => {
   const dispatch = useDispatch()
 
-  const hint = useSelector(initSelectors.initDescription)
-  const checks = useSelector(initSelectors.initChecks)
-
   useEffect(() => {
     const code = route.params?.code
 
@@ -20,5 +16,5 @@ export const SplashScreen: FC<SplashScreenProps> = ({ route }) => {
     dispatch(initActions.deepLink(code))
   }, [route.params?.code])
 
-  return <Loading progress={0} description={hint} checks={checks} />
+  return <Loading />
 }
diff --git a/packages/mobile/src/setupTests.tsx b/packages/mobile/src/setupTests.tsx
index 078950a186..ccdc73625a 100644
--- a/packages/mobile/src/setupTests.tsx
+++ b/packages/mobile/src/setupTests.tsx
@@ -62,6 +62,12 @@ jest.mock('socket.io-client', () => ({
 // could not be found. Verify that a module by this name is registered in the native binary."
 jest.mock('react-native-document-picker', () => { })
 
+jest.mock('react-native-device-info', () => {
+  return {
+    getVersion: () => { return '1.0.0' }
+  }
+})
+
 jest.mock('react-native-safe-area-context', () => ({
   useSafeAreaInsets: () => {
     return {
diff --git a/packages/mobile/tsconfig.build.json b/packages/mobile/tsconfig.build.json
index 53628a6236..b7bf574ed6 100644
--- a/packages/mobile/tsconfig.build.json
+++ b/packages/mobile/tsconfig.build.json
@@ -18,8 +18,7 @@
     "index.d.ts"
   ],
   "exclude": [
-    "node_modules",
-    "**/__tests__/*"
+    "node_modules"
   ]
 }
   
\ No newline at end of file
diff --git a/packages/mobile/tsconfig.json b/packages/mobile/tsconfig.json
index 6fa238aae0..db81ee655e 100644
--- a/packages/mobile/tsconfig.json
+++ b/packages/mobile/tsconfig.json
@@ -19,6 +19,5 @@
   ],
   "exclude": [
     "node_modules",
-    "**/__tests__/*"
   ]
 }