From 9c0e997f100628138b333d53e8710d5ae2545a00 Mon Sep 17 00:00:00 2001 From: Riccardo Date: Wed, 6 Jan 2021 16:00:35 +0100 Subject: [PATCH] Progress --- client/src/components/App.js | 10 +- client/src/components/Calendar.js | 4 +- client/src/components/Events.js | 36 ---- client/src/components/UpdateAppointment.js | 185 ------------------ .../{ => appointment}/Appointment.js | 0 .../{ => appointment}/AppointmentList.js | 5 +- .../{ => appointment}/CreateAppointment.js | 26 ++- .../appointment/UpdateAppointment.js | 141 +++++++++++++ client/src/components/{ => layout}/Header.js | 6 +- server/src/models/appointment.js | 4 + server/src/resolvers.js | 13 +- server/src/resolvers/Mutation.js | 1 - server/src/resolvers/Query.js | 2 +- server/src/schema.graphql | 36 ++-- server/src/utils/db.js | 3 + 15 files changed, 207 insertions(+), 265 deletions(-) delete mode 100644 client/src/components/Events.js delete mode 100644 client/src/components/UpdateAppointment.js rename client/src/components/{ => appointment}/Appointment.js (100%) rename client/src/components/{ => appointment}/AppointmentList.js (96%) rename client/src/components/{ => appointment}/CreateAppointment.js (85%) create mode 100644 client/src/components/appointment/UpdateAppointment.js rename client/src/components/{ => layout}/Header.js (93%) diff --git a/client/src/components/App.js b/client/src/components/App.js index 87a921e..f95cccc 100644 --- a/client/src/components/App.js +++ b/client/src/components/App.js @@ -1,13 +1,12 @@ import React from 'react'; -import Header from './Header'; +import Header from './layout/Header'; import Login from './Login'; -import AppointmentList from './AppointmentList'; -import CreateAppointment from './CreateAppointment'; -import UpdateAppointemnt from './UpdateAppointment'; +import AppointmentList from './appointment/AppointmentList'; +import CreateAppointment from './appointment/CreateAppointment'; +import UpdateAppointemnt from './appointment/UpdateAppointment'; import Calendar from './Calendar'; import { Switch, Route } from 'react-router-dom'; // import ProductList from './ProductList'; -import Events from './Events'; const App = () => { return ( @@ -17,7 +16,6 @@ const App = () => { {/* */} - {/* */} diff --git a/client/src/components/Calendar.js b/client/src/components/Calendar.js index 93648fa..861e0d5 100644 --- a/client/src/components/Calendar.js +++ b/client/src/components/Calendar.js @@ -2,8 +2,8 @@ import React from 'react' import FullCalendar from '@fullcalendar/react' import dayGridPlugin from '@fullcalendar/daygrid' import interactionPlugin from "@fullcalendar/interaction"; -import { useQuery, gql } from '@apollo/client'; -import { APPOINTMENTS_QUERY } from './AppointmentList'; +import { useQuery } from '@apollo/client'; +import { APPOINTMENTS_QUERY } from './appointment/AppointmentList'; export default function Calendar() { const { data, loading } = useQuery(APPOINTMENTS_QUERY); diff --git a/client/src/components/Events.js b/client/src/components/Events.js deleted file mode 100644 index 87e3213..0000000 --- a/client/src/components/Events.js +++ /dev/null @@ -1,36 +0,0 @@ -import React from 'react'; -import { useQuery, gql } from '@apollo/client'; - -export const APPOINTMENTS_QUERY = gql` - { - allAppointments{ - title - description - start - end - } - } -`; - -var EventsList = []; - -const Events = () => { - - const { data } = useQuery(APPOINTMENTS_QUERY); - - - // if (data !== undefined) { - console.log("Data:", data.allAppointments); - EventsList = data.allAppointments; - return ( - EventsList - ); - // } else { - // return ( - // EventsList - // ) - // } - -}; - -export default EventsList; \ No newline at end of file diff --git a/client/src/components/UpdateAppointment.js b/client/src/components/UpdateAppointment.js deleted file mode 100644 index acdcb7b..0000000 --- a/client/src/components/UpdateAppointment.js +++ /dev/null @@ -1,185 +0,0 @@ -import React, { useState } from 'react'; -import { useHistory } from 'react-router'; -import { useMutation, gql, useQuery } from '@apollo/client'; -import { APPOINTMENTS_PER_PAGE } from '../constants'; -import { APPOINTMENTS_QUERY } from './AppointmentList'; -import Datetime from 'react-datetime'; -import "react-datetime/css/react-datetime.css"; - -const ONE_APPOINTMENT_QUERY = gql` - query OneAppointmentQuery( - $_id: ID! - ){ - oneAppointments(_id: $id){ - _id - title - description - start - end - } - } -`; - -const UPDATE_APPOINTMENT_MUTATION = gql` - mutation UpdateAppointmentMutation( - $_id: ID! - $title: String! - $description: String! - $start: String! - $end: String! - ) { - updateAppointment(title: $title, description: $description, start: $start, end: $end) { - _id - title - description - start - end - } - } -`; - -const UpdateAppointment = ({ match: { params: { _id } } }) => { - console.log(_id); - const history = useHistory(); - - // const { data } = useQuery(ONE_APPOINTMENT_QUERY, { - // variables: { - // _id: _id - // } - // }); - - let [formState, setFormState] = useState({ - _id: '', - title: '', - description: '', - start: '', - end: '' - }); - - const { - data, - loading, - error - } = useQuery(ONE_APPOINTMENT_QUERY, { - variables: { - _id: _id - } - }); - - if (loading) { - console.log("yes") - } else { - console.log(data); - // [formState, setFormState] = useState({ - // _id: data._id, - // title: data.title, - // description: data.description, - // start: data.start, - // end: data.end - // }); - // formState.setFormState({ - // title: "ykkg" - // }) - } - - - const [updateAppointment] = useMutation(UPDATE_APPOINTMENT_MUTATION, { - variables: { - _id: formState._id, - title: formState.title, - description: formState.description, - start: formState.start, - end: formState.end - }, - // update: (cache, { data: { createAppointment } }) => { - // const take = APPOINTMENTS_PER_PAGE; - // const skip = 0; - // const orderBy = { createdAt: 'desc' }; - - // const data = cache.readQuery({ - // query: APPOINTMENTS_QUERY, - // variables: { - // take, - // skip, - // orderBy - // } - // }); - - // cache.writeQuery({ - // query: APPOINTMENTS_QUERY, - // data: { - // allAppointments: { - // appointments: [createAppointment, ...data.allAppointments] - // } - // }, - // variables: { - // take, - // skip, - // orderBy - // } - // }); - // }, - onCompleted: () => history.push('/') - }); - - return ( -
-
{ - e.preventDefault(); - updateAppointment(); - }} - > -
- - setFormState({ - ...formState, - title: e.target.value - }) - } - type="text" - placeholder="Input title" - /> - - setFormState({ - ...formState, - description: e.target.value - }) - } - type="text" - placeholder="Input description" - /> - - setFormState({ - ...formState, - start: e - }) - } - /> - - setFormState({ - ...formState, - end: e - }) - } - /> -
- -
-
- ); -}; - -export default UpdateAppointment; \ No newline at end of file diff --git a/client/src/components/Appointment.js b/client/src/components/appointment/Appointment.js similarity index 100% rename from client/src/components/Appointment.js rename to client/src/components/appointment/Appointment.js diff --git a/client/src/components/AppointmentList.js b/client/src/components/appointment/AppointmentList.js similarity index 96% rename from client/src/components/AppointmentList.js rename to client/src/components/appointment/AppointmentList.js index 14c5394..3bdc3a1 100644 --- a/client/src/components/AppointmentList.js +++ b/client/src/components/appointment/AppointmentList.js @@ -16,7 +16,7 @@ export const APPOINTMENTS_QUERY = gql` const AppointmentList = () => { - const { data } = useQuery(APPOINTMENTS_QUERY); + const { data, loading } = useQuery(APPOINTMENTS_QUERY); if (data !== undefined) { return ( @@ -40,11 +40,8 @@ const AppointmentList = () => { export default AppointmentList; -// import React from 'react'; -// import Appointment from './Appointment'; // import { useHistory } from 'react-router'; // import { APPOINTMENTS_PER_PAGE } from '../constants'; -// import { useQuery, gql } from '@apollo/client'; // import { Link } from 'react-router-dom'; // export const FEED_QUERY = gql` diff --git a/client/src/components/CreateAppointment.js b/client/src/components/appointment/CreateAppointment.js similarity index 85% rename from client/src/components/CreateAppointment.js rename to client/src/components/appointment/CreateAppointment.js index f11f248..2a348a6 100644 --- a/client/src/components/CreateAppointment.js +++ b/client/src/components/appointment/CreateAppointment.js @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { useHistory } from 'react-router'; import { useMutation, gql } from '@apollo/client'; -import { APPOINTMENTS_PER_PAGE } from '../constants'; +import { APPOINTMENTS_PER_PAGE } from '../../constants'; import { APPOINTMENTS_QUERY } from './AppointmentList'; import Datetime from 'react-datetime'; import "react-datetime/css/react-datetime.css"; @@ -9,13 +9,15 @@ import "react-datetime/css/react-datetime.css"; const CREATE_APPOINTMENT_MUTATION = gql` mutation CreateAppointmentMutation( $title: String! - $description: String! - $start: String! - $end: String! + $description: String + $type: String! + $start: DateTime! + $end: DateTime! ) { - createAppointment(title: $title, description: $description, start: $start, end: $end) { + createAppointment(title: $title, description: $description, type: $type, start: $start, end: $end) { title description + type start end } @@ -28,6 +30,7 @@ const CreateAppointment = () => { const [formState, setFormState] = useState({ title: '', description: '', + type: '', start: '', end: '' }); @@ -36,6 +39,7 @@ const CreateAppointment = () => { variables: { title: formState.title, description: formState.description, + type: formState.type, start: formState.start, end: formState.end }, @@ -103,6 +107,18 @@ const CreateAppointment = () => { type="text" placeholder="Input description" /> + + setFormState({ + ...formState, + type: e.target.value + }) + } + type="text" + placeholder="Input Type" + /> { + const history = useHistory(); + + const { data } = useQuery(ONE_APPOINTMENT_QUERY, { + variables: { + _id: _id + } + }); + + let [formState, setFormState] = useState({ + _id: '', + title: '', + description: '', + start: '', + end: '' + }); + + const [updateAppointment] = useMutation(UPDATE_APPOINTMENT_MUTATION, { + variables: { + _id: formState._id, + title: formState.title, + description: formState.description, + start: formState.start, + end: formState.end + }, + onCompleted: () => history.push('/') + }); + + if (data === undefined) { + return
Loading...
+ } else { + + return ( +
+
{ + e.preventDefault(); + updateAppointment(); + }} + > +
+ + + setFormState({ + ...formState, + title: e.target.value + }) + } + type="text" + placeholder="Input title" + /> + + setFormState({ + ...formState, + description: e.target.value + }) + } + type="text" + placeholder="Input description" + /> + + setFormState({ + ...formState, + start: e + }) + } + /> + + setFormState({ + ...formState, + end: e + }) + } + /> +
+ +
+
+ ); + } +}; + +export default UpdateAppointment; \ No newline at end of file diff --git a/client/src/components/Header.js b/client/src/components/layout/Header.js similarity index 93% rename from client/src/components/Header.js rename to client/src/components/layout/Header.js index e0bc8d2..e21be71 100644 --- a/client/src/components/Header.js +++ b/client/src/components/layout/Header.js @@ -1,7 +1,7 @@ import React from 'react'; import { useHistory } from 'react-router'; import { Link, withRouter } from 'react-router-dom'; -import { AUTH_TOKEN } from '../constants'; +import { AUTH_TOKEN } from '../../constants'; const Header = () => { const history = useHistory(); @@ -9,13 +9,13 @@ const Header = () => { return (
- Top list + List
Calendar
- Create new + New
{authToken ? ( diff --git a/server/src/models/appointment.js b/server/src/models/appointment.js index 65836c5..ed792e2 100644 --- a/server/src/models/appointment.js +++ b/server/src/models/appointment.js @@ -9,6 +9,10 @@ const AppointmentSchema = new Schema({ type: String, required: false }, + type: { + type: String, + required: true + }, start: { type: Date, required: true diff --git a/server/src/resolvers.js b/server/src/resolvers.js index 208da0e..a2f04e9 100644 --- a/server/src/resolvers.js +++ b/server/src/resolvers.js @@ -10,10 +10,10 @@ import dotenv from 'dotenv'; export const resolvers = { Query: { async allAppointments() { - return await Appointment.find(); + return await Appointment.find({ deleted: false }) + // return await Appointment.find(); }, async oneAppointment(root, args, context, info) { - console.log(args); return await Appointment.findOne({ _id: args._id }); @@ -73,6 +73,7 @@ export const resolvers = { }, async createAppointment(parent, args, context, info) { + args.deleted = false; return await Appointment.create(args); }, async updateAppointment(parent, args, context, info) { @@ -83,12 +84,8 @@ export const resolvers = { }) }, async deleteAppointment(parent, args, context, info) { - console.log(args); - return await Appointment.deleteOne({ _id: args._id }).then(function () { - console.log("Data deleted"); // Success - }).catch(function (error) { - console.log(error); // Failure - }); + return await Appointment.findOneAndUpdate({ _id: args._id }, { deleted: true }) + // return await Appointment.deleteOne({ _id: args._id }); }, async createProduct(root, { input diff --git a/server/src/resolvers/Mutation.js b/server/src/resolvers/Mutation.js index f40f62b..c98e157 100644 --- a/server/src/resolvers/Mutation.js +++ b/server/src/resolvers/Mutation.js @@ -17,7 +17,6 @@ function createAppointment(parent, args, context, info) { } async function signup(parent, args, context, info) { - console.log(context.mongo); const password = await bcrypt.hash(args.password, 10); const user = await context.mongo.user.create({ data: { ...args, password } diff --git a/server/src/resolvers/Query.js b/server/src/resolvers/Query.js index acd3c6e..b68f879 100644 --- a/server/src/resolvers/Query.js +++ b/server/src/resolvers/Query.js @@ -8,7 +8,7 @@ async function feed(parent, args, context, info) { ] } : {}; - console.log(context.mongo); + const appointments = await context.mongo.appointment.findMany({ where, skip: args.skip, diff --git a/server/src/schema.graphql b/server/src/schema.graphql index bbf4ebc..c85434c 100644 --- a/server/src/schema.graphql +++ b/server/src/schema.graphql @@ -24,15 +24,20 @@ type Feed { type Mutation { createAppointment( title: String! - description: String! - start: String! - end: String! + description: String + type: String! + start: DateTime! + end: DateTime! + deleted: Boolean ): Appointment! updateAppointment( _id: ID!, title: String! - description: String! - start: String! + description: String + type: String! + start: DateTime! + end: DateTime! + deleted: Boolean ): Appointment deleteAppointment( _id: ID! @@ -89,9 +94,10 @@ type AuthPayload { type Appointment { _id: ID! title: String! - description: String! - start: Time! - end: Time! + description: String + type: String! + start: DateTime! + end: DateTime! deleted: Boolean # createdBy: User # follows: [Follow!]! @@ -99,14 +105,16 @@ type Appointment { } input AppointmentInput { title: String! - description: String! - start: Time! - end: Time! + description: String + type: String! + start: DateTime! + end: DateTime! + deleted: Boolean } input AppointmentOrderByInput { - description: Sort - url: Sort - createdAt: Sort + title: Sort + desc: Sort + # createdAt: Sort } # Product schemas diff --git a/server/src/utils/db.js b/server/src/utils/db.js index 78e1695..01bee8d 100644 --- a/server/src/utils/db.js +++ b/server/src/utils/db.js @@ -19,6 +19,9 @@ const connection = mongoose.connect(process.env.MONGODB_URI, { }); mongoose.set('useCreateIndex', true); +mongoose.set('useNewUrlParser', true); +mongoose.set('useFindAndModify', false); +mongoose.set('useUnifiedTopology', true); connection .then(db => db)