initial commit

src/Campaigns/Blocks/DonateButton/block.json

@@ -0,0 +1,35 @@
+{
+    "$schema": "https://json.schemastore.org/block.json",
+    "apiVersion": 2,
+    "name": "givewp/campaign-donate-button",
+    "version": "1.0.0",
+    "title": "Donate Button",
+    "category": "give",
+    "icon": "button",
+    "description": "The GiveWP Donate Button inserts an donate button into the page.",
+    "supports": {
+        "align": [
+            "wide",
+            "full"
+        ]
+    },
+    "attributes": {
+        "campaignId": {
+            "type": "number"
+        },
+        "useDefaultForm": {
+            "type": "boolean",
+            "default": true
+        },
+        "selectedForm": {
+            "type": "string"
+        },
+        "buttonText": {
+            "type": "string",
+            "default": "Donate now"
+        }
+    },
+    "textdomain": "give",
+    "editorStyle": "file:../../../../build/campaignDonateButtonBlock.css",
+    "editorScript": "file:../../../../build/campaignDonateButtonBlock.js"
+}

src/Campaigns/Blocks/DonateButton/edit.tsx

@@ -0,0 +1,84 @@
+import {__} from '@wordpress/i18n';
+import {useSelect} from '@wordpress/data';
+import {InspectorControls, useBlockProps} from '@wordpress/block-editor';
+import {BlockEditProps} from '@wordpress/blocks';
+import {PanelBody, SelectControl, TextControl, ToggleControl} from '@wordpress/components';
+import useCampaign from '../shared/hooks/useCampaign';
+import {CampaignSelector} from '../shared/components/CampaignSelector';
+
+export default function Edit({attributes, setAttributes,}: BlockEditProps<{
+    campaignId: number;
+    buttonText: string;
+    useDefaultForm: boolean;
+    selectedForm: string;
+}>) {
+    const blockProps = useBlockProps();
+    const {campaign, hasResolved} = useCampaign(attributes.campaignId);
+
+    const adminBaseUrl = useSelect(
+        // @ts-ignore
+        (select) => select('core').getSite()?.url + '/wp-admin/edit.php?post_type=give_forms&page=give-campaigns',
+        []
+    );
+
+    const campaignForms = (() => {
+        const {forms, isLoading} = campaign.forms();
+
+        if (isLoading) {
+            return []
+        }
+
+        return forms.map((form: { name: string, id: string }) => ({
+            label: form.name,
+            value: form.id
+        }))
+    })();
+
+    return (
+        <div {...blockProps}>
+
+            <CampaignSelector attributes={attributes} setAttributes={setAttributes}>
+                <div>
+                    {attributes.buttonText}
+                </div>
+            </CampaignSelector>
+
+            {hasResolved && campaign?.id && (
+                <InspectorControls>
+                    <PanelBody title="Settings" initialOpen={true}>
+                        <TextControl
+                            label={__('Donate button', 'give')}
+                            value={attributes.buttonText}
+                            onChange={(buttonText: string) => setAttributes({buttonText})}
+                        />
+                        <ToggleControl
+                            label={__('Use default form', 'give')}
+                            checked={attributes.useDefaultForm}
+                            onChange={(useDefaultForm: boolean) => setAttributes({useDefaultForm})}
+                            help={
+                                <>
+                                    {__('Uses the campaign’s default form', 'give')}.
+                                    {` `}
+                                    <a
+                                        href={`${adminBaseUrl}&id=${attributes.campaignId}&tab=forms`}
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                        aria-label={__('Change campaign default form', 'give')}
+                                    >
+                                        {__('Change default form', 'give')}
+                                    </a>
+                                </>
+                            }
+                        />
+                        <SelectControl
+                            label={__('Form', 'give')}
+                            onChange={(selectedForm: string) => setAttributes({selectedForm})}
+                            options={campaignForms}
+                            value={attributes.selectedForm}
+                        />
+                    </PanelBody>
+                </InspectorControls>
+            )}
+        </div>
+    );
+}

src/Campaigns/Blocks/DonateButton/index.ts

@@ -0,0 +1,13 @@
+import metadata from './block.json';
+import Edit from './edit';
+import initBlock from '../shared/utils/init-block';
+
+const {name} = metadata;
+
+export const init = () => initBlock({
+    name,
+    metadata,
+    settings: {
+        edit: Edit,
+    }
+});

src/Campaigns/Blocks/blocks.ts

@@ -1,7 +1,11 @@
 import * as campaignTitleBlock from './CampaignTitleBlock';
+import * as campaignDonateButton from './DonateButton';
 
 const getAllBlocks = () => {
-    return [campaignTitleBlock];
+    return [
+        campaignTitleBlock,
+        campaignDonateButton
+    ];
 };
 
 getAllBlocks().forEach((block) => {

src/Campaigns/Blocks/shared/hooks/useCampaign.ts

@@ -1,11 +1,31 @@
 import {useEntityRecord} from '@wordpress/core-data';
 import {Campaign} from '@givewp/campaigns/admin/components/types';
+import apiFetch from '@wordpress/api-fetch';
+import {addQueryArgs} from '@wordpress/url';
+import useSWR from 'swr';
 
 export default function useCampaign(campaignId: number) {
-    const data = useEntityRecord('givewp', 'campaign', campaignId);
+    const campaignData = useEntityRecord('givewp', 'campaign', campaignId);
 
     return {
-        campaign: data?.record as Campaign,
-        hasResolved: data?.hasResolved,
+        campaign: {
+            ...campaignData?.record as Campaign,
+            forms: (params: FormsApiParams = {status: 'publish'}) => {
+                const {data, isLoading}: { data: { items: [] }, isLoading: boolean } = useSWR(
+                    addQueryArgs('/give-api/v2/admin/forms', {campaignId, ...params}),
+                    path => apiFetch({path})
+                )
+
+                return {
+                    forms: data?.items || [],
+                    isLoading
+                }
+            }
+        },
+        hasResolved: campaignData?.hasResolved,
     };
 }
+
+interface FormsApiParams {
+    status?: 'publish' | 'draft' | 'pending' | 'trash' | 'upgraded' | 'any'
+}

src/Campaigns/Controllers/CampaignRequestController.php

@@ -58,6 +58,11 @@ public function getCampaigns(WP_REST_Request $request): WP_REST_Response
         $totalCampaigns = empty($campaigns) ? 0 : Campaign::query()->count();
         $totalPages = (int)ceil($totalCampaigns / $perPage);
 
+        // todo: remove - temporary solution
+        $campaigns = array_map(function ($campaign) {
+            return $campaign->toArray();
+        }, $campaigns);
+
         $response = rest_ensure_response($campaigns);
         $response->header('X-WP-Total', $totalCampaigns);
         $response->header('X-WP-TotalPages', $totalPages);