# give/4.18.0/src/Campaigns/Blocks/CampaignGoal/app.tsx

GiveWP – Donation Plugin and Fundraising Platform, version 4.18.0. 28 lines.

- Page: https://pluginprobe.com/plugins/give/4.18.0/code/src/Campaigns/Blocks/CampaignGoal/app.tsx
- Raw: https://pluginprobe.com/plugins/give/4.18.0/raw/src/Campaigns/Blocks/CampaignGoal/app.tsx
- Modified: 2025-08-20T14:13:16+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/give/4.18.0/code/src/Campaigns/Blocks/CampaignGoal/app.tsx#L10-L20`.

```tsx
import {createRoot} from '@wordpress/element';
import useCampaign from '../shared/hooks/useCampaign';
import App from './app/index';

export const CampaignGoalBlockApp = ({campaignId}: { campaignId: number }) => {
    const {campaign, hasResolved} = useCampaign(campaignId);

    if (!hasResolved || !campaignId) {
        return null;
    }

    return <App campaign={campaign} />;
}

/**
 * @since 4.0.0
 */
const nodeList = document.querySelectorAll('[data-givewp-campaign-goal]');

if (nodeList) {
    const containers = Array.from(nodeList);

    containers.map((container: any) => {
        const root = createRoot(container);
        return root.render(<CampaignGoalBlockApp campaignId={container.dataset?.id} />);
    });
}

```