From 9a48f0593bee7d9e7e11c00b21e42106a6e1027f Mon Sep 17 00:00:00 2001
From: Rahul Barwal <rahul.barwal@appsmith.com>
Date: Wed, 30 Oct 2024 17:31:50 +0530
Subject: [PATCH] test: add unit tests for RequestTemplate component

---
 .../Template/RequestTemplate.test.tsx         | 63 +++++++++++++++++++
 .../Templates/Template/RequestTemplate.tsx    | 14 ++---
 2 files changed, 70 insertions(+), 7 deletions(-)
 create mode 100644 app/client/src/pages/Templates/Template/RequestTemplate.test.tsx

diff --git a/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx b/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx
new file mode 100644
index 00000000000..c88f60a8283
--- /dev/null
+++ b/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx
@@ -0,0 +1,63 @@
+import { createMessage } from "@appsmith/ads-old";
+import "@testing-library/jest-dom";
+import { fireEvent, render } from "@testing-library/react";
+import {
+  REQUEST_BUILDING_BLOCK,
+  REQUEST_TEMPLATE,
+} from "ee/constants/messages";
+import AnalyticsUtil from "ee/utils/AnalyticsUtil";
+import { unitTestBaseMockStore } from "layoutSystems/common/dropTarget/unitTestUtils";
+import React from "react";
+import { Provider } from "react-redux";
+import configureStore from "redux-mock-store";
+import { lightTheme } from "selectors/themeSelectors";
+import { ThemeProvider } from "styled-components";
+import RequestTemplate, {
+  REQUEST_TEMPLATE_URL,
+  type RequestTemplateProps,
+} from "./RequestTemplate";
+const mockStore = configureStore([]);
+
+const BaseComponentRender = (
+  props: RequestTemplateProps,
+  storeToUse = unitTestBaseMockStore,
+) => (
+  <Provider store={mockStore(storeToUse)}>
+    <ThemeProvider theme={lightTheme}>
+      <RequestTemplate {...props} />
+    </ThemeProvider>
+  </Provider>
+);
+
+describe("RequestTemplate", () => {
+  it("should display correct message based on isBuildingBlock prop", () => {
+    const { getByText } = render(
+      BaseComponentRender({ isBuildingBlock: true }),
+    );
+
+    expect(
+      getByText(createMessage(REQUEST_BUILDING_BLOCK)),
+    ).toBeInTheDocument();
+  });
+  it("should open REQUEST_TEMPLATE_URL in a new window when button is clicked", () => {
+    const openSpy = jest.spyOn(window, "open");
+    const { getByText } = render(
+      BaseComponentRender({ isBuildingBlock: false }),
+    );
+    const button = getByText(createMessage(REQUEST_TEMPLATE));
+
+    fireEvent.click(button);
+    expect(openSpy).toHaveBeenCalledWith(REQUEST_TEMPLATE_URL);
+  });
+
+  it('should trigger AnalyticsUtil logEvent with "REQUEST_NEW_TEMPLATE" when button is clicked', () => {
+    const logEventSpy = jest.spyOn(AnalyticsUtil, "logEvent");
+    const { getByText } = render(
+      BaseComponentRender({ isBuildingBlock: false }),
+    );
+    const button = getByText(createMessage(REQUEST_TEMPLATE));
+
+    fireEvent.click(button);
+    expect(logEventSpy).toHaveBeenCalledWith("REQUEST_NEW_TEMPLATE");
+  });
+});
diff --git a/app/client/src/pages/Templates/Template/RequestTemplate.tsx b/app/client/src/pages/Templates/Template/RequestTemplate.tsx
index 68fce42e6d8..10b8b14e7d7 100644
--- a/app/client/src/pages/Templates/Template/RequestTemplate.tsx
+++ b/app/client/src/pages/Templates/Template/RequestTemplate.tsx
@@ -1,16 +1,16 @@
-import React from "react";
-import styled from "styled-components";
-import { Text, TextType } from "@appsmith/ads-old";
 import { Button } from "@appsmith/ads";
+import { Text, TextType } from "@appsmith/ads-old";
 import RequestTemplateSvg from "assets/images/request-template.svg";
 import {
   COULDNT_FIND_TEMPLATE,
-  createMessage,
   COULDNT_FIND_TEMPLATE_DESCRIPTION,
-  REQUEST_TEMPLATE,
+  createMessage,
   REQUEST_BUILDING_BLOCK,
+  REQUEST_TEMPLATE,
 } from "ee/constants/messages";
 import AnalyticsUtil from "ee/utils/AnalyticsUtil";
+import React from "react";
+import styled from "styled-components";
 
 const Wrapper = styled.div`
   border: 1px solid var(--ads-v2-color-border);
@@ -48,10 +48,10 @@ const StyledImage = styled.img`
   border-radius: var(--ads-v2-border-radius);
 `;
 
-const REQUEST_TEMPLATE_URL =
+export const REQUEST_TEMPLATE_URL =
   "https://app.appsmith.com/app/request-templates/request-list-6241c12fc99df2369931a714";
 
-interface RequestTemplateProps {
+export interface RequestTemplateProps {
   isBuildingBlock?: boolean;
 }