import React, { FC, useState } from 'react';
import { View, StyleSheet } from 'react-native';
import { layoutStyles } from 'styles';
import { pages } from './pages';
import { WizardContainer, Toast, Loader } from 'components/core';
import { useForm, useApi } from 'hooks';
import { dietReportCommentInitialValues, fieldValidations } from './schema';
import { generateValidationSchema } from 'utils/form';
import { DietReportPage } from './components';
import { useRoute, useNavigation } from '@react-navigation/native';
import {
createNutritionistCommentApi,
retrieveUserReportCommentByReportId,
updateNutritionistCommentApi,
} from 'services/progress';
import {
NutritionistCommentRequest,
UserReportResponse,
NutritionistComment,
} from 'services/progress/models';
import * as ROUTES from 'constants/routes';
import {
dietReportTextFields,
dietReportSelectFields,
} from 'constants/weeklyReport';
const DietReportForNutritionist: FC = () => {
const navigation = useNavigation();
const route = useRoute();
const userReport = route.params as UserReportResponse;
const [activeSlide, setActiveSlide] = useState(1);
const { isLoading, data: commentResponse } = useApi(() =>
retrieveUserReportCommentByReportId(userReport.id),
);
const getInitialValues = () => {
let defaultValues = { ...dietReportCommentInitialValues };
if (commentResponse && commentResponse.length > 0) {
const data = commentResponse[0];
Object.entries(data).map(([field, comment]) => {
const key = field as keyof NutritionistComment;
defaultValues[key] = comment;
});
}
return defaultValues;
};
const {
getTextInputProps,
handleSubmit,
isSubmitting,
isFieldError,
values: formValues,
} = useForm({
initialValues: getInitialValues(),
validationSchema: generateValidationSchema(fieldValidations),
enableReinitialize: true,
onSubmit: async (values) => {
const payload: NutritionistCommentRequest = {
weekly_report: userReport.id,
...values,
};
const commentId =
commentResponse && commentResponse.length > 0
? commentResponse[0].id
: null;
const response = commentId
? await updateNutritionistCommentApi(payload, commentId)
: await createNutritionistCommentApi(payload);
if (response.success) {
commentId
? Toast.show({
type: 'success',
text1: 'Sukses mengubah komen',
text2:
'Perubahan komen Anda terhadap laporan mingguan klien sudah tersimpan.',
})
: Toast.show({
type: 'success',
text1: 'Sukses membuat komen',
text2:
'Komen Anda terhadap laporan mingguan klien sudah tersimpan.',
});
navigation.navigate(ROUTES.weeklyReportChooseWeekForNutritionist);
} else {
Toast.show({
type: 'error',
text1: 'Gagal membuat komen',
text2: 'Komen anda terhadap laporan mingguan klien gagal tersimpan.',
});
}
},
});
if (isLoading) {
return ;
}
const isCurrentPageError = (): boolean => {
if (activeSlide === 1) {
return [
formValues.height,
formValues.weight,
formValues.waist_size,
].reduce((acc: boolean, item) => acc || item === '', false);
}
if (activeSlide === 3) {
return isFieldError('average_consumption');
}
const fields = [
...dietReportTextFields[`dietReportPage${activeSlide}`],
...dietReportSelectFields[`dietReportPage${activeSlide}`],
];
return fields.reduce(
(acc: boolean, item) => acc || isFieldError(item.name),
false,
);
};
return (
(
))}
/>
);
};
const styles = StyleSheet.create({
flexContainer: {
flex: 1,
},
reportContainer: {
position: 'relative',
flex: 1,
paddingBottom: 20,
},
searchContainer: {
backgroundColor: 'white',
borderWidth: 1,
borderRadius: 5,
marginBottom: 20,
justifyContent: 'center',
height: 58,
},
backgroundWhite: { backgroundColor: 'white' },
});
export default DietReportForNutritionist;