@@ -2,23 +2,15 @@ import { html, msg, router, store } from 'hybrids';
2
2
3
3
import * as labels from '@ghostery/ui/labels';
4
4
5
- import { isCategoryBlockedByDefault } from '../../../utils/trackerdb.js';
6
-
7
5
import TabStats from '/store/tab-stats.js';
8
- import TrackerException from '/store/tracker-exception.js';
9
-
10
- function toggleException(type) {
11
- return ({ exception, stats }) => {
12
- const list = [...exception[type]];
13
- const index = list.indexOf(stats.domain);
14
- if (index !== -1) {
15
- list.splice(index, 1);
16
- } else {
17
- list.push(stats.domain);
18
- }
6
+ import { toggleExceptionDomain } from '/store/tracker-exception.js';
19
7
20
- store.set(exception, { [type]: list });
21
- };
8
+ function toggleDomain({ stats, tracker }) {
9
+ toggleExceptionDomain(
10
+ tracker.exception,
11
+ stats.domain,
12
+ tracker.blockedByDefault,
13
+ );
22
14
}
23
15
24
16
export default {
@@ -27,21 +19,17 @@ export default {
27
19
trackerId: '',
28
20
tracker: ({ stats, trackerId }) =>
29
21
stats.trackers.find((t) => t.id === trackerId),
30
- exception: store(TrackerException, { id: 'trackerId' }),
31
- blockedByDefault: ({ tracker }) =>
32
- isCategoryBlockedByDefault(tracker.category),
33
- blockedOnSite: ({ stats, exception }) =>
34
- store.ready(exception) && exception.blocked.includes(stats.domain),
35
- allowedOnSite: ({ stats, exception }) =>
36
- store.ready(exception) && exception.allowed.includes(stats.domain),
37
- content: ({
38
- stats,
39
- tracker,
40
- exception,
41
- blockedByDefault,
42
- blockedOnSite,
43
- allowedOnSite,
44
- }) => html`
22
+ blocked: ({ tracker }) =>
23
+ store.ready(tracker.exception)
24
+ ? tracker.exception.blocked
25
+ : tracker.blockedByDefault,
26
+ blockedOnSite: ({ stats, tracker }) =>
27
+ store.ready(tracker.exception) &&
28
+ tracker.exception.blockedDomains.includes(stats.domain),
29
+ allowedOnSite: ({ stats, tracker }) =>
30
+ store.ready(tracker.exception) &&
31
+ tracker.exception.trustedDomains.includes(stats.domain),
32
+ content: ({ stats, tracker, blocked, blockedOnSite, allowedOnSite }) => html`
45
33
<template layout="column">
46
34
<gh-panel-dialog>
47
35
<div
@@ -56,7 +44,7 @@ export default {
56
44
tracker.company + ' •'}
57
45
${labels.categories[tracker.category]}
58
46
</ui-text>
59
- ${store.ready(exception) &&
47
+ ${( store.ready(tracker. exception) || store.error(tracker.exception) ) &&
60
48
html`
61
49
<div layout="column gap:3">
62
50
<div layout="column gap">
@@ -68,16 +56,15 @@ export default {
68
56
</div>
69
57
<ui-panel-protection-status-toggle
70
58
layout="self:center"
71
- value="${exception.overwriteStatus}"
72
- blockByDefault="${blockedByDefault}"
59
+ value="${blocked}"
73
60
tooltip
74
- onchange="${html.set(exception, 'overwriteStatus ')}"
61
+ onchange="${html.set(tracker. exception, 'blocked ')}"
75
62
></ui-panel-protection-status-toggle>
76
63
</div>
77
64
<gh-panel-card type="info">
78
65
<ui-text type="label-s" color="primary-700" layout="row gap:0.5">
79
66
<ui-icon name="info-filled"></ui-icon>
80
- ${blockedByDefault
67
+ ${tracker. blockedByDefault
81
68
? msg`Our recommendation for this activity: Blocked`
82
69
: msg`Our recommendation for this activity: Trusted`}
83
70
</ui-text>
@@ -88,27 +75,27 @@ export default {
88
75
Add ${stats.domain} as exception
89
76
</ui-text>
90
77
<ui-text type="body-s" color="gray-500">
91
- ${blockedByDefault === exception.overwriteStatus
92
- ? msg`Block on this website`
93
- : msg`Trust on this website`}
78
+ ${blocked
79
+ ? msg`Trust on this website`
80
+ : msg`Block on this website`}
94
81
</ui-text>
95
82
</div>
96
- ${blockedByDefault === exception.overwriteStatus
83
+ ${blocked
97
84
? html`
98
85
<ui-toggle
99
- value="${blockedOnSite }"
100
- onchange="${toggleException('blocked') }"
86
+ value="${allowedOnSite }"
87
+ onchange="${toggleDomain }"
101
88
type="status"
102
- color="danger -500"
89
+ color="success -500"
103
90
layout="margin:top:0.5"
104
91
></ui-toggle>
105
92
`
106
93
: html`
107
94
<ui-toggle
108
- value="${allowedOnSite }"
109
- onchange="${toggleException('allowed') }"
95
+ value="${blockedOnSite }"
96
+ onchange="${toggleDomain }"
110
97
type="status"
111
- color="success -500"
98
+ color="danger -500"
112
99
layout="margin:top:0.5"
113
100
></ui-toggle>
114
101
`}
0 commit comments