diff --git a/backend/Schemas/TypeDefs/PlantType.js b/backend/Schemas/TypeDefs/PlantType.js index dcd6b41917de966bdf63074bab2c074c600da703..e696918d3474d00186c9b6cb9486edac9f7b72ff 100644 --- a/backend/Schemas/TypeDefs/PlantType.js +++ b/backend/Schemas/TypeDefs/PlantType.js @@ -10,7 +10,7 @@ const PlantType = new GraphQLObjectType({ name: 'Plant', description: 'This represents a plant', fields: () => ({ - id: { type: GraphQLNonNull(GraphQLInt) }, + // id: { type: GraphQLNonNull(GraphQLInt) }, plantName: { type: GraphQLNonNull(GraphQLString) }, maxWaterUsage: { type: GraphQLNonNull(GraphQLString) }, // might need to change to int later minMoistureLevel: { type: GraphQLNonNull(GraphQLString) }, diff --git a/ui-subsystem/src/GraphQL/Mutations.js b/ui-subsystem/src/GraphQL/Mutations.js new file mode 100644 index 0000000000000000000000000000000000000000..ea54dbe79d60b224884cec09115824c2a6cfb8b7 --- /dev/null +++ b/ui-subsystem/src/GraphQL/Mutations.js @@ -0,0 +1,12 @@ +import {gql} from '@apollo/client'; + +export const CREATE_PLANT_MUTATION = gql` +mutation createPlant($plantName: String! $maxWaterUsage: String! $minMoistureLevel: String! $hours: String!) { + createPlant(plantName: $plantName maxWaterUsage: $maxWaterUsage minMoistureLevel: $minMoistureLevel hours: $hours) { + plantName + maxWaterUsage + minMoistureLevel + hours + } +} +` \ No newline at end of file diff --git a/ui-subsystem/src/GraphQL/Queries.js b/ui-subsystem/src/GraphQL/Queries.js new file mode 100644 index 0000000000000000000000000000000000000000..3435b8dc8f084fe31b6e34ca204c7de965c3bd25 --- /dev/null +++ b/ui-subsystem/src/GraphQL/Queries.js @@ -0,0 +1,15 @@ +import {gql} from '@apollo/client'; + +export const PLANTS_QUERY = gql` +query { + plants { + id + plantName + maxWaterUsage + minMoistureLevel + hours + } +} +` + + diff --git a/ui-subsystem/src/components/TestingMutation.js b/ui-subsystem/src/components/TestingMutation.js new file mode 100644 index 0000000000000000000000000000000000000000..7c4901f2819159afbc4dbe96eb08246432609213 --- /dev/null +++ b/ui-subsystem/src/components/TestingMutation.js @@ -0,0 +1,62 @@ +import React, { useState } from "react"; +import { CREATE_PLANT_MUTATION } from "../GraphQL/Mutations"; +import { useMutation } from "@apollo/client"; + +function Form() { + const [plantName, setPlantName] = useState(""); + const [maxWaterUsage, setMaxWaterUsage] = useState(""); + const [minMoistureLevel, setMinMoistureLevel] = useState(""); + const [hours, setHours] = useState(""); + + const [createPlant, { error }] = useMutation(CREATE_PLANT_MUTATION); + + const addPlant = () => { + createPlant({ + variables: { + plantName: plantName, + maxWaterUsage: maxWaterUsage, + minMoistureLevel: minMoistureLevel, + hours: hours, + }, + }); + + if (error) { + console.log(error); + } + }; + return ( + <div> + <input + type="text" + placeholder="Plant Name" + onChange={(e) => { + setPlantName(e.target.value); + }} + /> + <input + type="text" + placeholder="Max Water Usage" + onChange={(e) => { + setMaxWaterUsage(e.target.value); + }} + /> + <input + type="text" + placeholder="Min Moisture Level" + onChange={(e) => { + setMinMoistureLevel(e.target.value); + }} + /> + <input + type="text" + placeholder="Hours" + onChange={(e) => { + setHours(e.target.value); + }} + /> + <button onClick={addPlant}> Create Plant</button> + </div> + ); +} + +export default Form; \ No newline at end of file diff --git a/ui-subsystem/src/components/TestingQueries.js b/ui-subsystem/src/components/TestingQueries.js new file mode 100644 index 0000000000000000000000000000000000000000..ece39fb2d2e40e57a490c4059543e547241f3a81 --- /dev/null +++ b/ui-subsystem/src/components/TestingQueries.js @@ -0,0 +1,25 @@ +import React, { useState, useEffect } from 'react'; +import { useQuery, gql } from '@apollo/client'; +import { PLANTS_QUERY } from '../GraphQL/Queries'; + +function GetPlants() { + const [plants, setPlants] = useState([]) + const {error, loading, data} = useQuery(PLANTS_QUERY) + + + useEffect(() => { + if (data) { + setPlants(data.plants) + } + }, [data]) + + return ( + <div> + {plants.map((val) => { + return <h1>{val.plantName}</h1> + })} + </div> + ) +} + +export default GetPlants; \ No newline at end of file