octo/tooot
octo
/
tooot
mirror of https://github.com/tooot-app/app
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fixed #362

This commit is contained in:
xmflsct 2022-08-14 22:18:41 +02:00
parent c6e7063929
commit 42528caf09
4 changed files with 80 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/Header/Center.tsx
View File

@ -1,31 +1,53 @@
import Icon from '@components/Icon'
import CustomText from '@components/Text'
import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager'
import React from 'react'
import { View } from 'react-native'
export interface Props {
content: React.ReactNode | string
content?: string
inverted?: boolean
onPress?: () => void
dropdown?: boolean
}
// Used for Android mostly
const HeaderCenter: React.FC<Props> = ({
content,
inverted = false,
onPress
onPress,
dropdown = false
}) => {
const { colors } = useTheme()
return (
<CustomText
<View
style={{
fontSize: 18,
color: inverted ? colors.primaryOverlay : colors.primaryDefault
flexDirection: 'row',
alignItems: 'center'
}}
fontWeight='Bold'
children={content}
{...(onPress && { onPress })}
/>
>
<CustomText
style={{
color: inverted ? colors.primaryOverlay : colors.primaryDefault
}}
fontSize='L'
fontWeight='Bold'
numberOfLines={1}
children={content}
{...(onPress && { onPress })}
/>
{dropdown ? (
<Icon
name='ChevronDown'
size={StyleConstants.Font.Size.M}
color={colors.primaryDefault}
style={{ marginLeft: StyleConstants.Spacing.XS }}
strokeWidth={3}
/>
) : null}
</View>
)
}

8
src/screens/ImagesViewer.tsx
View File

@ -2,13 +2,9 @@ import analytics from '@components/analytics'
import { HeaderCenter, HeaderLeft, HeaderRight } from '@components/Header'
import { Message } from '@components/Message'
import { useActionSheet } from '@expo/react-native-action-sheet'
import { NativeStackNavigationProp } from '@react-navigation/native-stack'
import {
RootStackParamList,
RootStackScreenProps
} from '@utils/navigation/navigators'
import { RootStackScreenProps } from '@utils/navigation/navigators'
import { useTheme } from '@utils/styles/ThemeManager'
import React, { RefObject, useCallback, useRef, useState } from 'react'
import React, { useCallback, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Platform, Share, StatusBar, View } from 'react-native'
import FlashMessage from 'react-native-flash-message'

134
src/screens/Tabs/Local.tsx
View File

@ -1,7 +1,5 @@
import analytics from '@components/analytics'
import { HeaderCenter, HeaderRight } from '@components/Header'
import Icon from '@components/Icon'
import CustomText from '@components/Text'
import Timeline from '@components/Timeline'
import TimelineDefault from '@components/Timeline/Default'
import { createNativeStackNavigator } from '@react-navigation/native-stack'
@ -11,26 +9,22 @@ import {
} from '@utils/navigation/navigators'
import { useListsQuery } from '@utils/queryHooks/lists'
import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
import { StyleConstants } from '@utils/styles/constants'
import layoutAnimation from '@utils/styles/layoutAnimation'
import { useTheme } from '@utils/styles/ThemeManager'
import React, { useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Pressable, StyleSheet, Text, View } from 'react-native'
import ContextMenu from 'react-native-context-menu-view'
import TabSharedRoot from './Shared/Root'
const Stack = createNativeStackNavigator<TabLocalStackParamList>()
const TabLocal = React.memo(
({ navigation }: ScreenTabsScreenProps<'Tab-Local'>) => {
const { colors } = useTheme()
const { t } = useTranslation('screenTabs')
const { data: lists } = useListsQuery({})
const [listsShown, setListsShown] = useState(false)
useEffect(() => {
layoutAnimation()
}, [listsShown])
}, [lists?.length])
const [queryKey, setQueryKey] = useState<QueryKeyTimeline>([
'Timeline',
@ -43,25 +37,42 @@ const TabLocal = React.memo(
name='Tab-Local-Root'
options={{
headerTitle: () => (
<HeaderCenter
onPress={() => {
if (lists?.length) {
setListsShown(!listsShown)
}
<ContextMenu
dropdownMenuMode
style={{ maxWidth: '80%' }}
actions={
lists?.length
? [
{
id: '',
title: t('tabs.local.name'),
disabled: queryKey[1].page === 'Following'
},
...lists.map(list => ({
id: list.id,
title: list.title,
disabled:
queryKey[1].page === 'List' &&
queryKey[1].list === list.id
}))
]
: undefined
}
onPress={({ nativeEvent: { id } }) => {
id.length
? setQueryKey(['Timeline', { page: 'List', list: id }])
: setQueryKey(['Timeline', { page: 'Following' }])
}}
content={
<>
<Text>{t('tabs.local.name')}</Text>
{lists?.length ? (
<Icon
name='ChevronDown'
size={StyleConstants.Font.Size.M}
color={colors.primaryDefault}
style={{ marginLeft: StyleConstants.Spacing.S }}
strokeWidth={3}
/>
) : null}
</>
children={
<HeaderCenter
dropdown={(lists?.length ?? 0) > 0}
content={
queryKey[1].page === 'List' && queryKey[1].list?.length
? lists?.find(list => list.id === queryKey[1].list)
?.title
: t('tabs.local.name')
}
/>
}
/>
),
@ -81,68 +92,15 @@ const TabLocal = React.memo(
)
}}
children={() => (
<>
<Timeline
queryKey={queryKey}
lookback='Following'
customProps={{
renderItem: ({ item }) => (
<TimelineDefault item={item} queryKey={queryKey} />
)
}}
/>
{listsShown ? (
<View
style={{
position: 'absolute',
backgroundColor: colors.backgroundDefault,
width: '100%',
paddingVertical: StyleConstants.Spacing.S
}}
>
<Pressable
style={{
padding: StyleConstants.Spacing.S * 1.5,
borderColor: colors.border,
borderTopWidth: StyleSheet.hairlineWidth,
borderBottomWidth: StyleSheet.hairlineWidth
}}
onPress={() => {
setQueryKey(['Timeline', { page: 'Following' }])
setListsShown(!listsShown)
}}
>
<CustomText fontSize='M' style={{ textAlign: 'center' }}>
Default
</CustomText>
</Pressable>
{lists?.map(list => (
<Pressable
style={{
padding: StyleConstants.Spacing.S,
borderColor: colors.border,
borderBottomWidth: StyleSheet.hairlineWidth
}}
onPress={() => {
setQueryKey([
'Timeline',
{ page: 'List', list: list.id }
])
setListsShown(!listsShown)
}}
>
<CustomText
key={list.id}
fontSize='M'
style={{ textAlign: 'center' }}
>
{list.title}
</CustomText>
</Pressable>
))}
</View>
) : null}
</>
<Timeline
queryKey={queryKey}
lookback='Following'
customProps={{
renderItem: ({ item }) => (
<TimelineDefault item={item} queryKey={queryKey} />
)
}}
/>
)}
/>
{TabSharedRoot({ Stack })}

1
src/startup/sentry.ts
View File

@ -4,6 +4,7 @@ import log from './log'
const sentry = () => {
log('log', 'Sentry', 'initializing')
Sentry.init({
// @ts-ignore
dsn: 'https://53348b60ff844d52886e90251b3a5f41@o917354.ingest.sentry.io/6410576',
enableInExpoDevelopment: false,
autoSessionTracking: true