diff options
Diffstat (limited to 'src/view/com/modals/CreateScene.tsx')
| -rw-r--r-- | src/view/com/modals/CreateScene.tsx | 243 |
1 files changed, 0 insertions, 243 deletions
diff --git a/src/view/com/modals/CreateScene.tsx b/src/view/com/modals/CreateScene.tsx deleted file mode 100644 index d92fe2e31..000000000 --- a/src/view/com/modals/CreateScene.tsx +++ /dev/null @@ -1,243 +0,0 @@ -import React, {useState} from 'react' -import * as Toast from '../util/Toast' -import { - ActivityIndicator, - StyleSheet, - TouchableOpacity, - View, -} from 'react-native' -import LinearGradient from 'react-native-linear-gradient' -import {BottomSheetScrollView, BottomSheetTextInput} from '@gorhom/bottom-sheet' -import {AppBskyActorCreateScene} from '@atproto/api' -import {ErrorMessage} from '../util/error/ErrorMessage' -import {Text} from '../util/text/Text' -import {useStores} from '../../../state' -import {s, colors, gradients} from '../../lib/styles' -import { - makeValidHandle, - createFullHandle, - enforceLen, - MAX_DISPLAY_NAME, - MAX_DESCRIPTION, -} from '../../../lib/strings' - -export const snapPoints = ['60%'] - -export function Component({}: {}) { - const store = useStores() - const [error, setError] = useState<string>('') - const [isProcessing, setIsProcessing] = useState<boolean>(false) - const [handle, setHandle] = useState<string>('') - const [displayName, setDisplayName] = useState<string>('') - const [description, setDescription] = useState<string>('') - const onPressSave = async () => { - setIsProcessing(true) - if (error) { - setError('') - } - try { - if (!store.me.did) { - return - } - const desc = await store.api.com.atproto.server.getAccountsConfig() - const fullHandle = createFullHandle( - handle, - desc.data.availableUserDomains[0], - ) - // create scene actor - const createSceneRes = await store.api.app.bsky.actor.createScene({ - handle: fullHandle, - }) - // set the scene profile - await store.api.app.bsky.actor - .updateProfile({ - did: createSceneRes.data.did, - displayName, - description, - }) - .catch(e => - // an error here is not critical - store.log.error('Failed to update scene profile during creation', e), - ) - // follow the scene - await store.api.app.bsky.graph.follow - .create( - { - did: store.me.did, - }, - { - subject: { - did: createSceneRes.data.did, - declarationCid: createSceneRes.data.declaration.cid, - }, - createdAt: new Date().toISOString(), - }, - ) - .catch(e => - // an error here is not critical - store.log.error('Failed to follow scene after creation', e), - ) - Toast.show('Scene created') - store.shell.closeModal() - store.nav.navigate(`/profile/${fullHandle}`) - } catch (e: any) { - if (e instanceof AppBskyActorCreateScene.InvalidHandleError) { - setError( - 'The handle can only contain letters, numbers, and dashes, and must start with a letter.', - ) - } else if (e instanceof AppBskyActorCreateScene.HandleNotAvailableError) { - setError(`The handle "${handle}" is not available.`) - } else { - store.log.error('Failed to create scene', e) - setError( - 'Failed to create the scene. Check your internet connection and try again.', - ) - } - setIsProcessing(false) - } - } - const onPressCancel = () => { - store.shell.closeModal() - } - - return ( - <View style={styles.outer}> - <BottomSheetScrollView style={styles.inner}> - <Text style={[styles.title, s.black]}>Create a scene</Text> - <Text style={styles.description}> - Scenes are invite-only groups which aggregate what's popular with - members. - </Text> - <View style={{paddingBottom: 50}}> - <View style={styles.group}> - <Text style={[styles.label, s.black]}>Scene Handle</Text> - <BottomSheetTextInput - style={styles.textInput} - placeholder="e.g. alices-friends" - placeholderTextColor={colors.gray4} - autoCorrect={false} - value={handle} - onChangeText={str => setHandle(makeValidHandle(str))} - /> - </View> - <View style={styles.group}> - <Text style={[styles.label, s.black]}>Scene Display Name</Text> - <BottomSheetTextInput - style={styles.textInput} - placeholder="e.g. Alice's Friends" - placeholderTextColor={colors.gray4} - value={displayName} - onChangeText={v => - setDisplayName(enforceLen(v, MAX_DISPLAY_NAME)) - } - /> - </View> - <View style={styles.group}> - <Text style={[styles.label, s.black]}>Scene Description</Text> - <BottomSheetTextInput - style={[styles.textArea]} - placeholder="e.g. Artists, dog-lovers, and memelords." - placeholderTextColor={colors.gray4} - multiline - value={description} - onChangeText={v => setDescription(enforceLen(v, MAX_DESCRIPTION))} - /> - </View> - {error !== '' && ( - <View style={s.mb10}> - <ErrorMessage message={error} numberOfLines={3} /> - </View> - )} - {handle.length >= 2 && !isProcessing ? ( - <TouchableOpacity style={s.mt10} onPress={onPressSave}> - <LinearGradient - colors={[gradients.primary.start, gradients.primary.end]} - start={{x: 0, y: 0}} - end={{x: 1, y: 1}} - style={[styles.btn]}> - <Text style={[s.white, s.bold, s.f18]}>Create Scene</Text> - </LinearGradient> - </TouchableOpacity> - ) : ( - <View style={s.mt10}> - <View style={[styles.btn]}> - {isProcessing ? ( - <ActivityIndicator /> - ) : ( - <Text style={[s.gray4, s.bold, s.f18]}>Create Scene</Text> - )} - </View> - </View> - )} - <TouchableOpacity style={s.mt10} onPress={onPressCancel}> - <View style={[styles.btn, {backgroundColor: colors.white}]}> - <Text style={[s.black, s.bold]}>Cancel</Text> - </View> - </TouchableOpacity> - </View> - </BottomSheetScrollView> - </View> - ) -} - -const styles = StyleSheet.create({ - outer: { - flex: 1, - // paddingTop: 20, - }, - title: { - textAlign: 'center', - fontWeight: 'bold', - fontSize: 24, - marginBottom: 12, - }, - description: { - textAlign: 'center', - fontSize: 17, - paddingHorizontal: 22, - color: colors.gray5, - marginBottom: 10, - }, - inner: { - padding: 14, - height: 350, - }, - group: { - marginBottom: 10, - }, - label: { - fontSize: 16, - fontWeight: 'bold', - paddingHorizontal: 4, - paddingBottom: 4, - }, - textInput: { - borderWidth: 1, - borderColor: colors.gray3, - borderRadius: 6, - paddingHorizontal: 14, - paddingVertical: 10, - fontSize: 16, - color: colors.black, - }, - textArea: { - borderWidth: 1, - borderColor: colors.gray3, - borderRadius: 6, - paddingHorizontal: 12, - paddingTop: 10, - fontSize: 16, - color: colors.black, - height: 70, - textAlignVertical: 'top', - }, - btn: { - flexDirection: 'row', - alignItems: 'center', - justifyContent: 'center', - width: '100%', - borderRadius: 32, - padding: 14, - backgroundColor: colors.gray1, - }, -}) |