fix adding topics

apps/mobile/src/components/AddTopicDialog/index.js

@@ -5,6 +5,9 @@ import Icon from 'react-native-vector-icons/Feather';
 import {opacity, ph, pv, SIZE, WEIGHT} from '../../common/common';
 
 import {getElevation, ToastEvent} from '../../utils/utils';
+import {db} from '../../../App';
+import {eSendEvent} from '../../services/eventManager';
+import {eOnNewTopicAdded} from '../../services/events';
 
 export class AddTopicDialog extends React.Component {
   constructor(props) {
@@ -21,10 +24,10 @@ export class AddTopicDialog extends React.Component {
     if (!this.title)
       return ToastEvent.show('Title is required', 'error', 3000, () => {}, '');
 
-    //db.addTopicToNotebook(toEdit.dateCreated, title);
-
+    db.addTopicToNotebook(this.props.notebookID, this.title);
+    eSendEvent(eOnNewTopicAdded);
     ToastEvent.show('New topic added', 'success', 3000, () => {}, '');
-    close(true);
+    this.close();
   };
 
   open() {
@@ -49,7 +52,10 @@ export class AddTopicDialog extends React.Component {
         animated
         animationType="fade"
         transparent={true}
-        onRequestClose={() => (refs = [])}>
+        onRequestClose={() => {
+          refs = [];
+          this.close();
+        }}>
         <View
           style={{
             width: '100%',
@@ -59,7 +65,7 @@ export class AddTopicDialog extends React.Component {
             alignItems: 'center',
           }}>
           <TouchableOpacity
-            onPress={() => close()}
+            onPress={() => this.close()}
             style={{
               width: '100%',
               height: '100%',

apps/mobile/src/components/DialogManager/index.js

@@ -295,7 +295,7 @@ export class DialogManager extends Component {
     this.addNotebooksDialog.close();
   };
 
-  showAddTopic = () => {
+  showAddTopic = notebook => {
     this.setState({
       item: notebook,
     });
@@ -452,11 +452,11 @@ export class DialogManager extends Component {
 
         <AddTopicDialog
           ref={ref => (this.addTopicsDialog = ref)}
-          toEdit={item}
+          toEdit={item.type === 'topic' ? item : null}
           notebookID={
             actionSheetData.extraData
               ? actionSheetData.extraData.notebookID
-              : null
+              : item.dateCreated
           }
           colors={colors}
         />

apps/mobile/src/services/events.js

@@ -55,3 +55,5 @@ export const eHideToast = '526';
 export const eThemeUpdated = '527';
 
 export const eScrollEvent = '528';
+
+export const eOnNewTopicAdded = '529';

apps/mobile/src/views/Notebook/index.js

@@ -10,7 +10,15 @@ import {
   eSubscribeEvent,
   eUnSubscribeEvent,
 } from '../../services/eventManager';
-import {eMoveNoteDialogNavigateBack, eScrollEvent} from '../../services/events';
+import {
+  eMoveNoteDialogNavigateBack,
+  eScrollEvent,
+  eOnNewTopicAdded,
+} from '../../services/events';
+import SelectionHeader from '../../components/SelectionHeader';
+import SelectionWrapper from '../../components/SelectionWrapper';
+import {AddTopicEvent} from '../../components/DialogManager';
+import {db} from '../../../App';
 
 export const Notebook = ({navigation}) => {
   const [state, dispatch] = useTracked();
@@ -18,15 +26,30 @@ export const Notebook = ({navigation}) => {
   const [topics, setTopics] = useState([]);
   const [refreshing, setRefreshing] = useState(false);
   let params = navigation.state.params;
-
+  let notebook;
   let isFocused = useIsFocused();
 
   useEffect(() => {
+    params = navigation.state.params;
     let topic = params.notebook.topics;
-
+    notebook = params.notebook;
+    console.log(navigation);
     setTopics([...topic]);
   }, []);
 
+  useEffect(() => {
+    eSubscribeEvent(eOnNewTopicAdded, () => {
+      notebook = db.getNotebook(navigation.state.params.notebook.dateCreated);
+      setTopics([...notebook.topics]);
+    });
+    return () => {
+      eUnSubscribeEvent(eOnNewTopicAdded, () => {
+        notebook = db.getNotebook(navigation.state.params.notebook.dateCreated);
+        setTopics([...notebook.topics]);
+      });
+    };
+  }, []);
+
   const handleBackPress = () => {
     navigation.goBack();
   };
@@ -47,18 +70,34 @@ export const Notebook = ({navigation}) => {
     item.dateCreated.toString() + index.toString();
 
   const renderItem = ({item, index}) => (
-    <NotebookItem
-      hideMore={params.hideMore}
-      isTopic={true}
-      noteToMove={params.note}
-      notebookID={params.notebook.dateCreated}
-      isMove={params.isMove}
-      refresh={() => {}}
-      item={item}
-      index={index}
-      colors={colors}
-      data={topics}
-    />
+    <SelectionWrapper item={item}>
+      <NotebookItem
+        hideMore={params.hideMore}
+        isTopic={true}
+        customStyle={{
+          width: selectionMode ? w - 74 : '100%',
+          marginHorizontal: 0,
+        }}
+        onLongPress={() => {
+          dispatch({
+            type: ACTIONS.SELECTION_MODE,
+            enabled: !selectionMode,
+          });
+          dispatch({
+            type: ACTIONS.SELECTED_ITEMS,
+            item: item,
+          });
+        }}
+        noteToMove={params.note}
+        notebookID={params.notebook.dateCreated}
+        isMove={params.isMove}
+        refresh={() => {}}
+        item={item}
+        index={index}
+        colors={colors}
+        data={topics}
+      />
+    </SelectionWrapper>
   );
 
   const ListFooterComponent = (
@@ -102,9 +141,11 @@ export const Notebook = ({navigation}) => {
       placeholder={`Search in "${params.title}"`}
       heading={params.title}
       canGoBack={true}
-      data={params.notebook.topics}
+      data={topics}
       bottomButtonOnPress={() => {
-        //setAddTopic(true);
+        console.log(navigation.state.params.notebook);
+        let n = navigation.state.params.notebook;
+        AddTopicEvent(n);
       }}>
       <FlatList
         refreshControl={