Merge pull request #69 from ClaytonWWilson/search_page

added search page

functions/handlers/topic.js

@@ -1,4 +1,3 @@
-/* eslint-disable promise/always-return */
 const { admin, db } = require("../util/admin");
 exports.putTopic = (req, res) => {
   const newTopic = {
@@ -52,7 +51,7 @@ exports.deleteTopic = (req, res) => {
       }
     })
     .then(() => {
-      res.json({ message: "Topic successfully deleted!" });
+      return res.json({ message: "Topic successfully deleted!" });
     })
     .catch(err => {
       console.error(err);

functions/handlers/users.js

@@ -54,7 +54,7 @@ exports.signup = (req, res) => {
 
   db.doc(`/users/${newUser.handle}`)
     .get()
-    .then((doc) => {
+    .then(doc => {
       if (doc.exists) {
         return res
           .status(400)
@@ -64,11 +64,11 @@ exports.signup = (req, res) => {
         .auth()
         .createUserWithEmailAndPassword(newUser.email, newUser.password);
     })
-    .then((data) => {
+    .then(data => {
       userId = data.user.uid;
       return data.user.getIdToken();
     })
-    .then((idToken) => {
+    .then(idToken => {
       token = idToken;
       const userCred = {
         email: newUser.email,
@@ -82,7 +82,7 @@ exports.signup = (req, res) => {
     .then(() => {
       return res.status(201).json({ token });
     })
-    .catch((err) => {
+    .catch(err => {
       console.error(err);
       if (err.code === "auth/email-already-in-use") {
         return res.status(500).json({ email: "This email is already taken." });
@@ -120,62 +120,76 @@ exports.login = (req, res) => {
   // Email/username field is username since it's not in email format
   if (!user.email.match(emailRegEx)) {
     var userDoc = db.collection("users").doc(`${user.email}`);
-    userDoc.get()
-    .then(function(doc) {
+    userDoc
+      .get()
+      .then(function(doc) {
         if (doc.exists) {
           user.email = doc.data().email;
-        }
-        else {
-          return res.status(403).json({ general: "Invalid credentials. Please try again." });
+        } else {
+          return res
+            .status(403)
+            .json({ general: "Invalid credentials. Please try again." });
         }
         return;
-    })
-    .then(function() {
-      firebase
-      .auth()
-      .signInWithEmailAndPassword(user.email, user.password)
-      .then((data) => {
-        return data.user.getIdToken();
       })
-      .then((token) => {
-        return res.status(200).json({ token });
+      .then(function() {
+        firebase
+          .auth()
+          .signInWithEmailAndPassword(user.email, user.password)
+          .then(data => {
+            return data.user.getIdToken();
+          })
+          .then(token => {
+            return res.status(200).json({ token });
+          })
+          .catch(err => {
+            console.error(err);
+            if (
+              err.code === "auth/user-not-found" ||
+              err.code === "auth/invalid-email" ||
+              err.code === "auth/wrong-password"
+            ) {
+              return res
+                .status(403)
+                .json({ general: "Invalid credentials. Please try again." });
+            }
+            return res.status(500).json({ error: err.code });
+          });
+        return;
       })
-      .catch((err) => {
-        console.error(err);
-        if (err.code === "auth/user-not-found" || err.code === "auth/invalid-email" || err.code === "auth/wrong-password") {
-          return res.status(403).json({ general: "Invalid credentials. Please try again." });
+      .catch(function(err) {
+        if (!doc.exists) {
+          return res
+            .status(403)
+            .json({ general: "Invalid credentials. Please try again." });
         }
-        return res.status(500).json({ error: err.code });
+        return res.status(500).send(err);
       });
-      return;
-    })
-    .catch(function(err) {
-      if(!doc.exists) {
-        return res.status(403).json({ general: "Invalid credentials. Please try again." });
-      }
-      return res.status(500).send(err);
-    });
   }
   // Email/username field is username
   else {
     firebase
-    .auth()
-    .signInWithEmailAndPassword(user.email, user.password)
-    .then((data) => {
-      return data.user.getIdToken();
-    })
-    .then((token) => {
-      return res.status(200).json({ token });
-    })
-    .catch((err) => {
-      console.error(err);
-      if (err.code === "auth/user-not-found" || err.code === "auth/invalid-email" || err.code === "auth/wrong-password") {
-        return res
-              .status(403)
-              .json({ general: "Invalid credentials. Please try again." });
-      }
-      return res.status(500).json({ error: err.code });
-    });
+      .auth()
+      .signInWithEmailAndPassword(user.email, user.password)
+      .then(data => {
+        return data.user.getIdToken();
+      })
+      .then(token => {
+        return res.status(200).json({ token });
+      })
+      .catch(err => {
+        console.error(err);
+        if (
+          err.code === "auth/user-not-found" ||
+          err.code === "auth/invalid-email" ||
+          err.code === "auth/wrong-password"
+        ) {
+          return res
+            .status(403)
+            .json({ general: "Invalid credentials. Please try again." });
+        }
+        return res.status(500).json({ error: err.code });
+      });
   }
 };
 
@@ -185,47 +199,52 @@ exports.deleteUser = (req, res) => {
   firebase.auth().onAuthStateChanged(function(user) {
     currentUser = user;
     if (currentUser) {
-      var post_query = db.collection("posts").where("userHandle", "==", req.user.handle);
-      post_query.get()
-      .then(function(myPosts) {
-        myPosts.forEach(function(doc) {
-          doc.ref.delete();
+      var post_query = db
+        .collection("posts")
+        .where("userHandle", "==", req.user.handle);
+      post_query
+        .get()
+        .then(function(myPosts) {
+          myPosts.forEach(function(doc) {
+            doc.ref.delete();
+          });
+          return;
+        })
+        .then(function() {
+          res
+            .status(200)
+            .send("Successfully removed all user's posts from database.");
+          return;
+        })
+        .catch(function(err) {
+          res
+            .status(500)
+            .send("Failed to remove all user's posts from database.", err);
         });
-        return;
-      })
-      .then(function() {
-        res.status(200).send("Successfully removed all user's posts from database.");
-        return;
-      })
-      .catch(function(err) {
-        res.status(500).send("Failed to remove all user's posts from database.", err);
-      });
 
+      db.collection("users")
+        .doc(`${req.user.handle}`)
+        .delete()
+        .then(function() {
+          res.status(200).send("Sucessfully removed user from database.");
+          return;
+        })
+        .catch(function(err) {
+          res.status(500).send("Failed to remove user from database.", err);
+        });
 
-
-      db.collection("users").doc(`${req.user.handle}`).delete()
-      .then(function() {
-        res.status(200).send("Sucessfully removed user from database.");
-        return;
-      })
-      .catch(function(err) {
-        res.status(500).send("Failed to remove user from database.", err);
-      });
-
-
-      
-      currentUser.delete()
-      .then(function() {
-        console.log("Successfully deleted user.");
-        res.status(200).send("Sucessfully deleted user.");
-        return;
-      })
-      .catch(function(err) {
-        console.log("Failed to delete user.", err);
-        res.status(500).send("Failed to delete user.");
-      });
-    } 
-    else {
+      currentUser
+        .delete()
+        .then(function() {
+          console.log("Successfully deleted user.");
+          res.status(200).send("Sucessfully deleted user.");
+          return;
+        })
+        .catch(function(err) {
+          console.log("Failed to delete user.", err);
+          res.status(500).send("Failed to delete user.");
+        });
+    } else {
       console.log("Failed to deleter user or cannot get user.");
       res.status(500).send("Failed to deleter user or cannot get user.");
     }
@@ -237,10 +256,10 @@ exports.getProfileInfo = (req, res) => {
   db.collection("users")
     .doc(req.user.handle)
     .get()
-    .then((data) => {
+    .then(data => {
       return res.status(200).json(data.data());
     })
-    .catch((err) => {
+    .catch(err => {
       console.error(err);
       return res.status(500).json(err);
     });
@@ -258,13 +277,11 @@ exports.updateProfileInfo = (req, res) => {
     .set(profileData, { merge: true })
     .then(() => {
       console.log(`${req.user.handle}'s profile info has been updated.`);
-      return res
-        .status(201)
-        .json({
-          general: `${req.user.handle}'s profile info has been updated.`
-        });
+      return res.status(201).json({
+        general: `${req.user.handle}'s profile info has been updated.`
+      });
     })
-    .catch((err) => {
+    .catch(err => {
       console.error(err);
       return res.status(500).json({
         error: "Error updating profile data"
@@ -276,14 +293,15 @@ exports.getUserDetails = (req, res) => {
   let userData = {};
   db.doc(`/users/${req.body.handle}`)
     .get()
-    .then((doc) => {
+    .then(doc => {
       if (doc.exists) {
         userData = doc.data();
-        return res.status(200).json({userData});
-    } else {
-      return res.status(400).json({error: "User not found."})
-    }})
-    .catch((err) => {
+        return res.status(200).json({ userData });
+      } else {
+        return res.status(400).json({ error: "User not found." });
+      }
+    })
+    .catch(err => {
       console.error(err);
       return res.status(500).json({ error: err.code });
     });
@@ -293,17 +311,34 @@ exports.getAuthenticatedUser = (req, res) => {
   let credentials = {};
   db.doc(`/users/${req.user.handle}`)
     .get()
-    .then((doc) => {
+    .then(doc => {
       if (doc.exists) {
         credentials = doc.data();
-        return res.status(200).json({credentials});
-    } else {
-      return res.status(400).json({error: "User not found."})
-    }})
-    .catch((err) => {
+        return res.status(200).json({ credentials });
+      } else {
+        return res.status(400).json({ error: "User not found." });
+      }
+    })
+    .catch(err => {
       console.error(err);
       return res.status(500).json({ error: err.code });
     });
 };
 
-
+exports.getUserHandles = (req, res) => {
+  admin
+    .firestore()
+    .collection("users")
+    .get()
+    .then(data => {
+      let users = [];
+      data.forEach(function(doc) {
+        users.push(doc.data().handle);
+      });
+      return res.status(200).json(users);
+    })
+    .catch(err => {
+      console.error(err);
+      return res.status(500).json({ error: "Failed to get all user handles." });
+    });
+};

functions/index.js

@@ -16,7 +16,8 @@ const {
   login,
   signup,
   deleteUser,
-  updateProfileInfo
+  updateProfileInfo,
+  getUserHandles
 } = require("./handlers/users");
 
 // Adds a user to the database and registers them in firebase with
@@ -41,6 +42,9 @@ app.post("/updateProfileInfo", fbAuth, updateProfileInfo);
 
 app.get("/user", fbAuth, getAuthenticatedUser);
 
+// get user handles with search phase
+app.get("/getUserHandles", fbAuth, getUserHandles);
+
 /*------------------------------------------------------------------*
  *  handlers/post.js                                                *
  *------------------------------------------------------------------*/

twistter-frontend/src/App.js

@@ -31,6 +31,7 @@ import Delete from "./pages/Delete";
 import writeMicroblog from "./Writing_Microblogs.js";
 import editProfile from "./pages/editProfile";
 import userLine from "./Userline.js";
+import Search from "./pages/Search.js";
 
 const theme = createMuiTheme(themeObject);
 
@@ -75,6 +76,10 @@ class App extends Component {
                 <Route exact path="/home" component={home} />
                 <Route exact path="/user" component={user} />
                 <Route exact path="/edit" component={editProfile} />
+                <Route exact path="/search" component={Search} />
+
+                <AuthRoute exact path="/" component={home} />
+
               </Switch>
             </div>
           </Router>

twistter-frontend/src/pages/Search.js

@@ -0,0 +1,74 @@
+import React, { Component } from "react";
+// import props
+import { TextField, Paper } from "@material-ui/core";
+import Grid from "@material-ui/core/Grid";
+import Axios from "axios";
+import user from "./user.js";
+
+import {
+  BrowserRouter as Router,
+  Switch,
+  Route,
+  Link,
+  useRouteMatch
+} from "react-router-dom";
+
+export class Search extends Component {
+  state = {
+    searchPhase: null,
+    searchResult: null
+  };
+
+  handleSearch(event) {
+    Axios.get("/getUserHandles").then(res => {
+      this.setState({
+        searchResult: res.data
+      });
+    });
+    console.log(this.state.searchPhase);
+  }
+
+  handleInput(event) {
+    this.setState({
+      searchPhase: event.target.value
+    });
+    this.handleSearch();
+  }
+
+  handleRedirect() {
+    location.reload();
+  }
+
+  render() {
+    let resultMarkup = this.state.searchResult ? (
+      this.state.searchResult.map(result => (
+        <Router>
+          <div>
+            <Link to={`/user`}>{result}</Link>
+          </div>
+        </Router>
+      ))
+    ) : (
+      //   console.log(this.state.searchResult)
+      <p> searching... </p>
+    );
+
+    return (
+      <Grid>
+        <Grid>
+          <TextField
+            id="standard-required"
+            label="Search"
+            defaultValue="username"
+            margin="normal"
+            value={this.state.searchPhase}
+            onChange={event => this.handleInput(event)}
+          />
+        </Grid>
+        <Grid>{resultMarkup}</Grid>
+      </Grid>
+    );
+  }
+}
+
+export default Search;