Skip to content

Commit 8edb3e4

Browse files
HaroenvHaroenv
committed
fix(panel): use undefined templates by default
1 parent 50bb676 commit 8edb3e4

File tree

4 files changed

+123
-129
lines changed

4 files changed

+123
-129
lines changed

‎packages/instantsearch.js/src/components/Panel/Panel.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export type PanelComponentCSSClasses = ComponentCSSClasses<
1919
>;
2020

2121
export type PanelComponentTemplates<TWidget extends UnknownWidgetFactory> =
22-
Required<PanelTemplates<TWidget>>;
22+
PanelTemplates<TWidget>;
2323

2424
export type PanelProps<TWidget extends UnknownWidgetFactory> = {
2525
hidden: boolean;

‎packages/instantsearch.js/src/widgets/panel/__tests__/panel-test.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -132,8 +132,6 @@ describe('Templates', () => {
132132
const { templates } = firstRender.props as PanelProps<typeof widgetFactory>;
133133

134134
expect(templates).toEqual({
135-
header: '',
136-
footer: '',
137135
collapseButtonText: expect.any(Function),
138136
});
139137
});

‎packages/instantsearch.js/src/widgets/panel/__tests__/panel.test.tsx‎

Lines changed: 120 additions & 122 deletions
Original file line numberDiff line numberDiff line change
@@ -48,30 +48,28 @@ describe('panel', () => {
4848
await wait(0);
4949

5050
expect(container).toMatchInlineSnapshot(`
51-
<div>
52-
<div
53-
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
54-
>
55-
56-
<div
57-
class="ais-Panel-body"
58-
>
59-
<div>
60-
<div
61-
class="ais-Stats"
62-
>
63-
<span
64-
class="ais-Stats-text"
51+
<div>
52+
<div
53+
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
6554
>
66-
10 results found in 0ms
67-
</span>
55+
<div
56+
class="ais-Panel-body"
57+
>
58+
<div>
59+
<div
60+
class="ais-Stats"
61+
>
62+
<span
63+
class="ais-Stats-text"
64+
>
65+
10 results found in 0ms
66+
</span>
67+
</div>
68+
</div>
69+
</div>
70+
</div>
6871
</div>
69-
</div>
70-
</div>
71-
72-
</div>
73-
</div>
74-
`);
72+
`);
7573
});
7674

7775
test('renders with templates using `html`', async () => {
@@ -109,58 +107,58 @@ describe('panel', () => {
109107
await wait(0);
110108

111109
expect(container).toMatchInlineSnapshot(`
112-
<div>
113-
<div
114-
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
115-
>
116-
<div
117-
class="ais-Panel-header"
118-
>
119-
<span>
120-
<span>
121-
Header
122-
(10 results)
123-
</span>
124-
</span>
125-
<button
126-
aria-expanded="false"
127-
class="ais-Panel-collapseButton"
128-
>
129-
<span>
130-
<span>
131-
More
132-
</span>
133-
</span>
134-
</button>
135-
</div>
136-
<div
137-
class="ais-Panel-body"
138-
>
139-
<div>
140-
<div
141-
class="ais-Stats"
142-
>
143-
<span
144-
class="ais-Stats-text"
110+
<div>
111+
<div
112+
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
145113
>
146-
10 results found in 0ms
147-
</span>
114+
<div
115+
class="ais-Panel-header"
116+
>
117+
<span>
118+
<span>
119+
Header
120+
(10 results)
121+
</span>
122+
</span>
123+
<button
124+
aria-expanded="false"
125+
class="ais-Panel-collapseButton"
126+
>
127+
<span>
128+
<span>
129+
More
130+
</span>
131+
</span>
132+
</button>
133+
</div>
134+
<div
135+
class="ais-Panel-body"
136+
>
137+
<div>
138+
<div
139+
class="ais-Stats"
140+
>
141+
<span
142+
class="ais-Stats-text"
143+
>
144+
10 results found in 0ms
145+
</span>
146+
</div>
147+
</div>
148+
</div>
149+
<div
150+
class="ais-Panel-footer"
151+
>
152+
<a
153+
href="#"
154+
>
155+
Footer
156+
(10 results)
157+
</a>
158+
</div>
159+
</div>
148160
</div>
149-
</div>
150-
</div>
151-
<div
152-
class="ais-Panel-footer"
153-
>
154-
<a
155-
href="#"
156-
>
157-
Footer
158-
(10 results)
159-
</a>
160-
</div>
161-
</div>
162-
</div>
163-
`);
161+
`);
164162
});
165163

166164
test('renders with templates using JSX', async () => {
@@ -200,58 +198,58 @@ describe('panel', () => {
200198
await wait(0);
201199

202200
expect(container).toMatchInlineSnapshot(`
203-
<div>
204-
<div
205-
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
206-
>
207-
<div
208-
class="ais-Panel-header"
209-
>
210-
<span>
211-
<span>
212-
Header
213-
(10 results)
214-
</span>
215-
</span>
216-
<button
217-
aria-expanded="false"
218-
class="ais-Panel-collapseButton"
219-
>
220-
<span>
221-
<span>
222-
More
223-
</span>
224-
</span>
225-
</button>
226-
</div>
227-
<div
228-
class="ais-Panel-body"
229-
>
230-
<div>
231-
<div
232-
class="ais-Stats"
233-
>
234-
<span
235-
class="ais-Stats-text"
201+
<div>
202+
<div
203+
class="ais-Panel ais-Panel--collapsible ais-Panel--collapsed"
236204
>
237-
10 results found in 0ms
238-
</span>
205+
<div
206+
class="ais-Panel-header"
207+
>
208+
<span>
209+
<span>
210+
Header
211+
(10 results)
212+
</span>
213+
</span>
214+
<button
215+
aria-expanded="false"
216+
class="ais-Panel-collapseButton"
217+
>
218+
<span>
219+
<span>
220+
More
221+
</span>
222+
</span>
223+
</button>
224+
</div>
225+
<div
226+
class="ais-Panel-body"
227+
>
228+
<div>
229+
<div
230+
class="ais-Stats"
231+
>
232+
<span
233+
class="ais-Stats-text"
234+
>
235+
10 results found in 0ms
236+
</span>
237+
</div>
238+
</div>
239+
</div>
240+
<div
241+
class="ais-Panel-footer"
242+
>
243+
<a
244+
href="#"
245+
>
246+
Footer
247+
(10 results)
248+
</a>
249+
</div>
250+
</div>
239251
</div>
240-
</div>
241-
</div>
242-
<div
243-
class="ais-Panel-footer"
244-
>
245-
<a
246-
href="#"
247-
>
248-
Footer
249-
(10 results)
250-
</a>
251-
</div>
252-
</div>
253-
</div>
254-
`);
252+
`);
255253
});
256254

257255
function createMockedSearchClient() {

‎packages/instantsearch.js/src/widgets/panel/panel.tsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,7 @@ const renderer =
151151
containerNode: HTMLElement;
152152
bodyContainerNode: HTMLElement;
153153
cssClasses: PanelComponentCSSClasses;
154-
templates: Required<PanelTemplates<TWidget>>;
154+
templates: PanelTemplates<TWidget>;
155155
}) =>
156156
({
157157
options,
@@ -259,9 +259,7 @@ const panel: PanelWidget = (panelWidgetParams) => {
259259

260260
const containerNode = getContainerNode(widgetParams.container);
261261

262-
const defaultTemplates: Required<PanelTemplates<typeof widgetFactory>> = {
263-
header: '',
264-
footer: '',
262+
const defaultTemplates: PanelTemplates<typeof widgetFactory> = {
265263
collapseButtonText: ({ collapsed: isCollapsed }) =>
266264
`<svg
267265
class="${cssClasses.collapseIcon}"

0 commit comments

Comments
 (0)