Added length of appointment to config + fixed appointments not showing in scheduling modal + added appointment confirmation template. BOD-141 BOD-149 BOD-148

client/src/components/schedule-day-view/schedule-day-view.component.jsx

@@ -6,15 +6,13 @@ import ScheduleCalendarWrapperComponent from "../schedule-calendar-wrapper/sched
 export default function ScheduleDayViewComponent({ data, day }) {
   const { t } = useTranslation();
   if (data)
-    //TODO Remove addtional calendar elements from day view.
     return (
       <ScheduleCalendarWrapperComponent
         events={data}
         defaultView="day"
         views={["day"]}
         style={{ height: "40vh" }}
-        defaultDate={new Date(day)}
-        //onNavigate={e => console.log("e", e)}
+        date={day}
       />
     );
   else return <div>{t("appointments.labels.nodateselected")}</div>;

client/src/components/schedule-day-view/schedule-day-view.container.jsx

@@ -4,22 +4,24 @@ import { useQuery } from "@apollo/react-hooks";
 import { QUERY_APPOINTMENT_BY_DATE } from "../../graphql/appointments.queries";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import moment from "moment";
-
+import { useTranslation } from "react-i18next";
 export default function ScheduleDayViewContainer({ day }) {
   const { loading, error, data } = useQuery(QUERY_APPOINTMENT_BY_DATE, {
     variables: {
       start: moment(day).startOf("day"),
-      end: moment(day).endOf("day")
+      end: moment(day).endOf("day"),
     },
-    skip: !day,
-    fetchPolicy: "network-only"
+    skip: !!!day,
+    fetchPolicy: "network-only",
   });
-
+  const { t } = useTranslation();
+  if (!!!day) return <div>{t("appointments.labels.nodateselected")}</div>;
   if (loading) return <LoadingSkeleton paragraph={{ rows: 4 }} />;
   if (error) return <div>{error.message}</div>;
   let normalizedData;
+
   if (data) {
-    normalizedData = data.appointments.map(e => {
+    normalizedData = data.appointments.map((e) => {
       //Required becuase Hasura returns a string instead of a date object.
       return Object.assign(
         {},
@@ -31,6 +33,6 @@ export default function ScheduleDayViewContainer({ day }) {
   }
 
   return (
-    <ScheduleDayViewComponent data={data ? normalizedData : null} day={day} />
+    <ScheduleDayViewComponent data={data ? normalizedData : []} day={day} />
   );
 }