Skip to content

Commit 6aab105

Browse files
charlesschaefercharlesschaefer
committed
Adding triggers management page, still not filtering archived/active triggers
1 parent f41d885 commit 6aab105

8 files changed

Lines changed: 502 additions & 50 deletions

File tree

‎src-tauri/Cargo.lock‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/app.db.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,29 @@ export class AppDb extends Dexie {
113113
}
114114
});
115115

116+
this.version(10)
117+
.stores({
118+
trigger: "++id, name, archived, archive_date",
119+
})
120+
.upgrade((transaction) => {
121+
console.log("Upgrade to version 10 - Adding archived fields to trigger table");
122+
try {
123+
// Add default values for existing substances
124+
this.trigger.toArray().then((triggers) => {
125+
const updatedTrigger = triggers.map(trigger => ({
126+
...trigger,
127+
archived: 0, // 0 for false, 1 for true
128+
archive_date: null
129+
}));
130+
return this.trigger.bulkPut(updatedTrigger);
131+
});
132+
console.log("Added archived fields to trigger table");
133+
} catch (error) {
134+
transaction.abort();
135+
console.error("Error during upgrade:", error);
136+
}
137+
});
138+
116139
this.on("populate", (trans) => this.populate(trans));
117140
}
118141

‎src/app/app.routes.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,13 @@ export const routes: Routes = [
6262
(comp) => comp.TriggersComponent,
6363
),
6464
},
65+
{
66+
path: "settings",
67+
loadComponent: () =>
68+
import("./pages/settings/settings.component").then(
69+
(comp) => comp.SettingsComponent,
70+
),
71+
},
6572
{
6673
path: "substances",
6774
loadComponent: () =>
@@ -70,10 +77,10 @@ export const routes: Routes = [
7077
),
7178
},
7279
{
73-
path: "settings",
80+
path: "triggers/management",
7481
loadComponent: () =>
75-
import("./pages/settings/settings.component").then(
76-
(comp) => comp.SettingsComponent,
82+
import("./pages/triggers/trigger_management.component").then(
83+
(comp) => comp.TriggerManagementComponent,
7784
),
7885
},
7986
{

‎src/app/components/header/header.component.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,14 +40,15 @@ export class HeaderComponent implements OnInit {
4040
{ href: "/", label: this.translateService.translate("Home"), icon: false },
4141
// { href: "/usage-entries", label: this.translateService.translate("Entries"), icon: false },
4242
// { href: "/recovery-dashboard", label: this.translateService.translate("Dashboard"), icon: false },
43-
{ href: "/substances", label: this.translateService.translate("Substances"), icon: false },
4443
{ href: "/triggers", label: this.translateService.translate("Triggers"), icon: false },
4544
{ href: "/financial-impact", label: this.translateService.translate("Finances"), icon: false },
4645
//{ href: "/settings", label: this.translateService.translate("Settings"), icon: true },
4746
];
48-
47+
4948
this.settingsLinks = [
5049
{ href: "/settings", label: this.translateService.translate("App Settings"), icon: false },
50+
{ href: "/substances", label: this.translateService.translate("Substances"), icon: false },
51+
{ href: "/triggers/management", label: this.translateService.translate("Triggers"), icon: false },
5152
{ href: "/settings/backup", label: this.translateService.translate("Backup"), icon: false },
5253
{ href: "/settings/sync", label: this.translateService.translate("Sync"), icon: false },
5354
{ href: "/about", label: this.translateService.translate("About"), icon: false },

‎src/app/dto/trigger.dto.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
export interface TriggerDto {
33
id: number;
44
name: string;
5+
archived?: number;
6+
archive_date?: Date | null;
57
}
68

7-
export type TriggerAddDto = Pick<TriggerDto, 'name'>;
9+
export type TriggerAddDto = Pick<TriggerDto, 'name'>;

‎src/app/pages/triggers/trigger_management.component.html‎

Lines changed: 188 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,188 @@
1+
<div class="min-h-screen bg-gradient-to-br from-purple-50 via-gray-50 to-orange-50 dark:from-gray-900 dark:via-gray-950 dark:to-gray-900 text-gray-800 dark:text-gray-100 transition-all duration-300">
2+
<main class="max-w-5xl mx-auto px-4 py-8 relative">
3+
<!-- Page Title -->
4+
<div class="mb-8">
5+
<h2 class="text-2xl font-semibold bg-gradient-to-r from-purple-600 to-orange-500 bg-clip-text text-transparent text-center">
6+
{{ 'Triggers' | transloco }}
7+
</h2>
8+
<p class="text-gray-500 dark:text-gray-400 text-center">
9+
{{ 'Manage your triggers and their settings' | transloco }}
10+
</p>
11+
</div>
12+
13+
<!-- Active Triggers -->
14+
<div class="bg-white/80 dark:bg-gray-900/80 backdrop-blur-sm rounded-2xl shadow-md p-6 mb-8 border border-gray-100 dark:border-gray-800">
15+
<div class="flex items-center justify-between mb-6">
16+
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-200">
17+
{{ 'Active Triggers' | transloco }}
18+
</h3>
19+
<button
20+
(click)="showArchived.set(!showArchived())"
21+
class="px-4 py-2 bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 rounded-lg hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors"
22+
>
23+
{{ showArchived() ? ('Hide Archived' | transloco) : ('Show Archived' | transloco) }}
24+
</button>
25+
</div>
26+
27+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
28+
<div *ngFor="let trigger of triggers()"
29+
class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-100 dark:border-gray-700 p-4 hover:shadow-md transition-all duration-200">
30+
<div class="flex items-center justify-between mb-3">
31+
<div class="flex items-center space-x-3">
32+
<div>
33+
<h4 class="font-semibold text-lg text-gray-800 dark:text-gray-200">
34+
{{ trigger.name }}
35+
</h4>
36+
<p class="text-sm text-gray-500 dark:text-gray-400">
37+
{{ 'Active' | transloco }}
38+
</p>
39+
</div>
40+
</div>
41+
</div>
42+
43+
<div class="flex justify-end space-x-2">
44+
<button
45+
(click)="editTrigger(trigger)"
46+
class="px-3 py-1.5 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors text-sm"
47+
>
48+
{{ 'Edit' | transloco }}
49+
</button>
50+
<button
51+
(click)="archiveTrigger(trigger)"
52+
class="px-3 py-1.5 bg-orange-500 text-white rounded-lg hover:bg-orange-600 transition-colors text-sm"
53+
>
54+
{{ 'Archive' | transloco }}
55+
</button>
56+
</div>
57+
</div>
58+
</div>
59+
60+
<div *ngIf="triggers().length === 0" class="text-center py-8">
61+
<div class="text-gray-400 dark:text-gray-600 mb-2">
62+
<svg xmlns="http://www.w3.org/2000/svg" class="h-12 w-12 mx-auto" fill="none" viewBox="0 0 24 24" stroke="currentColor">
63+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" />
64+
</svg>
65+
</div>
66+
<p class="text-gray-500 dark:text-gray-400">{{ 'No active triggers found' | transloco }}</p>
67+
</div>
68+
</div>
69+
70+
<!-- Archived Triggers -->
71+
<div *ngIf="showArchived()" class="bg-white/80 dark:bg-gray-900/80 backdrop-blur-sm rounded-2xl shadow-md p-6 mb-8 border border-gray-100 dark:border-gray-800">
72+
<h3 class="text-lg font-semibold text-gray-700 dark:text-gray-200 mb-6">
73+
{{ 'Archived Triggers' | transloco }}
74+
</h3>
75+
76+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
77+
<div *ngFor="let trigger of archivedTriggers()"
78+
class="bg-gray-50 dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 p-4 opacity-75">
79+
<div class="flex items-center justify-between mb-3">
80+
<div class="flex items-center space-x-3">
81+
<div>
82+
<h4 class="font-semibold text-lg text-gray-600 dark:text-gray-400">
83+
{{ trigger.name }}
84+
</h4>
85+
<p class="text-sm text-gray-500 dark:text-gray-500">
86+
{{ 'Archived' | transloco }}
87+
<span *ngIf="trigger.archive_date">
88+
- {{ trigger.archive_date | date:'shortDate' }}
89+
</span>
90+
</p>
91+
</div>
92+
</div>
93+
</div>
94+
95+
<div class="flex justify-end space-x-2">
96+
<button
97+
(click)="editTrigger(trigger)"
98+
class="px-3 py-1.5 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors text-sm"
99+
>
100+
{{ 'Edit' | transloco }}
101+
</button>
102+
<button
103+
(click)="unarchiveTrigger(trigger)"
104+
class="px-3 py-1.5 bg-green-500 text-white rounded-lg hover:bg-green-600 transition-colors text-sm"
105+
>
106+
{{ 'Unarchive' | transloco }}
107+
</button>
108+
</div>
109+
</div>
110+
</div>
111+
112+
<div *ngIf="archivedTriggers().length === 0" class="text-center py-8">
113+
<div class="text-gray-400 dark:text-gray-600 mb-2">
114+
<svg xmlns="http://www.w3.org/2000/svg" class="h-12 w-12 mx-auto" fill="none" viewBox="0 0 24 24" stroke="currentColor">
115+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-14 0h14" />
116+
</svg>
117+
</div>
118+
<p class="text-gray-500 dark:text-gray-400">{{ 'No archived triggers found' | transloco }}</p>
119+
</div>
120+
</div>
121+
</main>
122+
</div>
123+
124+
<!-- Edit Dialog -->
125+
<p-dialog
126+
[(visible)]="showEditDialog"
127+
[header]="'Edit Trigger' | transloco"
128+
[modal]="true"
129+
[style]="{width: '500px'}"
130+
[draggable]="false"
131+
[resizable]="false"
132+
>
133+
<div class="space-y-4">
134+
<form>
135+
<div>
136+
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2" for="name">
137+
{{ 'Name' | transloco }}
138+
</label>
139+
<input
140+
name="name"
141+
type="text"
142+
[(ngModel)]="editForm.name"
143+
class="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent dark:bg-gray-800 dark:text-white"
144+
placeholder="{{ 'Enter trigger name' | transloco }}"
145+
>
146+
</div>
147+
148+
<div>
149+
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2" for="archived">
150+
{{ 'Archive Trigger' | transloco }}
151+
</label>
152+
<div class="flex items-center space-x-3">
153+
<p-toggleButton
154+
name="archived"
155+
[(ngModel)]="archivedToggle"
156+
[onLabel]="'Archived' | transloco"
157+
[offLabel]="'Active' | transloco"
158+
offIcon="pi pi-check"
159+
[onIcon]="'pi pi-archive'"
160+
class="w-full"
161+
></p-toggleButton>
162+
</div>
163+
<p class="text-sm text-gray-500 dark:text-gray-400 mt-2">
164+
{{ 'Archived triggers will not appear in analyses or the "Add trigger usage" popup.' | transloco }}
165+
</p>
166+
</div>
167+
</form>
168+
</div>
169+
170+
<ng-template pTemplate="footer">
171+
<div class="flex justify-end space-x-2">
172+
<button
173+
(click)="cancelEdit()"
174+
class="px-4 py-2 bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-300 rounded-lg hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors"
175+
>
176+
{{ 'Cancel' | transloco }}
177+
</button>
178+
<button
179+
(click)="saveTrigger()"
180+
class="px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors"
181+
>
182+
{{ 'Save Changes' | transloco }}
183+
</button>
184+
</div>
185+
</ng-template>
186+
</p-dialog>
187+
188+
<p-toast></p-toast>

0 commit comments

Comments
 (0)