// import LoyaltyCardListItem from "@/apps/new-ui/pages/(loyalty)/loyalty-cards/+components/LoyaltyCardListItem";
// import { render, screen, fireEvent, waitFor } from "@testing-library/react";
// import { BrowserRouter } from "react-router-dom";

// // تغییر vi به jest
// jest.mock("@/utils/date-time", () => ({
//   formatPersianDate: jest.fn(() => "1402/01/15"),
// }));

// // Mock customer service
// const mockGetCustomerProfilePicture = jest.fn();

// jest.mock("@/apps/new-ui/services/Customer.ts", () => ({
//   __esModule: true,
//   useGetCustomerProfilePicture: jest.fn(() => ({
//     mutateAsync: mockGetCustomerProfilePicture,
//   })),
// }));
// jest.mock("../src/apps/new-ui/Utils/env.ts", () => ({
//   ENV: {
//     API_URL: "https://api.test",
//   },
// }));
// // Mock images
// jest.mock(
//   "../../../../assets/loyalty-cards/cosmetic1.png",
//   () => "cosmetic1.png",
// );
// jest.mock(
//   "../../../../assets/loyalty-cards/cosmetic2.png",
//   () => "cosmetic2.png",
// );
// jest.mock(
//   "../../../../assets/loyalty-cards/cosmetic3.png",
//   () => "cosmetic3.png",
// );
// jest.mock(
//   "../../../../assets/loyalty-cards/cosmetic4.png",
//   () => "cosmetic4.png",
// );
// jest.mock("../../../../assets/profilePhoto.svg", () => "avatar.svg");

// // Mock medal icons
// jest.mock("@/apps/new-ui/constant/CustomerTypes", () => ({
//   CUSTOMER_TYPES: [
//     { status: "VIP", icon: "vip.png" },
//     { status: "NORMAL", icon: "normal.png" },
//   ],
// }));

// const renderUI = (data: any, handlers: any) =>
//   render(
//     <BrowserRouter>
//       <LoyaltyCardListItem {...handlers} data={data} />
//     </BrowserRouter>,
//   );

// describe("LoyaltyCardListItem", () => {
//   const baseData = {
//     id: 55,
//     customer_name: "علی رضایی",
//     customer_phone_number: "09120000000",
//     card_type: "1",
//     creation_time: "2024-02-10 12:00",
//     link: "https://example.com/share/55",
//     description_of_discount: "20 درصد تخفیف",
//     predicted_number_of_visits: 12,
//     primary_number_of_visits: 3,
//     extera_description: "توضیحات تست",
//   };

//   const handlers = {
//     deleteLoyaltyCardHandler: jest.fn(),
//     shareLinkHandler: jest.fn(),
//     deletePending: false,
//   };

//   beforeEach(() => {
//     jest.clearAllMocks();

//     mockGetCustomerProfilePicture.mockResolvedValue({
//       data: {},
//     });
//   });

    
// mockGetCustomerProfilePicture.mockImplementation(() => ({
//   then: (resolve: any) => resolve({ data: {} }),
//   catch: () => {},
// }));

//   // test("renders basic loyalty card info", async () => {
//   //   renderUI(baseData, handlers);

//   //   await waitFor(() => {
//   //     expect(screen.getByText("کارت وفاداری")).toBeInTheDocument();
//   //   });
//   // });
//   test("renders basic loyalty card info", async () => {
//   renderUI(baseData, handlers);

//   await waitFor(() => {
//     expect(mockGetCustomerProfilePicture).toHaveBeenCalled();
//   });

//   expect(screen.getByText("کارت وفاداری")).toBeInTheDocument();
// });


//   //     expect(screen.getByText("علی رضایی")).toBeInTheDocument();
//   //   });

//   test("fetches customer profile picture and renders medal", async () => {
//     mockGetCustomerProfilePicture.mockResolvedValue({
//       data: {
//         "09120000000": { customer_type: "VIP", profile_picture: "pic.jpg" },
//       },
//     });

//     renderUI(baseData, handlers);

//     await waitFor(() => {
//       const img = screen.getByAltText("avatar") as HTMLImageElement;
//       expect(img.src).toContain("pic.jpg");
//     });

//     const statusImg = screen.getByAltText("status") as HTMLImageElement;
//     expect(statusImg.src).toContain("vip.png");
//   });

//   test("calls delete handler when X clicked", () => {
//     renderUI(baseData, handlers);
//     // پیدا کردن آیکون X (در لوساید معمولا با تگ svg یا عنوان کلاس پیدا می‌شود)
//     const xIcon = screen.getByText("کارت وفاداری").previousElementSibling;
//     if (xIcon) fireEvent.click(xIcon);

//     expect(handlers.deleteLoyaltyCardHandler).toHaveBeenCalledWith(55);
//   });

//   test("toggles accordion on click", () => {
//     renderUI(baseData, handlers);
//     const moreBtn = screen.getByText("بیشتر");
//     fireEvent.click(moreBtn);
//     expect(screen.getByText("جایزه")).toBeInTheDocument();

//     const lessBtn = screen.getByText("کمتر");
//     fireEvent.click(lessBtn);
//     expect(screen.queryByText("جایزه")).not.toBeInTheDocument();
//   });
// });


import LoyaltyCardListItem from "@/apps/new-ui/pages/(loyalty)/loyalty-cards/+components/LoyaltyCardListItem";
import { render, screen, fireEvent, waitFor } from "@testing-library/react";
import { BrowserRouter } from "react-router-dom";

jest.mock("@/utils/date-time", () => ({
  formatPersianDate: jest.fn(() => "1402/01/15"),
}));

jest.mock("../src/apps/new-ui/Utils/env.ts", () => ({
  ENV: { API_URL: "https://api.test" },
}));

// Mock images
jest.mock("../../../../assets/loyalty-cards/cosmetic1.png", () => "cosmetic1.png");
jest.mock("../../../../assets/loyalty-cards/cosmetic2.png", () => "cosmetic2.png");
jest.mock("../../../../assets/loyalty-cards/cosmetic3.png", () => "cosmetic3.png");
jest.mock("../../../../assets/loyalty-cards/cosmetic4.png", () => "cosmetic4.png");
jest.mock("../../../../assets/profilePhoto.svg", () => "avatar.svg");

jest.mock("@/apps/new-ui/constant/CustomerTypes", () => ({
  CUSTOMER_TYPES: [
    { status: "VIP", icon: "vip.png" },
    { status: "NORMAL", icon: "normal.png" },
  ],
}));

const renderUI = (data: any, handlers: any) =>
  render(
    <BrowserRouter>
      <LoyaltyCardListItem {...handlers} data={data} />
    </BrowserRouter>
  );

describe("LoyaltyCardListItem", () => {
  const baseData = {
    id: 55,
    customer_name: "علی رضایی",
    customer_phone_number: "09120000000",
    card_type: "1",
    creation_time: "2024-02-10 12:00",
    link: "https://example.com/share/55",
    description_of_discount: "20 درصد تخفیف",
    predicted_number_of_visits: 12,
    primary_number_of_visits: 3,
    extera_description: "توضیحات تست",
  };

  const handlers = {
    deleteLoyaltyCardHandler: jest.fn(),
    shareLinkHandler: jest.fn(),
    deletePending: false,
  };

  test("renders basic loyalty card info", async () => {
    renderUI(baseData, handlers);

    await waitFor(() => {
      expect(screen.getByText("کارت وفاداری")).toBeInTheDocument();
    });
  });

  test("fetches customer profile picture and renders medal", async () => {
    renderUI(baseData, handlers);

    await waitFor(() => {
      const img = screen.getByAltText("avatar");
      expect(img).toBeInTheDocument();
    });
  });

  test("calls delete handler when X clicked", () => {
    renderUI(baseData, handlers);

    const xIcon = screen.getByText("کارت وفاداری").previousElementSibling;
    if (xIcon) fireEvent.click(xIcon);

    expect(handlers.deleteLoyaltyCardHandler).toHaveBeenCalledWith(55);
  });

  test("toggles accordion on click", () => {
    renderUI(baseData, handlers);

    const moreBtn = screen.getByText("بیشتر");
    fireEvent.click(moreBtn);
    expect(screen.getByText("جایزه")).toBeInTheDocument();

    const lessBtn = screen.getByText("کمتر");
    fireEvent.click(lessBtn);
    expect(screen.queryByText("جایزه")).not.toBeInTheDocument();
  });
});