ivyforms / frontend / src / stores / useNotificationSettingBuilder.ts

useNotificationSettingBuilder.ts in The Innovative Form Builder – IvyForms 0.6, at frontend/src/stores/useNotificationSettingBuilder.ts

358 lines 10.1 KB

Raw Download Zip

1	import { defineStore } from 'pinia'
2	import { ref } from 'vue'
3	import { useLabels } from '@/composables/useLabels'
4	import IvyMessage from '@/views/_components/message/ivyMessage.ts'
5	import { useApiClient } from '@/composables/useApiClient'
6	import { useUnsavedChangesStore } from '@/stores/useUnsavedChangesStore'
7
8	export const useNotificationSettingBuilder = defineStore('notificationSettingBuilder', () => {
9	const allNotifications = ref([])
10	const { getLabel } = useLabels()
11	const tableData = ref([])
12	const paginationMeta = ref({
13	page: 1,
14	perPage: 10,
15	total: 0,
16	})
17	const name = ref<string \| null>(getLabel('new_notification'))
18	const sender = ref<string \| null>('')
19	const receiver = ref<string \| null>('')
20	const enabled = ref(false)
21	const subject = ref<string \| null>('')
22	const message = ref<string \| null>('')
23	const smartLogic = ref(false)
24	const formId = ref<string \| null>(null)
25	const id = ref<number \| null>(null)
26	const isEditing = ref(false) // Make `isEditing` reactive
27
28	// Use unsaved changes store for state management
29	const unsavedChangesStore = useUnsavedChangesStore()
30
31	// Create complete entity manager for notification builder
32	const entityManager = unsavedChangesStore.createEntityManager('notificationBuilder', {
33	name,
34	sender,
35	receiver,
36	enabled,
37	subject,
38	message,
39	})
40
41	const { request } = useApiClient()
42
43	// Load existing notification if notification id is provided
44	const loadNotification = async (NotifId: number) => {
45	try {
46	const { data, error, status } = await request(`/notification/${NotifId}`, {
47	method: 'GET',
48	})
49	if (!error && status === 200 && data?.data?.data) {
50	const responseData = data.data.data
51	formId.value = responseData.formId
52	id.value = NotifId
53	name.value = responseData.name \|\| getLabel('new_notification')
54	sender.value = responseData.sender \|\| ''
55	receiver.value = responseData.receiver \|\| ''
56	enabled.value = responseData.enabled \|\| false
57	subject.value = responseData.subject \|\| getLabel('new_notification')
58	message.value = responseData.message \|\| ''
59	smartLogic.value = false
60	isEditing.value = true
61	} else {
62	IvyMessage({
63	message: `${getLabel('failed_to_load_notification')} ${data?.message \|\| error}`,
64	type: 'error',
65	})
66	}
67	} catch (error) {
68	IvyMessage({
69	message: `${getLabel('failed_to_load_notification')} ${error}`,
70	type: 'error',
71	})
72	}
73	}
74
75	// Fetch all form notifications
76	const fetchData = async (formId?: number) => {
77	try {
78	const url = formId ? `/notifications/${formId}` : `/notifications`
79	const { data, error } = await request(url, { method: 'GET' })
80	if (data && data.data) {
81	allNotifications.value = data.data.data
82	} else {
83	allNotifications.value = []
84	IvyMessage({
85	message: `${getLabel('unexpected_response_structure')} ${error \|\| data}`,
86	type: 'error',
87	})
88	}
89	} catch (error) {
90	IvyMessage({
91	message: `${getLabel('failed_to_fetch_notification')} ${error}`,
92	type: 'error',
93	})
94	}
95	}
96
97	// Fetch all notifications
98	const fetchAllNotifications = async () => {
99	try {
100	const url = `/notifications`
101	const { data, error } = await request(url, { method: 'GET' })
102	if (data && data.data) {
103	allNotifications.value = data.data.data
104	} else {
105	allNotifications.value = []
106	IvyMessage({
107	message: `${getLabel('unexpected_response_structure')} ${error \|\| data}`,
108	type: 'error',
109	})
110	}
111	} catch (error) {
112	IvyMessage({
113	message: `${getLabel('failed_to_fetch_notification')} ${error}`,
114	type: 'error',
115	})
116	}
117	}
118
119	// Reset notification to default values
120	const resetNotification = (formIdRoute: string) => {
121	name.value = getLabel('new_notification')
122	sender.value = ''
123	receiver.value = ''
124	enabled.value = true
125	subject.value = getLabel('new_notification')
126	message.value = '{{all_data}}'
127	smartLogic.value = false
128	formId.value = formIdRoute
129	id.value = null
130	isEditing.value = false // Reset to false when resetting notification
131	}
132
133	// Create a new notification
134	const createNotification = async (formId) => {
135	const notificationData = {
136	name: name.value \|\| getLabel('new_notification'),
137	sender: sender.value \|\| '',
138	receiver: receiver.value \|\| '',
139	enabled: enabled.value \|\| false,
140	subject: subject.value \|\| getLabel('new_notification'),
141	message: message.value \|\| '',
142	smartLogic: smartLogic.value \|\| false,
143	formId: formId \|\| null,
144	}
145
146	try {
147	const { data, error, status } = await request('/notification/add/', {
148	method: 'POST',
149	data: notificationData,
150	})
151	if (!error && status === 200) {
152	id.value = data.data.data.id
153	allNotifications.value.push(data.data)
154	IvyMessage({
155	message: getLabel('create_notification'),
156	type: 'success',
157	})
158	entityManager.resetUnsavedChanges()
159	} else {
160	IvyMessage({
161	message: `${getLabel('failed_to_create_notification')}: ${data?.message \|\| error}`,
162	type: 'error',
163	})
164	}
165	} catch (error) {
166	IvyMessage({
167	message: `${getLabel('error_creating_notification')} ${error}`,
168	type: 'error',
169	})
170	}
171	}
172
173	// Update notification data
174	const updateNotification = async (NotifId, dataObj) => {
175	try {
176	const { data, error, status } = await request(`/notification/update/${NotifId}/`, {
177	method: 'POST',
178	data: dataObj,
179	})
180	if (!error && status === 200) {
181	IvyMessage({
182	message: getLabel('update_notification'),
183	type: 'success',
184	})
185	entityManager.resetUnsavedChanges()
186	} else {
187	IvyMessage({
188	message: `${getLabel('failed_to_update_notification')}: ${data?.message \|\| error}`,
189	type: 'error',
190	})
191	}
192	} catch (error) {
193	IvyMessage({
194	message: `${getLabel('error_updating_notification')} ${error}`,
195	type: 'error',
196	})
197	}
198	}
199
200	// Search notifications with pagination and sorting
201	const searchNotifications = async ({
202	page = 1,
203	perPage = 10,
204	search = '',
205	sortBy = '',
206	sortOrder = 'asc',
207	filters = {},
208	formId = null,
209	}: {
210	page?: number
211	perPage?: number
212	search?: string
213	sortBy?: string
214	sortOrder?: string
215	filters?: Record<string, string \| number \| null>
216	formId?: number \| null
217	} = {}) => {
218	try {
219	const mergedFilters = { ...filters }
220	if (formId !== null && formId !== undefined) {
221	mergedFilters.formId = formId
222	}
223	const params: Record<
224	string,
225	string \| number \| boolean \| null \| Record<string, string \| number \| null>
226	> = {
227	page,
228	perPage,
229	search,
230	orderBy: sortBy,
231	order: sortOrder,
232	filters: mergedFilters,
233	}
234
235	const { data, error } = await request('notifications/search', {
236	method: 'GET',
237	params,
238	})
239
240	if (error) {
241	IvyMessage({
242	message: `${getLabel('error_fetching_notifications')} ${error}`,
243	type: 'error',
244	})
245	return
246	}
247
248	const response = data.data
249	tableData.value = normalizeNotificationData(response.data.data \|\| [])
250	paginationMeta.value = response.data.meta \|\| { page: 1, perPage: 10, total: 0 }
251	} catch (error) {
252	IvyMessage({
253	message: `${getLabel('error_fetching_notifications')} ${error}`,
254	type: 'error',
255	})
256	}
257	}
258
259	// Define proper types for notification data
260	interface RawNotificationItem {
261	id?: number
262	name?: string
263	sender?: string
264	receiver?: string
265	subject?: string
266	message?: string
267	enabled?: string \| number \| boolean
268	formId?: number
269	[key: string]: unknown // For any wrapped notification properties
270	}
271
272	interface NormalizedNotification {
273	id: number
274	name: string
275	sender: string
276	receiver: string
277	subject: string
278	message: string
279	enabled: boolean
280	formId: number
281	}
282
283	// Normalize notification data structure
284	const normalizeNotificationData = (data: RawNotificationItem[]): NormalizedNotification[] => {
285	return data.map((item) => {
286	if (item && typeof item === 'object') {
287	const notificationKey = Object.keys(item).find(
288	(key) => key.includes('notification') \|\| key.includes('Notification'),
289	)
290
291	if (notificationKey && item[notificationKey]) {
292	const notification = item[notificationKey] as RawNotificationItem
293	return {
294	id: notification.id \|\| 0,
295	name: notification.name \|\| '',
296	sender: notification.sender \|\| '',
297	receiver: notification.receiver \|\| '',
298	subject: notification.subject \|\| '',
299	message: notification.message \|\| '',
300	enabled: notification.enabled === '1',
301	formId: notification.formId \|\| 0,
302	}
303	}
304
305	// If it's a direct notification object
306	if (item.id && item.name !== undefined) {
307	return {
308	id: item.id,
309	name: item.name,
310	sender: item.sender \|\| '',
311	receiver: item.receiver \|\| '',
312	subject: item.subject \|\| '',
313	message: item.message \|\| '',
314	enabled: item.enabled === '1',
315	formId: item.formId \|\| null,
316	}
317	}
318	}
319
320	// Return a fallback object for items that couldn't be normalized
321	return {
322	id: 0,
323	name: 'Unknown',
324	sender: '',
325	receiver: '',
326	subject: '',
327	message: '',
328	enabled: false,
329	formId: null,
330	}
331	})
332	}
333
334	return {
335	allNotifications,
336	tableData,
337	paginationMeta,
338	name,
339	sender,
340	receiver,
341	enabled,
342	subject,
343	message,
344	smartLogic,
345	formId,
346	id,
347	isEditing,
348	getCurrentState: entityManager.getCurrentState,
349	fetchData,
350	fetchAllNotifications,
351	resetNotification,
352	createNotification,
353	updateNotification,
354	loadNotification,
355	searchNotifications,
356	}
357	})
358