@@ -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