From 9f7f39e16c14c548c8bc612e7f567a3c7a16ee2d Mon Sep 17 00:00:00 2001
From: Glauber Silva <glauber.silva@givewp.com>
Date: Tue, 3 Sep 2024 15:08:43 -0300
Subject: [PATCH] feature: add overview page foundation

---
 .../Actions/LoadCampaignDetailsAssets.php     | 41 +++++++++++++++++++
 src/Campaigns/CampaignsAdminPage.php          | 14 ++++++-
 src/Campaigns/ViewModels/CampaignDetails.php  | 34 +++++++++++++++
 .../resources/admin/campaign-details.tsx      | 11 +++++
 webpack.mix.js                                |  1 +
 5 files changed, 100 insertions(+), 1 deletion(-)
 create mode 100644 src/Campaigns/Actions/LoadCampaignDetailsAssets.php
 create mode 100644 src/Campaigns/ViewModels/CampaignDetails.php
 create mode 100644 src/Campaigns/resources/admin/campaign-details.tsx

diff --git a/src/Campaigns/Actions/LoadCampaignDetailsAssets.php b/src/Campaigns/Actions/LoadCampaignDetailsAssets.php
new file mode 100644
index 0000000000..e948dba2eb
--- /dev/null
+++ b/src/Campaigns/Actions/LoadCampaignDetailsAssets.php
@@ -0,0 +1,41 @@
+<?php
+
+namespace Give\Campaigns\Actions;
+
+use Give\Campaigns\Models\Campaign;
+use Give\Campaigns\ViewModels\CampaignDetails;
+
+/**
+ * @unreleased
+ */
+class LoadCampaignDetailsAssets
+{
+    /**
+     * @unreleased
+     */
+    public function __invoke(Campaign $campaign)
+    {
+        $handleName = 'givewp-admin-campaign-details';
+
+        wp_register_script(
+            $handleName,
+            GIVE_PLUGIN_URL . 'assets/dist/js/give-admin-campaign-details.js',
+            [],
+            GIVE_VERSION,
+            true
+        );
+
+        wp_localize_script($handleName, 'GiveCampaignDetails',
+            [
+                'apiRoot' => esc_url_raw(rest_url('give-api/v2/campaigns')),
+                'apiNonce' => wp_create_nonce('wp_rest'),
+                'adminUrl' => admin_url(),
+                'pluginUrl' => GIVE_PLUGIN_URL,
+                'campaign' => (new CampaignDetails($campaign))->exports(),
+            ]
+        );
+
+        wp_enqueue_script($handleName);
+        wp_enqueue_style('givewp-design-system-foundation');
+    }
+}
diff --git a/src/Campaigns/CampaignsAdminPage.php b/src/Campaigns/CampaignsAdminPage.php
index 3b7c954189..17c3910128 100644
--- a/src/Campaigns/CampaignsAdminPage.php
+++ b/src/Campaigns/CampaignsAdminPage.php
@@ -2,7 +2,9 @@
 
 namespace Give\Campaigns;
 
+use Give\Campaigns\Actions\LoadCampaignDetailsAssets;
 use Give\Campaigns\Actions\LoadCampaignsListTableAssets;
+use Give\Campaigns\Models\Campaign;
 
 /**
  * @unreleased
@@ -30,7 +32,17 @@ public function addCampaignsSubmenuPage()
      */
     public function renderCampaignsPage()
     {
-        give(LoadCampaignsListTableAssets::class)();
+        if (isset($_GET['id'])) {
+            $campaign = Campaign::find(absint($_GET['id']));
+
+            if ( ! $campaign) {
+                wp_die(__('Campaign not found', 'give'), 404);
+            }
+
+            give(LoadCampaignDetailsAssets::class)($campaign);
+        } else {
+            give(LoadCampaignsListTableAssets::class)();
+        }
 
         echo '<div id="give-admin-campaigns-root"></div>';
     }
diff --git a/src/Campaigns/ViewModels/CampaignDetails.php b/src/Campaigns/ViewModels/CampaignDetails.php
new file mode 100644
index 0000000000..3d05cad810
--- /dev/null
+++ b/src/Campaigns/ViewModels/CampaignDetails.php
@@ -0,0 +1,34 @@
+<?php
+
+namespace Give\Campaigns\ViewModels;
+
+use Give\Campaigns\Models\Campaign;
+
+/**
+ * @unreleased
+ */
+class CampaignDetails
+{
+    /**
+     * @unreleased
+     *
+     * @var Campaign
+     */
+    protected $campaign;
+
+    /**
+     * @unreleased
+     */
+    public function __construct(Campaign $campaign)
+    {
+        $this->campaign = $campaign;
+    }
+
+    /**
+     * @unreleased
+     */
+    public function exports(): array
+    {
+        return $this->campaign->toArray();
+    }
+}
diff --git a/src/Campaigns/resources/admin/campaign-details.tsx b/src/Campaigns/resources/admin/campaign-details.tsx
new file mode 100644
index 0000000000..ca1926d7af
--- /dev/null
+++ b/src/Campaigns/resources/admin/campaign-details.tsx
@@ -0,0 +1,11 @@
+import {createRoot} from 'react-dom/client';
+
+const container = document.getElementById('give-admin-campaigns-root');
+const root = createRoot(container!);
+root.render(
+    <div style={{marginTop: '6rem', padding: '1rem'}}>
+        <p>
+            <strong>Campaign details goes here...</strong>
+        </p>
+    </div>
+);
diff --git a/webpack.mix.js b/webpack.mix.js
index bbb3986395..23adaf9664 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -61,6 +61,7 @@ mix.setPublicPath('assets/dist')
     .ts('src/Promotions/InPluginUpsells/resources/js/payment-gateway.ts', 'js/payment-gateway.js')
     .ts('src/Promotions/WelcomeBanner/resources/js/index.tsx', 'js/welcome-banner.js')
     .ts('src/Campaigns/resources/admin/campaigns-list-table.tsx', 'js/give-admin-campaigns-list-table.js')
+    .ts('src/Campaigns/resources/admin/campaign-details.tsx', 'js/give-admin-campaign-details.js')
 
     .react()
     .sourceMaps(false, 'source-map')