Icon.tsx
1 year ago
app.tsx
1 year ago
block.json
1 year ago
edit.tsx
1 year ago
index.tsx
1 year ago
render.php
1 year ago
styles.scss
1 year ago
edit.tsx
55 lines
| 1 | import {InspectorControls, useBlockProps} from '@wordpress/block-editor'; |
| 2 | import {__} from '@wordpress/i18n'; |
| 3 | import {BlockEditProps} from '@wordpress/blocks'; |
| 4 | import {PanelBody, SelectControl} from '@wordpress/components'; |
| 5 | import CampaignSelector from '../shared/components/CampaignSelector'; |
| 6 | import ServerSideRender from '@wordpress/server-side-render'; |
| 7 | import useCampaign from '../shared/hooks/useCampaign'; |
| 8 | |
| 9 | import './styles.scss'; |
| 10 | |
| 11 | type statisticType = 'top-donation' | 'average-donation'; |
| 12 | |
| 13 | export default function Edit({ |
| 14 | attributes, |
| 15 | setAttributes, |
| 16 | }: BlockEditProps<{ |
| 17 | campaignId: number; |
| 18 | statistic: statisticType; |
| 19 | }>) { |
| 20 | const blockProps = useBlockProps(); |
| 21 | const {campaign, hasResolved} = useCampaign(attributes?.campaignId); |
| 22 | |
| 23 | const statsHelpText = attributes.statistic === 'top-donation' |
| 24 | ? __('Displays the top donation of the selected campaign.', 'give') |
| 25 | : __('Displays the average donation of the selected campaign.', 'give'); |
| 26 | |
| 27 | return ( |
| 28 | <div {...blockProps}> |
| 29 | <CampaignSelector |
| 30 | campaignId={attributes.campaignId} |
| 31 | handleSelect={(campaignId: number) => setAttributes({campaignId})} |
| 32 | > |
| 33 | <ServerSideRender block="givewp/campaign-stats-block" attributes={attributes} /> |
| 34 | </CampaignSelector> |
| 35 | |
| 36 | {hasResolved && campaign?.id && ( |
| 37 | <InspectorControls> |
| 38 | <PanelBody title="Settings" initialOpen={true}> |
| 39 | <SelectControl |
| 40 | label={__('Type', 'give')} |
| 41 | help={statsHelpText} |
| 42 | value={attributes.statistic} |
| 43 | options={[ |
| 44 | {value: 'top-donation', label: __('Top Donation', 'give')}, |
| 45 | {value: 'average-donation', label: __('Average Donation', 'give')}, |
| 46 | ]} |
| 47 | onChange={(value: statisticType) => setAttributes({statistic: value})} |
| 48 | /> |
| 49 | </PanelBody> |
| 50 | </InspectorControls> |
| 51 | )} |
| 52 | </div> |
| 53 | ); |
| 54 | } |
| 55 |