Merge pull request #165 from oss-slu/161-search-published-entries

Fixes 161 search published entries

.github/workflows/Native.yml

@@ -2,7 +2,7 @@ name: App test
 
 on:
   push:
-    branches: [ main,Home-screen-navigation-issue ]
+    branches: [ main,Home-screen-navigation-issue, 161-search-published-entries ]
   pull_request:
     branches: [ main ]
 

__tests__/HomeScreen.test.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import { render, fireEvent, waitFor } from '@testing-library/react-native';
+import { Alert } from 'react-native';
+import AddNoteScreen from '../lib/screens/AddNoteScreen';
+import * as Location from 'expo-location';
+import HomeScreen from '../lib/screens/HomeScreen';
+
+// Mock external dependencies
+jest.mock('../lib/components/ThemeProvider', () => ({
+  useTheme: () => ({
+    theme: 'mockedTheme', // Provide a mocked theme object
+  }),
+}));
+
+// Mock expo-location module with TypeScript type support
+jest.mock('expo-location', () => ({
+  getForegroundPermissionsAsync: jest.fn(),
+  requestForegroundPermissionsAsync: jest.fn(),
+  getCurrentPositionAsync: jest.fn(),
+}));
+
+// Mock API calls directly
+const mockWriteNewNote = jest.fn();
+jest.mock('../lib/utils/api_calls', () => ({
+  writeNewNote: mockWriteNewNote,
+}));
+
+beforeEach(() => {
+  // Clear mocks before each test
+  jest.clearAllMocks();
+
+  // Mock console methods to avoid unnecessary log outputs in tests
+  jest.spyOn(console, 'log').mockImplementation(() => {});
+  jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+
+afterEach(() => {
+  // Restore the original console methods
+  console.log.mockRestore();
+  console.error.mockRestore();
+});
+
+describe('AddNoteScreen', () => {
+  it('renders without crashing', () => {
+    const routeMock = { params: { untitledNumber: 1 } };
+    const { getByTestId } = render(<HomeScreen route={routeMock as any} />);
+
+    // Check if the RichEditor is rendered
+    expect(getByTestId('searchBar')).toBeTruthy();
+  });
+
+});

__tests__/__snapshots__/SetTime.test.tsx.snap

@@ -38,8 +38,8 @@ exports[`LocationWindow renders without crashing 1`] = `
           }
         }
       >
-        9/18/2024
-05:01 PM
+        9/23/2024
+09:39 PM
       </Text>
     </View>
     <View

lib/screens/HomeScreen.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import {
   Platform,
   View,
@@ -9,6 +9,7 @@ import {
   Dimensions,
   SafeAreaView,
   Image,
+  TextInput,
 } from "react-native";
 import { Ionicons } from "@expo/vector-icons";
 import { User } from "../models/user_class";
@@ -237,7 +238,7 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
       width: "100%",
       alignItems: "center",
       zIndex: 1000,
-      marginTop: -12,
+      marginTop: -13,
     },
     horizontalLine: {
       borderBottomColor: theme.text,
@@ -254,7 +255,7 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
       width: "100%",
       //padding: 10,
       flexDirection: "row",
-      height: 140,
+      height: 185,
       paddingLeft: width * 0.03,
       paddingRight: width * 0.03,
     },
@@ -331,6 +332,16 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
       padding: 10,
       alignSelf: "center",
     },
+    seachBar:{
+      backgroundColor: theme.homeColor,
+      borderRadius: 20,
+      fontSize: 18,
+      padding: 20,
+      margin: 20,
+      color: theme.text,
+      borderWidth: 3,
+
+    },
   });
 
   const sideMenu = (data: any, rowMap: any) => {
@@ -395,9 +406,20 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
   }
 
   const renderList = (notes: Note[]) => {
+    const filteredNotes = searchQuery
+    ? notes.filter(note => {
+        const lowerCaseQuery = searchQuery.toLowerCase();
+        const noteTime = new Date(note.time);
+        const formattedTime = formatDate(noteTime);
+        return (
+          note.title.toLowerCase().includes(lowerCaseQuery) || formattedTime.includes(lowerCaseQuery)
+        );
+      })
+    : notes;
+
     return isPrivate ? (
       <SwipeListView
-        data={notes}
+        data={filteredNotes}
         renderItem={renderItem}
         renderHiddenItem={sideMenu}
         leftActivationValue={160}
@@ -412,7 +434,7 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
       />
     ) : (
       <SwipeListView
-        data={notes}
+        data={filteredNotes}
         renderItem={renderItem}
         keyExtractor={(item) => item.id}
       />
@@ -517,7 +539,33 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
     );
   };
 
+  //Part of searchbar:
+  const [searchQuery, setSearchQuery] = useState("");
+
+  const handleSearch = (query: string) => {
+    setSearchQuery(query);
+  };
+  const formatDate = (date: Date) => {
+    const day = date.getDate().toString();
+    const month = (date.getMonth() + 1).toString(); // Months are zero-based
+    const year = date.getFullYear();
+    return `${month}/${day}/${year}`;
+  };
+
+  const filteredNotes = useMemo(() => {
+    return notes.filter(note => {
+      const noteTime = new Date(note.time);
+      const formattedTime = formatDate(noteTime);
+
+      return note.title.toLowerCase().includes(searchQuery.toLowerCase()) || 
+             formattedTime.includes(searchQuery.toLowerCase());
+    });
+  }, [notes, searchQuery]);
+
+
+
   return (
+
     <View style={styles.container}>
       <View style={styles.topView}>
         <View
@@ -544,6 +592,7 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
           <Image source={require('../../assets/icon.png')} style={{width: width * 0.105, height: width * 0.105, marginEnd: width * 0.435}} />
         </View>
       </View>
+
       <View style={styles.dropdown}>
         <DropDownPicker
           open={open}
@@ -568,7 +617,7 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
             borderWidth: 0, 
             backgroundColor: theme.homeColor,
           }}
-          placeholder={`${items.find(item => item.value === value)?.label || 'Select an option'} (${notes.length})`}
+          placeholder={`${items.find(item => item.value === value)?.label || 'Select an option'} (${filteredNotes.length})`}
           placeholderStyle={{
             textAlign: 'center',
             fontSize: 22,
@@ -585,6 +634,12 @@ const HomeScreen: React.FC<HomeScreenProps> = ({ navigation, route }) => {
           showArrowIcon={true}
         /> 
       </View>
+      <TextInput
+          testID="searchBar"
+          placeholder="Search notes.."
+          onChangeText={handleSearch}
+          style= {styles.seachBar}
+        />
       <View style={styles.horizontalLine} />
       <View style={styles.scrollerBackgroundColor}>
         {rendering ? <NoteSkeleton /> : renderList(notes)}