1- // AdminAgreementCreate.jsx
2- import React , { useState , useEffect } from 'react' ;
3- import axios from 'axios' ;
4- import MDEditor from '@uiw/react-md-editor' ;
51
6- const AdminAgreementCreate = ( ) => {
7- const [ stores , setStores ] = useState ( [ ] ) ;
8- const [ storeId , setStoreId ] = useState ( '' ) ;
9- const [ agreementType , setAgreementType ] = useState ( 'Terms & Conditions' ) ;
10- const [ agreementVersion , setAgreementVersion ] = useState ( '1.0' ) ;
11- const [ agreementContent , setAgreementContent ] = useState ( '' ) ;
12-
13- const [ loading , setLoading ] = useState ( false ) ;
14- const [ success , setSuccess ] = useState ( false ) ;
15- const [ error , setError ] = useState ( null ) ;
16- const [ createdAgreementId , setCreatedAgreementId ] = useState ( null ) ;
17-
18- // For notification step
19- const [ showNotify , setShowNotify ] = useState ( false ) ;
20- const [ recipientEmail , setRecipientEmail ] = useState ( '' ) ;
21- const [ recipientName , setRecipientName ] = useState ( '' ) ;
22- const [ notifySuccess , setNotifySuccess ] = useState ( false ) ;
23-
24- useEffect ( ( ) => {
25- // Fetch stores for dropdown
26- const fetchStores = async ( ) => {
27- try {
28- const response = await axios . get ( '/api/stores' ) ;
29- setStores ( response . data . stores ) ;
30- } catch ( err ) {
31- setError ( 'Failed to load stores' ) ;
32- }
33- } ;
34-
35- fetchStores ( ) ;
36- } , [ ] ) ;
37-
38- const handleSubmit = async ( e ) => {
39- e . preventDefault ( ) ;
40-
41- if ( ! storeId || ! agreementType || ! agreementContent || ! agreementVersion ) {
42- setError ( 'All fields are required' ) ;
43- return ;
44- }
45-
46- setLoading ( true ) ;
47- setError ( null ) ;
48-
49- try {
50- const response = await axios . post ( '/api/agreements/create' , {
51- storeId,
52- agreementType,
53- agreementContent,
54- agreementVersion
55- } ) ;
56-
57- setSuccess ( true ) ;
58- setCreatedAgreementId ( response . data . agreement . id ) ;
59- setShowNotify ( true ) ;
60-
61- // Get store details for notification
62- const store = stores . find ( s => s . _id === storeId ) ;
63- if ( store && store . contactEmail ) {
64- setRecipientEmail ( store . contactEmail ) ;
65- setRecipientName ( store . contactName || '' ) ;
66- }
67- } catch ( err ) {
68- setError ( 'Failed to create agreement. Please try again.' ) ;
69- } finally {
70- setLoading ( false ) ;
71- }
72- } ;
73-
74- const handleSendNotification = async ( e ) => {
75- e . preventDefault ( ) ;
76-
77- if ( ! recipientEmail ) {
78- setError ( 'Email address is required' ) ;
79- return ;
80- }
81-
82- setLoading ( true ) ;
83- setError ( null ) ;
84-
85- try {
86- await axios . post ( `/api/agreements/notify/${ createdAgreementId } , {
87- email : recipientEmail ,
88- name : recipientName
89- } ) ;
90-
91- setNotifySuccess ( true ) ;
92- } catch ( err ) {
93- setError ( 'Failed to send notification. Please try again.' ) ;
94- } finally {
95- setLoading ( false ) ;
96- }
97- } ;
98-
99- if ( notifySuccess ) {
100- return (
101- < div className = "agreement-create" >
102- < div className = "success-container card" >
103- < h2 > Agreement Created & Notification Sent ! </ h2 >
104- < p > The store has been notified about the new agreement.</ p >
105- < button
106- className = "btn btn-primary"
107- onClick = { ( ) => {
108- setSuccess ( false ) ;
109- setShowNotify ( false ) ;
110- setNotifySuccess ( false ) ;
111- setCreatedAgreementId ( null ) ;
112- setAgreementContent ( '' ) ;
113- setStoreId ( '' ) ;
114- } }
115- >
116- Create Another Agreement
117- </ button >
118- </ div >
119- </ div >
120- ) ;
121- }
122-
123- if ( showNotify && createdAgreementId ) {
124- return (
125- < div className = "agreement-create" >
126- < h2 > Send Agreement Notification</ h2 >
127-
128- < div className = "card" >
129- < form onSubmit = { handleSendNotification } >
130- < div className = "form-group" >
131- < label htmlFor = "recipientEmail" > Recipient Email:</ label >
132- < input
133- type = "email"
134- id = "recipientEmail"
135- value = { recipientEmail }
136- onChange = { ( e ) => setRecipientEmail ( e . target . value ) }
137- required
138- />
139- </ div >
140-
141- < div className = "form-group" >
142- < label htmlFor = "recipientName" > Recipient Name:</ label >
143- < input
144- type = "text"
145- id = "recipientName"
146- value = { recipientName }
147- onChange = { ( e ) => setRecipientName ( e . target . value ) }
148- />
149- </ div >
150-
151- { error && < div className = "error" > { error } </ div > }
152-
153- < div className = "action-buttons" >
154- < button
155- type = "button"
156- className = "btn"
157- onClick = { ( ) => setShowNotify ( false ) }
158- disabled = { loading }
159- >
160- Back
161- </ button >
162- < button
163- type = "submit"
164- className = "btn btn-primary"
165- disabled = { loading }
166- >
167- { loading ? 'Sending...' : 'Send Notification' }
168- </ button >
169- </ div >
170- </ form >
171- </ div >
172- </ div >
173- ) ;
174- }
175-
176- return (
177- < div className = "agreement-create" >
178- < h2 > Create New Agreement</ h2 >
179-
180- < div className = "card" >
181- < form onSubmit = { handleSubmit } >
182- < div className = "form-group" >
183- < label htmlFor = "storeId" > Store:</ label >
184- < select
185- id = "storeId"
186- value = { storeId }
187- onChange = { ( e ) => setStoreId ( e . target . value ) }
188- required
189- >
190- < option value = "" > Select a store</ option >
191- { stores . map ( store => (
192- < option key = { store . _id } value = { store . _id } >
193- { store . name }
194- </ option >
195- ) ) }
196- </ select >
197- </ div >
198-
199- < div className = "form-group" >
200- < label htmlFor = "agreementType" > Agreement Type:</ label >
201- < select
202- id = "agreementType"
203- value = { agreementType }
204- onChange = { ( e ) => setAgreementType ( e . target . value ) }
205- required
206- >
207- < option value = "Terms & Conditions" > Terms & Conditions </ option >
208- < option value = "Contract" > Contract</ option >
209- < option value = "Privacy Policy" > Privacy Policy</ option >
210- </ select >
211- </ div >
212-
213- < div className = "form-group" >
214- < label htmlFor = "agreementVersion" > Version:</ label >
215- < input
216- type = "text"
217- id = "agreementVersion"
218- value = { agreementVersion }
219- onChange = { ( e ) => setAgreementVersion ( e . target . value ) }
220- required
221- />
222- </ div >
223-
224- < div className = "form-group" >
225- < label htmlFor = "agreementContent" > Agreement Content:</ label >
226- < MDEditor
227- value = { agreementContent }
228- onChange = { setAgreementContent }
229- height = { 400 }
230- />
231- </ div >
232-
233- { error && < div className = "error" > { error } </ div > }
234-
235- < button
236- type = "submit"
237- className = "btn btn-primary"
238- disabled = { loading }
239- >
240- { loading ? 'Creating...' : 'Create Agreement' }
241- </ button >
242- </ form >
243- </ div >
244- </ div >
245- ) ;
246- } ;
247-
248- export default AdminAgreementCreate ;
0 commit comments