@@ -16,6 +16,9 @@ import { formatDate } from "@reporting/src/app/utils/formatDate";
16
16
interface Props {
17
17
formData : any ;
18
18
version_id : number ;
19
+ reportType : {
20
+ report_type : string ;
21
+ } ;
19
22
reportingYear : {
20
23
reporting_year : number ;
21
24
report_due_date : string ;
@@ -44,19 +47,22 @@ const taskListElements: TaskListElement[] = [
44
47
export default function OperationReview ( {
45
48
formData,
46
49
version_id,
50
+ reportType,
47
51
reportingYear,
48
52
allActivities,
49
53
allRegulatedProducts,
50
54
} : Props ) {
51
55
const router = useRouter ( ) ;
52
56
const [ schema , setSchema ] = useState < RJSFSchema > ( operationReviewSchema ) ;
57
+ const [ uiSchema , setUiSchema ] = useState < RJSFSchema > ( operationReviewUiSchema ) ;
53
58
const [ formDataState , setFormDataState ] = useState < any > ( formData ) ;
54
59
const saveAndContinueUrl = `/reports/${ version_id } /person-responsible` ;
55
60
const reportingWindowEnd = formatDate (
56
61
reportingYear . reporting_window_end ,
57
62
"MMM DD YYYY" ,
58
63
) ;
59
64
65
+ // Function to handle form data submission
60
66
const submitHandler = async (
61
67
data : { formData ?: any } ,
62
68
reportVersionId : number ,
@@ -66,22 +72,30 @@ export default function OperationReview({
66
72
67
73
const formDataObject = safeJsonParse ( JSON . stringify ( data . formData ) ) ;
68
74
75
+ // Prepare the data based on the operation report type
69
76
const preparedData = {
70
77
...formDataObject ,
71
- activities : formDataObject . activities ?. map ( ( activityId : any ) => {
72
- const activity = allActivities . find ( ( a ) => a . id === activityId ) ;
73
- if ( ! activity )
74
- throw new Error ( `Activity with ID ${ activityId } not found` ) ;
75
- return activity . name ;
76
- } ) ,
77
- regulated_products : formDataObject . regulated_products ?. map (
78
- ( productId : any ) => {
79
- const product = allRegulatedProducts . find ( ( p ) => p . id === productId ) ;
80
- if ( ! product )
81
- throw new Error ( `Product with ID ${ productId } not found` ) ;
82
- return product . name ;
83
- } ,
84
- ) ,
78
+ // Check the report type and set activities and regulated_products to empty arrays if it's a simple report
79
+ activities :
80
+ formDataState . operation_report_type === "Simple Report"
81
+ ? [ ]
82
+ : formDataObject . activities ?. map ( ( activityId : any ) => {
83
+ const activity = allActivities . find ( ( a ) => a . id === activityId ) ;
84
+ if ( ! activity )
85
+ throw new Error ( `Activity with ID ${ activityId } not found` ) ;
86
+ return activity . name ;
87
+ } ) ,
88
+ regulated_products :
89
+ formDataState . operation_report_type === "Simple Report"
90
+ ? [ ]
91
+ : formDataObject . regulated_products ?. map ( ( productId : any ) => {
92
+ const product = allRegulatedProducts . find (
93
+ ( p ) => p . id === productId ,
94
+ ) ;
95
+ if ( ! product )
96
+ throw new Error ( `Product with ID ${ productId } not found` ) ;
97
+ return product . name ;
98
+ } ) ,
85
99
} ;
86
100
87
101
const response = await actionHandler ( endpoint , method , endpoint , {
@@ -93,18 +107,43 @@ export default function OperationReview({
93
107
}
94
108
} ;
95
109
110
+ // Function to handle changes in the form data
111
+ const onChangeHandler = ( data : { formData : any } ) => {
112
+ const updatedData = {
113
+ ...data . formData ,
114
+ // Modify the structure of form data here as needed
115
+ } ;
116
+
117
+ setFormDataState ( updatedData ) ; // Update the state with modified data
118
+ } ;
119
+
96
120
useEffect ( ( ) => {
97
121
if ( ! formData || ! allActivities || ! allRegulatedProducts ) {
98
122
return ;
99
123
}
100
124
101
- const activities = formData . activities || [ ] ;
102
- const products = formData . regulated_products || [ ] ;
125
+ const updatedFormData = {
126
+ ...formData ,
127
+ operation_report_type : reportType ?. report_type || "Annual Report" ,
128
+ activities : formData . activities || [ ] ,
129
+ regulated_products : formData . regulated_products || [ ] ,
130
+ } ;
131
+
132
+ setFormDataState ( updatedFormData ) ;
133
+ } , [ formData , reportType , allActivities , allRegulatedProducts ] ) ;
103
134
135
+ useEffect ( ( ) => {
104
136
setSchema ( ( prevSchema ) => ( {
105
137
...prevSchema ,
106
138
properties : {
107
139
...prevSchema . properties ,
140
+ operation_report_type : {
141
+ type : "string" ,
142
+ title : "Please select what type of report you are filling" ,
143
+ enum : [ "Annual Report" , "Simple Report" ] ,
144
+ default : formDataState ?. operation_report_type || "Annual Report" ,
145
+ } ,
146
+ // Conditionally render fields based on report type
108
147
activities : {
109
148
type : "array" ,
110
149
title : "Reporting activities" ,
@@ -114,6 +153,10 @@ export default function OperationReview({
114
153
enumNames : allActivities . map ( ( activity ) => activity . name ) ,
115
154
} ,
116
155
uniqueItems : true ,
156
+ // Only show this field if report type is not simple
157
+ "ui:options" : {
158
+ hidden : formDataState . operation_report_type === "Simple Report" ,
159
+ } ,
117
160
} ,
118
161
regulated_products : {
119
162
type : "array" ,
@@ -124,16 +167,20 @@ export default function OperationReview({
124
167
enumNames : allRegulatedProducts . map ( ( product ) => product . name ) ,
125
168
} ,
126
169
uniqueItems : true ,
170
+ // Only show this field if report type is not simple
171
+ "ui:options" : {
172
+ hidden : formDataState . operation_report_type === "Simple Report" ,
173
+ } ,
127
174
} ,
128
175
operation_representative_name : {
129
176
type : "string" ,
130
177
title : "Operation representative" ,
131
- enum : [ formData . operation_representative_name || "" ] ,
178
+ enum : [ formDataState . operation_representative_name || "" ] ,
132
179
} ,
133
180
operation_type : {
134
181
type : "string" ,
135
182
title : "Operation type" ,
136
- enum : [ formData . operation_type || "" ] ,
183
+ enum : [ formDataState . operation_type || "" ] ,
137
184
} ,
138
185
date_info : {
139
186
type : "object" ,
@@ -142,18 +189,35 @@ export default function OperationReview({
142
189
} ,
143
190
} ,
144
191
} ) ) ;
192
+ } , [ allActivities , allRegulatedProducts , formDataState , reportingWindowEnd ] ) ;
145
193
146
- const updatedFormData = {
147
- ...formData ,
148
- activities,
149
- regulated_products : products ,
194
+ useEffect ( ( ) => {
195
+ const updateUiSchema = ( ) => {
196
+ const helperText =
197
+ formDataState ?. operation_report_type === "Simple Report" ? (
198
+ < small >
199
+ Regulated or Reporting Operations should file a Simple Report if
200
+ their emissions have dropped below 10,000 tCO2e. They will continue
201
+ to report using the Simple Report form until they stop Schedule A
202
+ activities or stay under 10ktCO2e for three years. This does not
203
+ apply to Opt-ins.
204
+ </ small >
205
+ ) : null ;
206
+
207
+ setUiSchema ( {
208
+ ...operationReviewUiSchema ,
209
+ operation_report_type : {
210
+ "ui:widget" : "select" , // Set the widget type
211
+ "ui:help" : helperText ,
212
+ } ,
213
+ } ) ;
150
214
} ;
151
215
152
- setFormDataState ( updatedFormData ) ;
153
- } , [ allActivities , allRegulatedProducts , formData , reportingWindowEnd ] ) ;
216
+ // Call the function to update the UI schema
217
+ updateUiSchema ( ) ;
218
+ } , [ formDataState ] ) ; // Ensure the effect runs when formDataState changes
154
219
155
220
if ( ! formData ) {
156
- //we need to render another component which we would display if no version Id exist or we want to show an error
157
221
return < div > No version ID found(TBD)</ div > ;
158
222
}
159
223
@@ -168,11 +232,12 @@ export default function OperationReview({
168
232
] }
169
233
taskListElements = { taskListElements }
170
234
schema = { schema }
171
- uiSchema = { operationReviewUiSchema }
235
+ uiSchema = { uiSchema }
172
236
formData = { formDataState }
173
237
baseUrl = { baseUrl }
174
238
cancelUrl = { cancelUrl }
175
239
onSubmit = { ( data ) => submitHandler ( data , version_id ) }
240
+ onChange = { onChangeHandler } // Pass the onChange handler here
176
241
/>
177
242
) ;
178
243
}
0 commit comments