add notes search

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

@@ -18,7 +18,8 @@ import {getElevation, h, w} from '../../utils/utils';
 import {Header} from '../header';
 import {Search} from '../SearchInput';
 import SelectionHeader from '../SelectionHeader';
-import {DDS} from '../../../App';
+import {DDS, db} from '../../../App';
+import {ACTIONS} from '../../provider/actions';
 export const AnimatedSafeAreaView = Animatable.createAnimatableComponent(
   SafeAreaView,
 );
@@ -45,6 +46,7 @@ export const Container = ({
   noSearch = false,
   noSelectionHeader = false,
   headerColor = null,
+  type = null,
 }) => {
   // State
   const [state, dispatch] = useTracked();
@@ -82,17 +84,25 @@ export const Container = ({
   };
 
   const onChangeText = value => {
-    //setText(value);
+    setText(value);
   };
   const onSubmitEditing = async () => {
     if (!text || text.length < 1) {
       clearSearch();
     } else {
       //setKeyword(text);
-      searchResult = await db.searchNotes(text);
+      if (type === 'notes') {
+        searchResult = await db.notes.filter(text);
+      } else if (type === 'notebooks') {
+        searchResult = await db.notebooks.filter(text);
+      } else if (type === 'topic') {
+        return;
+      } else {
+        return;
+      }
 
       if (searchResult && searchResult.length > 0) {
-        //setSearchResults([...searchResult]);
+        dispatch({type: ACTIONS.SEARCH_RESULTS, results: searchResult});
       } else {
         ToastEvent.show('No search results found', 'error', 3000, () => {}, '');
       }
@@ -111,7 +121,7 @@ export const Container = ({
 
   const clearSearch = () => {
     searchResult = null;
-    //setSearchResults([...[]]);
+    dispatch({type: ACTIONS.SEARCH_RESULTS, results: []});
   };
 
   useEffect(() => {

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

@@ -20,15 +20,9 @@ import SelectionWrapper from '../SelectionWrapper';
 
 export const NotesList = ({isGrouped = false}) => {
   const [state, dispatch] = useTracked();
-  const {
-    colors,
-    selectionMode,
-    currentEditingNote,
-    loading,
-    searchResults,
-    keyword,
-  } = state;
+  const {colors, selectionMode, currentEditingNote, loading, keyword} = state;
   const notes = [...state.notes];
+  const searchResults = [...state.searchResults];
   const [refreshing, setRefreshing] = useState(false);
   const _renderItem = ({item, index}) => (
     <SelectionWrapper
@@ -164,7 +158,34 @@ export const NotesList = ({isGrouped = false}) => {
             : notes[0]
             ? 155
             : 155 - 60,
-      }}></View>
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        paddingHorizontal: 12,
+      }}>
+      <Text
+        style={{
+          fontFamily: WEIGHT.bold,
+          color: colors.accent,
+          fontSize: SIZE.xs,
+        }}>
+        Search Results for War
+      </Text>
+      <Text
+        onPress={() => {
+          dispatch({
+            type: ACTIONS.SEARCH_RESULTS,
+            results: [],
+          });
+        }}
+        style={{
+          fontFamily: WEIGHT.regular,
+          color: colors.errorText,
+          fontSize: SIZE.xs,
+        }}>
+        Clear
+      </Text>
+    </View>
   );
 
   const _listKeyExtractor = (item, index) => item.id.toString();

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

@@ -11,7 +11,7 @@ const {Value, timing, block} = Animated;
 
 export const Search = props => {
   const [state, dispatch] = useTracked();
-  const {colors} = state;
+  const {colors, searchResults} = state;
 
   const [focus, setFocus] = useState(false);
   const inputRef = createRef();
@@ -94,12 +94,12 @@ export const Search = props => {
           style={{paddingRight: DDS.isTab ? 12 : 12}}
           onPress={() => {
             props.clear();
-            props.value.length > 0 ? props.clearSearch() : null;
+            searchResults.length > 0 ? props.clearSearch() : null;
             inputRef.current.setNativeProps({
               text: '',
             });
           }}
-          name={props.value && props.value.length > 0 ? '' : 'search'}
+          name={searchResults.length > 0 ? 'x' : 'search'}
           color={
             focus
               ? props.headerColor

apps/mobile/src/provider/actions.js

@@ -13,4 +13,5 @@ export const ACTIONS = {
   LOGIN_NAVIGATOR: 'loginNavigator',
   CURRENT_EDITING_NOTE: 'currentEditingNote',
   COLORS: 'colorNotes',
+  SEARCH_RESULTS: 'searchResults',
 };

apps/mobile/src/provider/reducer.js

@@ -112,6 +112,13 @@ export const reducer = (state, action) => {
         currentEditingNote: action.id,
       };
     }
+    case ACTIONS.SEARCH_RESULTS: {
+      let results = action.results;
+      return {
+        ...state,
+        searchResults: [...results],
+      };
+    }
     default:
       throw new Error('unknown action type');
   }

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

@@ -32,6 +32,7 @@ export const Home = ({navigation}) => {
       heading="Home"
       customIcon="menu"
       verticalMenu
+      type="notes"
       menu
       placeholder="Search all notes"
       canGoBack={false}