octo/tooot
1
0
Fork 0
mirror of https://github.com/tooot-app/app synced 2025-06-05 22:19:13 +02:00
Code Issues Projects Releases Wiki Activity

Fix #667

Browse Source
This commit is contained in:
xmflsct
2023-02-12 18:38:06 +01:00
parent 4a340fca8e
commit 79a92b5df7
31 changed files with 180 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Account.tsx
View File

@@ -42,7 +42,7 @@ const ComponentAccount: React.FC<PropsWithChildren & Props> = ({ account, props,
style={{
width: StyleConstants.Avatar.S,
height: StyleConstants.Avatar.S,
borderRadius: 8,
borderRadius: StyleConstants.BorderRadius,
marginRight: StyleConstants.Spacing.S
}}
dim

2
src/components/AccountButton.tsx
View File

@@ -45,7 +45,7 @@ const AccountButton: React.FC<Props> = ({ account, additionalActions }) => {
width: StyleConstants.Font.Size.L,
height: StyleConstants.Font.Size.L
}}
style={{ borderRadius: StyleConstants.Font.Size.L / 2, overflow: 'hidden' }}
style={{ borderRadius: 99, overflow: 'hidden' }}
/>
<CustomText
fontStyle='M'

2
src/components/Button.tsx
View File

@@ -116,7 +116,7 @@ const Button: React.FC<Props> = ({
}}
style={[
{
borderRadius: 100,
borderRadius: 99,
justifyContent: 'center',
alignItems: 'center',
borderWidth: overlay ? 0 : selected ? 1.5 : 1,

2
src/components/Emojis/Button.tsx
View File

@@ -35,7 +35,7 @@ const EmojisButton: React.FC = () => {
borderWidth: 2,
borderColor: colors.primaryDefault,
padding: StyleConstants.Spacing.Global.PagePadding / 2,
borderRadius: 100
borderRadius: 99
}}
>
<Icon

2
src/components/Header/Left.tsx
View File

@@ -51,7 +51,7 @@ const HeaderLeft: React.FC<Props> = ({
minWidth: 44,
marginLeft: native ? -StyleConstants.Spacing.S : StyleConstants.Spacing.S,
...(type === undefined && {
borderRadius: 100
borderRadius: 99
}),
...(type === 'text' && {
paddingHorizontal: StyleConstants.Spacing.S

4
src/components/Header/Right.tsx
View File

@@ -98,9 +98,7 @@ const HeaderRight: React.FC<Props> = ({
minHeight: 44,
minWidth: 44,
marginRight: native ? -StyleConstants.Spacing.S : StyleConstants.Spacing.S,
...(type === undefined && {
borderRadius: 100
}),
...(type === undefined && { borderRadius: 99 }),
...(type === 'text' && {
paddingHorizontal: StyleConstants.Spacing.S
})

2
src/components/Menu/Row.tsx
View File

@@ -89,7 +89,7 @@ const MenuRow: React.FC<Props> = ({
width: 8,
height: 8,
backgroundColor: colors.red,
borderRadius: 8,
borderRadius: StyleConstants.BorderRadius,
marginRight: StyleConstants.Spacing.S
}}
/>

2
src/components/SwipeToActions.tsx
View File

@@ -31,9 +31,11 @@ export const SwipeToActions = <T extends unknown>({
haptics(action.haptic || 'Light')
action.onPress({ item })
}}
style={{ backgroundColor: 'rgba(0, 255, 0, 0.2)' }}
>
<View
style={{
flex: 1,
paddingHorizontal: StyleConstants.Spacing.L,
flexBasis: perActionWidth,
backgroundColor: action.color,

2
src/components/Timeline/Conversation.tsx
View File

@@ -67,7 +67,7 @@ const TimelineConversation: React.FC<Props> = ({ conversation, queryKey, highlig
<View style={{ flex: 1, width: '100%', flexDirection: 'row' }}>
<View
style={{
borderRadius: 4,
borderRadius: StyleConstants.BorderRadius,
overflow: 'hidden',
marginRight: StyleConstants.Spacing.S,
width: StyleConstants.Avatar.M,

2
src/components/Timeline/Shared/Attachment/Audio.tsx
View File

@@ -118,7 +118,7 @@ const AttachmentAudio: React.FC<Props> = ({ total, index, sensitiveShown, audio
width: '100%',
height: StyleConstants.Spacing.M + StyleConstants.Spacing.S * 2,
paddingHorizontal: StyleConstants.Spacing.Global.PagePadding,
borderRadius: 100,
borderRadius: 99,
opacity: sensitiveShown ? 0.35 : undefined
}}
>

2
src/components/Timeline/Shared/Avatar.tsx
View File

@@ -49,7 +49,7 @@ const TimelineAvatar: React.FC<Props> = ({ account }) => {
}
}
style={{
borderRadius: StyleConstants.Avatar.M,
borderRadius: 99,
overflow: 'hidden',
marginRight: StyleConstants.Spacing.S
}}

2
src/components/Timeline/Shared/Card.tsx
View File

@@ -137,7 +137,7 @@ const TimelineCard: React.FC = () => {
flexDirection: 'row',
marginTop: StyleConstants.Spacing.M,
borderWidth: 1,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
overflow: 'hidden',
borderColor: colors.border
}}

26
src/components/discardConfirmation.ts Normal file
View File

@@ -0,0 +1,26 @@
import i18n from '@i18n/index'
import { Alert } from 'react-native'
export const discardConfirmation = ({
condition,
action
}: {
condition: boolean
action: () => void
}) => {
if (condition) {
Alert.alert(i18n.t('common:discard.title'), i18n.t('common:discard.message'), [
{
text: i18n.t('common:buttons.discard'),
style: 'destructive',
onPress: () => action()
},
{
text: i18n.t('common:buttons.cancel'),
style: 'default'
}
])
} else {
action()
}
}

4
src/components/mediaSelector.ts
View File

@@ -5,7 +5,7 @@ import i18next from 'i18next'
import { Asset, launchImageLibrary } from 'react-native-image-picker'
const queryKeyInstance: QueryKeyInstance = ['Instance']
export const MAX_MEDIA_ATTACHMENTS: number =
export const MAX_MEDIA_ATTACHMENTS = (): number =>
queryClient.getQueryData<Mastodon.Instance<any>>(queryKeyInstance)?.configuration?.statuses
.max_media_attachments || 4
@@ -27,7 +27,7 @@ const mediaSelector = async ({
indicateMaximum = false,
showActionSheetWithOptions
}: Props): Promise<Asset[]> => {
const _maximum = maximum || MAX_MEDIA_ATTACHMENTS
const _maximum = maximum || MAX_MEDIA_ATTACHMENTS()
const options = () => {
switch (mediaType) {

4
src/screens/AccountSelection.tsx
View File

@@ -52,7 +52,7 @@ const Share = ({
padding: StyleConstants.Spacing.M,
borderWidth: 1,
borderColor: colors.shimmerHighlight,
borderRadius: 8
borderRadius: StyleConstants.BorderRadius
}}
children={text}
/>
@@ -65,7 +65,7 @@ const Share = ({
padding: StyleConstants.Spacing.M,
borderWidth: 1,
borderColor: colors.shimmerHighlight,
borderRadius: 8
borderRadius: StyleConstants.BorderRadius
}}
>
<FlatList

8
src/screens/Announcements.tsx
View File

@@ -73,7 +73,7 @@ const ScreenAnnouncements: React.FC<RootStackScreenProps<'Screen-Announcements'>
padding: StyleConstants.Spacing.Global.PagePadding,
marginTop: StyleConstants.Spacing.Global.PagePadding,
borderWidth: 1,
borderRadius: 6,
borderRadius: StyleConstants.BorderRadius,
borderColor: colors.primaryDefault,
backgroundColor: colors.backgroundDefault
}}
@@ -123,7 +123,7 @@ const ScreenAnnouncements: React.FC<RootStackScreenProps<'Screen-Announcements'>
marginTop: StyleConstants.Spacing.Global.PagePadding / 2,
marginBottom: StyleConstants.Spacing.Global.PagePadding / 2,
marginRight: StyleConstants.Spacing.M,
borderRadius: 6,
borderRadius: StyleConstants.BorderRadius,
flexDirection: 'row',
borderColor: reaction.me ? colors.disabled : colors.primaryDefault,
backgroundColor: reaction.me ? colors.disabled : colors.backgroundDefault
@@ -231,7 +231,7 @@ const ScreenAnnouncements: React.FC<RootStackScreenProps<'Screen-Announcements'>
style={{
width: StyleConstants.Spacing.S,
height: StyleConstants.Spacing.S,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
borderWidth: 1,
borderColor: colors.primaryDefault,
backgroundColor: i === index ? colors.primaryDefault : undefined,
@@ -271,7 +271,7 @@ const ScreenAnnouncements: React.FC<RootStackScreenProps<'Screen-Announcements'>
style={{
width: StyleConstants.Spacing.S,
height: StyleConstants.Spacing.S,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
borderWidth: 1,
borderColor: colors.primaryDefault,
backgroundColor: i === index ? colors.primaryDefault : undefined,

2
src/screens/Compose/DraftsList.tsx
View File

@@ -56,7 +56,7 @@ const ComposeDraftsList: React.FC<ScreenComposeStackScreenProps<'Screen-Compose-
padding: StyleConstants.Spacing.S,
borderColor: colors.border,
borderWidth: 1,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
marginBottom: StyleConstants.Spacing.S
}}
>

82
src/screens/Compose/EditAttachment.tsx
View File

@@ -1,3 +1,4 @@
import { discardConfirmation } from '@components/discardConfirmation'
import haptics from '@components/haptics'
import { HeaderLeft, HeaderRight } from '@components/Header'
import { ModalScrollView } from '@components/ModalScrollView'
@@ -6,9 +7,11 @@ import apiInstance from '@utils/api/instance'
import { ScreenComposeStackScreenProps } from '@utils/navigation/navigators'
import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import { Image } from 'expo-image'
import React, { useContext, useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Alert, TextInput } from 'react-native'
import { Alert, TextInput, View } from 'react-native'
import { DEFAULT_WIDTH } from './Root/Footer/Attachments'
import ComposeContext from './utils/createContext'
const ComposeEditAttachment: React.FC<
@@ -20,7 +23,7 @@ const ComposeEditAttachment: React.FC<
}
}) => {
const { colors } = useTheme()
const { t } = useTranslation('screenCompose')
const { t } = useTranslation(['common', 'screenCompose'])
const { composeState, composeDispatch } = useContext(ComposeContext)
const [isSubmitting, setIsSubmitting] = useState(false)
@@ -31,55 +34,88 @@ const ComposeEditAttachment: React.FC<
return null
}
const [altText, setAltText] = useState<string | undefined>(theAttachment.description)
useEffect(() => {
navigation.setOptions({
title: t('content.editAttachment.header.title'),
headerLeft: () => <HeaderLeft content='chevron-down' onPress={() => navigation.goBack()} />,
title: t('screenCompose:content.editAttachment.header.title'),
headerLeft: () => (
<HeaderLeft
content='chevron-down'
onPress={() => {
discardConfirmation({
condition: theAttachment.description != altText,
action: () => navigation.goBack()
})
}}
/>
),
headerRight: () => (
<HeaderRight
accessibilityLabel={t('content.editAttachment.header.right.accessibilityLabel')}
accessibilityLabel={t(
'screenCompose:content.editAttachment.header.right.accessibilityLabel'
)}
content='save'
loading={isSubmitting}
onPress={() => {
if (composeState.type === 'edit') {
composeDispatch({ type: 'attachment/edit', payload: { ...theAttachment } })
composeDispatch({
type: 'attachment/edit',
payload: { ...theAttachment, description: altText }
})
navigation.goBack()
return
}
setIsSubmitting(true)
const body = { description: theAttachment.description }
theAttachment?.id &&
apiInstance<Mastodon.Attachment>({
method: 'put',
url: `media/${theAttachment.id}`,
body
body: { description: altText }
})
.then(() => {
.then(res => {
setIsSubmitting(false)
haptics('Success')
composeDispatch({
type: 'attachment/edit',
payload: res.body
})
navigation.goBack()
})
.catch(() => {
setIsSubmitting(false)
haptics('Error')
Alert.alert(t('content.editAttachment.header.right.failed.title'), undefined, [
Alert.alert(
t('screenCompose:content.editAttachment.header.right.failed.title'),
undefined,
[
{
text: t('content.editAttachment.header.right.failed.button'),
text: t('screenCompose:content.editAttachment.header.right.failed.button'),
style: 'cancel'
}
])
]
)
})
}}
/>
)
})
}, [theAttachment])
}, [theAttachment, altText])
return (
<ModalScrollView>
<View style={{ alignItems: 'center', marginBottom: StyleConstants.Spacing.M }}>
<Image
style={{
width: DEFAULT_WIDTH,
height: DEFAULT_WIDTH,
borderRadius: StyleConstants.BorderRadius
}}
source={theAttachment.preview_url}
/>
</View>
<CustomText fontStyle='M' style={{ color: colors.primaryDefault }} fontWeight='Bold'>
{t('content.editAttachment.content.altText.heading')}
{t('screenCompose:content.editAttachment.content.altText.heading')}
</CustomText>
<TextInput
style={{
@@ -94,18 +130,10 @@ const ComposeEditAttachment: React.FC<
}}
maxLength={1500}
multiline
onChangeText={e =>
composeDispatch({
type: 'attachment/edit',
payload: {
...theAttachment,
description: e
}
})
}
placeholder={t('content.editAttachment.content.altText.placeholder')}
value={altText}
onChangeText={e => setAltText(e)}
placeholder={t('screenCompose:content.editAttachment.content.altText.placeholder')}
placeholderTextColor={colors.secondary}
value={theAttachment.description}
/>
<CustomText
fontStyle='S'

2
src/screens/Compose/Root/Actions.tsx
View File

@@ -30,7 +30,7 @@ const ComposeActions: React.FC = () => {
const attachmentOnPress = () => {
if (composeState.poll.active) return
if (composeState.attachments.uploads.length < MAX_MEDIA_ATTACHMENTS) {
if (composeState.attachments.uploads.length < MAX_MEDIA_ATTACHMENTS()) {
return chooseAndUploadAttachment({ composeDispatch, showActionSheetWithOptions })
}
}

101
src/screens/Compose/Root/Footer/Attachments.tsx
View File

@@ -12,19 +12,19 @@ import { StyleConstants } from '@utils/styles/constants'
import layoutAnimation from '@utils/styles/layoutAnimation'
import { useTheme } from '@utils/styles/ThemeManager'
import { Image } from 'expo-image'
import React, { RefObject, useContext, useEffect, useRef } from 'react'
import React, { RefObject, useContext, useRef } from 'react'
import { useTranslation } from 'react-i18next'
import { FlatList, Pressable, StyleSheet, View } from 'react-native'
import ComposeContext from '../../utils/createContext'
import { ExtendedAttachment } from '../../utils/types'
import chooseAndUploadAttachment from './addAttachment'
export const DEFAULT_WIDTH = 150
export interface Props {
accessibleRefAttachments: RefObject<View>
}
const DEFAULT_HEIGHT = 200
const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
const { showActionSheetWithOptions } = useActionSheet()
const { composeState, composeDispatch } = useContext(ComposeContext)
@@ -40,72 +40,22 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
payload: { sensitive: !composeState.attachments.sensitive }
})
const calculateWidth = (item: ExtendedAttachment) => {
if (item.local) {
return ((item.local.width || 100) / (item.local.height || 100)) * DEFAULT_HEIGHT
} else {
if (item.remote) {
if (item.remote.meta.original.aspect) {
return item.remote.meta.original.aspect * DEFAULT_HEIGHT
} else if (item.remote.meta.original.width && item.remote.meta.original.height) {
return (
(item.remote.meta.original.width / item.remote.meta.original.height) * DEFAULT_HEIGHT
)
} else {
return DEFAULT_HEIGHT
}
} else {
return DEFAULT_HEIGHT
}
}
}
const snapToOffsets = () => {
const attachmentsOffsets = composeState.attachments.uploads.map((_, index) => {
let currentOffset = 0
Array.from(Array(index).keys()).map(
i =>
(currentOffset =
currentOffset +
calculateWidth(composeState.attachments.uploads[i]) +
StyleConstants.Spacing.Global.PagePadding)
)
return currentOffset
})
return attachmentsOffsets.length < 4
? [
...attachmentsOffsets,
attachmentsOffsets.reduce((a, b) => a + b, 0) +
DEFAULT_HEIGHT +
StyleConstants.Spacing.Global.PagePadding
]
: attachmentsOffsets
}
let prevOffsets = useRef<number[]>()
useEffect(() => {
const snap = snapToOffsets()
if (snap.length > (prevOffsets.current ? prevOffsets.current.length : 0)) {
flatListRef.current?.scrollToOffset({
offset: snap[snapToOffsets.length - 2] + snap[snapToOffsets.length - 1]
})
}
prevOffsets.current = snap
}, [snapToOffsets, prevOffsets.current])
const renderAttachment = ({ item, index }: { item: ExtendedAttachment; index: number }) => {
return (
<View
key={index}
style={{
height: DEFAULT_HEIGHT,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginTop: StyleConstants.Spacing.Global.PagePadding,
marginBottom: StyleConstants.Spacing.Global.PagePadding,
width: calculateWidth(item)
marginBottom: StyleConstants.Spacing.Global.PagePadding
}}
>
<Image
style={{ width: '100%', height: '100%' }}
style={{
width: DEFAULT_WIDTH,
height: DEFAULT_WIDTH,
borderRadius: StyleConstants.BorderRadius
}}
source={
item.local?.thumbnail
? { uri: item.local?.thumbnail }
@@ -123,7 +73,7 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
paddingRight: StyleConstants.Spacing.S,
paddingTop: StyleConstants.Spacing.XS,
paddingBottom: StyleConstants.Spacing.XS,
color: colors.backgroundDefault,
color: colors.primaryOverlay,
backgroundColor: colors.backgroundOverlayInvert
}}
>
@@ -157,7 +107,7 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
})}
type='icon'
content='x'
spacing='M'
size='L'
round
overlay
onPress={() => {
@@ -175,11 +125,11 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
accessibilityLabel={t('content.root.footer.attachments.edit.accessibilityLabel', {
attachment: index + 1
})}
type='icon'
content='edit'
spacing='M'
round
overlay
size='S'
type='text'
content={!!item.remote?.description?.length ? 'ALT ✓' : '+ ALT'}
fontBold
onPress={() => navigation.navigate('Screen-Compose-EditAttachment', { index })}
/>
) : null}
@@ -230,23 +180,23 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
pagingEnabled={false}
snapToAlignment='center'
renderItem={renderAttachment}
snapToOffsets={snapToOffsets()}
snapToOffsets={new Array(composeState.attachments.uploads.length).fill(DEFAULT_WIDTH)}
keyboardShouldPersistTaps='always'
showsHorizontalScrollIndicator={false}
data={composeState.attachments.uploads}
keyExtractor={item => item.local?.uri || item.remote?.url || Math.random().toString()}
ListFooterComponent={
composeState.attachments.uploads.length < MAX_MEDIA_ATTACHMENTS ? (
composeState.attachments.uploads.length < MAX_MEDIA_ATTACHMENTS() ? (
<Pressable
accessible
accessibilityLabel={t('content.root.footer.attachments.upload.accessibilityLabel')}
style={{
height: DEFAULT_HEIGHT,
width: DEFAULT_WIDTH,
height: DEFAULT_WIDTH,
marginLeft: StyleConstants.Spacing.Global.PagePadding,
marginTop: StyleConstants.Spacing.Global.PagePadding,
marginBottom: StyleConstants.Spacing.Global.PagePadding,
width: DEFAULT_HEIGHT,
backgroundColor: colors.backgroundOverlayInvert
backgroundColor: colors.disabled
}}
onPress={async () => {
await chooseAndUploadAttachment({
@@ -258,9 +208,7 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
<Button
type='icon'
content='upload-cloud'
spacing='M'
round
overlay
size='L'
onPress={async () => {
await chooseAndUploadAttachment({
composeDispatch,
@@ -270,10 +218,11 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
style={{
position: 'absolute',
top:
(DEFAULT_HEIGHT - StyleConstants.Spacing.M * 2 - StyleConstants.Font.Size.M) /
2,
(DEFAULT_WIDTH - StyleConstants.Spacing.M * 2 - StyleConstants.Font.Size.M) / 2,
left:
(DEFAULT_HEIGHT - StyleConstants.Spacing.M * 2 - StyleConstants.Font.Size.M) / 2
(DEFAULT_WIDTH - StyleConstants.Spacing.M * 2 - StyleConstants.Font.Size.M) / 2,
borderWidth: 0,
backgroundColor: ''
}}
/>
</Pressable>

6
src/screens/Compose/Root/Footer/Poll.tsx
View File

@@ -38,8 +38,8 @@ const ComposePoll: React.FC = () => {
<View
style={{
flex: 1,
borderWidth: StyleSheet.hairlineWidth,
borderRadius: StyleConstants.Spacing.S,
borderWidth: 1,
borderRadius: StyleConstants.BorderRadius,
margin: StyleConstants.Spacing.Global.PagePadding,
borderColor: colors.border
}}
@@ -70,7 +70,7 @@ const ComposePoll: React.FC = () => {
flex: 1,
padding: StyleConstants.Spacing.S,
borderWidth: StyleSheet.hairlineWidth,
borderRadius: 6,
borderRadius: StyleConstants.BorderRadius,
...StyleConstants.FontStyle.M,
marginLeft: StyleConstants.Spacing.S,
borderColor: colors.border,

2
src/screens/Compose/Root/Footer/Reply.tsx
View File

@@ -17,7 +17,7 @@ const ComposeReply: React.FC = () => {
flex: 1,
flexDirection: 'row',
borderWidth: 1,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
overflow: 'hidden',
borderColor: colors.border,
marginHorizontal: StyleConstants.Spacing.Global.PagePadding,

2
src/screens/Compose/Root/Header/TextInput.tsx
View File

@@ -71,7 +71,7 @@ const ComposeTextInput: React.FC = () => {
scrollEnabled={false}
disableCopyPaste={false}
onPaste={(error: string | null | undefined, files: PastedFile[]) => {
if (composeState.attachments.uploads.length + files.length > MAX_MEDIA_ATTACHMENTS) {
if (composeState.attachments.uploads.length + files.length > MAX_MEDIA_ATTACHMENTS()) {
Alert.alert(
t('screenCompose:content.root.header.textInput.keyboardImage.exceedMaximum.title'),
undefined,

34
src/screens/Compose/utils/initialState.ts
View File

@@ -28,7 +28,39 @@ const composeInitialState: Omit<ComposeState, 'timestamp'> = {
},
attachments: {
sensitive: false,
uploads: []
uploads: [
// Test images
// {
// remote: {
// id: '01',
// type: 'image',
// url: 'https://images.unsplash.com/photo-1669311540088-8d44f4ab2cd7',
// preview_url: 'https://images.unsplash.com/photo-1669311540088-8d44f4ab2cd7'
// },
// local: undefined,
// uploading: false
// },
// {
// remote: {
// id: '02',
// type: 'image',
// url: 'https://images.unsplash.com/photo-1669311605888-07172f42cb35',
// preview_url: 'https://images.unsplash.com/photo-1669311605888-07172f42cb35'
// },
// local: undefined,
// uploading: false
// },
// {
// remote: {
// id: '03',
// type: 'image',
// url: 'https://images.unsplash.com/photo-1669311576866-d77abb31f4ce',
// preview_url: 'https://images.unsplash.com/photo-1669311576866-d77abb31f4ce'
// },
// local: undefined,
// uploading: false
// }
]
},
visibility: 'public',
visibilityLock: false,

2
src/screens/Tabs/Public/Root.tsx
View File

@@ -134,7 +134,7 @@ const Explore = ({ route: { key: page } }: { route: { key: 'Explore' } }) => {
paddingHorizontal: StyleConstants.Spacing.Global.PagePadding,
marginTop: StyleConstants.Spacing.S,
borderWidth: 1,
borderRadius: StyleConstants.Spacing.S,
borderRadius: StyleConstants.BorderRadius,
marginHorizontal: StyleConstants.Spacing.Global.PagePadding,
borderColor: colors.border
}}

2
src/screens/Tabs/Shared/Account/Information/Avatar.tsx
View File

@@ -14,7 +14,7 @@ const AccountInformationAvatar: React.FC = () => {
return (
<GracefullyImage
style={{ borderRadius: 8, overflow: 'hidden' }}
style={{ borderRadius: StyleConstants.BorderRadius, overflow: 'hidden' }}
dimension={{ width: StyleConstants.Avatar.L, height: StyleConstants.Avatar.L }}
sources={{
default: { uri: account?.avatar },

2
src/screens/Tabs/Shared/Report.tsx
View File

@@ -110,7 +110,7 @@ const TabSharedReport: React.FC<TabSharedStackScreenProps<'Tab-Shared-Report'>>
margin: StyleConstants.Spacing.Global.PagePadding,
borderWidth: 1,
borderColor: colors.red,
borderRadius: 8
borderRadius: StyleConstants.BorderRadius
}}
>
<ComponentAccount account={account} props={{}} />

2
src/screens/Tabs/Shared/Users.tsx
View File

@@ -79,7 +79,7 @@ const TabSharedUsers: React.FC<TabSharedStackScreenProps<'Tab-Shared-Users'>> =
padding: StyleConstants.Spacing.S,
borderColor: colors.border,
borderWidth: 1,
borderRadius: StyleConstants.Spacing.S
borderRadius: StyleConstants.BorderRadius
}}
>
<Icon

2
src/screens/Tabs/index.tsx
View File

@@ -55,7 +55,7 @@ const ScreenTabs = () => {
sources={{ default: { uri: avatarStatic } }}
dimension={{ width: size, height: size }}
style={{
borderRadius: size,
borderRadius: 99,
overflow: 'hidden',
borderWidth: focused ? 2 : 0,
borderColor: focused ? colors.primaryDefault : color

2
src/utils/styles/constants.ts
View File

@@ -21,5 +21,7 @@ export const StyleConstants = {
Global: { PagePadding: Base * 4 }
},
BorderRadius: Base * 2,
Avatar: { XS: 32, S: 40, M: 48, L: 96 }
}

6
src/utils/styles/themes.ts
View File

@@ -83,9 +83,9 @@ const themeColors: {
dark_darker: 'rgba(18, 18, 18, 0.5)'
},
backgroundOverlayInvert: {
light: 'rgba(25, 25, 25, 0.5)',
dark_lighter: 'rgba(0, 0, 0, 0.5)',
dark_darker: 'rgba(0, 0, 0, 0.5)'
light: 'rgba(25, 25, 25, 0.75)',
dark_lighter: 'rgba(0, 0, 0, 0.75)',
dark_darker: 'rgba(0, 0, 0, 0.75)'
},
border: {