adding search functionalty

.gitignore

@@ -64,4 +64,11 @@ typings/
 .vuepress/dist
 
 # Serverless directories
-.serverless
+.serverles
+
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history

.vscode/settings.json

@@ -1,4 +1,8 @@
 {
  "editor.lineHeight": 35,
- "editor.suggestLineHeight": 0
+ "editor.suggestLineHeight": 0,
+ "files.exclude": {
+ "**/.vscode": true,
+ "**/node_modules": true
+ }
 }

client/src/components/Profile/Profile.js

@@ -1,5 +1,10 @@
 import React from "react";
+import UserInfo from "./UserInfo";
 
-const Profile = () => <div>Profile</div>;
+const Profile = ({ session }) => (
+ <div>
+ <UserInfo session={session} />
+ </div>
+);
 
 export default Profile;

client/src/components/Profile/UserInfo.js

@@ -0,0 +1,9 @@
+import React from "react";
+
+const UserInfo = ({ session }) => (
+ <div>
+ <h3>user info</h3>
+ <p>username: {session.getCurrentUser.username}</p>
+ </div>
+);
+export default UserInfo;

client/src/components/Shot/Search.js

@@ -1,13 +1,47 @@
-import React from "react";
+import React, { Component } from "react";
+import { ApolloConsumer } from "react-apollo";
 import { SEARCH_SHOTS } from "../../queries";
-import { Query } from "react-apollo";
+import SearchItem from "./SearchItem";
 
-const Search = () => { 
- return (
- <div className="App">
- <input type="search" />
- </div>
- );
+class Search extends Component {
+ state = {
+ searchResults: []
+ };
+ handleChange = ({ searchShots }) => {
+ this.setState({
+ searchResults: searchShots
+ });
+ };
+ render() {
+ const { searchResults } = this.state;
+ return (
+ <ApolloConsumer>
+ {client => {
+ return (
+ <div className="App">
+ <input
+ type="search"
+ className="search"
+ placeholder="Search"
+ onChange={async event => {
+ event.persist();
+ const { data } = await client.query({
+ query: SEARCH_SHOTS,
+ variables: { searchTerm: event.target.value }
+ });
+ this.handleChange(data);
+ }}
+ />
+ <ul>
+ {searchResults.map(shot => (
+ <SearchItem key={shot._id} {...shot} />
+ ))}
+ </ul>
+ </div>
+ );
+ }}
+ </ApolloConsumer>
+ );
+ }
 }
-
 export default Search;

client/src/components/Shot/SearchItem.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { Link } from "react-router-dom";
+
+const SearchItem = ({_id, name, likes}) => {
+ return (
+ <li>
+ <Link to={`/shots/${_id}`}>
+ <h4>{name}</h4>
+ <p>{likes}</p>
+ </Link>
+ <p />
+ </li>
+ );
+};
+export default SearchItem;

client/src/index.js

@@ -53,9 +53,9 @@ const Root = ({ refetch, session }) => (
  <Route path="/search" component={Search} />
  <Route path="/signin" render={() => <Signin refetch={refetch} />} />
  <Route path="/signup" render={() => <Signup refetch={refetch} />} />
- <Route path="/Shot/add" render={() => <AddShot session={session} />} />
- <Route path="/Shots/:_id" component={ShotPage} />} />
- <Route path="/Profile" component={Profile} />
+ <Route path="/shot/add" render={() => <AddShot session={session} />} />
+ <Route path="/shots/:_id" component={ShotPage} />} />
+ <Route path="/profile" render={() => <Profile session={session} />} />
  <Redirect to="/" />
  </Switch>
  </div>

client/src/queries/index.js

@@ -33,19 +33,11 @@ export const GET_CURRENT_USER = gql`
  }
 `;
 
-// ShotS MUTATIONS
+// SHOT MUTATIONS
 
 export const ADD_SHOT = gql`
- mutation(
- $name: String!
- $description: String!
- $username: String!
- ) {
- addShot(
- name: $name
- description: $description
- username: $username
- ) {
+ mutation($name: String!, $description: String!, $username: String!) {
+ addShot(name: $name, description: $description, username: $username) {
  _id
  name
  description
@@ -56,11 +48,15 @@ export const ADD_SHOT = gql`
  }
 `;
 
-// export const SEARCH_SHOT = gql`
-// query($searchTerm: String) {
-
-// }
-// `
+export const SEARCH_SHOTS = gql`
+ query($searchTerm: String) {
+ searchShots(searchTerm: $searchTerm) {
+ _id
+ name
+ likes
+ }
+ }
+`;
 
 // USER QUERIES
 

models/Shot.js

@@ -9,4 +9,8 @@ const ShotSchema = new Schema({
  username: { type: String }
 });
 
+ShotSchema.index({
+ "$**": "text"
+});
+
 module.exports = mongoose.model("Shot", ShotSchema);

resolvers.js

@@ -20,7 +20,17 @@ exports.resolvers = {
  },
  searchShots: async (root, { searchTerm }, { Shot }) => {
  if (searchTerm) {
- // search
+ const searchResults = await Shot.find(
+ {
+ $text: { $search: searchTerm }
+ },
+ {
+ score: { $meta: "textScore" }
+ }
+ ).sort({
+ score: { $meta: "textScore" }
+ });
+ return searchResults;
  } else {
  const shots = await Shot.find().sort({
  likes: "desc",

schema.js

@@ -21,7 +21,6 @@ exports.typeDefs = `
  getAllShots: [Shot]
  getShot(_id: ID!): Shot
  searchShots(searchTerm: String): [Shot]
-
  getCurrentUser: User
  }