From 3e7d4ddcd5cb6c355936fe0f124e3af931a24ca4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Frane=20Poli=C4=87?=
 <16856471+fPolic@users.noreply.github.com>
Date: Tue, 10 Sep 2024 15:21:06 +0200
Subject: [PATCH] fix(dashboard): campaign fixes (#9082)

**What**
- fix campaign dropdown placeholder
- fix create campaign broken modal

---

![Screenshot 2024-09-10 at 14 23 55](https://github.com/user-attachments/assets/279451ec-72f4-49be-8d70-d18bc87e7fc3)

---

FIXES CC-112
---
 .../admin/dashboard/src/i18n/translations/en.json  |  6 +++++-
 .../create-campaign-form/create-campaign-form.tsx  |  5 ++++-
 .../add-campaign-promotion-form.tsx                | 14 ++++++++++++++
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/packages/admin/dashboard/src/i18n/translations/en.json b/packages/admin/dashboard/src/i18n/translations/en.json
index 4c639606e4..1f1c96f302 100644
--- a/packages/admin/dashboard/src/i18n/translations/en.json
+++ b/packages/admin/dashboard/src/i18n/translations/en.json
@@ -1714,7 +1714,11 @@
       "campaign": {
         "existing": {
           "title": "Existing Campaign",
-          "description": "Add promotion to an existing campaign."
+          "description": "Add promotion to an existing campaign.",
+          "placeholder": {
+            "title": "No existing campaigns",
+            "desc": "You can create one to track multiple promotions and set budget limits."
+          }
         },
         "new": {
           "title": "New Campaign",
diff --git a/packages/admin/dashboard/src/routes/campaigns/campaign-create/components/create-campaign-form/create-campaign-form.tsx b/packages/admin/dashboard/src/routes/campaigns/campaign-create/components/create-campaign-form/create-campaign-form.tsx
index 71ecf142a7..d6fb17e932 100644
--- a/packages/admin/dashboard/src/routes/campaigns/campaign-create/components/create-campaign-form/create-campaign-form.tsx
+++ b/packages/admin/dashboard/src/routes/campaigns/campaign-create/components/create-campaign-form/create-campaign-form.tsx
@@ -78,7 +78,10 @@ export const CreateCampaignForm = () => {
 
   return (
     <RouteFocusModal.Form form={form}>
-      <form onSubmit={handleSubmit} className="flex flex-col overflow-hidden">
+      <form
+        onSubmit={handleSubmit}
+        className="flex size-full flex-col overflow-hidden"
+      >
         <RouteFocusModal.Header />
         <RouteFocusModal.Body className="flex size-full flex-col items-center overflow-auto py-16">
           <CreateCampaignFormFields form={form} />
diff --git a/packages/admin/dashboard/src/routes/promotions/promotion-add-campaign/components/add-campaign-promotion-form/add-campaign-promotion-form.tsx b/packages/admin/dashboard/src/routes/promotions/promotion-add-campaign/components/add-campaign-promotion-form/add-campaign-promotion-form.tsx
index ab56e02d80..9c91c9e67d 100644
--- a/packages/admin/dashboard/src/routes/promotions/promotion-add-campaign/components/add-campaign-promotion-form/add-campaign-promotion-form.tsx
+++ b/packages/admin/dashboard/src/routes/promotions/promotion-add-campaign/components/add-campaign-promotion-form/add-campaign-promotion-form.tsx
@@ -110,6 +110,20 @@ export const AddCampaignPromotionFields = ({
                     </Select.Trigger>
 
                     <Select.Content>
+                      {!campaigns.length && (
+                        <div className="flex h-[120px] flex-col items-center justify-center gap-2 p-2">
+                          <span className="txt-small text-ui-fg-subtle font-medium">
+                            {t(
+                              "promotions.form.campaign.existing.placeholder.title"
+                            )}
+                          </span>
+                          <span className="txt-small text-ui-fg-muted">
+                            {t(
+                              "promotions.form.campaign.existing.placeholder.desc"
+                            )}
+                          </span>
+                        </div>
+                      )}
                       {campaigns.map((c) => (
                         <Select.Item key={c.id} value={c.id}>
                           {c.name?.toUpperCase()}