@lodashventure/medusa-campaign 1.4.0 → 1.4.2

package/src/admin/hooks/useFlashSales.ts

@@ -1,15 +1,26 @@
-import { CampaignDTO } from "@medusajs/framework/types";
-import { useQuery } from "@tanstack/react-query";
 import axios from "axios";
+import { useEffect, useState } from "react";
+
+type CampaignDTO = any;
 
 export const useFlashSales = (pagination: {
   limit: number;
   offset: number;
 }) => {
-  const query = useQuery({
-    queryKey: ["flash-sales", pagination],
-    queryFn: async () => {
-      const { data } = await axios.get<{
+  const [data, setData] = useState<{
+    campaigns: CampaignDTO[];
+    count: number;
+    limit: number;
+    offset: number;
+  } | null>(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<Error | null>(null);
+
+  const fetchFlashSales = async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const response = await axios.get<{
         campaigns: CampaignDTO[];
         count: number;
         limit: number;
@@ -17,9 +28,24 @@ export const useFlashSales = (pagination: {
       }>("/admin/flash-sales", {
         params: pagination,
       });
-      return data;
-    },
-  });
+      setData(response.data);
+    } catch (err) {
+      setError(
+        err instanceof Error ? err : new Error("Failed to fetch flash sales"),
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchFlashSales();
+  }, [pagination.limit, pagination.offset]);
 
-  return query;
+  return {
+    data,
+    isLoading,
+    error,
+    refetch: fetchFlashSales,
+  };
 };

package/src/admin/routes/coupons/[id]/page.tsx

@@ -0,0 +1,147 @@
+import { defineRouteConfig } from "@medusajs/admin-sdk";
+import { Tag } from "@medusajs/icons";
+import {
+  Button,
+  Container,
+  Tabs,
+  toast,
+} from "@medusajs/ui";
+import axios from "axios";
+import dayjs from "dayjs";
+import { FC, useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import {
+  CouponForm,
+  CouponFormData,
+} from "../../../components/CouponForm";
+import { useCouponById } from "../../../hooks/useCouponById";
+import { CampaignDetailForm } from "../../../components/campaign-detail-form";
+
+const CouponDetail: FC = () => {
+  const { id } = useParams<{ id: string }>();
+  const navigate = useNavigate();
+  const [isEditing, setIsEditing] = useState(false);
+
+  const { data, isLoading, refetch } = useCouponById(id ?? "");
+
+  if (isLoading) {
+    return (
+      <Container className="flex items-center justify-center h-screen">
+        <div className="animate-spin h-10 w-10 border-4 border-primary rounded-full border-t-transparent"></div>
+      </Container>
+    );
+  }
+
+  if (!data?.campaign) {
+    return (
+      <Container>
+        <p>Coupon not found</p>
+      </Container>
+    );
+  }
+
+  const campaign = data.campaign;
+  const promotion = campaign.promotions?.[0];
+
+  const initialValues: Partial<CouponFormData> = {
+    name: campaign.name ?? "",
+    description: campaign.description ?? "",
+    type: "coupon",
+    code: promotion?.code ?? "",
+    discount_type: (promotion?.application_method?.type as CouponFormData["discount_type"]) ?? "percentage",
+    discount_value: Number(promotion?.application_method?.value ?? 0),
+    currency_code: promotion?.application_method?.currency_code ?? undefined,
+    starts_at: campaign.starts_at
+      ? dayjs(campaign.starts_at).format("YYYY-MM-DDTHH:mm")
+      : undefined,
+    ends_at: campaign.ends_at
+      ? dayjs(campaign.ends_at).format("YYYY-MM-DDTHH:mm")
+      : undefined,
+    allocation: promotion?.application_method?.allocation ?? "total",
+    target_type: promotion?.application_method?.target_type ?? "order",
+  };
+
+  const handleSubmit = async (formData: CouponFormData) => {
+    if (!id) {
+      return;
+    }
+
+    try {
+      await axios.put(`/admin/coupons/${id}`, {
+        ...formData,
+        starts_at: new Date(formData.starts_at).toUTCString(),
+        ends_at: new Date(formData.ends_at).toUTCString(),
+        currency_code:
+          formData.discount_type === "fixed"
+            ? formData.currency_code
+            : undefined,
+      });
+
+      toast.success("Coupon updated successfully");
+      setIsEditing(false);
+      refetch();
+    } catch (error) {
+      let message = "Failed to update coupon";
+      if (axios.isAxiosError(error)) {
+        message = error.response?.data?.message ?? message;
+      } else if (error instanceof Error) {
+        message = error.message;
+      }
+
+      toast.error("Failed to update coupon", {
+        description: message,
+      });
+    }
+  };
+
+  return (
+    <Container>
+      <div className="mb-6 flex items-center justify-between">
+        <div>
+          <h1 className="text-2xl font-semibold mb-1">{campaign.name}</h1>
+          <p className="text-ui-fg-subtle">
+            Manage coupon configuration and content
+          </p>
+        </div>
+        <div className="flex gap-2">
+          <Button variant="secondary" onClick={() => navigate("/coupons")}>
+            Back to Coupons
+          </Button>
+          <Button onClick={() => setIsEditing((prev) => !prev)}>
+            {isEditing ? "View Mode" : "Edit Mode"}
+          </Button>
+        </div>
+      </div>
+
+      <Tabs defaultValue="settings">
+        <Tabs.List>
+          <Tabs.Trigger value="settings">Coupon Settings</Tabs.Trigger>
+          <Tabs.Trigger value="details">Coupon Details</Tabs.Trigger>
+        </Tabs.List>
+
+        <Tabs.Content value="settings" className="mt-6">
+          <CouponForm
+            initialData={initialValues}
+            onSubmit={handleSubmit}
+            onCancel={() => navigate("/coupons")}
+            disabled={!isEditing}
+          />
+        </Tabs.Content>
+
+        <Tabs.Content value="details" className="mt-6">
+          <CampaignDetailForm
+            campaignId={campaign.id}
+            campaignName={campaign.name ?? ""}
+          />
+        </Tabs.Content>
+      </Tabs>
+    </Container>
+  );
+};
+
+export const config = defineRouteConfig({
+  label: "Coupon Detail",
+  icon: Tag,
+});
+
+export default CouponDetail;

package/src/admin/routes/coupons/create/page.tsx

@@ -0,0 +1,49 @@
+import { toast } from "@medusajs/ui";
+import axios from "axios";
+import { FC } from "react";
+import { useNavigate } from "react-router-dom";
+import {
+  CouponForm,
+  CouponFormData,
+} from "../../../components/CouponForm";
+
+const CouponCreate: FC = () => {
+  const navigate = useNavigate();
+
+  const handleSubmit = async (formData: CouponFormData) => {
+    try {
+      await axios.post("/admin/coupons", {
+        ...formData,
+        starts_at: new Date(formData.starts_at).toUTCString(),
+        ends_at: new Date(formData.ends_at).toUTCString(),
+        currency_code:
+          formData.discount_type === "fixed"
+            ? formData.currency_code
+            : undefined,
+      });
+
+      toast.success("Coupon created successfully");
+      navigate("/coupons");
+    } catch (error) {
+      let message = "Failed to create coupon";
+      if (axios.isAxiosError(error)) {
+        message = error.response?.data?.message ?? message;
+      } else if (error instanceof Error) {
+        message = error.message;
+      }
+
+      toast.error("Failed to create coupon", {
+        description: message,
+      });
+    }
+  };
+
+  return (
+    <CouponForm
+      onSubmit={handleSubmit}
+      onCancel={() => navigate("/coupons")}
+    />
+  );
+};
+
+export default CouponCreate;

package/src/admin/routes/coupons/page.tsx

@@ -0,0 +1,15 @@
+import { defineRouteConfig } from "@medusajs/admin-sdk";
+import { Tag } from "@medusajs/icons";
+import { FC } from "react";
+import { CouponPage } from "../../components/CouponPage";
+
+const Coupons: FC = () => {
+  return <CouponPage />;
+};
+
+export const config = defineRouteConfig({
+  label: "Coupons",
+  icon: Tag,
+});
+
+export default Coupons;

package/src/admin/routes/flash-sales/[id]/page.tsx

@@ -1,7 +1,6 @@
 import { defineRouteConfig } from "@medusajs/admin-sdk";
 import { Sparkles } from "@medusajs/icons";
 import { Button, Container, toast, Tabs } from "@medusajs/ui";
-import { useQueryClient } from "@tanstack/react-query";
 import axios from "axios";
 import { FC, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
@@ -18,8 +17,7 @@ import { CampaignDetailForm } from "../../../components/campaign-detail-form";
 const FlashSaleDetail: FC = () => {
   const { id } = useParams<{ id: string }>();
   const navigate = useNavigate();
-  const queryClient = useQueryClient();
-  const { data, isLoading } = useFlashSaleById(id || "");
+  const { data, isLoading, refetch } = useFlashSaleById(id || "");
 
   const [isEditing, setIsEditing] = useState(false);
 
@@ -32,14 +30,7 @@ const FlashSaleDetail: FC = () => {
       });
 
       toast.success("Flash sale updated successfully");
-      queryClient.invalidateQueries({
-        exact: false,
-        predicate(query) {
-          return ["flash-sales", "flash-sale"].includes(
-            query.queryKey[0] as string,
-          );
-        },
-      });
+      refetch();
       navigate("/flash-sales");
     } catch (error) {
       let message: string;

package/src/admin/routes/flash-sales/create/page.tsx

@@ -1,5 +1,4 @@
 import { toast } from "@medusajs/ui";
-import { useQueryClient } from "@tanstack/react-query";
 import axios from "axios";
 import { FC } from "react";
 import { useNavigate } from "react-router-dom";
@@ -7,7 +6,6 @@ import { CampaignData, FlashSaleForm } from "../../../components/FlashSaleForm";
 
 const FlashSaleCreate: FC = () => {
   const navigate = useNavigate();
-  const queryClient = useQueryClient();
 
   async function handleSubmit(campaignData: CampaignData) {
     try {
@@ -17,10 +15,6 @@ const FlashSaleCreate: FC = () => {
         ends_at: new Date(campaignData.ends_at).toUTCString(),
       });
       toast.success("Flash sale created successfully");
-      queryClient.invalidateQueries({
-        exact: false,
-        queryKey: ["flash-sales"],
-      });
       navigate("/flash-sales");
     } catch (error) {
       let message: string;

package/src/admin/widgets/campaign-detail-widget.tsx

@@ -1,12 +1,5 @@
 import { defineWidgetConfig } from "@medusajs/admin-sdk";
-import {
-  Container,
-  Heading,
-  Text,
-  Badge,
-  Button,
-  Alert,
-} from "@medusajs/ui";
+import { Container, Heading, Text, Badge, Button, Alert } from "@medusajs/ui";
 import { Sparkles, PhotoSolid, PencilSquare, Eye } from "@medusajs/icons";
 import { useState, useEffect } from "react";
 import { useNavigate } from "react-router-dom";
@@ -38,10 +31,14 @@ interface CampaignDetailWidgetProps {
   data: any; // Promotion data
 }
 
-const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) => {
+const CampaignDetailWidget = ({
+  data: promotion,
+}: CampaignDetailWidgetProps) => {
   const navigate = useNavigate();
   const [campaign, setCampaign] = useState<Campaign | null>(null);
-  const [campaignDetail, setCampaignDetail] = useState<CampaignDetail | null>(null);
+  const [campaignDetail, setCampaignDetail] = useState<CampaignDetail | null>(
+    null,
+  );
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
@@ -65,7 +62,7 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
         `/admin/flash-sales/${promotion.campaign_id}`,
         {
           credentials: "include",
-        }
+        },
       );
 
       if (campaignResponse.ok) {
@@ -149,7 +146,8 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
 
   const hasCampaignDetail = !!campaignDetail;
   const hasImages = campaignDetail?.image_url || campaignDetail?.thumbnail_url;
-  const hasContent = campaignDetail?.detail_content || campaignDetail?.terms_and_conditions;
+  const hasContent =
+    campaignDetail?.detail_content || campaignDetail?.terms_and_conditions;
   const hasSEO = campaignDetail?.meta_title || campaignDetail?.meta_description;
 
   return (
@@ -164,7 +162,9 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
         <div className="mb-4 p-4 rounded-lg border bg-ui-bg-subtle">
           <div className="flex items-start justify-between mb-3">
             <div className="flex-1">
-              <Text className="font-semibold text-lg mb-1">{campaign.name}</Text>
+              <Text className="font-semibold text-lg mb-1">
+                {campaign.name}
+              </Text>
               {campaign.description && (
                 <Text className="text-sm text-ui-fg-subtle line-clamp-2">
                   {campaign.description}
@@ -180,15 +180,19 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
           {/* Campaign Detail Status */}
           <div className="grid grid-cols-2 gap-2 mt-3 pt-3 border-t">
             <div className="flex items-center gap-2">
-              <PhotoSolid className={`h-4 w-4 ${hasImages ? 'text-green-500' : 'text-ui-fg-muted'}`} />
+              <PhotoSolid
+                className={`h-4 w-4 ${hasImages ? "text-green-500" : "text-ui-fg-muted"}`}
+              />
               <Text className="text-xs">
-                {hasImages ? 'Images added' : 'No images'}
+                {hasImages ? "Images added" : "No images"}
               </Text>
             </div>
             <div className="flex items-center gap-2">
-              <PencilSquare className={`h-4 w-4 ${hasContent ? 'text-green-500' : 'text-ui-fg-muted'}`} />
+              <PencilSquare
+                className={`h-4 w-4 ${hasContent ? "text-green-500" : "text-ui-fg-muted"}`}
+              />
               <Text className="text-xs">
-                {hasContent ? 'Content added' : 'No content'}
+                {hasContent ? "Content added" : "No content"}
               </Text>
             </div>
           </div>
@@ -223,7 +227,9 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
 
             {campaignDetail.link_url && (
               <div className="flex items-center gap-2 text-xs">
-                <Badge size="xsmall" color="blue">CTA Link</Badge>
+                <Badge size="xsmall" color="blue">
+                  CTA Link
+                </Badge>
                 <Text className="text-ui-fg-subtle truncate">
                   {campaignDetail.link_text || campaignDetail.link_url}
                 </Text>
@@ -232,7 +238,9 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
 
             {hasSEO && (
               <div className="flex items-center gap-2 text-xs">
-                <Badge size="xsmall" color="green">SEO</Badge>
+                <Badge size="xsmall" color="green">
+                  SEO
+                </Badge>
                 <Text className="text-ui-fg-subtle">
                   Meta fields configured
                 </Text>
@@ -245,18 +253,15 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
         {!hasCampaignDetail && (
           <Alert variant="info" className="mb-4">
             <Text className="text-sm">
-              No campaign details added yet. Add images, content, and SEO to enhance this campaign.
+              No campaign details added yet. Add images, content, and SEO to
+              enhance this campaign.
             </Text>
           </Alert>
         )}
 
         {/* Actions */}
         <div className="flex gap-2">
-          <Button
-            variant="secondary"
-            size="small"
-            onClick={handleEditCampaign}
-          >
+          <Button variant="secondary" size="small" onClick={handleEditCampaign}>
             <PencilSquare className="mr-1" />
             Edit Campaign
           </Button>
@@ -277,7 +282,9 @@ const CampaignDetailWidget = ({ data: promotion }: CampaignDetailWidgetProps) =>
           <div className="mt-4 pt-4 border-t grid grid-cols-2 gap-3 text-xs">
             <div>
               <Text className="text-ui-fg-subtle">Display Order</Text>
-              <Text className="font-medium">{campaignDetail.display_order}</Text>
+              <Text className="font-medium">
+                {campaignDetail.display_order}
+              </Text>
             </div>
             <div>
               <Text className="text-ui-fg-subtle">Status</Text>

package/src/api/admin/buy-x-get-y/[id]/route.ts

@@ -19,7 +19,7 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
   if (!id) {
     throw new MedusaError(
       MedusaError.Types.INVALID_DATA,
-      "Campaign ID is required"
+      "Campaign ID is required",
     );
   }
 
@@ -34,11 +34,7 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
       data: [customCampaignTypes],
     } = await query.graph({
       entity: "custom_campaign_type",
-      fields: [
-        "id",
-        "campaign.*",
-        "campaign.promotions.*",
-      ],
+      fields: ["id", "campaign.*", "campaign.promotions.*"],
       filters: {
         type: CampaignTypeEnum.BuyXGetY,
         campaign_id: id,
@@ -50,7 +46,7 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
     if (!campaign) {
       throw new MedusaError(
         MedusaError.Types.NOT_FOUND,
-        `Buy X Get Y campaign with ID ${id} not found`
+        `Buy X Get Y campaign with ID ${id} not found`,
       );
     }
 
@@ -64,10 +60,10 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
     const rules: BuyXGetYCampaign["rules"] = [];
     for (const config of buyXGetYConfigs) {
       const triggerProduct = await productService.retrieveProduct(
-        config.trigger_product_id
+        config.trigger_product_id,
       );
       const rewardProduct = await productService.retrieveProduct(
-        config.reward_product_id
+        config.reward_product_id,
       );
 
       rules.push({
@@ -100,7 +96,7 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
     console.error("Error fetching Buy X Get Y campaign:", error);
     throw new MedusaError(
       MedusaError.Types.UNEXPECTED_STATE,
-      "An error occurred while fetching the Buy X Get Y campaign"
+      "An error occurred while fetching the Buy X Get Y campaign",
     );
   }
 };
@@ -110,7 +106,7 @@ export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
  */
 export const PUT = async (
   req: MedusaRequest<BuyXGetYCampaign>,
-  res: MedusaResponse
+  res: MedusaResponse,
 ) => {
   const { id } = req.params;
   const body = req.body;
@@ -118,7 +114,7 @@ export const PUT = async (
   if (!id) {
     throw new MedusaError(
       MedusaError.Types.INVALID_DATA,
-      "Campaign ID is required"
+      "Campaign ID is required",
     );
   }
 
@@ -127,7 +123,7 @@ export const PUT = async (
     if (new Date(body.ends_at) < new Date(body.starts_at)) {
       throw new MedusaError(
         MedusaError.Types.INVALID_DATA,
-        "End date must be after start date"
+        "End date must be after start date",
       );
     }
 
@@ -136,7 +132,7 @@ export const PUT = async (
       if (rule.rewardType !== "free" && !rule.rewardValue) {
         throw new MedusaError(
           MedusaError.Types.INVALID_DATA,
-          "Reward value is required for percentage and fixed reward types"
+          "Reward value is required for percentage and fixed reward types",
         );
       }
     }
@@ -158,7 +154,7 @@ export const PUT = async (
     console.error("Error updating Buy X Get Y campaign:", error);
     throw new MedusaError(
       MedusaError.Types.UNEXPECTED_STATE,
-      "An error occurred while updating the Buy X Get Y campaign"
+      "An error occurred while updating the Buy X Get Y campaign",
     );
   }
 };

package/src/api/admin/coupons/[id]/route.ts

@@ -0,0 +1,98 @@
+import { container, MedusaRequest, MedusaResponse } from "@medusajs/framework";
+import { MedusaError, Modules } from "@medusajs/framework/utils";
+import z from "zod";
+import { createCouponCampaignSchema } from "../route";
+import { updateCouponCampaignWorkflow } from "../../../../workflows/custom-campaign/updateCouponCampaignWorkflow";
+import { CUSTOM_CAMPAIGN_MODULE } from "../../../../modules/custom-campaigns";
+import CustomCampaignModuleService from "../../../../modules/custom-campaigns/service";
+import { CampaignTypeEnum } from "../../../../modules/custom-campaigns/types/campaign-type.enum";
+
+const updateCouponSchema = createCouponCampaignSchema.extend({
+  type: z.literal(CampaignTypeEnum.Coupon),
+});
+
+export const GET = async (req: MedusaRequest, res: MedusaResponse) => {
+  const { id } = req.params;
+
+  const promotionService = container.resolve(Modules.PROMOTION);
+  const customCampaignModuleService =
+    container.resolve<CustomCampaignModuleService>(CUSTOM_CAMPAIGN_MODULE);
+
+  try {
+    const campaign = await promotionService.retrieveCampaign(id, {
+      relations: ["promotions", "promotions.application_method"],
+    });
+
+    if (!campaign) {
+      throw new MedusaError(
+        MedusaError.Types.NOT_FOUND,
+        "Coupon campaign not found",
+      );
+    }
+
+    const [campaignType] =
+      await customCampaignModuleService.listCustomCampaignTypes({
+        campaign_id: campaign.id,
+      });
+
+    if (campaignType?.type !== CampaignTypeEnum.Coupon) {
+      throw new MedusaError(
+        MedusaError.Types.INVALID_DATA,
+        "Campaign is not a coupon",
+      );
+    }
+
+    const [detail] = await customCampaignModuleService.listCampaignDetails({
+      campaign_id: campaign.id,
+    });
+
+    res.status(200).json({
+      campaign,
+      campaign_detail: detail ?? null,
+    });
+  } catch (error) {
+    if (error instanceof MedusaError) {
+      throw error;
+    }
+
+    throw new MedusaError(
+      MedusaError.Types.INVALID_DATA,
+      (error as Error)?.message ?? "Failed to retrieve coupon",
+    );
+  }
+};
+
+export const PUT = async (
+  req: MedusaRequest<z.infer<typeof updateCouponSchema>>,
+  res: MedusaResponse,
+) => {
+  const { id } = req.params;
+  const body = req.body;
+
+  if (body.type !== CampaignTypeEnum.Coupon) {
+    throw new MedusaError(
+      MedusaError.Types.INVALID_DATA,
+      "Campaign type must be coupon",
+    );
+  }
+
+  await updateCouponCampaignWorkflow.run({
+    input: {
+      id,
+      name: body.name,
+      description: body.description,
+      code: body.code,
+      starts_at: new Date(body.starts_at),
+      ends_at: new Date(body.ends_at),
+      discount_type: body.discount_type,
+      discount_value: body.discount_value,
+      currency_code: body.currency_code,
+      allocation: body.allocation,
+      target_type: body.target_type,
+    },
+  });
+
+  res.status(200).json({
+    message: "Coupon campaign updated",
+  });
+};