BAH-1093 : Tele-consultation feature merge (#149)

* Gracil/Hamza | Add 'Add Teleconsultation' button to the appointment plan component

* CON-19 | Gracil - Added Join Teleconsultation button on the appointment popup

* [Kaleeaswari] Deploying app to the environment

* [Kaleeaswari] Deploying app to the environment - specifying correct project name

* [Kaleeaswari] Deploying app to the environment - moving dist to appropriate folder

* [Kaleeaswari] Deploying app to the environment - moving dist to appropriate folder

* [Kaleeaswari] Deploying app to the environment - Extracting test to separate task

* SM, DL: templated/standardised octo CLI commands

* Temporary test to see if changes are reflected in app on env

* Revert temp test

* [vishal]  add rename isTeleconsulationEnabled to teleconslutation

* Zafar/Natheesh | #40, Added teleconsulting in list view.

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* Zafar/Natheesh | #40, Fixed join teleconsultation visibility

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* Zafar/Natheesh | #97, Added copy link button in list-view

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* Zafar/Natheesh | #97, Added copy link button in calender-view

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* Zafar/Natheesh | #97, Added title for copy link button.

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* Zafar/Natheesh | #97, Refactored class name and padding for copy-clip button

Co-authored-by: Natheeshkumar <natheeshece@gmail.com>

* WIP Appointment UI - Separate field for Teleconsultation - pairing with @ana Karolina

* Appointment UI - Separate field for Teleconsultation - Clean up code - pairing with Ana Karolina

* Appointment UI - Separate field for Teleconsultation - Clean up code - Pairing with Ana Karolina

* Fix Appointment Type not appearing when editing existing appointment

* Open Patient summary when clicking Join Teleconsultation

* Natheesh/Monica | #112 Fixed check/uncheck Teleconsultiation checkbox

Signed-off-by: Natheeshkumar <natheeshkumar.r@thoughtworks.com>

* Natheesh/Monica | #112 Fixed the SQL Exception

Signed-off-by: natheeshsunway <natheeshece@gmail.com>

Co-authored-by: monicarajendran <monicarajendran96@gmail.com>

* Natheesh/Monica | #119 Added Email warning message on saving appointment

Co-authored-by: monicarajendran <monicarajendran96@gmail.com>
Signed-off-by: natheeshsunway <natheeshece@gmail.com>

* Natheesh/Monica | #119 Refactored Email warning message showing based on teleconsultation

Co-authored-by: monicarajendran <monicarajendran96@gmail.com>
Signed-off-by: natheeshsunway <natheeshece@gmail.com>

* make join teleconsult button enable for only scheduled meetings

* Removed usage of "::set_env" from github actions

* Praveena/Swati : navigation control fix

* Resolve review comments

* remove https from constants

* Praveena | Removed github actions before merging to Bahmni product

* swati|praveena: Implementation of review comments

* make CopyLink internationalisation

Co-authored-by: kaleeaswari <skaleeas@thoughtworks.com>
Co-authored-by: Steve M <smorris@thoughtworks.com>
Co-authored-by: Deedee <deedee>
Co-authored-by: Zafar <momin.zafaraabid@thoughtworks.com>
Co-authored-by: Natheeshkumar <natheeshece@gmail.com>
Co-authored-by: Carlos Rigo <carlos.rigocano@thoughtworks.com>
Co-authored-by: Natheeshkumar <natheeshkumar.r@thoughtworks.com>
Co-authored-by: monicarajendran <monicarajendran96@gmail.com>
Co-authored-by: Mahesh Ippili <maheshippili@Maheshs-MacBook-Pro.local>
Co-authored-by: swatigogia2020 <swati.gogia@thoughtworks.com>

config/ng-config.json

@@ -80,7 +80,9 @@
       "openMRSSystemSettingUrl": "/openmrs/ws/rest/v1/systemsetting/",
       "baseLocaleURL": "./i18n/",
       "customLocaleURL": "/bahmni_config/openmrs/i18n/",
-      "loginPageUrl": "../../bahmni/home/index.html#/login"
+      "loginPageUrl": "../../bahmni/home/index.html#/login",
+      "patientsURL": "/bahmni/clinical/index.html#/default/patient/",
+      "patientsURLGeneralInformationTab": "/dashboard?currentTab=DASHBOARD_TAB_GENERAL_KEY"
     }
   },
   "Appointments": {

i18n/appointments/locale_en.json

@@ -174,5 +174,7 @@
   "PLACEHOLDER_APPOINTMENT_REQUEST": "Select Appointment Status",
   "ACCEPT_APPOINTMENT_REQUEST": "Accept",
   "PROVIDER_RESPONSE_ACCEPT_SUCCESS_MESSAGE": "Appointment invitation accepted successfully.",
-  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Are you sure, you want to accept the appointment invite?"
+  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Are you sure, you want to accept the appointment invite?",
+  "JOIN_TELE_CONSULTATION":"Join Teleconsultation",
+  "COPY_LINK": "Copy TeleConsultation Link"
 }

i18n/appointments/locale_es.json

@@ -151,5 +151,7 @@
   "PLACEHOLDER_APPOINTMENT_REQUEST": "Seleccionar estado de cita",
   "ACCEPT_APPOINTMENT_REQUEST": "Aceptar",
   "PROVIDER_RESPONSE_ACCEPT_SUCCESS_MESSAGE": "Invitación de cita aceptada con éxito.",
-  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "¿Estás seguro de que quieres aceptar la invitación a la cita?"
+  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "¿Estás seguro de que quieres aceptar la invitación a la cita?",
+  "JOIN_TELE_CONSULTATION":"Unirse Teleconsulta",
+  "COPY_LINK": "copiar enlace de teleconsulta"
 }

i18n/appointments/locale_fr.json

@@ -167,5 +167,7 @@
   "PLACEHOLDER_APPOINTMENT_REQUEST": "Sélectionnez statut rendez-vous",
   "ACCEPT_APPOINTMENT_REQUEST": "Acceptez",
   "PROVIDER_RESPONSE_ACCEPT_SUCCESS_MESSAGE": "Invitation à le rendez-vous acceptée avec succès.",
-  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Êtes-vous sûr de vouloir accepter l'invitation au rendez-vous?"
+  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Êtes-vous sûr de vouloir accepter l'invitation au rendez-vous?",
+  "COPY_LINK": "copier le lien de téléconsultation",
+  "JOIN_TELE_CONSULTATION":"Joindre Téléconsultation"
 }

i18n/appointments/locale_pt_BR.json

@@ -151,5 +151,7 @@
   "PLACEHOLDER_APPOINTMENT_REQUEST": "Selecionar status do compromisso",
   "ACCEPT_APPOINTMENT_REQUEST": "Aceitar",
   "PROVIDER_RESPONSE_ACCEPT_SUCCESS_MESSAGE": "Convite para compromisso aceito com sucesso.",
-  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Tem certeza de que deseja aceitar o convite para o compromisso?"
+  "APPOINTMENT_ACCEPT_CONFIRM_MESSAGE": "Tem certeza de que deseja aceitar o convite para o compromisso?",
+  "COPY_LINK": "copiar link de teleconsulta",
+  "JOIN_TELE_CONSULTATION":"Junte-se Teleconsulta"
 }

src/controllers/manage/list/appointmentsListViewController.js

@@ -175,13 +175,35 @@ angular.module('bahmni.appointments')
                 return appointmentType === 'WalkIn' ? 'Yes' : 'No';
             };
 
-            $scope.editAppointment = function () {
+            $scope.editAppointment = function () {     
                 var params = $stateParams;
                 params.uuid = $scope.selectedAppointment.uuid;
                 params.isRecurring = $scope.selectedAppointment.recurring;
                 $state.go('home.manage.appointments.list.edit', params);
             };
 
+            $scope.openJitsiMeet = function () {
+
+                window.open("https://" + 
+                    window.location.hostname + 
+                    Bahmni.Common.Constants.patientsURL + 
+                    $scope.selectedAppointment.patient.uuid +
+                    Bahmni.Common.Constants.patientsURLGeneralInformationTab
+                    , '_self')
+            }; 
+
+            $scope.copyTeleConsultationMeetingURL = function () {
+                var jitsiMeetingUrl = 'https://meet.jit.si/' + $scope.selectedAppointment.uuid;
+
+                    const el = document.createElement('textarea');
+                    el.value = jitsiMeetingUrl;
+                    document.body.appendChild(el);
+                    el.select();
+                    document.execCommand('copy');
+                    document.body.removeChild(el);
+
+            };
+
             $scope.checkinAppointment = function () {
                 var scope = $rootScope.$new();
                 scope.message = $translate.instant('APPOINTMENT_STATUS_CHANGE_CONFIRM_MESSAGE', {
@@ -419,6 +441,13 @@ angular.module('bahmni.appointments')
                 return false;
             };
 
+            $scope.isTeleconsultingAllowed = function () {
+                if (!_.isUndefined($scope.selectedAppointment)) {
+                    return $scope.selectedAppointment.teleconsultation && $scope.selectedAppointment.status == window.Bahmni.Appointments.Constants.appointmentStatuses.Scheduled;
+                }
+                return false;
+            };
+
             $scope.isResetAppointmentStatusFeatureEnabled = function () {
                 return !(_.isNull($scope.enableResetAppointmentStatuses) ||
                     _.isUndefined($scope.enableResetAppointmentStatuses));

src/models/appointment.js

@@ -41,6 +41,7 @@ Bahmni.Appointments.Appointment = (function () {
             locationUuid: appointmentDetails.location && appointmentDetails.location.uuid,
             status: appointmentDetails.status,
             appointmentKind: appointmentDetails.appointmentKind,
+            teleconsultation: appointmentDetails.teleconsultation,
             comments: appointmentDetails.comments
         });
         return appointment;

src/models/appointmentViewModel.js

@@ -68,6 +68,7 @@ Bahmni.Appointments.AppointmentViewModel = (function () {
             startTime: getTimeWithoutDate(appointmentDetails.startDateTime),
             endTime: getTimeWithoutDate(appointmentDetails.endDateTime),
             appointmentKind: appointmentDetails.appointmentKind,
+            teleconsultation: appointmentDetails.teleconsultation,
             status: appointmentDetails.status,
             comments: appointmentDetails.comments
         });

src/services/calendarViewPopUp.js

@@ -1,9 +1,9 @@
 'use strict';
 
 angular.module('bahmni.appointments')
-    .service('calendarViewPopUp', ['$rootScope', 'ngDialog', '$state', '$translate', 'appointmentsService',
+    .service('calendarViewPopUp', ['$rootScope', 'ngDialog', '$state','$window', '$translate', 'appointmentsService',
         'confirmBox', 'checkinPopUp', 'appService', 'messagingService', 'appointmentCommonService',
-        function ($rootScope, ngDialog, $state, $translate, appointmentsService, confirmBox, checkinPopUp, appService, messagingService, appointmentCommonService) {
+        function ($rootScope, ngDialog, $state, $window, $translate, appointmentsService, confirmBox, checkinPopUp, appService, messagingService, appointmentCommonService) {
             var calendarViewPopUp = function (config) {
                 var popUpScope = $rootScope.$new();
                 var dialog;
@@ -42,6 +42,25 @@ angular.module('bahmni.appointments')
                     popUpScope.$destroy();
                 };
 
+                popUpScope.openJitsiMeet = function (appointment) {
+
+                    $window.open("https://" +
+                        window.location.hostname + 
+                        Bahmni.Common.Constants.patientsURL + 
+                        appointment.patient.uuid +
+                        Bahmni.Common.Constants.patientsURLGeneralInformationTab
+                        , '_self')
+                };  
+                popUpScope.copyTeleConsultationMeetingURL = function (appointment) {
+                    var jitsiMeetingUrl = 'https://meet.jit.si/' + appointment.uuid
+                    const el = document.createElement('textarea');
+                    el.value = jitsiMeetingUrl;
+                    document.body.appendChild(el);
+                    el.select();
+                    document.execCommand('copy');
+                    document.body.removeChild(el);
+                };
+
                 var closeConfirmBox = function (closeConfirmBox) {
                     closeConfirmBox();
                 };

src/styles/appointments/_manageAppointments.scss

@@ -229,8 +229,13 @@
   &.calendar-view-btn-container {
     height: 51px;
   }
+  .copy-clip,.copy-clip:disabled,.copy-clip:hover{
+    width: 25px;
+    height: 30px;
+    background:url('../images/copy_24px.png') no-repeat left center;
+    padding: 10px;
+  }  
 }
-
 /*----- create new appointment styles -----*/
 .create-new-app-wrapper {
   top: 52px;

src/styles/bahmni-components/_ngDialog.scss

@@ -306,3 +306,12 @@ div.ngdialog-close {
     position:static!important;
     height:auto!important;
 }
+
+.copy-clip,.copy-clip:hover{
+    width: 25px;
+    height: 30px;
+    background:url('../images/copy_24px.png') no-repeat left center;
+    padding: 10px;
+
+  }  
+

src/views/manage/calendar/popUp.html

@@ -29,6 +29,13 @@
     <p><b>{{::'APPOINTMENT_DATE' | translate}}:</b> {{scope.appointments[0].startDateTime | bahmniDate}}</p>
     <p><b>{{::'APPOINTMENT_SLOT' | translate}}:</b> {{scope.appointments[0].startDateTime | bahmniTime}} -
         {{scope.appointments[0].endDateTime | bahmniTime}}</p>
+     <p ng-if="appointment.teleconsultation"><b>
+        <button  ng-click="openJitsiMeet(appointment)">
+           {{::'JOIN_TELE_CONSULTATION' | translate}}
+        </button>
+        <button ng-click="copyTeleConsultationMeetingURL(appointment)" class="copy-clip" title="{{::'COPY_LINK' | translate}}">
+        </button>
+      <p><b>  
     <p class="app-dialog-btn-wrap">
         <button show-if-privilege="{{manageAppointmentPrivilege}},{{ownAppointmentPrivilege}}" style="background: #039BE5"
                 ng-show="isAppointmentRequestEnabled"

src/views/manage/list/listView.html

@@ -53,6 +53,14 @@
     </div>
     <div ui-view="content@appointment"></div>
     <fieldset class="appointment-action-btn-container" ng-disabled="!selectedAppointment" ng-class="{'disabled': !selectedAppointment}">
+
+        <button show-if-privilege="{{manageAppointmentPrivilege}},{{ownAppointmentPrivilege}}" ng-click="openJitsiMeet()" 
+        ng-disabled="!isTeleconsultingAllowed()">
+        {{::'JOIN_TELE_CONSULTATION' |translate}}</button>
+
+        <button class="copy-clip" title="{{::'COPY_LINK' | translate}}" show-if-privilege="{{manageAppointmentPrivilege}},{{ownAppointmentPrivilege}}"
+        ng-click="copyTeleConsultationMeetingURL()" ng-disabled="!isTeleconsultingAllowed()"></button>
+
         <button show-if-privilege="{{manageAppointmentPrivilege}},{{ownAppointmentPrivilege}}" ng-click="editAppointment()"
         ng-disabled="!isEditAllowed()">
             {{::'EDIT_APPOINTMENT' |translate}}

ui/react-components/components/AddAppointment/AddAppointment.jsx

@@ -9,6 +9,7 @@ import {
     recurringContainerLeft,
     recurringContainerRight,
     searchFieldsContainer,
+    appointmentTypeContainer,
     timeSelector,
     weekDaysContainer
 } from './AddAppointment.module.scss';
@@ -28,6 +29,7 @@ import {getDateTime, isStartTimeBeforeEndTime} from '../../utils/DateUtil.js'
 import TimeSelector from "../TimeSelector/TimeSelector.jsx";
 import AppointmentNotes from "../AppointmentNotes/AppointmentNotes.jsx";
 import AppointmentPlan from "../AppointmentPlan/AppointmentPlan.jsx";
+import AppointmentType from "../AppointmentType/AppointmentType.jsx";
 import CustomPopup from "../CustomPopup/CustomPopup.jsx";
 import SuccessConfirmation from "../SuccessModal/SuccessModal.jsx";
 import {AppContext} from "../AppContext/AppContext";
@@ -45,6 +47,7 @@ import {
     RECURRING_APPOINTMENT_TYPE,
     SERVICE_ERROR_MESSAGE_TIME_OUT_INTERVAL,
     TODAY,
+    TELECONSULTATION_APPOINTMENT,
     WALK_IN_APPOINTMENT_TYPE
 } from "../../constants";
 import moment from "moment";
@@ -79,6 +82,7 @@ const AddAppointment = props => {
         startTime: appointmentParams && moment(appointmentParams.startDateTime),
         endTime: appointmentParams && moment(appointmentParams.endDateTime),
         appointmentType: undefined,
+        teleconsultation: false,
         notes: undefined,
         startDateType: appointmentParams && moment(new Date(appointmentParams.startDateTime)) ? FROM : undefined,
         endDateType: undefined,
@@ -106,6 +110,7 @@ const AddAppointment = props => {
     };
 
     const [appointmentDetails, setAppointmentDetails] = useState(initialAppointmentState);
+    const [showEmailWarning, setShowEmailWarning] = useState(false);
     const [conflicts, setConflicts] = useState();
     const [errors, setErrors] = useState(initialErrorsState);
     const [showSuccessPopup, setShowSuccessPopup] = useState(false);
@@ -151,6 +156,7 @@ const AddAppointment = props => {
 
     const isRecurringAppointment = () => appointmentDetails.appointmentType === RECURRING_APPOINTMENT_TYPE;
     const isWalkInAppointment = () => appointmentDetails.appointmentType === WALK_IN_APPOINTMENT_TYPE;
+    const isTeleConsultation = () => appointmentDetails.teleconsultation;
 
     const getAppointmentRequest = () => {
         let appointment = {
@@ -167,6 +173,7 @@ const AddAppointment = props => {
             providers: appointmentDetails.providers,
             locationUuid: appointmentDetails.location && appointmentDetails.location.value.uuid,
             appointmentKind: isWalkInAppointment() ? WALK_IN_APPOINTMENT_TYPE : "Scheduled",
+            teleconsultation: isTeleConsultation(),
             comments: appointmentDetails.notes
         };
         if (!appointment.serviceTypeUuid || appointment.serviceTypeUuid.length < 1)
@@ -255,6 +262,7 @@ const AddAppointment = props => {
         const status = response.status;
         if (status === 200) {
             setConflicts(undefined);
+            setShowEmailWarning((response.data.teleconsultation && (!response.data.emailIdAvailable)));
             setViewDateAndShowSuccessPopup(response.data.startDateTime);
         } else if (response.data && response.data.error) {
             setConflicts(undefined);
@@ -339,7 +347,8 @@ const AddAppointment = props => {
 
     const savePopup = <CustomPopup style={customPopup} popupContent={<SuccessConfirmation
       resetAppointmentModal={reInitialiseComponent}
-      patientDetails={appointmentDetails.patient && `${appointmentDetails.patient.value.name} (${appointmentDetails.patient.value.identifier})`}/>}/>;
+      patientDetails={appointmentDetails.patient && `${appointmentDetails.patient.value.name} (${appointmentDetails.patient.value.identifier})`}
+      showEmailWarning={showEmailWarning}/>}/>;
 
     const endTimeBasedOnService = (time, service, serviceType) => {
         const currentTime = moment(time);
@@ -383,21 +392,38 @@ const AddAppointment = props => {
 
     const on = "On";
     return (<Fragment>
-        <div data-testid="appointment-editor" className={classNames(appointmentEditor, appointmentDetails.appointmentType === RECURRING_APPOINTMENT_TYPE ? isRecurring: '')}>
+        <div data-testid="appointment-editor" className={classNames(appointmentEditor, appointmentDetails.appointmentType === RECURRING_APPOINTMENT_TYPE ? isRecurring : '')}>
             <AppointmentEditorCommonFieldsWrapper appointmentDetails={appointmentDetails}
-                                   updateAppointmentDetails={updateAppointmentDetails}
-                                   updateErrorIndicators={updateErrorIndicators}
-                                   endTimeBasedOnService={endTimeBasedOnService}
-                                   appConfig={appConfig} errors={errors} autoFocus={true}/>
+                updateAppointmentDetails={updateAppointmentDetails}
+                updateErrorIndicators={updateErrorIndicators}
+                endTimeBasedOnService={endTimeBasedOnService}
+                appConfig={appConfig} errors={errors} autoFocus={true} />
             <div className={classNames(searchFieldsContainer)} data-testid="recurring-plan-checkbox">
                 <div className={classNames(appointmentPlanContainer)}>
                     <AppointmentPlan appointmentType={appointmentDetails.appointmentType}
-                                     onChange={(e) => {
-                                         if (appointmentDetails.appointmentType === e.target.name)
-                                             updateAppointmentDetails({appointmentType: undefined});
-                                         else
-                                             updateAppointmentDetails({appointmentType: e.target.name})
-                                     }}/>
+                        teleconsultation={appointmentDetails.teleconsultation}
+                        onChange={(e) => {
+                            if (appointmentDetails.teleconsultation && e.target.name === TELECONSULTATION_APPOINTMENT)
+                                updateAppointmentDetails({ teleconsultation: false });
+                            else if (!appointmentDetails.teleconsultation && e.target.name === TELECONSULTATION_APPOINTMENT)
+                                updateAppointmentDetails({ teleconsultation: true });
+                            else if (appointmentDetails.appointmentType === e.target.name)
+                                updateAppointmentDetails({ appointmentType: undefined });
+                            else
+                                updateAppointmentDetails({ appointmentType: e.target.name })
+                        }} />
+                </div>
+            </div>
+            <div className={classNames(appointmentTypeContainer)} data-testid="appointment-type-checkbox">
+                <div className={classNames(appointmentPlanContainer)}>
+                    <AppointmentType appointmentType={appointmentDetails.appointmentType}
+                        teleconsultation={appointmentDetails.teleconsultation}
+                        onChange={(e) => {
+                            if (appointmentDetails.teleconsultation && e.target.name === TELECONSULTATION_APPOINTMENT)
+                                updateAppointmentDetails({ teleconsultation: false });
+                            else if (!appointmentDetails.teleconsultation && e.target.name === TELECONSULTATION_APPOINTMENT)
+                                updateAppointmentDetails({ teleconsultation: true });
+                        }} />
                 </div>
             </div>
             <div className={classNames(recurringContainer)}>

ui/react-components/components/AddAppointment/AddAppointment.module.scss

@@ -66,4 +66,20 @@
   letter-spacing: normal;
 }
 
+.appointmentTypeContainer {
+  top: 50px;
+  position: relative;
+  padding: 1% 2% 0 2%;
+  display: flex;
+  justify-content: space-between;
+
+  &:nth-child(2) {
+    padding-top: 0;
+  }
+
+  .appointmentPlanContainer {
+    width: 70%;
+    margin-bottom: 25px;
+  }
+}
 

ui/react-components/components/AppointmentType/AppointmentType.jsx

@@ -0,0 +1,41 @@
+import React from "react";
+import Label from "../Label/Label.jsx";
+import {checkbox, checkboxContainer, container, appointmentTypeLabel} from "./AppointmentType.module.scss";
+import classNames from "classnames";
+import PropTypes from "prop-types";
+import {injectIntl} from "react-intl";
+import Checkbox from 'rc-checkbox';
+import 'rc-checkbox/assets/index.css';
+import {TELECONSULTATION_APPOINTMENT} from "../../constants";
+
+const AppointmentType = props => {
+
+    const {onChange, teleconsultation, isTeleconsultationDisabled } = props;
+
+    return (<div className={classNames(container)}>
+        <span className={classNames(appointmentTypeLabel)}><Label className={classNames(appointmentTypeLabel)} translationKey="APPOINTMENT_TYPE_LABEL"
+        defaultValue="Appointment Type"/></span>
+        <div className={classNames(checkboxContainer)} data-test-id="add-tele-consultation">    
+            <Checkbox
+                defaultChecked={false}
+                className={classNames(checkbox)}
+                id="teleconsultation-checkbox"
+                onChange={onChange}
+                checked={teleconsultation}
+                name={TELECONSULTATION_APPOINTMENT}
+                disabled={isTeleconsultationDisabled}
+            />
+            <Label forInput="teleconsultation-checkbox" translationKey="TELECONSULTATION_APPOINTMENT_LABEL"
+                defaultValue="Teleconsultation"
+                disabled={isTeleconsultationDisabled}/>
+        </div>
+    </div>)
+};
+
+AppointmentType.propTypes = {
+    onChange: PropTypes.func,
+    appointmentType: PropTypes.string,
+    isTeleconsultationDisabled: PropTypes.bool
+};
+
+export default injectIntl(AppointmentType);