解决切换主题时函数式组件颜色未能正确显示问题;完全移除code-push;

shuiRong · May 20, 2019 · 876a0f6 · 876a0f6
1 parent 9b0b2a6
commit 876a0f6
Show file tree

Hide file tree

Showing 14 changed files with 67 additions and 146 deletions.
diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -194,6 +194,7 @@ configurations.all {
 }
 
 dependencies {
+    implementation project(':react-native-restart')
     implementation project(':react-native-splash-screen')
     implementation project(':@react-native-community_async-storage')
     compile project(':react-native-image-crop-picker')

diff --git a/android/app/src/main/java/com/gakki/MainApplication.java b/android/app/src/main/java/com/gakki/MainApplication.java
@@ -3,6 +3,7 @@
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import com.avishayil.rnrestart.ReactNativeRestartPackage;
 import org.devio.rn.splashscreen.SplashScreenReactPackage;
 import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
 import com.reactnative.ivpusic.imagepicker.PickerPackage;
@@ -34,6 +35,7 @@ public boolean getUseDeveloperSupport() {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new MainReactPackage(),
+            new ReactNativeRestartPackage(),
             new SplashScreenReactPackage(),
             new AsyncStoragePackage(),
             new PickerPackage(),

diff --git a/android/settings.gradle b/android/settings.gradle
@@ -1,4 +1,6 @@
 rootProject.name = 'gakki'
+include ':react-native-restart'
+project(':react-native-restart').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-restart/android')
 include ':react-native-splash-screen'
 project(':react-native-splash-screen').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-splash-screen/android')
 include ':@react-native-community_async-storage'

diff --git a/ios/gakki.xcodeproj/project.pbxproj b/ios/gakki.xcodeproj/project.pbxproj
@@ -72,6 +72,7 @@
 		07374F5F9C8D4F5CB20DAF18 /* libimageCropPicker.a in Frameworks */ = {isa = PBXBuildFile; fileRef = AE6432C2771741069044A8AB /* libimageCropPicker.a */; };
 		EBA4D2DF16D046298266B6E1 /* libRNCAsyncStorage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 29E541105281479CA6A256D7 /* libRNCAsyncStorage.a */; };
 		FB6CC6A3B71B4381849374E9 /* libSplashScreen.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D9AF64B2A73548338EE002BC /* libSplashScreen.a */; };
+		D320AEC8BCA646C491337546 /* libRCTRestart.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 6C281510810C46F8B604D51E /* libRCTRestart.a */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -500,6 +501,8 @@
 		29E541105281479CA6A256D7 /* libRNCAsyncStorage.a */ = {isa = PBXFileReference; name = "libRNCAsyncStorage.a"; path = "libRNCAsyncStorage.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
 		A7C9D33CF62142E2BEF0B085 /* SplashScreen.xcodeproj */ = {isa = PBXFileReference; name = "SplashScreen.xcodeproj"; path = "../node_modules/react-native-splash-screen/ios/SplashScreen.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
 		D9AF64B2A73548338EE002BC /* libSplashScreen.a */ = {isa = PBXFileReference; name = "libSplashScreen.a"; path = "libSplashScreen.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
+		5244C16A569B450DB9D3FC56 /* RCTRestart.xcodeproj */ = {isa = PBXFileReference; name = "RCTRestart.xcodeproj"; path = "../node_modules/react-native-restart/ios/RCTRestart.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
+		6C281510810C46F8B604D51E /* libRCTRestart.a */ = {isa = PBXFileReference; name = "libRCTRestart.a"; path = "libRCTRestart.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -538,6 +541,7 @@
 				07374F5F9C8D4F5CB20DAF18 /* libimageCropPicker.a in Frameworks */,
 				EBA4D2DF16D046298266B6E1 /* libRNCAsyncStorage.a in Frameworks */,
 				FB6CC6A3B71B4381849374E9 /* libSplashScreen.a in Frameworks */,
+				D320AEC8BCA646C491337546 /* libRCTRestart.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -737,6 +741,7 @@
 				FD1BE416A12544F58034E099 /* imageCropPicker.xcodeproj */,
 				38EC2C27CBBA45DB8A1D4783 /* RNCAsyncStorage.xcodeproj */,
 				A7C9D33CF62142E2BEF0B085 /* SplashScreen.xcodeproj */,
+				5244C16A569B450DB9D3FC56 /* RCTRestart.xcodeproj */,
 			);
 			name = Libraries;
 			sourceTree = "<group>";
@@ -1601,6 +1606,7 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = gakkiTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@@ -1609,6 +1615,7 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1638,6 +1645,7 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = gakkiTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@@ -1646,6 +1654,7 @@
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1676,6 +1685,7 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = gakki/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@@ -1708,6 +1718,7 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = gakki/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@@ -1747,13 +1758,15 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = "gakki-tvOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1792,13 +1805,15 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = "gakki-tvOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1836,13 +1851,15 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = "gakki-tvOSTests/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1880,13 +1897,15 @@
 					"$(SRCROOT)/../node_modules/react-native-image-crop-picker/ios/**",
 					"$(SRCROOT)/../node_modules/@react-native-community/async-storage/ios",
 					"$(SRCROOT)/../node_modules/react-native-splash-screen/ios",
+					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart",
 				);
 				INFOPLIST_FILE = "gakki-tvOSTests/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
+					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",

diff --git a/package.json b/package.json
@@ -28,6 +28,7 @@
     "react-native-image-picker": "^0.27.2",
     "react-native-material-ripple": "^0.8.0",
     "react-native-render-html": "^3.10.0",
+    "react-native-restart": "^0.0.10",
     "react-native-scrollable-tab-view": "git+ssh://[email protected]:shuiRong/react-native-scrollable-tab-view.git#master",
     "react-native-spinkit": "^1.2.0",
     "react-native-splash-screen": "^3.2.0",
@@ -53,7 +54,6 @@
     "jest": "23.6.0",
     "jsc-android": "^236355.1.1",
     "metro-react-native-babel-preset": "^0.51.1",
-    "react-native-code-push": "^5.6.0",
     "react-test-renderer": "16.6.3",
     "schedule": "0.4.0"
   },

diff --git a/src/pages/About.js b/src/pages/About.js
@@ -157,7 +157,7 @@ export default class About extends Component {
             </Text>
           </TouchableOpacity>
           <TouchableOpacity
-            onPress={() => this.openURL('https://github.com/shuiRong/Gakki')}
+            onPress={() => this.openURL('https://github.com/shuiRong/Gakki/releases')}
             activeOpacity={0.5}
             style={{
               marginTop: 20,

diff --git a/src/pages/SideBar.js b/src/pages/SideBar.js
@@ -16,8 +16,8 @@ import HTMLView from './common/HTMLView'
 import Divider from './common/Divider'
 import { observer } from 'mobx-react'
 import { remove, save, fetch } from '../utils/store'
-import CodePush from 'react-native-code-push'
 import { CancelToken } from 'axios'
+import RNRestart from 'react-native-restart'
 
 let color = {}
 @observer
@@ -85,7 +85,7 @@ export default class SideBar extends Component {
             save('access_token', keys[0]),
             save('domain', nextAccount.domain)
           ]).then(() => {
-            CodePush.restartApp()
+            RNRestart.Restart()
           })
         })
         .catch(err => {
@@ -199,7 +199,7 @@ export default class SideBar extends Component {
       save('domain', data.domain),
       save('account', data)
     ]).then(() => {
-      CodePush.restartApp()
+      RNRestart.Restart()
     })
   }
 
@@ -476,7 +476,9 @@ export default class SideBar extends Component {
             onPress={() => {
               const theme = mobx.theme === 'white' ? 'black' : 'white'
               mobx.updateTheme(theme)
-              save('theme', theme).then(() => {})
+              save('theme', theme).then(() => {
+                RNRestart.Restart()
+              })
             }}
           >
             {mobx.theme === 'white' ? (

diff --git a/src/pages/common/TootBox/AdditionalInfo.js b/src/pages/common/TootBox/AdditionalInfo.js
@@ -5,37 +5,36 @@ import mobx from '../../../utils/mobx'
 import { themeData } from '../../../utils/color'
 import HTMLView from '../HTMLView'
 
-const color = themeData[mobx.theme]
-const info = {
-  reblog: '转嘟了',
-  pinned: '置顶嘟文',
-  favourite: '收藏了',
-  follow: '开始关注你',
-  mention: '提及了'
-}
-const icon = {
-  reblog: 'retweet',
-  pinned: 'thumbtack',
-  favourite: 'star',
-  follow: 'user-plus'
-}
-const iconColor = {
-  favourite: color.gold,
-  follow: color.lightgreen,
-  reblog: color.lightBlue,
-  pinned: color.lightContrastColor
-}
-
 const areEqual = (prevProps, nextPros) => {
   return prevProps.data.id === nextPros.data.id
 }
 
 // 嘟文上方的附加信息：转嘟、置顶...
 const AdditionalInfoFunc = ({ data = {}, navigation = () => {} }) => {
+  const color = themeData[mobx.theme]
   let type = undefined
   let pTagStyle = { color: color.subColor }
   const toot = data.type ? data.status : data // 有type属性，表示是Notification entity
   const isNotificationPage = Boolean(data.type) // 当前组件是否使用在通知页面，因为通知接口返回的数据格式稍有不同
+  const info = {
+    reblog: '转嘟了',
+    pinned: '置顶嘟文',
+    favourite: '收藏了',
+    follow: '开始关注你',
+    mention: '提及了'
+  }
+  const icon = {
+    reblog: 'retweet',
+    pinned: 'thumbtack',
+    favourite: 'star',
+    follow: 'user-plus'
+  }
+  const iconColor = {
+    favourite: color.gold,
+    follow: color.lightgreen,
+    reblog: color.lightBlue,
+    pinned: color.lightContrastColor
+  }
 
   if (isNotificationPage) {
     // 如果是在通知页面，那么类型的名称可以直接当作变量名

diff --git a/src/pages/common/TootBox/Avatar.js b/src/pages/common/TootBox/Avatar.js
@@ -3,8 +3,6 @@ import { View, Image, StyleSheet } from 'react-native'
 import mobx from '../../../utils/mobx'
 import { themeData } from '../../../utils/color'
 
-const color = themeData[mobx.theme]
-
 const areEqual = (prevProps, nextPros) => {
   return prevProps.toot.id === nextPros.toot.id
 }
@@ -13,6 +11,8 @@ const areEqual = (prevProps, nextPros) => {
  * @description 获取用户头像，如果是转发，则同时显示两人头像
  */
 const AvatarFunc = ({ toot }) => {
+  const color = themeData[mobx.theme]
+
   /**
    * @description 私信页面的头像，需要对两个及其以上的 @ 用户头像特殊处理
    */

diff --git a/src/pages/common/TootBox/Body.js b/src/pages/common/TootBox/Body.js
@@ -13,8 +13,6 @@ import Avatar from './Avatar'
 import BottomIcons from './BottomIcons'
 
 const timezone = jstz.determine().name() // 获得当前用户所在的时区
-const color = themeData[mobx.theme]
-
 const areEqual = (prevProps, nextProps) =>
   prevProps.data.id === nextProps.data.id
 
@@ -25,6 +23,7 @@ const areEqual = (prevProps, nextProps) =>
  */
 const BodyFunc = props => {
   const { isMaster, data, showTread, navigation } = props
+  const color = themeData[mobx.theme]
 
   let toot = null // 有type属性，表示是Notification entity. 如果数据为空，说明情况是：Notification Entity 中的follow类型
   if (data.type) {

diff --git a/src/pages/common/TootBox/BottomIcons.js b/src/pages/common/TootBox/BottomIcons.js
@@ -22,7 +22,6 @@ import mobx from '../../../utils/mobx'
 import { CancelToken } from 'axios'
 
 const cheerio = require('react-native-cheerio')
-const color = themeData[mobx.theme]
 const areEqual = (prevProps, nextProps) => {
   const prevToot = prevProps.data
   const nextToot = nextProps.data
@@ -49,6 +48,7 @@ const BottomIconsFunc = ({
   navigation
 }) => {
   const [toot, setToot] = useState(data)
+  const color = themeData[mobx.theme]
   let cancel = []
   let theRef = null
   /**

diff --git a/src/pages/common/TootBox/Index.js b/src/pages/common/TootBox/Index.js
@@ -5,8 +5,6 @@ import mobx from '../../../utils/mobx'
 import AdditionalInfo from './AdditionalInfo'
 import Body from './Body'
 
-const color = themeData[mobx.theme]
-
 const TootBoxAreEqual = (prevProps, nextProps) => {
   const prevToot = prevProps.data
   const nextToot = nextProps.data
@@ -22,7 +20,9 @@ const TootBoxAreEqual = (prevProps, nextProps) => {
 }
 
 const TootBox = props => {
+  const color = themeData[mobx.theme]
   const barStyle = mobx.theme === 'black' ? 'light-content' : 'dark-content'
+
   return (
     <View
       style={{

diff --git a/src/pages/common/TootBox/TootContent.js b/src/pages/common/TootBox/TootContent.js
@@ -5,8 +5,6 @@ import { themeData } from '../../../utils/color'
 import mobx from '../../../utils/mobx'
 
 // 嘟文主体内容
-const color = themeData[mobx.theme]
-
 const TootContentAreEqual = (prevProps, nextProps) => {
   return (
     prevProps.hide === nextProps.hide && prevProps.toot.id === nextProps.toot.id
@@ -19,6 +17,7 @@ const TootContentFunc = ({
   toot = {},
   isNotificationPage = false
 }) => {
+  const color = themeData[mobx.theme]
   const [hide, setHide] = useState(sensitive)
   let pTagStyle = {}