Skip to content

Commit 30fc027

Browse files
ashwin31ashwin31
committed
Refactor event handlers from 'on:click' to 'onclick' for consistency across components
- Updated all instances of 'on:click' to 'onclick' in various Svelte components to maintain a uniform coding style. - Adjusted the delete action in opportunities to return a success response instead of redirecting. - Enhanced error handling in the delete opportunity page to log errors and notify users appropriately. - Added navigation to opportunities list upon successful deletion of an opportunity.
1 parent 68bb50e commit 30fc027

File tree

20 files changed

+117
-115
lines changed

20 files changed

+117
-115
lines changed

‎src/routes/(app)/app/accounts/new/+page.svelte‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@
164164
<p class="text-sm font-medium {toastType === 'success' ? 'text-green-800 dark:text-green-200' : 'text-red-800 dark:text-red-200'}">{toastMessage}</p>
165165
</div>
166166
<button
167-
on:click={() => showToast = false}
167+
onclick={() => showToast = false}
168168
class="ml-auto -mx-1.5 -my-1.5 rounded-lg p-1.5 {toastType === 'success' ? 'text-green-500 dark:text-green-400 hover:bg-green-100 dark:hover:bg-green-800/30' : 'text-red-500 dark:text-red-400 hover:bg-red-100 dark:hover:bg-red-800/30'}">
169169
<X class="w-4 h-4" />
170170
</button>
@@ -259,7 +259,7 @@
259259
id="type"
260260
name="type"
261261
bind:value={formData.type}
262-
on:change={handleChange}
262+
onchange={handleChange}
263263
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
264264
{#each data.data.accountTypes as [value, label]}
265265
<option value={value}>{label}</option>
@@ -276,7 +276,7 @@
276276
id="industry"
277277
name="industry"
278278
bind:value={formData.industry}
279-
on:change={handleChange}
279+
onchange={handleChange}
280280
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
281281
{#each data.data.industries as [value, label]}
282282
<option value={value}>{label}</option>
@@ -293,7 +293,7 @@
293293
id="rating"
294294
name="rating"
295295
bind:value={formData.rating}
296-
on:change={handleChange}
296+
onchange={handleChange}
297297
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
298298
{#each data.data.ratings as [value, label]}
299299
<option value={value}>{label}</option>
@@ -310,7 +310,7 @@
310310
id="accountOwnership"
311311
name="accountOwnership"
312312
bind:value={formData.accountOwnership}
313-
on:change={handleChange}
313+
onchange={handleChange}
314314
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
315315
{#each data.data.accountOwnership as [value, label]}
316316
<option value={value}>{label}</option>
@@ -439,7 +439,7 @@
439439
id="country"
440440
name="country"
441441
bind:value={formData.country}
442-
on:change={handleChange}
442+
onchange={handleChange}
443443
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
444444
{#each data.data.countries as [value, label]}
445445
<option value={value}>{label}</option>
@@ -564,7 +564,7 @@
564564
<div class="flex justify-end gap-4">
565565
<button
566566
type="button"
567-
on:click={() => goto('/app/accounts')}
567+
onclick={() => goto('/app/accounts')}
568568
disabled={isSubmitting}
569569
class="px-6 py-2 border border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2">
570570
<X class="w-4 h-4" />

‎src/routes/(app)/app/cases/+page.svelte‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@
9090
id="status"
9191
class="w-full px-3 py-2 border border-slate-300 dark:border-slate-600 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-slate-700 text-slate-900 dark:text-white"
9292
bind:value={statusFilter}
93-
on:change={onFilterChange}
93+
onchange={onFilterChange}
9494
>
9595
<option value="">All Statuses</option>
9696
{#each statusOptions as s}
@@ -105,7 +105,7 @@
105105
id="assigned"
106106
class="w-full px-3 py-2 border border-slate-300 dark:border-slate-600 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-slate-700 text-slate-900 dark:text-white"
107107
bind:value={assignedFilter}
108-
on:change={onFilterChange}
108+
onchange={onFilterChange}
109109
>
110110
<option value="">All Users</option>
111111
{#each assignedOptions as a}
@@ -120,7 +120,7 @@
120120
id="account"
121121
class="w-full px-3 py-2 border border-slate-300 dark:border-slate-600 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-slate-700 text-slate-900 dark:text-white"
122122
bind:value={accountFilter}
123-
on:change={onFilterChange}
123+
onchange={onFilterChange}
124124
>
125125
<option value="">All Accounts</option>
126126
{#each accountOptions as acc}
@@ -133,7 +133,7 @@
133133
<div class="flex items-end">
134134
<button
135135
class="inline-flex items-center gap-1 px-3 py-2 text-sm font-medium text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white hover:bg-slate-50 dark:hover:bg-slate-700 rounded-lg transition-colors duration-200"
136-
on:click={clearFilters}
136+
onclick={clearFilters}
137137
>
138138
<X class="w-4 h-4" />
139139
Clear
@@ -278,7 +278,7 @@
278278
{#if hasActiveFilters}
279279
<button
280280
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white hover:bg-slate-50 dark:hover:bg-slate-700 rounded-lg transition-colors duration-200"
281-
on:click={clearFilters}
281+
onclick={clearFilters}
282282
>
283283
<X class="w-4 h-4" />
284284
Clear Filters

‎src/routes/(app)/app/cases/[caseId]/edit/+page.svelte‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@
6161
</div>
6262
<div class="flex items-center gap-3">
6363
<button
64-
on:click={() => goto(`/app/cases/${data.caseItem.id}`)}
64+
onclick={() => goto(`/app/cases/${data.caseItem.id}`)}
6565
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 transition-colors"
6666
>
6767
<X size="16" />
@@ -230,7 +230,7 @@
230230
{#if data.caseItem.status === 'CLOSED'}
231231
<button
232232
type="button"
233-
on:click={handleReopenCase}
233+
onclick={handleReopenCase}
234234
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 text-sm font-medium text-green-700 dark:text-green-300 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg hover:bg-green-100 dark:hover:bg-green-900/30 focus:ring-2 focus:ring-green-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
235235
>
236236
<Unlock size="16" />
@@ -239,7 +239,7 @@
239239
{:else}
240240
<button
241241
type="button"
242-
on:click={handleCloseCase}
242+
onclick={handleCloseCase}
243243
class="inline-flex items-center justify-center gap-2 px-4 py-2.5 text-sm font-medium text-amber-700 dark:text-amber-300 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg hover:bg-amber-100 dark:hover:bg-amber-900/30 focus:ring-2 focus:ring-amber-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
244244
>
245245
<Lock size="16" />
@@ -275,13 +275,13 @@
275275
</p>
276276
<div class="flex gap-3">
277277
<button
278-
on:click={confirmCloseCase}
278+
onclick={confirmCloseCase}
279279
class="flex-1 px-4 py-2 text-sm font-medium text-white bg-amber-600 dark:bg-amber-600 rounded-lg hover:bg-amber-700 dark:hover:bg-amber-700 focus:ring-2 focus:ring-amber-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
280280
>
281281
Close Case
282282
</button>
283283
<button
284-
on:click={cancelCloseCase}
284+
onclick={cancelCloseCase}
285285
class="flex-1 px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
286286
>
287287
Cancel
@@ -311,13 +311,13 @@
311311
</p>
312312
<div class="flex gap-3">
313313
<button
314-
on:click={confirmReopenCase}
314+
onclick={confirmReopenCase}
315315
class="flex-1 px-4 py-2 text-sm font-medium text-white bg-green-600 dark:bg-green-600 rounded-lg hover:bg-green-700 dark:hover:bg-green-700 focus:ring-2 focus:ring-green-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
316316
>
317317
Reopen Case
318318
</button>
319319
<button
320-
on:click={cancelReopenCase}
320+
onclick={cancelReopenCase}
321321
class="flex-1 px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors"
322322
>
323323
Cancel

‎src/routes/(app)/app/leads/[lead_id]/edit/+page.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@
9898
<div class="flex items-center justify-between h-16">
9999
<div class="flex items-center space-x-4">
100100
<button
101-
on:click={() => goto(`/app/leads/${lead.id}`)}
101+
onclick={() => goto(`/app/leads/${lead.id}`)}
102102
class="inline-flex items-center justify-center w-10 h-10 rounded-lg bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors"
103103
>
104104
<ArrowLeft class="w-5 h-5 text-gray-600 dark:text-gray-300" />
@@ -405,7 +405,7 @@
405405
<div class="flex justify-end space-x-4 pt-6 border-t border-gray-200 dark:border-gray-700">
406406
<button
407407
type="button"
408-
on:click={cancelEdit}
408+
onclick={cancelEdit}
409409
class="inline-flex items-center px-6 py-3 border border-gray-300 dark:border-gray-600 rounded-lg text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 hover:bg-gray-50 dark:hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-offset-2 dark:focus:ring-offset-gray-800 focus:ring-blue-500 dark:focus:ring-blue-400 transition-all"
410410
>
411411
<X class="w-4 h-4 mr-2" />

‎src/routes/(app)/app/leads/new/+page.svelte‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -232,7 +232,7 @@
232232
<p class="text-sm font-medium {toastType === 'success' ? 'text-green-800 dark:text-green-200' : 'text-red-800 dark:text-red-200'}">{toastMessage}</p>
233233
</div>
234234
<button
235-
on:click={() => showToast = false}
235+
onclick={() => showToast = false}
236236
class="ml-auto -mx-1.5 -my-1.5 rounded-lg p-1.5 {toastType === 'success' ? 'text-green-500 dark:text-green-400 hover:bg-green-100 dark:hover:bg-green-800/30' : 'text-red-500 dark:text-red-400 hover:bg-red-100 dark:hover:bg-red-800/30'}">
237237
<X class="w-4 h-4" />
238238
</button>
@@ -343,7 +343,7 @@
343343
id="source"
344344
name="source"
345345
bind:value={formData.source}
346-
on:change={handleChange}
346+
onchange={handleChange}
347347
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
348348
<option value="">Select source</option>
349349
{#each data.data.source as [value, label]}
@@ -361,7 +361,7 @@
361361
id="industry"
362362
name="industry"
363363
bind:value={formData.industry}
364-
on:change={handleChange}
364+
onchange={handleChange}
365365
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
366366
<option value="">Select industry</option>
367367
{#each data.data.industries as [value, label]}
@@ -379,7 +379,7 @@
379379
id="status"
380380
name="status"
381381
bind:value={formData.status}
382-
on:change={handleChange}
382+
onchange={handleChange}
383383
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
384384
{#each data.data.status as [value, label]}
385385
<option value={value}>{label}</option>
@@ -396,7 +396,7 @@
396396
id="rating"
397397
name="rating"
398398
bind:value={formData.rating}
399-
on:change={handleChange}
399+
onchange={handleChange}
400400
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
401401
<option value="">Select rating</option>
402402
<option value="HOT">🔥 Hot</option>
@@ -472,7 +472,7 @@
472472
id="budget_range"
473473
name="budget_range"
474474
bind:value={formData.budget_range}
475-
on:change={handleChange}
475+
onchange={handleChange}
476476
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
477477
<option value="">Select budget range</option>
478478
<option value="under_10k">Under $10K</option>
@@ -493,7 +493,7 @@
493493
id="decision_timeframe"
494494
name="decision_timeframe"
495495
bind:value={formData.decision_timeframe}
496-
on:change={handleChange}
496+
onchange={handleChange}
497497
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white rounded-lg focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:border-blue-500 dark:focus:border-blue-400 transition-colors">
498498
<option value="">Select timeframe</option>
499499
<option value="immediate">Immediate (&lt; 1 month)</option>
@@ -782,7 +782,7 @@
782782
<div class="flex justify-end gap-4">
783783
<button
784784
type="button"
785-
on:click={() => goto('/app/leads/')}
785+
onclick={() => goto('/app/leads/')}
786786
disabled={isSubmitting}
787787
class="px-6 py-2 border border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2">
788788
<X class="w-4 h-4" />

‎src/routes/(app)/app/opportunities/[opportunityId]/delete/+page.server.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { error, redirect } from '@sveltejs/kit';
1+
import { error } from '@sveltejs/kit';
22
import { fail } from '@sveltejs/kit';
33
import prisma from '$lib/prisma';
44

@@ -71,12 +71,9 @@ export const actions = {
7171
}
7272
});
7373

74-
// Redirect to opportunities list
75-
throw redirect(303, '/app/opportunities');
74+
// Return success response - let client handle redirect
75+
return { success: true, message: 'Opportunity deleted successfully' };
7676
} catch (err) {
77-
if (err instanceof Response && err.status === 303) {
78-
throw err; // Re-throw redirect
79-
}
8077
console.error('Error deleting opportunity:', err);
8178
return fail(500, { message: 'Failed to delete opportunity' });
8279
}

‎src/routes/(app)/app/opportunities/[opportunityId]/delete/+page.svelte‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,12 @@
8787
return ({ result }) => {
8888
deleteLoading = false;
8989
if (result.type === 'success') {
90+
// Navigate to opportunities list on successful deletion
9091
goto('/app/opportunities');
92+
} else if (result.type === 'failure') {
93+
// Handle error case - you could show a toast notification here
94+
console.error('Failed to delete opportunity:', result.data?.message);
95+
alert(result.data?.message || 'Failed to delete opportunity');
9196
}
9297
};
9398
}}>

‎src/routes/(app)/app/tasks/[task_id]/edit/+page.svelte‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
</div>
4242
<button
4343
type="button"
44-
on:click={handleCancel}
44+
onclick={handleCancel}
4545
class="w-10 h-10 rounded-xl bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 flex items-center justify-center transition-colors duration-200"
4646
aria-label="Close"
4747
>
@@ -211,7 +211,7 @@
211211
<button
212212
type="button"
213213
class="h-11 px-6 rounded-xl bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-700 dark:text-gray-200 font-medium transition-colors duration-200 flex items-center space-x-2"
214-
on:click={handleCancel}
214+
onclick={handleCancel}
215215
>
216216
<X class="w-4 h-4" />
217217
<span>Cancel</span>

0 commit comments

Comments
 (0)