| Server IP : 104.21.80.1 / Your IP : 216.73.216.145 Web Server : LiteSpeed System : Linux premium151.web-hosting.com 4.18.0-553.44.1.lve.el8.x86_64 #1 SMP Thu Mar 13 14:29:12 UTC 2025 x86_64 User : tempvsty ( 647) PHP Version : 8.0.30 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home/tempvsty/pontiacques.org/wp-content/plugins/give/src/Campaigns/Blocks/CampaignDonors/ |
Upload File : |
import {InspectorControls, useBlockProps} from '@wordpress/block-editor';
import {BlockEditProps} from '@wordpress/blocks';
import {
__experimentalNumberControl as NumberControl,
PanelBody,
SelectControl,
TextControl,
ToggleControl,
} from '@wordpress/components';
import {__} from '@wordpress/i18n';
import ServerSideRender from '@wordpress/server-side-render';
import CampaignSelector from '../shared/components/CampaignSelector';
import useCampaign from '../shared/hooks/useCampaign';
export default function Edit({
attributes,
setAttributes,
}: BlockEditProps<{
campaignId: number;
showAnonymous: boolean;
showCompanyName: boolean;
showAvatar: boolean;
showButton: boolean;
donateButtonText: string;
sortBy: string;
donorsPerPage: number;
loadMoreButtonText: string;
}>) {
const blockProps = useBlockProps();
const {campaign, hasResolved} = useCampaign(attributes.campaignId);
const {
showAnonymous,
showCompanyName,
showAvatar,
showButton,
donateButtonText,
sortBy,
donorsPerPage,
loadMoreButtonText,
} = attributes;
return (
<div {...blockProps}>
<CampaignSelector
campaignId={attributes.campaignId}
handleSelect={(campaignId: number) => setAttributes({campaignId})}
>
<ServerSideRender block="givewp/campaign-donors" attributes={attributes} />
</CampaignSelector>
{hasResolved && campaign?.id && (
<InspectorControls>
<PanelBody title={__('Display Elements', 'give')} initialOpen={true}>
<ToggleControl
label={__('Show anonymous', 'give')}
checked={showAnonymous}
onChange={(value) => setAttributes({showAnonymous: value})}
/>
<ToggleControl
label={__('Show company name', 'give')}
checked={showCompanyName}
onChange={(value) => setAttributes({showCompanyName: value})}
/>
<ToggleControl
label={__('Show avatar', 'give')}
checked={showAvatar}
onChange={(value) => setAttributes({showAvatar: value})}
/>
<ToggleControl
label={__('Show button', 'give')}
checked={showButton}
onChange={(value) => setAttributes({showButton: value})}
/>
<TextControl
label={__('Donate Button', 'give')}
value={donateButtonText}
onChange={(value) => setAttributes({donateButtonText: value})}
help={__('This shows on the header', 'give')}
/>
</PanelBody>
<PanelBody title={__('Settings', 'give')} initialOpen={true}>
<SelectControl
label={__('Sort by', 'give')}
value={sortBy}
options={[
{label: __('Top Donors', 'give'), value: 'top-donors'},
{label: __('Recent Donors', 'give'), value: 'recent-donors'},
]}
onChange={(value) => setAttributes({sortBy: value})}
help={__('The order donors are displayed in.', 'give')}
/>
{/* TODO: Revert the label and help text back to what are in the designs once the backend for pagination is ready */}
<NumberControl
label={__('Limit', 'give')}
value={donorsPerPage}
min={1}
max={100}
onChange={(value) => setAttributes({donorsPerPage: parseInt(value)})}
help={__('The maximum number of donors to display.', 'give')}
/>
{/* TODO: Revert the field back once the backend for pagination is ready
<TextControl
label={__('Load More Button', 'give')}
value={loadMoreButtonText}
onChange={(value) => setAttributes({loadMoreButtonText: value})}
/>
*/}
</PanelBody>
</InspectorControls>
)}
</div>
);
}