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

Remove dependency `react-native-collapsible`

This commit is contained in:
Zhiyuan Zheng 2020-12-22 11:14:00 +01:00
parent 4d6cee643b
commit e00ec84c7c
No known key found for this signature in database
GPG Key ID: 078A93AB607D85E0
3 changed files with 27 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -36,7 +36,6 @@
"react-dom": "16.13.1", "react-dom": "16.13.1",
"react-i18next": "^11.8.4", "react-i18next": "^11.8.4",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.0.tar.gz", "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.0.tar.gz",
"react-native-collapsible": "^1.5.3",
"react-native-gesture-handler": "~1.8.0", "react-native-gesture-handler": "~1.8.0",
"react-native-htmlview": "^0.16.0", "react-native-htmlview": "^0.16.0",
"react-native-image-zoom-viewer": "^3.0.1", "react-native-image-zoom-viewer": "^3.0.1",

40
src/components/Timelines/Timeline/Shared/Content.tsx
View File

@ -1,9 +1,6 @@
import React, { useState } from 'react' import React, { useState } from 'react'
import { Pressable, Text } from 'react-native' import { LayoutAnimation, Pressable, Text, View } from 'react-native'
import Collapsible from 'react-native-collapsible'
import ParseContent from '@components/ParseContent' import ParseContent from '@components/ParseContent'
import { useTheme } from '@utils/styles/ThemeManager' import { useTheme } from '@utils/styles/ThemeManager'
import { StyleConstants } from '@utils/styles/constants' import { StyleConstants } from '@utils/styles/constants'
import { LinearGradient } from 'expo-linear-gradient' import { LinearGradient } from 'expo-linear-gradient'
@ -19,8 +16,9 @@ const TimelineContent: React.FC<Props> = ({
numberOfLines, numberOfLines,
highlighted = false highlighted = false
}) => { }) => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
const { theme } = useTheme() const { theme } = useTheme()
const [spoilerCollapsed, setSpoilerCollapsed] = useState(true) const [spoilerCollapsed, setSpoilerCollapsed] = useState(false)
const lineHeight = 28 const lineHeight = 28
return ( return (
@ -31,16 +29,23 @@ const TimelineContent: React.FC<Props> = ({
content={status.spoiler_text} content={status.spoiler_text}
size={highlighted ? 'L' : 'M'} size={highlighted ? 'L' : 'M'}
emojis={status.emojis} emojis={status.emojis}
numberOfLines={999}
/> />
<Collapsible collapsed={spoilerCollapsed} collapsedHeight={20}> <View
style={{
flex: 1,
height: spoilerCollapsed ? StyleConstants.Font.Size.M : undefined,
marginTop: StyleConstants.Font.Size.M
}}
>
<ParseContent <ParseContent
content={status.content} content={status.content}
size={highlighted ? 'L' : 'M'} size={highlighted ? 'L' : 'M'}
emojis={status.emojis} emojis={status.emojis}
mentions={status.mentions} mentions={status.mentions}
{...(numberOfLines && { numberOfLines: numberOfLines })} numberOfLines={999}
/> />
</Collapsible> </View>
<Pressable <Pressable
onPress={() => setSpoilerCollapsed(!spoilerCollapsed)} onPress={() => setSpoilerCollapsed(!spoilerCollapsed)}
style={{ style={{
@ -48,11 +53,20 @@ const TimelineContent: React.FC<Props> = ({
}} }}
> >
<LinearGradient <LinearGradient
colors={[ {...(spoilerCollapsed
theme.backgroundGradientStart, ? {
theme.backgroundGradientEnd colors: [
]} theme.backgroundGradientStart,
locations={[0, lineHeight / (StyleConstants.Font.Size.S * 5)]} theme.backgroundGradientEnd
],
locations: [
0,
lineHeight / (StyleConstants.Font.Size.S * 4)
]
}
: {
colors: ['rgba(0, 0, 0, 0)']
})}
style={{ style={{
paddingTop: StyleConstants.Font.Size.S * 2, paddingTop: StyleConstants.Font.Size.S * 2,
paddingBottom: StyleConstants.Font.Size.S paddingBottom: StyleConstants.Font.Size.S

7
yarn.lock
View File

@ -5225,13 +5225,6 @@ react-is@^17.0.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.1.tgz#5b3531bd76a645a4c9fb6e693ed36419e3301339" resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.1.tgz#5b3531bd76a645a4c9fb6e693ed36419e3301339"
integrity sha512-NAnt2iGDXohE5LI7uBnLnqvLQMtzhkiAOLXTmv+qnF9Ky7xAPcX8Up/xWIhxvLVGJvuLiNc4xQLtuqDRzb4fSA== integrity sha512-NAnt2iGDXohE5LI7uBnLnqvLQMtzhkiAOLXTmv+qnF9Ky7xAPcX8Up/xWIhxvLVGJvuLiNc4xQLtuqDRzb4fSA==
react-native-collapsible@^1.5.3:
version "1.5.3"
resolved "https://registry.yarnpkg.com/react-native-collapsible/-/react-native-collapsible-1.5.3.tgz#d6bc7274ae8f40f7688cca23ededa263e6c81c63"
integrity sha512-Ciuy3yF8wcHeLxXFtx9vxoyrq8l+9EJqLM/ADw54gVwzTQc1/e2ojhQbVFPlxhDA+Pba2qezkaKfv5ifxg8hoQ==
dependencies:
prop-types "^15.6.2"
react-native-gesture-handler@~1.8.0: react-native-gesture-handler@~1.8.0:
version "1.8.0" version "1.8.0"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.8.0.tgz#18f61f51da50320f938957b0ee79bc58f47449dc" resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.8.0.tgz#18f61f51da50320f938957b0ee79bc58f47449dc"