diff --git a/src/view/com/composer/Autocomplete.tsx b/src/view/com/composer/Autocomplete/Autocomplete.tsx
similarity index 91%
rename from src/view/com/composer/Autocomplete.tsx
rename to src/view/com/composer/Autocomplete/Autocomplete.tsx
index 3d71db635d..eb493d06a7 100644
--- a/src/view/com/composer/Autocomplete.tsx
+++ b/src/view/com/composer/Autocomplete/Autocomplete.tsx
@@ -6,15 +6,15 @@ import {
StyleSheet,
useWindowDimensions,
} from 'react-native'
-import {useAnimatedValue} from '../../lib/useAnimatedValue'
-import {colors} from '../../lib/styles'
+import {useAnimatedValue} from '../../../lib/useAnimatedValue'
+import {colors} from '../../../lib/styles'
interface AutocompleteItem {
handle: string
displayName?: string
}
-export function Autocomplete({
+export default function Autocomplete({
active,
items,
onSelect,
diff --git a/src/view/com/composer/Autocomplete/index.tsx b/src/view/com/composer/Autocomplete/index.tsx
new file mode 100644
index 0000000000..6aa5af5a28
--- /dev/null
+++ b/src/view/com/composer/Autocomplete/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Autocomplete = register({
+ loader: () => import('./Autocomplete'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/composer/ComposePost.tsx b/src/view/com/composer/ComposePost/ComposePost.tsx
similarity index 92%
rename from src/view/com/composer/ComposePost.tsx
rename to src/view/com/composer/ComposePost/ComposePost.tsx
index fb21b9f9dc..77d812f100 100644
--- a/src/view/com/composer/ComposePost.tsx
+++ b/src/view/com/composer/ComposePost/ComposePost.tsx
@@ -12,29 +12,29 @@ import {
} from 'react-native'
import LinearGradient from 'react-native-linear-gradient'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {UserAutocompleteViewModel} from '../../../state/models/user-autocomplete-view'
-import {Autocomplete} from './Autocomplete'
-import * as Toast from '../util/Toast'
+import {UserAutocompleteViewModel} from '../../../../state/models/user-autocomplete-view'
+import {Autocomplete} from '../Autocomplete'
+import * as Toast from '../../util/Toast'
// @ts-ignore no type definition -prf
import ProgressCircle from 'react-native-progress/Circle'
// @ts-ignore no type definition -prf
import ProgressPie from 'react-native-progress/Pie'
-import {TextLink} from '../util/Link'
-import {UserAvatar} from '../util/UserAvatar'
-import {useStores} from '../../../state'
-import * as apilib from '../../../state/lib/api'
-import {ComposerOpts} from '../../../state/models/shell-ui'
-import {s, colors, gradients} from '../../lib/styles'
-import {detectLinkables} from '../../../lib/strings'
-import {UserLocalPhotosModel} from '../../../state/models/user-local-photos'
-import {PhotoCarouselPicker} from './PhotoCarouselPicker'
-import {SelectedPhoto} from './SelectedPhoto'
-import {IMAGES_ENABLED} from '../../../build-flags'
+import {TextLink} from '../../util/Link'
+import {UserAvatar} from '../../util/UserAvatar'
+import {useStores} from '../../../../state'
+import * as apilib from '../../../../state/lib/api'
+import {ComposerOpts} from '../../../../state/models/shell-ui'
+import {s, colors, gradients} from '../../../lib/styles'
+import {detectLinkables} from '../../../../lib/strings'
+import {UserLocalPhotosModel} from '../../../../state/models/user-local-photos'
+import {PhotoCarouselPicker} from '../PhotoCarouselPicker'
+import {SelectedPhoto} from '../SelectedPhoto'
+import {IMAGES_ENABLED} from '../../../../build-flags'
const MAX_TEXT_LENGTH = 256
const DANGER_TEXT_LENGTH = MAX_TEXT_LENGTH
-export const ComposePost = observer(function ComposePost({
+export default observer(function ComposePost({
replyTo,
onPost,
onClose,
diff --git a/src/view/com/composer/ComposePost/index.tsx b/src/view/com/composer/ComposePost/index.tsx
new file mode 100644
index 0000000000..9be8e27fab
--- /dev/null
+++ b/src/view/com/composer/ComposePost/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ComposePost = register({
+ loader: () => import('./ComposePost'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker/PhotoCarouselPicker.tsx
similarity index 97%
rename from src/view/com/composer/PhotoCarouselPicker.tsx
rename to src/view/com/composer/PhotoCarouselPicker/PhotoCarouselPicker.tsx
index f4af4c61e3..76d6198e9e 100644
--- a/src/view/com/composer/PhotoCarouselPicker.tsx
+++ b/src/view/com/composer/PhotoCarouselPicker/PhotoCarouselPicker.tsx
@@ -1,14 +1,14 @@
import React, {useCallback} from 'react'
import {Image, StyleSheet, TouchableOpacity, ScrollView} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {colors} from '../../lib/styles'
+import {colors} from '../../../lib/styles'
import {
openPicker,
openCamera,
openCropper,
} from 'react-native-image-crop-picker'
-export const PhotoCarouselPicker = ({
+export default ({
selectedPhotos,
setSelectedPhotos,
localPhotos,
diff --git a/src/view/com/composer/PhotoCarouselPicker/index.tsx b/src/view/com/composer/PhotoCarouselPicker/index.tsx
new file mode 100644
index 0000000000..915b0910b9
--- /dev/null
+++ b/src/view/com/composer/PhotoCarouselPicker/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PhotoCarouselPicker = register({
+ loader: () => import('./PhotoCarouselPicker'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/composer/Prompt.tsx b/src/view/com/composer/Prompt/ComposePrompt.tsx
similarity index 90%
rename from src/view/com/composer/Prompt.tsx
rename to src/view/com/composer/Prompt/ComposePrompt.tsx
index 55730dc70a..bb411a127b 100644
--- a/src/view/com/composer/Prompt.tsx
+++ b/src/view/com/composer/Prompt/ComposePrompt.tsx
@@ -1,10 +1,10 @@
import React from 'react'
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
-import {colors} from '../../lib/styles'
-import {useStores} from '../../../state'
-import {UserAvatar} from '../util/UserAvatar'
+import {colors} from '../../../lib/styles'
+import {useStores} from '../../../../state'
+import {UserAvatar} from '../../util/UserAvatar'
-export function ComposePrompt({
+export default function ComposePrompt({
noAvi = false,
text = "What's up?",
btn = 'Post',
diff --git a/src/view/com/composer/Prompt/index.tsx b/src/view/com/composer/Prompt/index.tsx
new file mode 100644
index 0000000000..5eec6f9d0f
--- /dev/null
+++ b/src/view/com/composer/Prompt/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ComposePrompt = register({
+ loader: () => import('./ComposePrompt'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/composer/SelectedPhoto.tsx b/src/view/com/composer/SelectedPhoto/SelectedPhoto.tsx
similarity index 96%
rename from src/view/com/composer/SelectedPhoto.tsx
rename to src/view/com/composer/SelectedPhoto/SelectedPhoto.tsx
index 88209b3df6..55eea9f31e 100644
--- a/src/view/com/composer/SelectedPhoto.tsx
+++ b/src/view/com/composer/SelectedPhoto/SelectedPhoto.tsx
@@ -1,9 +1,9 @@
import React, {useCallback} from 'react'
import {Image, StyleSheet, TouchableOpacity, View} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {colors} from '../../lib/styles'
+import {colors} from '../../../lib/styles'
-export const SelectedPhoto = ({
+export default ({
selectedPhotos,
setSelectedPhotos,
}: {
diff --git a/src/view/com/composer/SelectedPhoto/index.tsx b/src/view/com/composer/SelectedPhoto/index.tsx
new file mode 100644
index 0000000000..f742d8cfa1
--- /dev/null
+++ b/src/view/com/composer/SelectedPhoto/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const SelectedPhoto = register({
+ loader: () => import('./SelectedPhoto'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/discover/SuggestedFollows.tsx b/src/view/com/discover/SuggestedFollows/SuggestedFollows.tsx
similarity index 93%
rename from src/view/com/discover/SuggestedFollows.tsx
rename to src/view/com/discover/SuggestedFollows/SuggestedFollows.tsx
index 315249159e..470171e8a6 100644
--- a/src/view/com/discover/SuggestedFollows.tsx
+++ b/src/view/com/discover/SuggestedFollows/SuggestedFollows.tsx
@@ -11,19 +11,19 @@ import LinearGradient from 'react-native-linear-gradient'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {observer} from 'mobx-react-lite'
import _omit from 'lodash.omit'
-import {ErrorScreen} from '../util/ErrorScreen'
-import {Link} from '../util/Link'
-import {UserAvatar} from '../util/UserAvatar'
-import * as Toast from '../util/Toast'
-import {useStores} from '../../../state'
-import * as apilib from '../../../state/lib/api'
+import {ErrorScreen} from '../../util/ErrorScreen'
+import {Link} from '../../util/Link'
+import {UserAvatar} from '../../util/UserAvatar'
+import * as Toast from '../../util/Toast'
+import {useStores} from '../../../../state'
+import * as apilib from '../../../../state/lib/api'
import {
SuggestedActorsViewModel,
SuggestedActor,
-} from '../../../state/models/suggested-actors-view'
-import {s, colors, gradients} from '../../lib/styles'
+} from '../../../../state/models/suggested-actors-view'
+import {s, colors, gradients} from '../../../lib/styles'
-export const SuggestedFollows = observer(
+export default observer(
({
onNoSuggestions,
asLinks,
diff --git a/src/view/com/discover/SuggestedFollows/index.tsx b/src/view/com/discover/SuggestedFollows/index.tsx
new file mode 100644
index 0000000000..ebd4d723d7
--- /dev/null
+++ b/src/view/com/discover/SuggestedFollows/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const SuggestedFollows = register({
+ loader: () => import('./SuggestedFollows'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/notifications/Feed.tsx b/src/view/com/notifications/Feed/Feed.tsx
similarity index 84%
rename from src/view/com/notifications/Feed.tsx
rename to src/view/com/notifications/Feed/Feed.tsx
index a6af0f88ac..406224d460 100644
--- a/src/view/com/notifications/Feed.tsx
+++ b/src/view/com/notifications/Feed/Feed.tsx
@@ -1,15 +1,15 @@
import React from 'react'
import {observer} from 'mobx-react-lite'
import {View, FlatList} from 'react-native'
-import {NotificationsViewModel} from '../../../state/models/notifications-view'
-import {FeedItem} from './FeedItem'
-import {NotificationFeedLoadingPlaceholder} from '../util/LoadingPlaceholder'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {EmptyState} from '../util/EmptyState'
+import {NotificationsViewModel} from '../../../../state/models/notifications-view'
+import {FeedItem} from '../FeedItem'
+import {NotificationFeedLoadingPlaceholder} from '../../util/LoadingPlaceholder'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {EmptyState} from '../../util/EmptyState'
const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
-export const Feed = observer(function Feed({
+export default observer(function Feed({
view,
onPressTryAgain,
}: {
diff --git a/src/view/com/notifications/Feed/index.tsx b/src/view/com/notifications/Feed/index.tsx
new file mode 100644
index 0000000000..eb28cab301
--- /dev/null
+++ b/src/view/com/notifications/Feed/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Feed = register({
+ loader: () => import('./Feed'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/notifications/FeedItem.tsx b/src/view/com/notifications/FeedItem/FeedItem.tsx
similarity index 91%
rename from src/view/com/notifications/FeedItem.tsx
rename to src/view/com/notifications/FeedItem/FeedItem.tsx
index c61159c726..209c7c0a20 100644
--- a/src/view/com/notifications/FeedItem.tsx
+++ b/src/view/com/notifications/FeedItem/FeedItem.tsx
@@ -1,22 +1,22 @@
import React, {useMemo} from 'react'
import {observer} from 'mobx-react-lite'
import {StyleSheet, Text, View} from 'react-native'
-import {AtUri} from '../../../third-party/uri'
+import {AtUri} from '../../../../third-party/uri'
import {FontAwesomeIcon, Props} from '@fortawesome/react-native-fontawesome'
-import {NotificationsViewItemModel} from '../../../state/models/notifications-view'
-import {PostThreadViewModel} from '../../../state/models/post-thread-view'
-import {s, colors} from '../../lib/styles'
-import {ago, pluralize} from '../../../lib/strings'
-import {UpIconSolid} from '../../lib/icons'
-import {UserAvatar} from '../util/UserAvatar'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {Post} from '../post/Post'
-import {Link} from '../util/Link'
-import {InviteAccepter} from './InviteAccepter'
+import {NotificationsViewItemModel} from '../../../../state/models/notifications-view'
+import {PostThreadViewModel} from '../../../../state/models/post-thread-view'
+import {s, colors} from '../../../lib/styles'
+import {ago, pluralize} from '../../../../lib/strings'
+import {UpIconSolid} from '../../../lib/icons'
+import {UserAvatar} from '../../util/UserAvatar'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {Post} from '../../post/Post'
+import {Link} from '../../util/Link'
+import {InviteAccepter} from '../InviteAccepter'
const MAX_AUTHORS = 8
-export const FeedItem = observer(function FeedItem({
+export default observer(function FeedItem({
item,
}: {
item: NotificationsViewItemModel
diff --git a/src/view/com/notifications/FeedItem/index.tsx b/src/view/com/notifications/FeedItem/index.tsx
new file mode 100644
index 0000000000..3bea471a19
--- /dev/null
+++ b/src/view/com/notifications/FeedItem/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const FeedItem = register({
+ loader: () => import('./FeedItem'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/notifications/InviteAccepter.tsx b/src/view/com/notifications/InviteAccepter/InviteAccepter.tsx
similarity index 83%
rename from src/view/com/notifications/InviteAccepter.tsx
rename to src/view/com/notifications/InviteAccepter/InviteAccepter.tsx
index 8527440067..dafe58e444 100644
--- a/src/view/com/notifications/InviteAccepter.tsx
+++ b/src/view/com/notifications/InviteAccepter/InviteAccepter.tsx
@@ -2,15 +2,19 @@ import React, {useState} from 'react'
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
import LinearGradient from 'react-native-linear-gradient'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import * as apilib from '../../../state/lib/api'
-import {NotificationsViewItemModel} from '../../../state/models/notifications-view'
-import {ConfirmModel} from '../../../state/models/shell-ui'
-import {useStores} from '../../../state'
-import {ProfileCard} from '../profile/ProfileCard'
-import * as Toast from '../util/Toast'
-import {s, colors, gradients} from '../../lib/styles'
+import * as apilib from '../../../../state/lib/api'
+import {NotificationsViewItemModel} from '../../../../state/models/notifications-view'
+import {ConfirmModel} from '../../../../state/models/shell-ui'
+import {useStores} from '../../../../state'
+import {ProfileCard} from '../../profile/ProfileCard'
+import * as Toast from '../../util/Toast'
+import {s, colors, gradients} from '../../../lib/styles'
-export function InviteAccepter({item}: {item: NotificationsViewItemModel}) {
+export default function InviteAccepter({
+ item,
+}: {
+ item: NotificationsViewItemModel
+}) {
const store = useStores()
const [confirmationUri, setConfirmationUri] = useState('')
const isMember =
diff --git a/src/view/com/notifications/InviteAccepter/index.tsx b/src/view/com/notifications/InviteAccepter/index.tsx
new file mode 100644
index 0000000000..2631ba26e7
--- /dev/null
+++ b/src/view/com/notifications/InviteAccepter/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const InviteAccepter = register({
+ loader: () => import('./InviteAccepter'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/onboard/FeatureExplainer.tsx b/src/view/com/onboard/FeatureExplainer/FeatureExplainer.tsx
similarity index 94%
rename from src/view/com/onboard/FeatureExplainer.tsx
rename to src/view/com/onboard/FeatureExplainer/FeatureExplainer.tsx
index d9f70cf4fb..07ee37f786 100644
--- a/src/view/com/onboard/FeatureExplainer.tsx
+++ b/src/view/com/onboard/FeatureExplainer/FeatureExplainer.tsx
@@ -11,11 +11,11 @@ import {
} from 'react-native'
import {TabView, SceneMap, Route, TabBarProps} from 'react-native-tab-view'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {UserGroupIcon} from '../../lib/icons'
-import {useStores} from '../../../state'
-import {s} from '../../lib/styles'
-import {SCENE_EXPLAINER, TABS_EXPLAINER} from '../../lib/assets'
-import {TABS_ENABLED} from '../../../build-flags'
+import {UserGroupIcon} from '../../../lib/icons'
+import {useStores} from '../../../../state'
+import {s} from '../../../lib/styles'
+import {SCENE_EXPLAINER, TABS_EXPLAINER} from '../../../lib/assets'
+import {TABS_ENABLED} from '../../../../build-flags'
const Intro = () => (
@@ -79,7 +79,7 @@ const SCENE_MAP = {
}
const renderScene = SceneMap(SCENE_MAP)
-export const FeatureExplainer = () => {
+export default () => {
const layout = useWindowDimensions()
const store = useStores()
const [index, setIndex] = useState(0)
diff --git a/src/view/com/onboard/FeatureExplainer/index.tsx b/src/view/com/onboard/FeatureExplainer/index.tsx
new file mode 100644
index 0000000000..fe4868a5ef
--- /dev/null
+++ b/src/view/com/onboard/FeatureExplainer/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const FeatureExplainer = register({
+ loader: () => import('./FeatureExplainer'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/onboard/Follows.tsx b/src/view/com/onboard/Follows/Follows.tsx
similarity index 86%
rename from src/view/com/onboard/Follows.tsx
rename to src/view/com/onboard/Follows/Follows.tsx
index ab65cd45dd..81ac89eaea 100644
--- a/src/view/com/onboard/Follows.tsx
+++ b/src/view/com/onboard/Follows/Follows.tsx
@@ -7,11 +7,11 @@ import {
View,
} from 'react-native'
import {observer} from 'mobx-react-lite'
-import {SuggestedFollows} from '../discover/SuggestedFollows'
-import {useStores} from '../../../state'
-import {s} from '../../lib/styles'
+import {SuggestedFollows} from '../../discover/SuggestedFollows'
+import {useStores} from '../../../../state'
+import {s} from '../../../lib/styles'
-export const Follows = observer(() => {
+export default observer(() => {
const store = useStores()
const onNoSuggestions = () => {
diff --git a/src/view/com/onboard/Follows/index.tsx b/src/view/com/onboard/Follows/index.tsx
new file mode 100644
index 0000000000..4a45861834
--- /dev/null
+++ b/src/view/com/onboard/Follows/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Follows = register({
+ loader: () => import('./Follows'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post-thread/PostRepostedBy.tsx b/src/view/com/post-thread/PostRepostedBy/PostRepostedBy.tsx
similarity index 88%
rename from src/view/com/post-thread/PostRepostedBy.tsx
rename to src/view/com/post-thread/PostRepostedBy/PostRepostedBy.tsx
index 1f238f5b39..6602b09dca 100644
--- a/src/view/com/post-thread/PostRepostedBy.tsx
+++ b/src/view/com/post-thread/PostRepostedBy/PostRepostedBy.tsx
@@ -4,18 +4,14 @@ import {ActivityIndicator, FlatList, StyleSheet, Text, View} from 'react-native'
import {
RepostedByViewModel,
RepostedByViewItemModel,
-} from '../../../state/models/reposted-by-view'
-import {UserAvatar} from '../util/UserAvatar'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {Link} from '../util/Link'
-import {useStores} from '../../../state'
-import {s, colors} from '../../lib/styles'
+} from '../../../../state/models/reposted-by-view'
+import {UserAvatar} from '../../util/UserAvatar'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {Link} from '../../util/Link'
+import {useStores} from '../../../../state'
+import {s, colors} from '../../../lib/styles'
-export const PostRepostedBy = observer(function PostRepostedBy({
- uri,
-}: {
- uri: string
-}) {
+export default observer(function PostRepostedBy({uri}: {uri: string}) {
const store = useStores()
const [view, setView] = useState()
diff --git a/src/view/com/post-thread/PostRepostedBy/index.tsx b/src/view/com/post-thread/PostRepostedBy/index.tsx
new file mode 100644
index 0000000000..fccf006890
--- /dev/null
+++ b/src/view/com/post-thread/PostRepostedBy/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PostRepostedBy = register({
+ loader: () => import('./PostRepostedBy'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread/PostThread.tsx
similarity index 90%
rename from src/view/com/post-thread/PostThread.tsx
rename to src/view/com/post-thread/PostThread/PostThread.tsx
index bbaa4efa2a..1cffa8e41b 100644
--- a/src/view/com/post-thread/PostThread.tsx
+++ b/src/view/com/post-thread/PostThread/PostThread.tsx
@@ -4,12 +4,12 @@ import {ActivityIndicator, FlatList, Text, View} from 'react-native'
import {
PostThreadViewModel,
PostThreadViewPostModel,
-} from '../../../state/models/post-thread-view'
-import {useStores} from '../../../state'
-import {PostThreadItem} from './PostThreadItem'
-import {ErrorMessage} from '../util/ErrorMessage'
+} from '../../../../state/models/post-thread-view'
+import {useStores} from '../../../../state'
+import {PostThreadItem} from '../PostThreadItem'
+import {ErrorMessage} from '../../util/ErrorMessage'
-export const PostThread = observer(function PostThread({
+export default observer(function PostThread({
uri,
view,
}: {
diff --git a/src/view/com/post-thread/PostThread/index.tsx b/src/view/com/post-thread/PostThread/index.tsx
new file mode 100644
index 0000000000..3281188ddd
--- /dev/null
+++ b/src/view/com/post-thread/PostThread/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PostThread = register({
+ loader: () => import('./PostThread'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem/PostThreadItem.tsx
similarity index 93%
rename from src/view/com/post-thread/PostThreadItem.tsx
rename to src/view/com/post-thread/PostThreadItem/PostThreadItem.tsx
index 8408eb6c05..9c0a222fbd 100644
--- a/src/view/com/post-thread/PostThreadItem.tsx
+++ b/src/view/com/post-thread/PostThreadItem/PostThreadItem.tsx
@@ -2,27 +2,27 @@ import React, {useMemo, useState} from 'react'
import {observer} from 'mobx-react-lite'
import {StyleSheet, Text, View} from 'react-native'
import Clipboard from '@react-native-clipboard/clipboard'
-import {AtUri} from '../../../third-party/uri'
-import * as PostType from '../../../third-party/api/src/client/types/app/bsky/feed/post'
+import {AtUri} from '../../../../third-party/uri'
+import * as PostType from '../../../../third-party/api/src/client/types/app/bsky/feed/post'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {PostThreadViewPostModel} from '../../../state/models/post-thread-view'
-import {Link} from '../util/Link'
-import {RichText} from '../util/RichText'
-import {PostDropdownBtn} from '../util/DropdownBtn'
-import * as Toast from '../util/Toast'
-import {UserAvatar} from '../util/UserAvatar'
-import {s, colors} from '../../lib/styles'
-import {ago, pluralize} from '../../../lib/strings'
-import {useStores} from '../../../state'
-import {PostMeta} from '../util/PostMeta'
-import {PostEmbeds} from '../util/PostEmbeds'
-import {PostCtrls} from '../util/PostCtrls'
-import {ComposePrompt} from '../composer/Prompt'
+import {PostThreadViewPostModel} from '../../../../state/models/post-thread-view'
+import {Link} from '../../util/Link'
+import {RichText} from '../../util/RichText'
+import {PostDropdownBtn} from '../../util/DropdownBtn'
+import * as Toast from '../../util/Toast'
+import {UserAvatar} from '../../util/UserAvatar'
+import {s, colors} from '../../../lib/styles'
+import {ago, pluralize} from '../../../../lib/strings'
+import {useStores} from '../../../../state'
+import {PostMeta} from '../../util/PostMeta'
+import {PostEmbeds} from '../../util/PostEmbeds'
+import {PostCtrls} from '../../util/PostCtrls'
+import {ComposePrompt} from '../../composer/Prompt'
const PARENT_REPLY_LINE_LENGTH = 8
const REPLYING_TO_LINE_LENGTH = 6
-export const PostThreadItem = observer(function PostThreadItem({
+export default observer(function PostThreadItem({
item,
onPostReply,
}: {
diff --git a/src/view/com/post-thread/PostThreadItem/index.tsx b/src/view/com/post-thread/PostThreadItem/index.tsx
new file mode 100644
index 0000000000..bfb400d211
--- /dev/null
+++ b/src/view/com/post-thread/PostThreadItem/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PostThreadItem = register({
+ loader: () => import('./PostThreadItem'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post-thread/PostVotedBy.tsx b/src/view/com/post-thread/PostVotedBy/PostVotedBy.tsx
similarity index 89%
rename from src/view/com/post-thread/PostVotedBy.tsx
rename to src/view/com/post-thread/PostVotedBy/PostVotedBy.tsx
index 7b798482a0..27ade6a884 100644
--- a/src/view/com/post-thread/PostVotedBy.tsx
+++ b/src/view/com/post-thread/PostVotedBy/PostVotedBy.tsx
@@ -4,14 +4,14 @@ import {ActivityIndicator, FlatList, StyleSheet, Text, View} from 'react-native'
import {
VotesViewModel,
VotesViewItemModel,
-} from '../../../state/models/votes-view'
-import {Link} from '../util/Link'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {UserAvatar} from '../util/UserAvatar'
-import {useStores} from '../../../state'
-import {s, colors} from '../../lib/styles'
+} from '../../../../state/models/votes-view'
+import {Link} from '../../util/Link'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {UserAvatar} from '../../util/UserAvatar'
+import {useStores} from '../../../../state'
+import {s, colors} from '../../../lib/styles'
-export const PostVotedBy = observer(function PostVotedBy({
+export default observer(function PostVotedBy({
uri,
direction,
}: {
diff --git a/src/view/com/post-thread/PostVotedBy/index.tsx b/src/view/com/post-thread/PostVotedBy/index.tsx
new file mode 100644
index 0000000000..cab5377ea7
--- /dev/null
+++ b/src/view/com/post-thread/PostVotedBy/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PostVotedBy = register({
+ loader: () => import('./PostVotedBy'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post/Post.tsx
similarity index 89%
rename from src/view/com/post/Post.tsx
rename to src/view/com/post/Post/Post.tsx
index 97bec92eab..af89770695 100644
--- a/src/view/com/post/Post.tsx
+++ b/src/view/com/post/Post/Post.tsx
@@ -9,21 +9,21 @@ import {
} from 'react-native'
import {observer} from 'mobx-react-lite'
import Clipboard from '@react-native-clipboard/clipboard'
-import {AtUri} from '../../../third-party/uri'
-import * as PostType from '../../../third-party/api/src/client/types/app/bsky/feed/post'
+import {AtUri} from '../../../../third-party/uri'
+import * as PostType from '../../../../third-party/api/src/client/types/app/bsky/feed/post'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {PostThreadViewModel} from '../../../state/models/post-thread-view'
-import {Link} from '../util/Link'
-import {UserInfoText} from '../util/UserInfoText'
-import {PostMeta} from '../util/PostMeta'
-import {PostCtrls} from '../util/PostCtrls'
-import {RichText} from '../util/RichText'
-import * as Toast from '../util/Toast'
-import {UserAvatar} from '../util/UserAvatar'
-import {useStores} from '../../../state'
-import {s, colors} from '../../lib/styles'
+import {PostThreadViewModel} from '../../../../state/models/post-thread-view'
+import {Link} from '../../util/Link'
+import {UserInfoText} from '../../util/UserInfoText'
+import {PostMeta} from '../../util/PostMeta'
+import {PostCtrls} from '../../util/PostCtrls'
+import {RichText} from '../../util/RichText'
+import * as Toast from '../../util/Toast'
+import {UserAvatar} from '../../util/UserAvatar'
+import {useStores} from '../../../../state'
+import {s, colors} from '../../../lib/styles'
-export const Post = observer(function Post({
+export default observer(function Post({
uri,
initView,
style,
diff --git a/src/view/com/post/Post/index.tsx b/src/view/com/post/Post/index.tsx
new file mode 100644
index 0000000000..2c8dcd49fb
--- /dev/null
+++ b/src/view/com/post/Post/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Post = register({
+ loader: () => import('./Post'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/post/PostText.tsx b/src/view/com/post/PostText/PostText.tsx
similarity index 81%
rename from src/view/com/post/PostText.tsx
rename to src/view/com/post/PostText/PostText.tsx
index 5d6c45113c..fe68ba8bfa 100644
--- a/src/view/com/post/PostText.tsx
+++ b/src/view/com/post/PostText/PostText.tsx
@@ -1,12 +1,12 @@
import React, {useState, useEffect} from 'react'
import {observer} from 'mobx-react-lite'
import {Text, View} from 'react-native'
-import {LoadingPlaceholder} from '../util/LoadingPlaceholder'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {PostModel} from '../../../state/models/post'
-import {useStores} from '../../../state'
+import {LoadingPlaceholder} from '../../util/LoadingPlaceholder'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {PostModel} from '../../../../state/models/post'
+import {useStores} from '../../../../state'
-export const PostText = observer(function PostText({
+export default observer(function PostText({
uri,
style,
}: {
diff --git a/src/view/com/post/PostText/index.tsx b/src/view/com/post/PostText/index.tsx
new file mode 100644
index 0000000000..e84bc39524
--- /dev/null
+++ b/src/view/com/post/PostText/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const PostText = register({
+ loader: () => import('./PostText'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed/Feed.tsx
similarity index 86%
rename from src/view/com/posts/Feed.tsx
rename to src/view/com/posts/Feed/Feed.tsx
index 9e261638b4..533cfc5f48 100644
--- a/src/view/com/posts/Feed.tsx
+++ b/src/view/com/posts/Feed/Feed.tsx
@@ -1,17 +1,17 @@
import React, {MutableRefObject} from 'react'
import {observer} from 'mobx-react-lite'
import {View, FlatList, StyleProp, ViewStyle} from 'react-native'
-import {PostFeedLoadingPlaceholder} from '../util/LoadingPlaceholder'
-import {EmptyState} from '../util/EmptyState'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {FeedModel} from '../../../state/models/feed-view'
-import {FeedItem} from './FeedItem'
-import {ComposePrompt} from '../composer/Prompt'
+import {PostFeedLoadingPlaceholder} from '../../util/LoadingPlaceholder'
+import {EmptyState} from '../../util/EmptyState'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {FeedModel} from '../../../../state/models/feed-view'
+import {FeedItem} from '../FeedItem'
+import {ComposePrompt} from '../../composer/Prompt'
const COMPOSE_PROMPT_ITEM = {_reactKey: '__prompt__'}
const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
-export const Feed = observer(function Feed({
+export default observer(function Feed({
feed,
style,
scrollElRef,
diff --git a/src/view/com/posts/Feed/index.tsx b/src/view/com/posts/Feed/index.tsx
new file mode 100644
index 0000000000..eb28cab301
--- /dev/null
+++ b/src/view/com/posts/Feed/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Feed = register({
+ loader: () => import('./Feed'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem/FeedItem.tsx
similarity index 92%
rename from src/view/com/posts/FeedItem.tsx
rename to src/view/com/posts/FeedItem/FeedItem.tsx
index 62f1996732..c540073032 100644
--- a/src/view/com/posts/FeedItem.tsx
+++ b/src/view/com/posts/FeedItem/FeedItem.tsx
@@ -2,29 +2,25 @@ import React, {useMemo, useState} from 'react'
import {observer} from 'mobx-react-lite'
import {StyleSheet, Text, View} from 'react-native'
import Clipboard from '@react-native-clipboard/clipboard'
-import {AtUri} from '../../../third-party/uri'
-import * as PostType from '../../../third-party/api/src/client/types/app/bsky/feed/post'
+import {AtUri} from '../../../../third-party/uri'
+import * as PostType from '../../../../third-party/api/src/client/types/app/bsky/feed/post'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {FeedItemModel} from '../../../state/models/feed-view'
-import {Link} from '../util/Link'
-import {UserInfoText} from '../util/UserInfoText'
-import {PostMeta} from '../util/PostMeta'
-import {PostCtrls} from '../util/PostCtrls'
-import {PostEmbeds} from '../util/PostEmbeds'
-import {RichText} from '../util/RichText'
-import * as Toast from '../util/Toast'
-import {UserAvatar} from '../util/UserAvatar'
-import {s, colors} from '../../lib/styles'
-import {useStores} from '../../../state'
+import {FeedItemModel} from '../../../../state/models/feed-view'
+import {Link} from '../../util/Link'
+import {UserInfoText} from '../../util/UserInfoText'
+import {PostMeta} from '../../util/PostMeta'
+import {PostCtrls} from '../../util/PostCtrls'
+import {PostEmbeds} from '../../util/PostEmbeds'
+import {RichText} from '../../util/RichText'
+import * as Toast from '../../util/Toast'
+import {UserAvatar} from '../../util/UserAvatar'
+import {s, colors} from '../../../lib/styles'
+import {useStores} from '../../../../state'
const TOP_REPLY_LINE_LENGTH = 12
const REPLYING_TO_LINE_LENGTH = 8
-export const FeedItem = observer(function FeedItem({
- item,
-}: {
- item: FeedItemModel
-}) {
+export default observer(function FeedItem({item}: {item: FeedItemModel}) {
const store = useStores()
const [deleted, setDeleted] = useState(false)
const record = item.record as unknown as PostType.Record
diff --git a/src/view/com/posts/FeedItem/index.tsx b/src/view/com/posts/FeedItem/index.tsx
new file mode 100644
index 0000000000..3bea471a19
--- /dev/null
+++ b/src/view/com/posts/FeedItem/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const FeedItem = register({
+ loader: () => import('./FeedItem'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/profile/ProfileCard.tsx b/src/view/com/profile/ProfileCard/ProfileCard.tsx
similarity index 92%
rename from src/view/com/profile/ProfileCard.tsx
rename to src/view/com/profile/ProfileCard/ProfileCard.tsx
index 22b8bbdeaa..e48b079107 100644
--- a/src/view/com/profile/ProfileCard.tsx
+++ b/src/view/com/profile/ProfileCard/ProfileCard.tsx
@@ -1,10 +1,10 @@
import React from 'react'
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
-import {Link} from '../util/Link'
-import {UserAvatar} from '../util/UserAvatar'
-import {s, colors} from '../../lib/styles'
+import {Link} from '../../util/Link'
+import {UserAvatar} from '../../util/UserAvatar'
+import {s, colors} from '../../../lib/styles'
-export function ProfileCard({
+export default function ProfileCard({
did,
handle,
displayName,
diff --git a/src/view/com/profile/ProfileCard/index.tsx b/src/view/com/profile/ProfileCard/index.tsx
new file mode 100644
index 0000000000..c55f210856
--- /dev/null
+++ b/src/view/com/profile/ProfileCard/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ProfileCard = register({
+ loader: () => import('./ProfileCard'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/profile/ProfileFollowers.tsx b/src/view/com/profile/ProfileFollowers/ProfileFollowers.tsx
similarity index 87%
rename from src/view/com/profile/ProfileFollowers.tsx
rename to src/view/com/profile/ProfileFollowers/ProfileFollowers.tsx
index 6801ba161a..05a5352e30 100644
--- a/src/view/com/profile/ProfileFollowers.tsx
+++ b/src/view/com/profile/ProfileFollowers/ProfileFollowers.tsx
@@ -4,18 +4,14 @@ import {ActivityIndicator, FlatList, StyleSheet, Text, View} from 'react-native'
import {
UserFollowersViewModel,
FollowerItem,
-} from '../../../state/models/user-followers-view'
-import {Link} from '../util/Link'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {UserAvatar} from '../util/UserAvatar'
-import {useStores} from '../../../state'
-import {s, colors} from '../../lib/styles'
+} from '../../../../state/models/user-followers-view'
+import {Link} from '../../util/Link'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {UserAvatar} from '../../util/UserAvatar'
+import {useStores} from '../../../../state'
+import {s, colors} from '../../../lib/styles'
-export const ProfileFollowers = observer(function ProfileFollowers({
- name,
-}: {
- name: string
-}) {
+export default observer(function ProfileFollowers({name}: {name: string}) {
const store = useStores()
const [view, setView] = useState()
diff --git a/src/view/com/profile/ProfileFollowers/index.tsx b/src/view/com/profile/ProfileFollowers/index.tsx
new file mode 100644
index 0000000000..c205ad6251
--- /dev/null
+++ b/src/view/com/profile/ProfileFollowers/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ProfileFollowers = register({
+ loader: () => import('./ProfileFollowers'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/profile/ProfileFollows.tsx b/src/view/com/profile/ProfileFollows/ProfileFollows.tsx
similarity index 87%
rename from src/view/com/profile/ProfileFollows.tsx
rename to src/view/com/profile/ProfileFollows/ProfileFollows.tsx
index a705cf467e..34a92c8f92 100644
--- a/src/view/com/profile/ProfileFollows.tsx
+++ b/src/view/com/profile/ProfileFollows/ProfileFollows.tsx
@@ -4,18 +4,14 @@ import {ActivityIndicator, FlatList, StyleSheet, Text, View} from 'react-native'
import {
UserFollowsViewModel,
FollowItem,
-} from '../../../state/models/user-follows-view'
-import {useStores} from '../../../state'
-import {Link} from '../util/Link'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {UserAvatar} from '../util/UserAvatar'
-import {s, colors} from '../../lib/styles'
+} from '../../../../state/models/user-follows-view'
+import {useStores} from '../../../../state'
+import {Link} from '../../util/Link'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {UserAvatar} from '../../util/UserAvatar'
+import {s, colors} from '../../../lib/styles'
-export const ProfileFollows = observer(function ProfileFollows({
- name,
-}: {
- name: string
-}) {
+export default observer(function ProfileFollows({name}: {name: string}) {
const store = useStores()
const [view, setView] = useState()
diff --git a/src/view/com/profile/ProfileFollows/index.tsx b/src/view/com/profile/ProfileFollows/index.tsx
new file mode 100644
index 0000000000..c28197b167
--- /dev/null
+++ b/src/view/com/profile/ProfileFollows/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ProfileFollows = register({
+ loader: () => import('./ProfileFollows'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/profile/ProfileHeader.tsx b/src/view/com/profile/ProfileHeader/ProfileHeader.tsx
similarity index 93%
rename from src/view/com/profile/ProfileHeader.tsx
rename to src/view/com/profile/ProfileHeader/ProfileHeader.tsx
index fb31c18477..e901b0609c 100644
--- a/src/view/com/profile/ProfileHeader.tsx
+++ b/src/view/com/profile/ProfileHeader/ProfileHeader.tsx
@@ -3,26 +3,26 @@ import {observer} from 'mobx-react-lite'
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
import LinearGradient from 'react-native-linear-gradient'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {AtUri} from '../../../third-party/uri'
-import {ProfileViewModel} from '../../../state/models/profile-view'
-import {useStores} from '../../../state'
+import {AtUri} from '../../../../third-party/uri'
+import {ProfileViewModel} from '../../../../state/models/profile-view'
+import {useStores} from '../../../../state'
import {
ConfirmModel,
EditProfileModel,
InviteToSceneModel,
-} from '../../../state/models/shell-ui'
-import {pluralize} from '../../../lib/strings'
-import {s, colors} from '../../lib/styles'
-import {getGradient} from '../../lib/asset-gen'
-import {DropdownBtn, DropdownItem} from '../util/DropdownBtn'
-import * as Toast from '../util/Toast'
-import {LoadingPlaceholder} from '../util/LoadingPlaceholder'
-import {RichText} from '../util/RichText'
-import {UserAvatar} from '../util/UserAvatar'
-import {UserBanner} from '../util/UserBanner'
-import {UserInfoText} from '../util/UserInfoText'
+} from '../../../../state/models/shell-ui'
+import {pluralize} from '../../../../lib/strings'
+import {s, colors} from '../../../lib/styles'
+import {getGradient} from '../../../lib/asset-gen'
+import {DropdownBtn, DropdownItem} from '../../util/DropdownBtn'
+import * as Toast from '../../util/Toast'
+import {LoadingPlaceholder} from '../../util/LoadingPlaceholder'
+import {RichText} from '../../util/RichText'
+import {UserAvatar} from '../../util/UserAvatar'
+import {UserBanner} from '../../util/UserBanner'
+import {UserInfoText} from '../../util/UserInfoText'
-export const ProfileHeader = observer(function ProfileHeader({
+export default observer(function ProfileHeader({
view,
onRefreshAll,
}: {
diff --git a/src/view/com/profile/ProfileHeader/index.tsx b/src/view/com/profile/ProfileHeader/index.tsx
new file mode 100644
index 0000000000..c8ff497783
--- /dev/null
+++ b/src/view/com/profile/ProfileHeader/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ProfileHeader = register({
+ loader: () => import('./ProfileHeader'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/com/profile/ProfileMembers.tsx b/src/view/com/profile/ProfileMembers/ProfileMembers.tsx
similarity index 83%
rename from src/view/com/profile/ProfileMembers.tsx
rename to src/view/com/profile/ProfileMembers/ProfileMembers.tsx
index 251ece41ab..e91184eabe 100644
--- a/src/view/com/profile/ProfileMembers.tsx
+++ b/src/view/com/profile/ProfileMembers/ProfileMembers.tsx
@@ -1,16 +1,15 @@
import React, {useState, useEffect} from 'react'
import {observer} from 'mobx-react-lite'
import {ActivityIndicator, FlatList, View} from 'react-native'
-import {MembersViewModel, MemberItem} from '../../../state/models/members-view'
-import {ProfileCard} from './ProfileCard'
-import {ErrorMessage} from '../util/ErrorMessage'
-import {useStores} from '../../../state'
+import {
+ MembersViewModel,
+ MemberItem,
+} from '../../../../state/models/members-view'
+import {ProfileCard} from '../ProfileCard'
+import {ErrorMessage} from '../../util/ErrorMessage'
+import {useStores} from '../../../../state'
-export const ProfileMembers = observer(function ProfileMembers({
- name,
-}: {
- name: string
-}) {
+export default observer(function ProfileMembers({name}: {name: string}) {
const store = useStores()
const [view, setView] = useState()
diff --git a/src/view/com/profile/ProfileMembers/index.tsx b/src/view/com/profile/ProfileMembers/index.tsx
new file mode 100644
index 0000000000..710d005c92
--- /dev/null
+++ b/src/view/com/profile/ProfileMembers/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const ProfileMembers = register({
+ loader: () => import('./ProfileMembers'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/shell/mobile/Composer.tsx b/src/view/shell/mobile/Composer/Composer.tsx
similarity index 86%
rename from src/view/shell/mobile/Composer.tsx
rename to src/view/shell/mobile/Composer/Composer.tsx
index d72311ea97..62b2deeec7 100644
--- a/src/view/shell/mobile/Composer.tsx
+++ b/src/view/shell/mobile/Composer/Composer.tsx
@@ -1,11 +1,11 @@
import React, {useEffect} from 'react'
import {observer} from 'mobx-react-lite'
import {Animated, Easing, StyleSheet, View} from 'react-native'
-import {ComposePost} from '../../com/composer/ComposePost'
-import {ComposerOpts} from '../../../state/models/shell-ui'
-import {useAnimatedValue} from '../../lib/useAnimatedValue'
+import {ComposePost} from '../../../com/composer/ComposePost'
+import {ComposerOpts} from '../../../../state/models/shell-ui'
+import {useAnimatedValue} from '../../../lib/useAnimatedValue'
-export const Composer = observer(
+export default observer(
({
active,
winHeight,
diff --git a/src/view/shell/mobile/Composer/index.tsx b/src/view/shell/mobile/Composer/index.tsx
new file mode 100644
index 0000000000..30d99dee39
--- /dev/null
+++ b/src/view/shell/mobile/Composer/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Composer = register({
+ loader: () => import('./Composer'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})
diff --git a/src/view/shell/mobile/Menu.tsx b/src/view/shell/mobile/Menu/Menu.tsx
similarity index 96%
rename from src/view/shell/mobile/Menu.tsx
rename to src/view/shell/mobile/Menu/Menu.tsx
index 793b052768..ce02c9b390 100644
--- a/src/view/shell/mobile/Menu.tsx
+++ b/src/view/shell/mobile/Menu/Menu.tsx
@@ -8,19 +8,19 @@ import {
ViewStyle,
} from 'react-native'
import VersionNumber from 'react-native-version-number'
-import {s, colors} from '../../lib/styles'
-import {useStores} from '../../../state'
+import {s, colors} from '../../../lib/styles'
+import {useStores} from '../../../../state'
import {
HomeIcon,
UserGroupIcon,
BellIcon,
CogIcon,
MagnifyingGlassIcon,
-} from '../../lib/icons'
-import {UserAvatar} from '../../com/util/UserAvatar'
-import {CreateSceneModel} from '../../../state/models/shell-ui'
+} from '../../../lib/icons'
+import {UserAvatar} from '../../../com/util/UserAvatar'
+import {CreateSceneModel} from '../../../../state/models/shell-ui'
-export const Menu = ({
+export default ({
visible,
onClose,
}: {
diff --git a/src/view/shell/mobile/Menu/index.tsx b/src/view/shell/mobile/Menu/index.tsx
new file mode 100644
index 0000000000..8f7e5056a0
--- /dev/null
+++ b/src/view/shell/mobile/Menu/index.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+import {View, ActivityIndicator, StyleSheet} from 'react-native'
+import {register} from 'react-native-bundle-splitter'
+
+export const Menu = register({
+ loader: () => import('./Menu'),
+ placeholder: () => (
+
+
+
+ ),
+})
+
+const styles = StyleSheet.create({
+ loading: {flex: 1, justifyContent: 'center'},
+})