Skip to content
This repository was archived by the owner on Oct 27, 2025. It is now read-only.

Commit a182ef6

Browse files
author
Morten Hundevad
authored
Added: in page notification options (#127)
* Added: in page notification options Changed: browser sync storage as there is a limit to how manny packages you can send to the cloud (this is done with a timestamp counter) > 10 curently. if threasshold is reached it will delay send and send it one second later. further "adds" are added to the same "batch" and time is reset by 1 sec Changed so that it wont .set of value already equal to .get * fixed spelling error. * implemented sugested changes * more sugestions fixed
1 parent a5a0f9a commit a182ef6

File tree

12 files changed

+562
-116
lines changed

12 files changed

+562
-116
lines changed

‎public/_locales/da/messages.json‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,5 +69,39 @@
6969
},
7070
"GO_TO_OPTIONS": {
7171
"message": "Gå til indstillinger"
72+
},
73+
"SHOW_MORE_OPTION": {
74+
"message": "Vis mere option"
75+
},
76+
"SHOW_MUTE_OPTION": {
77+
"message": "Vis skjul option"
78+
},
79+
"SHOW_HIDE_OPTION": {
80+
"message": "Vis fjern option"
81+
},
82+
"AUTOHIDE_LABEL": {
83+
"message": "Skjul automatisk, $seconds$ sekunder",
84+
"placeholders": {
85+
"seconds": {
86+
"content": "$1"
87+
}
88+
}
89+
},
90+
"DISMISS_TIME_LABEL": {
91+
"message": "Skjul tid, $hours$ timer",
92+
"placeholders": {
93+
"hours": {
94+
"content": "$1"
95+
}
96+
}
97+
},
98+
"OFF": {
99+
"message": "Slukket"
100+
},
101+
"30": {
102+
"message": "30"
103+
},
104+
"IN_PAGE_SETTINGS": {
105+
"message": "Side besked instillinger"
72106
}
73107
}

‎public/_locales/en/messages.json‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,14 @@
1111
"EXCLUDED_DOMAINS": {
1212
"message": "Excluded Domains"
1313
},
14+
"DOMAIN_NOT_VALID": {
15+
"message": "$domainInput$ is not a valid domain",
16+
"placeholders": {
17+
"domainInput": {
18+
"content": "$1"
19+
}
20+
}
21+
},
1422
"ADD": {
1523
"message": "ADD"
1624
},
@@ -61,5 +69,39 @@
6169
},
6270
"GO_TO_OPTIONS": {
6371
"message": "Go to Options"
72+
},
73+
"SHOW_MORE_OPTION": {
74+
"message": "Show more option"
75+
},
76+
"SHOW_MUTE_OPTION": {
77+
"message": "Show mute option"
78+
},
79+
"SHOW_HIDE_OPTION": {
80+
"message": "Show hide option"
81+
},
82+
"AUTOHIDE_LABEL": {
83+
"message": "Autohide message, $seconds$ seconds",
84+
"placeholders": {
85+
"seconds": {
86+
"content": "$1"
87+
}
88+
}
89+
},
90+
"DISMISS_TIME_LABEL": {
91+
"message": "Dismiss time, $hours$ hours",
92+
"placeholders": {
93+
"hours": {
94+
"content": "$1"
95+
}
96+
}
97+
},
98+
"OFF": {
99+
"message": "OFF"
100+
},
101+
"30": {
102+
"message": "30"
103+
},
104+
"IN_PAGE_SETTINGS": {
105+
"message": "In page message settings"
64106
}
65107
}

‎src/common/helpers/dom-messenger.test.ts‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import DOMMessenger from './dom-messenger';
77
import { DOMMessengerAction, IShowInPageNotificationPayload } from './dom-messenger.types';
88
import { IPage } from '@/models/page';
99
import { CompanyPage } from '@/models/company';
10+
import { IInPageNotificationOptions } from '@/ui/inpagenotification/Inspagenotification';
1011

1112
type MessagePayload =
1213
| { action: DOMMessengerAction.DOM_QUERY_SELECTOR_ALL; selector: string }
@@ -17,6 +18,7 @@ type MessagePayload =
1718
| ({
1819
action: DOMMessengerAction.DOM_SHOW_IN_PAGE_NOTIFICATION;
1920
pages: IPage[];
21+
options: IInPageNotificationOptions;
2022
} & IShowInPageNotificationPayload);
2123

2224
type MessageListener = (
@@ -237,8 +239,20 @@ describe('DOMMessenger', () => {
237239

238240
const pages = [testPage];
239241

242+
const options: IInPageNotificationOptions = {
243+
showMore: true,
244+
showMute: true,
245+
showHide: true,
246+
autoHideTime: 5000,
247+
};
248+
240249
listener(
241-
{ action: DOMMessengerAction.DOM_SHOW_IN_PAGE_NOTIFICATION, message: testMessage, pages: pages },
250+
{
251+
action: DOMMessengerAction.DOM_SHOW_IN_PAGE_NOTIFICATION,
252+
message: testMessage,
253+
pages: pages,
254+
options: options,
255+
},
242256
{},
243257
sendResponse
244258
);

‎src/common/helpers/dom-messenger.ts‎

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import makeId from '@/utils/helpers/makeid';
66
import React from 'react';
77
import { createRoot } from 'react-dom/client';
88

9-
import Inspagenotification from '@/ui/inpagenotification/Inspagenotification';
9+
import InPageNotification, { IInPageNotificationOptions } from '@/ui/inpagenotification/Inspagenotification';
1010

1111
import { IPage, Page } from '@/models/page';
1212

@@ -19,6 +19,7 @@ type DOMMessagePayload =
1919
| ({
2020
action: DOMMessengerAction.DOM_SHOW_IN_PAGE_NOTIFICATION;
2121
pages: IPage[];
22+
options: IInPageNotificationOptions;
2223
} & IShowInPageNotificationPayload);
2324

2425
declare global {
@@ -72,13 +73,19 @@ class DOMMessenger implements IDOMMessengerInterface {
7273
});
7374
}
7475

75-
public async showInPageNotification(message: string, pages: Page[]): Promise<unknown> {
76+
public async showInPageNotification(
77+
message: string,
78+
pages: Page[],
79+
options: IInPageNotificationOptions
80+
): Promise<unknown> {
7681
console.log('showInPageNotification1: ', message);
7782
console.log('showInPageNotification2: ', pages);
83+
console.log('showInPageNotification3: ', options);
7884
return await this.sendMessageToCurrentTab({
7985
action: DOMMessengerAction.DOM_SHOW_IN_PAGE_NOTIFICATION,
8086
message: message,
8187
pages: pages.map((page) => page.toJSON()),
88+
options: options,
8289
});
8390
}
8491

@@ -237,7 +244,7 @@ class DOMMessenger implements IDOMMessengerInterface {
237244
if (!typedMessage.message && !typedMessage.pages?.length) {
238245
throw new Error(`DOM_SHOW_IN_PAGE_NOTIFICATION requires a message or pages`);
239246
}
240-
DOMMessenger.displayNotification(typedMessage.message, typedMessage.pages);
247+
DOMMessenger.displayNotification(typedMessage.message, typedMessage.pages, typedMessage.options);
241248
sendResponse({ success: true });
242249
break;
243250
}
@@ -262,7 +269,7 @@ class DOMMessenger implements IDOMMessengerInterface {
262269
return DOMMessenger.elementId;
263270
}
264271

265-
private static displayNotification(message: string, pages: IPage[]): void {
272+
private static displayNotification(message: string, pages: IPage[], options: IInPageNotificationOptions): void {
266273
const containerId = DOMMessenger.containerId();
267274

268275
/**
@@ -277,7 +284,12 @@ class DOMMessenger implements IDOMMessengerInterface {
277284
const shadow = host.attachShadow({ mode: 'open' }); // should we use closed to protect the content ?
278285

279286
createRoot(shadow).render(
280-
React.createElement(Inspagenotification, { containerId: containerId, message: message, pages: pages })
287+
React.createElement(InPageNotification, {
288+
containerId: containerId,
289+
message: message,
290+
pages: pages,
291+
options: options,
292+
})
281293
);
282294

283295
document.body.appendChild(host);

‎src/common/helpers/dom-messenger.types.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import { IElementData } from '@/common/services/content-scanner.types';
2+
import { IInPageNotificationOptions } from '@/ui/inpagenotification/Inspagenotification';
23

34
export interface IDOMMessengerInterface {
45
querySelectorAll(selector: string): Promise<IElementData[]>;
56
querySelector(selector: string): Promise<IElementData | undefined | null>;
67
querySelectorByParentId(id: string, selector: string): Promise<IElementData | undefined | null>;
78
querySelectorAllAsText(selector: string): Promise<string>;
89
createElement(parentId: string, element: string, html: string): Promise<void>;
9-
showInPageNotification(message: string, entries: object[]): Promise<unknown>;
10+
showInPageNotification(message: string, entries: object[], options: IInPageNotificationOptions): Promise<unknown>;
1011
setBadgeText(text: string): Promise<unknown>;
1112
}
1213

‎src/common/services/preferences.ts‎

Lines changed: 85 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,24 @@ class Preferences {
1010
static readonly PAGE_NOTIFICATIONS_ENABLED_KEY = 'page_notifications_enabled';
1111
static readonly DEFAULT_DOMAIN_EXCLUSIONS = ['rossmanngroup.com'];
1212

13+
static readonly PAGE_NOTIFICATIONS_AUTOHIDETIME_KEY = 'page_notifications_autohide';
14+
static readonly PAGE_NOTIFICATIONS_DISMISSTIME_KEY = 'page_notifications_dismiss_time';
15+
static readonly PAGE_NOTIFICATIONS_SHOWMORE_KEY = 'page_notifications_show_more';
16+
static readonly PAGE_NOTIFICATIONS_SHOWMUTE_KEY = 'page_notifications_show_mute';
17+
static readonly PAGE_NOTIFICATIONS_SHOWHIDE_KEY = 'page_notifications_show_hide';
18+
1319
static isEnabled = new ObservableValue<boolean>(true);
1420
static domainExclusions = new ObservableSet<string>();
1521
static browserNotificationsEnabled = new ObservableValue<boolean>(true);
1622
static pageNotificationsEnabled = new ObservableValue<boolean>(true);
1723

24+
//in page options
25+
static pageNotificationsAutoHideTime = new ObservableValue<number>(5);
26+
static pageNotificationsDismissTime = new ObservableValue<number>(1);
27+
static pageNotificationsShowMore = new ObservableValue<boolean>(true);
28+
static pageNotificationsShowMute = new ObservableValue<boolean>(true);
29+
static pageNotificationsShowHide = new ObservableValue<boolean>(true);
30+
1831
// Injected storage backends (TODO: do we need both?)
1932
// Sync is used to share data across browsers if logged in, e.g. plugin settings
2033
// Local is for 'this' browser only storage and can have more space available, e.g. for the pages db
@@ -37,27 +50,54 @@ class Preferences {
3750
static async initDefaults(preferenceStore: IStorageBackend, localStore: IStorageBackend) {
3851
console.log('Defaulting settings');
3952
this.setBackingStores(preferenceStore, localStore);
53+
4054
// Reset callbacks
4155
this.isEnabled.removeAllListeners();
4256
this.domainExclusions.removeAllListeners();
4357
this.browserNotificationsEnabled.removeAllListeners();
4458
this.pageNotificationsEnabled.removeAllListeners();
59+
this.pageNotificationsAutoHideTime.removeAllListeners();
60+
this.pageNotificationsDismissTime.removeAllListeners();
61+
this.pageNotificationsShowMore.removeAllListeners();
62+
this.pageNotificationsShowMute.removeAllListeners();
63+
this.pageNotificationsShowHide.removeAllListeners();
4564

4665
// Set up default callbacks
66+
4767
this.isEnabled.addListener(this.IS_ENABLED_KEY, (result: boolean) => {
48-
void this.setPreference(Preferences.IS_ENABLED_KEY, result);
68+
this.setPreference(Preferences.IS_ENABLED_KEY, result);
4969
});
5070

5171
this.domainExclusions.addListener(this.DOMAIN_EXCLUSIONS_KEY, (result: string[]) => {
52-
void this.setPreference(Preferences.DOMAIN_EXCLUSIONS_KEY, result);
72+
this.setPreference(Preferences.DOMAIN_EXCLUSIONS_KEY, result);
5373
});
5474

5575
this.browserNotificationsEnabled.addListener(this.BROWSER_NOTIFICATIONS_ENABLED_KEY, (result: boolean) => {
56-
void this.setPreference(Preferences.BROWSER_NOTIFICATIONS_ENABLED_KEY, result);
76+
this.setPreference(Preferences.BROWSER_NOTIFICATIONS_ENABLED_KEY, result);
5777
});
5878

5979
this.pageNotificationsEnabled.addListener(this.PAGE_NOTIFICATIONS_ENABLED_KEY, (result: boolean) => {
60-
void this.setPreference(Preferences.PAGE_NOTIFICATIONS_ENABLED_KEY, result);
80+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_ENABLED_KEY, result);
81+
});
82+
83+
this.pageNotificationsAutoHideTime.addListener(this.PAGE_NOTIFICATIONS_AUTOHIDETIME_KEY, (result: number) => {
84+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_AUTOHIDETIME_KEY, result);
85+
});
86+
87+
this.pageNotificationsDismissTime.addListener(this.PAGE_NOTIFICATIONS_DISMISSTIME_KEY, (result: number) => {
88+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_DISMISSTIME_KEY, result);
89+
});
90+
91+
this.pageNotificationsShowMore.addListener(this.PAGE_NOTIFICATIONS_SHOWMORE_KEY, (result: boolean) => {
92+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_SHOWMORE_KEY, result);
93+
});
94+
95+
this.pageNotificationsShowMute.addListener(this.PAGE_NOTIFICATIONS_SHOWMUTE_KEY, (result: boolean) => {
96+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_SHOWMUTE_KEY, result);
97+
});
98+
99+
this.pageNotificationsShowHide.addListener(this.PAGE_NOTIFICATIONS_SHOWHIDE_KEY, (result: boolean) => {
100+
this.setPreference(Preferences.PAGE_NOTIFICATIONS_SHOWHIDE_KEY, result);
61101
});
62102

63103
// Attempt preference retrieval
@@ -89,14 +129,54 @@ class Preferences {
89129
} else {
90130
this.pageNotificationsEnabled.value = true;
91131
}
132+
133+
const rawPageNotificationsAutoHide = await this.getPreference(this.PAGE_NOTIFICATIONS_AUTOHIDETIME_KEY);
134+
if (typeof rawPageNotificationsAutoHide === 'number') {
135+
this.pageNotificationsAutoHideTime.value = rawPageNotificationsAutoHide;
136+
} else {
137+
this.pageNotificationsAutoHideTime.value = 5;
138+
}
139+
140+
const rawPageNotificationsDismissTime = await this.getPreference(this.PAGE_NOTIFICATIONS_DISMISSTIME_KEY);
141+
if (typeof rawPageNotificationsDismissTime === 'number') {
142+
this.pageNotificationsDismissTime.value = rawPageNotificationsDismissTime;
143+
} else {
144+
this.pageNotificationsDismissTime.value = 1;
145+
}
146+
147+
const rawrawpageNotificationsShowMore = await this.getPreference(this.PAGE_NOTIFICATIONS_SHOWMORE_KEY);
148+
if (typeof rawrawpageNotificationsShowMore === 'boolean') {
149+
this.pageNotificationsShowMore.value = rawrawpageNotificationsShowMore;
150+
} else {
151+
this.pageNotificationsShowMore.value = true;
152+
}
153+
154+
const rawpageNotificationsShowMute = await this.getPreference(this.PAGE_NOTIFICATIONS_SHOWMUTE_KEY);
155+
if (typeof rawpageNotificationsShowMute === 'boolean') {
156+
this.pageNotificationsShowMute.value = rawpageNotificationsShowMute;
157+
} else {
158+
this.pageNotificationsShowMute.value = true;
159+
}
160+
161+
const rawpageNotificationsShowHide = await this.getPreference(this.PAGE_NOTIFICATIONS_SHOWHIDE_KEY);
162+
if (typeof rawpageNotificationsShowHide === 'boolean') {
163+
this.pageNotificationsShowHide.value = rawpageNotificationsShowHide;
164+
} else {
165+
this.pageNotificationsShowHide.value = true;
166+
}
92167
}
93168

94169
public static dump(): void {
95170
const msg: string =
96171
`IsEnabled = ${Preferences.isEnabled.toString()}, ` +
97172
`DomainExclusions = ${Preferences.domainExclusions.toString()}, ` +
98173
`BrowserNotificationsEnabled = ${Preferences.browserNotificationsEnabled.toString()}, ` +
99-
`PageNotificationsEnabled = ${Preferences.pageNotificationsEnabled.toString()}`;
174+
`PageNotificationsEnabled = ${Preferences.pageNotificationsEnabled.toString()}, ` +
175+
`PageNotificationsAutoHideTime = ${Preferences.pageNotificationsAutoHideTime.toString()}, ` +
176+
`PageNotificationsDismissTime = ${Preferences.pageNotificationsDismissTime.toString()}, ` +
177+
`pageNotificationsShowMore = ${Preferences.pageNotificationsShowMore.toString()}, ` +
178+
`pageNotificationsShowMute = ${Preferences.pageNotificationsShowMute.toString()}, ` +
179+
`pageNotificationsShowHide = ${Preferences.pageNotificationsShowHide.toString()}`;
100180
console.log(msg);
101181
}
102182

0 commit comments

Comments
 (0)