Skip to content

Commit 7702fe8

Browse files
jrtashjianjrtashjian
committed
move innerBlocks template to variation definition
1 parent 92344e2 commit 7702fe8

File tree

2 files changed

+48
-51
lines changed

2 files changed

+48
-51
lines changed

‎packages/block-library/top-charts/edit.js‎

Lines changed: 1 addition & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -12,50 +12,6 @@ import { useEffect, useState } from '@wordpress/element';
1212
import apiFetch from '@wordpress/api-fetch';
1313
import { addQueryArgs } from '@wordpress/url';
1414

15-
const TEMPLATE = {
16-
artists: [
17-
[ 'core/heading', { level: 3, content: __( 'Top Artists', 'profile-blocks-lastfm' ) } ],
18-
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
19-
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'artist.images', itemLinkProp: 'artist.url' } ],
20-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
21-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
22-
] ],
23-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
24-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.playcount' } ],
25-
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
26-
] ],
27-
] ],
28-
],
29-
albums: [
30-
[ 'core/heading', { level: 3, content: __( 'Top Albums', 'profile-blocks-lastfm' ) } ],
31-
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
32-
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'album.images', itemLinkProp: 'album.url' } ],
33-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
34-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'album.name', itemLinkProp: 'album.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
35-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontSize: '0.8em' } } } ],
36-
] ],
37-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
38-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'album.playcount' } ],
39-
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
40-
] ],
41-
] ],
42-
],
43-
tracks: [
44-
[ 'core/heading', { level: 3, content: __( 'Top Tracks', 'profile-blocks-lastfm' ) } ],
45-
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
46-
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'track.images', itemLinkProp: 'track.url' } ],
47-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
48-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'track.name', itemLinkProp: 'track.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
49-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontSize: '0.8em' } } } ],
50-
] ],
51-
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
52-
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'track.playcount' } ],
53-
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
54-
] ],
55-
] ],
56-
],
57-
};
58-
5915
const Edit = ( {
6016
attributes: { collection },
6117
} ) => {
@@ -90,7 +46,7 @@ const Edit = ( {
9046
}, [ apiKey, collection ] );
9147

9248
const blockProps = useBlockProps();
93-
const innerBlockProps = useInnerBlocksProps( blockProps, { template: TEMPLATE[ collection ] } );
49+
const innerBlockProps = useInnerBlocksProps( blockProps );
9450

9551
return (
9652
<BlockContextProvider value={ { collection: items } }>

‎packages/block-library/top-charts/variations.js‎

Lines changed: 47 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,65 @@
44
import { __ } from '@wordpress/i18n';
55

66
const variations = [
7+
{
8+
name: 'top-artists',
9+
title: __( 'Top Artists', 'profile-blocks-lastfm' ),
10+
description: __( 'Display the top artists of a user.', 'profile-blocks-lastfm' ),
11+
attributes: { collection: 'artists' },
12+
innerBlocks: [
13+
[ 'core/heading', { level: 3, content: __( 'Top Artists', 'profile-blocks-lastfm' ) } ],
14+
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
15+
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'artist.images', itemLinkProp: 'artist.url' } ],
16+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
17+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
18+
] ],
19+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
20+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.playcount' } ],
21+
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
22+
] ],
23+
] ],
24+
],
25+
},
726
{
827
name: 'top-albums',
928
title: __( 'Top Albums', 'profile-blocks-lastfm' ),
1029
description: __( 'Display the top albums of a user.', 'profile-blocks-lastfm' ),
1130
attributes: { collection: 'albums' },
31+
innerBlocks: [
32+
[ 'core/heading', { level: 3, content: __( 'Top Albums', 'profile-blocks-lastfm' ) } ],
33+
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
34+
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'album.images', itemLinkProp: 'album.url' } ],
35+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
36+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'album.name', itemLinkProp: 'album.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
37+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontSize: '0.8em' } } } ],
38+
] ],
39+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
40+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'album.playcount' } ],
41+
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
42+
] ],
43+
] ],
44+
],
1245
isDefault: true,
1346
},
14-
{
15-
name: 'top-artists',
16-
title: __( 'Top Artists', 'profile-blocks-lastfm' ),
17-
description: __( 'Display the top artists of a user.', 'profile-blocks-lastfm' ),
18-
attributes: { collection: 'artists' },
19-
},
2047
{
2148
name: 'top-tracks',
2249
title: __( 'Top Tracks', 'profile-blocks-lastfm' ),
2350
description: __( 'Display the top tracks of a user.', 'profile-blocks-lastfm' ),
2451
attributes: { collection: 'tracks' },
52+
innerBlocks: [
53+
[ 'core/heading', { level: 3, content: __( 'Top Tracks here', 'profile-blocks-lastfm' ) } ],
54+
[ 'profile-blocks-lastfm/dynamic-template', { layout: { type: 'flex' } }, [
55+
[ 'profile-blocks-lastfm/item-image', { itemImageProp: 'track.images', itemLinkProp: 'track.url' } ],
56+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap', orientation: 'vertical' }, style: { layout: { selfStretch: 'fill' }, spacing: { blockGap: '0' } } }, [
57+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'track.name', itemLinkProp: 'track.url', isLink: true, style: { typography: { fontStyle: 'normal', fontWeight: 700 } } } ],
58+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'artist.name', itemLinkProp: 'artist.url', isLink: true, style: { typography: { fontSize: '0.8em' } } } ],
59+
] ],
60+
[ 'core/group', { layout: { type: 'flex', flexWrap: 'nowrap' }, style: { spacing: { blockGap: '0.25em' }, typography: { fontSize: '0.8em' } } }, [
61+
[ 'profile-blocks-lastfm/item-name', { itemTextProp: 'track.playcount' } ],
62+
[ 'core/paragraph', { content: __( 'plays', 'profile-blocks-lastfm' ) } ],
63+
] ],
64+
] ],
65+
],
2566
},
2667
];
2768

0 commit comments

Comments
 (0)