chore: Merge branch 'dev'

Author: mydearxym

containers/UserFavorited/index.js

@@ -8,62 +8,62 @@ import React from 'react'
 
 import { connectStore, buildLog } from '@utils'
 
+import FavoritesCats from '@containers/FavoritesCats'
 import PagedContents from '@components/PagedContents'
-import FavoritesCats from '../FavoritesCats'
 import Breadcrumbs from './Breadcrumbs'
 
-import * as logic from './logic'
+import {
+  useInit,
+  onCatSelect,
+  backToCategoryList,
+  changeFavoriteThread,
+  onReload,
+  onPreview,
+} from './logic'
 
 /* eslint-disable-next-line */
 const log = buildLog('C:UserFavorited')
 
-class UserFavoritesContainer extends React.Component {
-  componentDidMount() {
-    const { userFavorited } = this.props
-    logic.init(userFavorited)
-  }
+const UserFavoritedContainer = ({ userFavorited }) => {
+  useInit(userFavorited)
 
-  render() {
-    const { userFavorited } = this.props
+  const {
+    pagedData,
+    parentView,
+    curView,
+    curCategoryData,
+    curThread,
+    viewingUser,
+  } = userFavorited
 
-    const {
-      pagedData,
-      parentView,
-      curView,
-      curCategoryData,
-      curThread,
-      viewingUser,
-    } = userFavorited
+  const { totalCount } = pagedData
 
-    const { totalCount } = pagedData
+  return (
+    <div>
+      {parentView === 'CATEGORY_LIST' ? (
+        <FavoritesCats onSelect={onCatSelect} displayMode="list" />
+      ) : (
+        <React.Fragment>
+          <Breadcrumbs
+            gotoParent={backToCategoryList}
+            category={curCategoryData}
+            curThread={curThread}
+            totalCount={totalCount}
+            changeFavoriteThread={changeFavoriteThread}
+          />
 
-    return (
-      <div>
-        {parentView === 'CATEGORY_LIST' ? (
-          <FavoritesCats onSelect={logic.onCatSelect} displayMode="list" />
-        ) : (
-          <React.Fragment>
-            <Breadcrumbs
-              gotoParent={logic.backToCategoryList}
-              category={curCategoryData}
-              curThread={curThread}
-              totalCount={totalCount}
-              changeFavoriteThread={logic.changeFavoriteThread}
-            />
-
-            <PagedContents
-              data={pagedData}
-              thread={curThread}
-              curView={curView}
-              emptyPrefix={`未找到 ${viewingUser.nickname} 收藏的`}
-              onPageChange={logic.reload}
-              onPreview={logic.onPreview}
-            />
-          </React.Fragment>
-        )}
-      </div>
-    )
-  }
+          <PagedContents
+            data={pagedData}
+            thread={curThread}
+            curView={curView}
+            emptyPrefix={`未找到 ${viewingUser.nickname} 收藏的`}
+            onPageChange={onReload}
+            onPreview={onPreview}
+          />
+        </React.Fragment>
+      )}
+    </div>
+  )
 }
 
-export default connectStore(UserFavoritesContainer)
+export default connectStore(UserFavoritedContainer)

containers/UserFavorited/logic.js

@@ -1,4 +1,5 @@
 import R from 'ramda'
+import { useEffect } from 'react'
 
 import {
   buildLog,
@@ -53,7 +54,7 @@ export const loadVideos = (page = 1) =>
 export const loadRepos = (page = 1) =>
   sr71$.query(S.favoritedRepos, getQueryArgs(page))
 
-export const reload = page => {
+export const onReload = page => {
   switch (store.curThread) {
     case THREAD.JOB:
       return loadJobs(page)
@@ -72,7 +73,7 @@ export const reload = page => {
 export const changeFavoriteThread = curThread => {
   store.markState({ curThread })
   // TODO:  change route
-  reload()
+  onReload()
 }
 
 export const onPreview = data => {
@@ -109,9 +110,18 @@ const DataSolver = [
 ]
 const ErrSolver = []
 
-export const init = _store => {
-  store = _store
-
-  if (sub$) return false
-  sub$ = sr71$.data().subscribe($solver(DataSolver, ErrSolver))
+// ###############################
+// init & uninit
+// ###############################
+export const useInit = _store => {
+  useEffect(() => {
+    store = _store
+    if (sub$) return false
+    sub$ = sr71$.data().subscribe($solver(DataSolver, ErrSolver))
+
+    return () => {
+      sub$.unsubscribe()
+      sub$ = null
+    }
+  }, [_store])
 }

containers/UserFavorited/store.js

@@ -6,8 +6,8 @@
 import { types as t, getParent } from 'mobx-state-tree'
 // import R from 'ramda'
 
-/* import { markStates, buildLog, stripMobx, TYPE, FILTER } from '@utils' */
 import { markStates, buildLog, TYPE, stripMobx, THREAD } from '@utils'
+
 import {
   PagedPosts,
   PagedJobs,