@internetarchive/collection-browser 2.13.2-alpha-webdev7687.6 → 2.13.2-alpha-webdev7687.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/dist/src/models.d.ts +6 -0
  2. package/dist/src/models.js +13 -7
  3. package/dist/src/models.js.map +1 -1
  4. package/dist/src/restoration-state-handler.js +3 -0
  5. package/dist/src/restoration-state-handler.js.map +1 -1
  6. package/dist/src/tiles/grid/tile-stats.js +1 -6
  7. package/dist/src/tiles/grid/tile-stats.js.map +1 -1
  8. package/dist/src/tiles/list/tile-list-compact.js +3 -9
  9. package/dist/src/tiles/list/tile-list-compact.js.map +1 -1
  10. package/dist/src/tiles/list/tile-list.js +1 -8
  11. package/dist/src/tiles/list/tile-list.js.map +1 -1
  12. package/dist/src/tiles/tile-mediatype-icon.d.ts +0 -4
  13. package/dist/src/tiles/tile-mediatype-icon.js +21 -26
  14. package/dist/src/tiles/tile-mediatype-icon.js.map +1 -1
  15. package/dist/test/restoration-state-handler.test.js +58 -1
  16. package/dist/test/restoration-state-handler.test.js.map +1 -1
  17. package/dist/test/tiles/tile-mediatype-icon.test.js +83 -26
  18. package/dist/test/tiles/tile-mediatype-icon.test.js.map +1 -1
  19. package/package.json +1 -1
  20. package/src/models.ts +13 -7
  21. package/src/restoration-state-handler.ts +3 -0
  22. package/src/tiles/grid/tile-stats.ts +1 -6
  23. package/src/tiles/list/tile-list-compact.ts +1 -7
  24. package/src/tiles/list/tile-list.ts +1 -7
  25. package/src/tiles/tile-mediatype-icon.ts +21 -19
  26. package/test/restoration-state-handler.test.ts +71 -1
  27. package/test/tiles/tile-mediatype-icon.test.ts +89 -26
package/dist/test/tiles/tile-mediatype-icon.test.js CHANGED
@@ -1,19 +1,26 @@
1
1
  import { expect, fixture } from '@open-wc/testing';
2
2
  import { html } from 'lit';
3
3
  import '../../src/tiles/tile-mediatype-icon';
4
+ import { TileModel } from '../../src/models';
4
5
  describe('Mediatype Icon', () => {
6
+ let model;
7
+ beforeEach(() => {
8
+ model = new TileModel({});
9
+ });
5
10
  it('renders component', async () => {
6
11
  var _a;
12
+ model.mediatype = 'texts';
7
13
  const el = await fixture(html `
8
- <tile-mediatype-icon mediatype="texts"></tile-mediatype-icon>
14
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
9
15
  `);
10
16
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
11
17
  expect(iconDiv).to.exist;
12
18
  });
13
19
  it('renders basic mediatype correctly', async () => {
14
20
  var _a;
21
+ model.mediatype = 'movies';
15
22
  const el = await fixture(html `
16
- <tile-mediatype-icon mediatype="movies"></tile-mediatype-icon>
23
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
17
24
  `);
18
25
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
19
26
  expect(iconDiv.title).to.equal('Movie');
@@ -22,64 +29,114 @@ describe('Mediatype Icon', () => {
22
29
  });
23
30
  it('renders TV mediatype', async () => {
24
31
  var _a;
32
+ model.mediatype = 'movies';
33
+ model.collections = ['tvnews'];
25
34
  const el = await fixture(html `
26
- <tile-mediatype-icon
27
- mediatype="movies"
28
- .collections=${['tvnews']}
29
- ></tile-mediatype-icon>
35
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
30
36
  `);
31
37
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
32
38
  expect(iconDiv.title).to.equal('TV');
33
39
  });
34
- it('renders TV Commercial mediatype', async () => {
40
+ it('renders TV Commercial mediatype for TV items with ad ids', async () => {
41
+ var _a;
42
+ model.mediatype = 'movies';
43
+ model.collections = ['tvnews'];
44
+ model.adIds = ['foo'];
45
+ const el = await fixture(html `
46
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
47
+ `);
48
+ const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
49
+ expect(iconDiv.title).to.equal('TV Commercial');
50
+ });
51
+ it('renders TV Commercial mediatype for TV items in tv_ads collection', async () => {
35
52
  var _a;
53
+ model.mediatype = 'movies';
54
+ model.collections = ['tvnews', 'tv_ads'];
36
55
  const el = await fixture(html `
37
- <tile-mediatype-icon
38
- mediatype="movies"
39
- .collections=${['tvnews', 'tv_ads']}
40
- ></tile-mediatype-icon>
56
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
41
57
  `);
42
58
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
43
59
  expect(iconDiv.title).to.equal('TV Commercial');
44
60
  });
45
- it('renders TV Fact Check mediatype for search results', async () => {
61
+ it('renders TV Fact Check mediatype for TV search results with fact check URLs', async () => {
62
+ var _a;
63
+ model.hitType = 'tv_clip';
64
+ model.hitRequestSource = 'search_query';
65
+ model.mediatype = 'movies';
66
+ model.collections = ['tvnews'];
67
+ model.factChecks = ['https://example.com'];
68
+ const el = await fixture(html `
69
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
70
+ `);
71
+ const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
72
+ expect(iconDiv.title).to.equal('TV Fact Check');
73
+ });
74
+ it('renders TV Fact Check mediatype for TV search results in factchecked collection', async () => {
46
75
  var _a;
76
+ model.hitType = 'tv_clip';
77
+ model.hitRequestSource = 'search_query';
78
+ model.mediatype = 'movies';
79
+ model.collections = ['tvnews', 'factchecked'];
47
80
  const el = await fixture(html `
48
- <tile-mediatype-icon
49
- isTvSearchResult
50
- mediatype="movies"
51
- .collections=${['tvnews', 'factchecked']}
52
- ></tile-mediatype-icon>
81
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
53
82
  `);
54
83
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
55
84
  expect(iconDiv.title).to.equal('TV Fact Check');
56
85
  });
57
86
  it('does not use TV Fact Check mediatype for non-search results', async () => {
58
87
  var _a;
88
+ model.hitType = 'tv_clip';
89
+ model.hitRequestSource = 'collection_members';
90
+ model.mediatype = 'movies';
91
+ model.collections = ['tvnews'];
92
+ model.factChecks = ['https://example.com'];
93
+ const el = await fixture(html `
94
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
95
+ `);
96
+ const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
97
+ expect(iconDiv.title).to.equal('TV');
98
+ });
99
+ it('renders TV Quote mediatype for TV search results that are clips', async () => {
100
+ var _a;
101
+ model.hitType = 'tv_clip';
102
+ model.hitRequestSource = 'search_query';
103
+ model.mediatype = 'movies';
104
+ model.collections = ['tvnews'];
105
+ model.isClip = true;
106
+ const el = await fixture(html `
107
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
108
+ `);
109
+ const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
110
+ expect(iconDiv.title).to.equal('TV Quote');
111
+ });
112
+ it('does not use TV Quote mediatype for non-search results', async () => {
113
+ var _a;
114
+ model.hitType = 'tv_clip';
115
+ model.hitRequestSource = 'collection_members';
116
+ model.mediatype = 'movies';
117
+ model.collections = ['tvnews'];
118
+ model.isClip = true;
59
119
  const el = await fixture(html `
60
- <tile-mediatype-icon
61
- mediatype="movies"
62
- .collections=${['tvnews', 'factchecked']}
63
- ></tile-mediatype-icon>
120
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
64
121
  `);
65
122
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
66
123
  expect(iconDiv.title).to.equal('TV');
67
124
  });
68
125
  it('renders radio mediatype', async () => {
69
126
  var _a;
127
+ model.mediatype = 'audio';
128
+ model.collections = ['radio'];
70
129
  const el = await fixture(html `
71
- <tile-mediatype-icon
72
- mediatype="audio"
73
- .collections=${['radio']}
74
- ></tile-mediatype-icon>
130
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
75
131
  `);
76
132
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
77
133
  expect(iconDiv.title).to.equal('Radio');
78
134
  });
79
135
  it('renders no icon if mediatype is unrecognized', async () => {
80
136
  var _a;
137
+ model.mediatype = 'foobar';
81
138
  const el = await fixture(html `
82
- <tile-mediatype-icon mediatype="foobar"></tile-mediatype-icon>
139
+ <tile-mediatype-icon .model=${model}></tile-mediatype-icon>
83
140
  `);
84
141
  const iconDiv = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#icon');
85
142
  expect(iconDiv).not.to.exist;
package/dist/test/tiles/tile-mediatype-icon.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tile-mediatype-icon.test.js","sourceRoot":"","sources":["../../../test/tiles/tile-mediatype-icon.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAG3B,OAAO,qCAAqC,CAAC;AAE7C,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;IAC9B,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;;QACjC,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;KAE/C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QACtD,MAAM,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAC3B,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;;QACjD,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;KAE/C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACxC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAC5D,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;IAC3D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;;QACpC,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;;uBAG7B,CAAC,QAAQ,CAAC;;KAE5B,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;;QAC/C,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;;uBAG7B,CAAC,QAAQ,EAAE,QAAQ,CAAC;;KAEtC,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAClD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oDAAoD,EAAE,KAAK,IAAI,EAAE;;QAClE,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;;;uBAI7B,CAAC,QAAQ,EAAE,aAAa,CAAC;;KAE3C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAClD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,6DAA6D,EAAE,KAAK,IAAI,EAAE;;QAC3E,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;;uBAG7B,CAAC,QAAQ,EAAE,aAAa,CAAC;;KAE3C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;;QACvC,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;;uBAG7B,CAAC,OAAO,CAAC;;KAE3B,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAmB,CAAC;QACxE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;;QAC5D,MAAM,EAAE,GAAG,MAAM,OAAO,CAAoB,IAAI,CAAA;;KAE/C,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QACtD,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,CAAC;IAC/B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { expect, fixture } from '@open-wc/testing';\nimport { html } from 'lit';\nimport type { TileMediatypeIcon } from '../../src/tiles/tile-mediatype-icon';\n\nimport '../../src/tiles/tile-mediatype-icon';\n\ndescribe('Mediatype Icon', () => {\n it('renders component', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon mediatype=\"texts\"></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon');\n expect(iconDiv).to.exist;\n });\n\n it('renders basic mediatype correctly', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon mediatype=\"movies\"></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('Movie');\n expect(iconDiv.getAttribute('style')).to.include('#f1644b');\n expect(iconDiv.children[0]).to.be.instanceOf(SVGElement);\n });\n\n it('renders TV mediatype', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon\n mediatype=\"movies\"\n .collections=${['tvnews']}\n ></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV');\n });\n\n it('renders TV Commercial mediatype', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon\n mediatype=\"movies\"\n .collections=${['tvnews', 'tv_ads']}\n ></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Commercial');\n });\n\n it('renders TV Fact Check mediatype for search results', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon\n isTvSearchResult\n mediatype=\"movies\"\n .collections=${['tvnews', 'factchecked']}\n ></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Fact Check');\n });\n\n it('does not use TV Fact Check mediatype for non-search results', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon\n mediatype=\"movies\"\n .collections=${['tvnews', 'factchecked']}\n ></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV');\n });\n\n it('renders radio mediatype', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon\n mediatype=\"audio\"\n .collections=${['radio']}\n ></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('Radio');\n });\n\n it('renders no icon if mediatype is unrecognized', async () => {\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon mediatype=\"foobar\"></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon');\n expect(iconDiv).not.to.exist;\n });\n});\n"]}
1
+ {"version":3,"file":"tile-mediatype-icon.test.js","sourceRoot":"","sources":["../../../test/tiles/tile-mediatype-icon.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, fixture } from '@open-wc/testing';\nimport { html } from 'lit';\nimport type { TileMediatypeIcon } from '../../src/tiles/tile-mediatype-icon';\n\nimport '../../src/tiles/tile-mediatype-icon';\nimport { TileModel } from '../../src/models';\nimport { MediaType } from '@internetarchive/field-parsers';\n\ndescribe('Mediatype Icon', () => {\n let model: TileModel;\n beforeEach(() => {\n model = new TileModel({});\n });\n\n it('renders component', async () => {\n model.mediatype = 'texts';\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon');\n expect(iconDiv).to.exist;\n });\n\n it('renders basic mediatype correctly', async () => {\n model.mediatype = 'movies';\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('Movie');\n expect(iconDiv.getAttribute('style')).to.include('#f1644b');\n expect(iconDiv.children[0]).to.be.instanceOf(SVGElement);\n });\n\n it('renders TV mediatype', async () => {\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV');\n });\n\n it('renders TV Commercial mediatype for TV items with ad ids', async () => {\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n model.adIds = ['foo'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Commercial');\n });\n\n it('renders TV Commercial mediatype for TV items in tv_ads collection', async () => {\n model.mediatype = 'movies';\n model.collections = ['tvnews', 'tv_ads'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Commercial');\n });\n\n it('renders TV Fact Check mediatype for TV search results with fact check URLs', async () => {\n model.hitType = 'tv_clip';\n model.hitRequestSource = 'search_query';\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n model.factChecks = ['https://example.com'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Fact Check');\n });\n\n it('renders TV Fact Check mediatype for TV search results in factchecked collection', async () => {\n model.hitType = 'tv_clip';\n model.hitRequestSource = 'search_query';\n model.mediatype = 'movies';\n model.collections = ['tvnews', 'factchecked'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Fact Check');\n });\n\n it('does not use TV Fact Check mediatype for non-search results', async () => {\n model.hitType = 'tv_clip';\n model.hitRequestSource = 'collection_members';\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n model.factChecks = ['https://example.com'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV');\n });\n\n it('renders TV Quote mediatype for TV search results that are clips', async () => {\n model.hitType = 'tv_clip';\n model.hitRequestSource = 'search_query';\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n model.isClip = true;\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV Quote');\n });\n\n it('does not use TV Quote mediatype for non-search results', async () => {\n model.hitType = 'tv_clip';\n model.hitRequestSource = 'collection_members';\n model.mediatype = 'movies';\n model.collections = ['tvnews'];\n model.isClip = true;\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('TV');\n });\n\n it('renders radio mediatype', async () => {\n model.mediatype = 'audio';\n model.collections = ['radio'];\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon') as HTMLDivElement;\n expect(iconDiv.title).to.equal('Radio');\n });\n\n it('renders no icon if mediatype is unrecognized', async () => {\n model.mediatype = 'foobar' as MediaType;\n const el = await fixture<TileMediatypeIcon>(html`\n <tile-mediatype-icon .model=${model}></tile-mediatype-icon>\n `);\n\n const iconDiv = el.shadowRoot?.querySelector('#icon');\n expect(iconDiv).not.to.exist;\n });\n});\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "The Internet Archive Collection Browser.",
4
4
  "license": "AGPL-3.0-only",
5
5
  "author": "Internet Archive",
6
- "version": "2.13.2-alpha-webdev7687.6",
6
+ "version": "2.13.2-alpha-webdev7687.7",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.js",
9
9
  "scripts": {
package/src/models.ts CHANGED
@@ -655,17 +655,23 @@ export const getDefaultSelectedFacets = (): Required<SelectedFacets> => ({
655
655
  */
656
656
  export type TvClipFilterType = 'all' | 'commercials' | 'factchecks' | 'quotes';
657
657
 
658
+ /**
659
+ * Map from TV clip filter types to their corresponding URL params
660
+ */
658
661
  export const tvClipFiltersToURLParams: Record<TvClipFilterType, string> = {
659
- 'all': '',
660
- 'commercials': 'only_commercials',
661
- 'factchecks': 'only_factchecks',
662
- 'quotes': 'only_quotes',
662
+ all: '',
663
+ commercials: 'only_commercials',
664
+ factchecks: 'only_factchecks',
665
+ quotes: 'only_quotes',
663
666
  };
664
667
 
668
+ /**
669
+ * Map from allowed TV filtering parameters in the URL to their corresponding filter type
670
+ */
665
671
  export const tvClipURLParamsToFilters: Record<string, TvClipFilterType> = {
666
- 'only_commercials': 'commercials',
667
- 'only_factchecks': 'factchecks',
668
- 'only_quotes': 'quotes',
672
+ only_commercials: 'commercials',
673
+ only_factchecks: 'factchecks',
674
+ only_quotes: 'quotes',
669
675
  };
670
676
 
671
677
  /**
package/src/restoration-state-handler.ts CHANGED
@@ -228,6 +228,9 @@ export class RestorationStateHandler
228
228
  'sort',
229
229
  'and[]',
230
230
  'not[]',
231
+ 'only_commercials',
232
+ 'only_factchecks',
233
+ 'only_quotes',
231
234
  ]);
232
235
 
233
236
  if (
package/src/tiles/grid/tile-stats.ts CHANGED
@@ -74,12 +74,7 @@ export class TileStats extends LitElement {
74
74
  return html`
75
75
  <li class="col">
76
76
  <p class="sr-only">${msg('Mediatype:')}</p>
77
- <tile-mediatype-icon
78
- .model=${this.model}
79
- .mediatype=${this.mediatype}
80
- .collections=${this.collections}
81
- ?isTvSearchResult=${this.isTvSearchResult}
82
- ></tile-mediatype-icon>
77
+ <tile-mediatype-icon .model=${this.model}></tile-mediatype-icon>
83
78
  </li>
84
79
  `;
85
80
  }
package/src/tiles/list/tile-list-compact.ts CHANGED
@@ -50,13 +50,7 @@ export class TileListCompact extends BaseTileComponent {
50
50
  </div>
51
51
  <div id="date">${formatDate(this.date, this.dateFormatSize)}</div>
52
52
  <div id="icon">
53
- <tile-mediatype-icon
54
- .model=${this.model}
55
- .mediatype=${this.model?.mediatype}
56
- .collections=${this.model?.collections}
57
- ?isTvSearchResult=${this.model?.isTvSearchResult}
58
- >
59
- </tile-mediatype-icon>
53
+ <tile-mediatype-icon .model=${this.model}> </tile-mediatype-icon>
60
54
  </div>
61
55
  <div id="views">${formatCount(this.views ?? 0, this.formatSize)}</div>
62
56
  </div>
package/src/tiles/list/tile-list.ts CHANGED
@@ -126,13 +126,7 @@ export class TileList extends BaseTileComponent {
126
126
  private get iconRightTemplate() {
127
127
  return html`
128
128
  <a id="icon-right" href=${this.mediatypeURL}>
129
- <tile-mediatype-icon
130
- .model=${this.model}
131
- .mediatype=${this.model?.mediatype}
132
- .collections=${this.model?.collections}
133
- ?isTvSearchResult=${this.model?.isTvSearchResult}
134
- >
135
- </tile-mediatype-icon>
129
+ <tile-mediatype-icon .model=${this.model}> </tile-mediatype-icon>
136
130
  </a>
137
131
  `;
138
132
  }
package/src/tiles/tile-mediatype-icon.ts CHANGED
@@ -7,19 +7,15 @@ import {
7
7
  } from '../mediatype/mediatype-config';
8
8
  import type { TileModel } from '../models';
9
9
 
10
+ const TV_COMMERCIAL_COLLECTION = 'tv_ads';
11
+ const TV_FACT_CHECK_COLLECTION = 'factchecked';
10
12
  const TV_COLLECTIONS = new Set(['tvnews', 'tvarchive', 'television']);
11
13
  const RADIO_COLLECTIONS = new Set(['radio', 'radioprogram']);
12
14
 
13
15
  @customElement('tile-mediatype-icon')
14
16
  export class TileMediatypeIcon extends LitElement {
15
- @property({ type: String }) mediatype?: MediatypeConfigKey;
16
-
17
17
  @property({ type: Object }) model?: TileModel;
18
18
 
19
- @property({ type: Array }) collections?: string[];
20
-
21
- @property({ type: Boolean }) isTvSearchResult = false;
22
-
23
19
  @property({ type: Boolean }) showText = false;
24
20
 
25
21
  /**
@@ -28,7 +24,7 @@ export class TileMediatypeIcon extends LitElement {
28
24
  private get displayMediatype(): MediatypeConfigKey {
29
25
  if (this.isTvItem) return this.tvDisplayMediatype;
30
26
  if (this.isRadioItem) return 'radio';
31
- return this.mediatype ?? 'none';
27
+ return this.model?.mediatype ?? 'none';
32
28
  }
33
29
 
34
30
  /**
@@ -37,9 +33,9 @@ export class TileMediatypeIcon extends LitElement {
37
33
  private get tvDisplayMediatype(): MediatypeConfigKey {
38
34
  if (this.isTvCommercial) {
39
35
  return 'tvCommercial';
40
- } else if (this.isTvSearchResult && this.isTvFactCheck) {
36
+ } else if (this.model?.isTvSearchResult && this.isTvFactCheck) {
41
37
  return 'tvFactCheck';
42
- } else if (this.isTvSearchResult && this.isTvQuote) {
38
+ } else if (this.model?.isTvSearchResult && this.isTvQuote) {
43
39
  return 'tvQuote';
44
40
  }
45
41
 
@@ -50,20 +46,26 @@ export class TileMediatypeIcon extends LitElement {
50
46
  * Whether this represents a TV item
51
47
  */
52
48
  private get isTvItem(): boolean {
53
- return (
54
- this.mediatype === 'movies' &&
55
- !!this.collections?.some(id => TV_COLLECTIONS.has(id))
49
+ return !!(
50
+ this.model?.mediatype === 'movies' &&
51
+ this.model?.collections.some(id => TV_COLLECTIONS.has(id))
56
52
  );
57
53
  }
58
54
 
59
55
  private get isTvCommercial(): boolean {
60
- // Contains one or more TV ad identifiers
61
- return !!this.model?.adIds?.length;
56
+ // Contains one or more TV ad identifiers or is in the tv_ads collection
57
+ return !!(
58
+ this.model?.adIds?.length ||
59
+ this.model?.collections.includes(TV_COMMERCIAL_COLLECTION)
60
+ );
62
61
  }
63
62
 
64
63
  private get isTvFactCheck(): boolean {
65
- // Contains one or more fact-check URLs
66
- return !!this.model?.factChecks?.length;
64
+ // Contains one or more fact-check URLs or is in the factchecked collection
65
+ return !!(
66
+ this.model?.factChecks?.length ||
67
+ this.model?.collections.includes(TV_FACT_CHECK_COLLECTION)
68
+ );
67
69
  }
68
70
 
69
71
  private get isTvQuote(): boolean {
@@ -74,9 +76,9 @@ export class TileMediatypeIcon extends LitElement {
74
76
  * Whether this represents a radio item
75
77
  */
76
78
  private get isRadioItem(): boolean {
77
- return (
78
- this.mediatype === 'audio' &&
79
- !!this.collections?.some(id => RADIO_COLLECTIONS.has(id))
79
+ return !!(
80
+ this.model?.mediatype === 'audio' &&
81
+ this.model?.collections.some(id => RADIO_COLLECTIONS.has(id))
80
82
  );
81
83
  }
82
84
 
package/test/restoration-state-handler.test.ts CHANGED
@@ -1,7 +1,10 @@
1
1
  import { SearchType } from '@internetarchive/search-service';
2
2
  import { expect } from '@open-wc/testing';
3
3
  import { SortField, getDefaultSelectedFacets } from '../src/models';
4
- import { RestorationStateHandler } from '../src/restoration-state-handler';
4
+ import {
5
+ RestorationState,
6
+ RestorationStateHandler,
7
+ } from '../src/restoration-state-handler';
5
8
 
6
9
  describe('Restoration state handler', () => {
7
10
  it('should restore query from URL', async () => {
@@ -242,6 +245,35 @@ describe('Restoration state handler', () => {
242
245
  );
243
246
  });
244
247
 
248
+ it('should restore any TV clip filters from URL', async () => {
249
+ const handler = new RestorationStateHandler({ context: 'search' });
250
+ const url = new URL(window.location.href);
251
+
252
+ // Commercials
253
+ url.search = '?only_commercials=1';
254
+ window.history.replaceState({ path: url.href }, '', url.href);
255
+ const commercialsRestorationState = handler.getRestorationState();
256
+ expect(commercialsRestorationState.tvClipFilter).to.equal('commercials');
257
+
258
+ // Fact checks
259
+ url.search = '?only_factchecks=1';
260
+ window.history.replaceState({ path: url.href }, '', url.href);
261
+ const factchecksRestorationState = handler.getRestorationState();
262
+ expect(factchecksRestorationState.tvClipFilter).to.equal('factchecks');
263
+
264
+ // Quotes
265
+ url.search = '?only_quotes=1';
266
+ window.history.replaceState({ path: url.href }, '', url.href);
267
+ const quotesRestorationState = handler.getRestorationState();
268
+ expect(quotesRestorationState.tvClipFilter).to.equal('quotes');
269
+
270
+ // No filter param
271
+ url.search = '';
272
+ window.history.replaceState({ path: url.href }, '', url.href);
273
+ const unfilteredRestorationState = handler.getRestorationState();
274
+ expect(unfilteredRestorationState.tvClipFilter).not.to.exist;
275
+ });
276
+
245
277
  it('should restore sort from URL (space format)', async () => {
246
278
  const handler = new RestorationStateHandler({ context: 'search' });
247
279
 
@@ -373,6 +405,44 @@ describe('Restoration state handler', () => {
373
405
  expect(window.location.search).to.equal('?page=2');
374
406
  });
375
407
 
408
+ it('should persist TV clip filter types to the URL', async () => {
409
+ const url = new URL(window.location.href);
410
+ url.search = '';
411
+ window.history.replaceState({ path: url.href }, '', url.href);
412
+
413
+ // Commercials
414
+ const handler = new RestorationStateHandler({ context: 'search' });
415
+ handler.persistState({
416
+ tvClipFilter: 'commercials',
417
+ selectedFacets: getDefaultSelectedFacets(),
418
+ });
419
+ expect(window.location.search).to.equal('?only_commercials=1');
420
+
421
+ // Fact checks
422
+ window.history.replaceState({ path: url.href }, '', url.href);
423
+ handler.persistState({
424
+ tvClipFilter: 'factchecks',
425
+ selectedFacets: getDefaultSelectedFacets(),
426
+ });
427
+ expect(window.location.search).to.equal('?only_factchecks=1');
428
+
429
+ // Quotes
430
+ window.history.replaceState({ path: url.href }, '', url.href);
431
+ handler.persistState({
432
+ tvClipFilter: 'quotes',
433
+ selectedFacets: getDefaultSelectedFacets(),
434
+ });
435
+ expect(window.location.search).to.equal('?only_quotes=1');
436
+
437
+ // Unfiltered
438
+ window.history.replaceState({ path: url.href }, '', url.href);
439
+ handler.persistState({
440
+ tvClipFilter: 'all',
441
+ selectedFacets: getDefaultSelectedFacets(),
442
+ });
443
+ expect(window.location.search).to.equal('');
444
+ });
445
+
376
446
  it('should upgrade legacy search params to new ones', async () => {
377
447
  const url = new URL(window.location.href);
378
448
  url.search = '?q=foo';