Resolved conflicts and merged develop

keyurdoshi03 · keyurdoshi03 · commit 518e2bf6e74f · 2025-11-02T12:22:10.000+05:30
diff --git a/services/web/src/actions/shopActions.ts b/services/web/src/actions/shopActions.ts
@@ -115,6 +115,21 @@ export const applyCouponAction = ({
   };
 };
 
+export const newProductAction = ({
+  accessToken,
+  callback,
+  ...data
+}: ActionPayload) => {
+  return {
+    type: actionTypes.NEW_PRODUCT,
+    payload: {
+      accessToken,
+      ...data,
+      callback,
+    },
+  };
+};
+
 export const newCouponAction = ({
   accessToken,
   callback,
diff --git a/services/web/src/components/layout/layout.tsx b/services/web/src/components/layout/layout.tsx
@@ -108,7 +108,11 @@ const AfterLogin: React.FC<AfterLoginProps> = ({
     return <Navigate to="/login" />;
   }
 
-  if (!componentRole || (componentRole && componentRole === userRole)) {
+  if (
+    !componentRole ||
+    (componentRole && componentRole === userRole) ||
+    userRole === roleTypes.ROLE_ADMIN
+  ) {
     return <Component />;
   }
 
diff --git a/services/web/src/components/shop/shop.tsx b/services/web/src/components/shop/shop.tsx
@@ -37,6 +37,7 @@ import {
 } from "@ant-design/icons";
 import {
   COUPON_CODE_REQUIRED,
+  PRODUCT_DETAILS_REQUIRED,
   COUPON_AMOUNT_REQUIRED,
 } from "../../constants/messages";
 import { useNavigate } from "react-router-dom";
@@ -64,6 +65,11 @@ interface ShopProps extends PropsFromRedux {
   nextOffset: number | null;
   onOffsetChange: (offset: number | null) => void;
   onBuyProduct: (product: Product) => void;
+  isNewProductFormOpen: boolean;
+  setIsNewProductFormOpen: (isOpen: boolean) => void;
+  newProductHasErrored: boolean;
+  newProductErrorMessage: string;
+  onNewProductFinish: (values: any) => void;
   isNewCouponFormOpen: boolean;
   setIsNewCouponFormOpen: (isOpen: boolean) => void;
   newCouponHasErrored: boolean;
@@ -116,6 +122,11 @@ const Shop: React.FC<ShopProps> = (props) => {
     nextOffset,
     onOffsetChange,
     onBuyProduct,
+    isNewProductFormOpen,
+    setIsNewProductFormOpen,
+    newProductHasErrored,
+    newProductErrorMessage,
+    onNewProductFinish,
     isNewCouponFormOpen,
     setIsNewCouponFormOpen,
     newCouponHasErrored,
@@ -189,6 +200,23 @@ const Shop: React.FC<ShopProps> = (props) => {
               </Card>
             </Col>
           ))}
+          {role === roleTypes.ROLE_ADMIN && (
+            <Col span={8} key="new-product-card">
+              <Card
+                className="new-product-card"
+                onClick={() => setIsNewProductFormOpen(true)}
+                cover={<PlusOutlined className="add-icon" />}
+              >
+                <Meta
+                  description={
+                    <div className="product-info product-price">
+                      Add Product
+                    </div>
+                  }
+                />
+              </Card>
+            </Col>
+          )}
         </Row>
         <Row justify="center" className="pagination">
           <Button
@@ -240,6 +268,53 @@ const Shop: React.FC<ShopProps> = (props) => {
           </Form.Item>
         </Form>
       </Modal>
+      <Modal
+        title="Add New Product"
+        open={isNewProductFormOpen}
+        footer={null}
+        onCancel={() => setIsNewProductFormOpen(false)}
+      >
+        <Form
+          name="basic"
+          initialValues={{
+            remember: true,
+          }}
+          onFinish={onNewProductFinish}
+        >
+          <Form.Item
+            name="name"
+            rules={[{ required: true, message: PRODUCT_DETAILS_REQUIRED }]}
+          >
+            <Input placeholder="Product Name" />
+          </Form.Item>
+          <Form.Item
+            name="price"
+            rules={[
+              { required: true, message: PRODUCT_DETAILS_REQUIRED },
+              {
+                pattern: /^\d+$/,
+                message: "Please enter a valid price!",
+              },
+            ]}
+          >
+            <Input placeholder="Price" type="number" step="1" />
+          </Form.Item>
+          <Form.Item
+            name="image_url"
+            rules={[{ required: true, message: PRODUCT_DETAILS_REQUIRED }]}
+          >
+            <Input placeholder="Image URL (e.g., images/product.svg)" />
+          </Form.Item>
+          <Form.Item>
+            {newProductHasErrored && (
+              <div className="error-message">{newProductErrorMessage}</div>
+            )}
+            <Button type="primary" htmlType="submit" className="form-button">
+              Add
+            </Button>
+          </Form.Item>
+        </Form>
+      </Modal>
       <Modal
         title="Create New Coupon"
         open={isNewCouponFormOpen}
diff --git a/services/web/src/components/shop/styles.css b/services/web/src/components/shop/styles.css
@@ -315,7 +315,8 @@
 
 /* Responsive Design */
 @media (max-width: 1200px) {
-  .product-card .ant-card-cover {
+  .product-card .ant-card-cover,
+  .new-product-card .ant-card-cover {
     min-height: 240px;
   }
 }
@@ -329,7 +330,8 @@
     margin-bottom: var(--spacing-md);
   }
   
-  .product-card .ant-card-cover {
+  .product-card .ant-card-cover,
+  .new-product-card .ant-card-cover {
     min-height: 200px;
     padding: var(--spacing-md);
   }
@@ -366,6 +368,19 @@
   .pagination .ant-btn {
     width: 200px;
   }
+  
+  .new-product-card .ant-card-body {
+    min-height: 180px;
+    padding: var(--spacing-md);
+  }
+  
+  .add-icon {
+    font-size: 100px;
+  }
+  
+  .new-product-card .product-price {
+    font-size: 22px;
+  }
 }
 
 @media (max-width: 576px) {
@@ -377,5 +392,59 @@
   .page-header .ant-btn {
     width: 100%;
   }
+
+  .new-product-card .ant-card-cover {
+    min-height: 180px;
+  }
+  
+  .new-product-card .ant-card-body {
+    min-height: 160px;
+  }
+  
+  .add-icon {
+    font-size: 80px;
+  }
+  
+  .new-product-card .product-price {
+    font-size: 18px;
+  }
+}
+
+.new-product-card {
+  border: 5px dashed #d9d9d9 !important;
+  background: transparent !important;
+}
+
+.new-product-card:hover {
+  border: none !important;
+  background: rgba(255, 255, 255, 0.8) !important;
+  border-color: rgba(139, 92, 246, 0.3);
+}
+
+.new-product-card .ant-card-cover {
+  min-height: 280px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--spacing-lg);
 }
 
+.add-icon {
+  font-size: 150px;
+  color: #8b5cf6;
+  opacity: 0.5;
+  transition: all 0.3s ease;
+}
+
+.new-product-card .ant-card-body {
+  min-height: 217px;
+  padding: var(--spacing-lg);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.new-product-card .product-price {
+  font-size: 30px;
+  font-weight: 700;
+}
diff --git a/services/web/src/constants/actionTypes.ts b/services/web/src/constants/actionTypes.ts
@@ -70,6 +70,7 @@ const actionTypes = {
   RETURN_ORDER: "RETURN_ORDER",
   ORDER_RETURNED: "ORDER_RETURNED",
   APPLY_COUPON: "APPLY_COUPON",
+  NEW_PRODUCT: "NEW_PRODUCT",
   NEW_COUPON: "NEW_COUPON",
 
   GET_POSTS: "GET_POSTS",
diff --git a/services/web/src/constants/messages.ts b/services/web/src/constants/messages.ts
@@ -53,6 +53,8 @@ export const POST_TITLE_REQUIRED: string = "Please enter title for post!";
 export const POST_DESC_REQUIRED: string = "Please enter description for Post!";
 export const COMMENT_REQUIRED: string = "Please enter a comment!";
 export const COUPON_CODE_REQUIRED: string = "Please enter a coupon code!";
+export const PRODUCT_DETAILS_REQUIRED: string =
+  "Please enter all product details!";
 export const COUPON_AMOUNT_REQUIRED: string = "Please enter a coupon amount!";
 
 export const NO_VEHICLE_DESC_1: string =
@@ -85,6 +87,8 @@ export const INVALID_COUPON_CODE: string = "Invalid Coupon Code";
 export const COUPON_APPLIED: string = "Coupon applied";
 export const COUPON_NOT_APPLIED: string = "Could not validate coupon";
 export const COUPON_NOT_CREATED: string = "Could not create coupon";
+export const PRODUCT_NOT_ADDED: string = "Could not add product";
+export const NEW_PRODUCT_ADDED: string = "Product added!";
 export const INVALID_CREDS: string = "Invalid Username or Password";
 export const INVALID_CODE_CREDS: string = "Invalid Email or Code";
 export const SIGN_UP_SUCCESS: string = "User Registered Successfully!";
diff --git a/services/web/src/containers/shop/shop.js b/services/web/src/containers/shop/shop.js
@@ -22,6 +22,7 @@ import {
   getProductsAction,
   buyProductAction,
   applyCouponAction,
+  newProductAction,
   newCouponAction,
 } from "../../actions/shopActions";
 import Shop from "../../components/shop/shop";
@@ -37,6 +38,10 @@ const ShopContainer = (props) => {
   const [errorMessage, setErrorMessage] = React.useState("");
   const [isCouponFormOpen, setIsCouponFormOpen] = useState(false);
 
+  const [isNewProductFormOpen, setIsNewProductFormOpen] = useState(false);
+  const [newProductHasErrored, setNewProductHasErrored] = useState(false);
+  const [newProductErrorMessage, setNewProductErrorMessage] = useState("");
+
   const [newCouponHasErrored, setNewCouponHasErrored] = React.useState(false);
   const [newCouponErrorMessage, setNewCouponErrorMessage] = React.useState("");
   const [isNewCouponFormOpen, setIsNewCouponFormOpen] = useState(false);
@@ -103,6 +108,27 @@ const ShopContainer = (props) => {
     });
   };
 
+  const handleNewProductFormFinish = (values) => {
+    const callback = (res, data) => {
+      if (res === responseTypes.SUCCESS) {
+        setIsNewProductFormOpen(false);
+        Modal.success({
+          title: SUCCESS_MESSAGE,
+          content: data,
+          onOk: () => handleOffsetChange(0),
+        });
+      } else {
+        setNewProductHasErrored(true);
+        setNewProductErrorMessage(data);
+      }
+    };
+    props.newProduct({
+      callback,
+      accessToken,
+      ...values,
+    });
+  };
+
   const handleNewCouponFormFinish = (values) => {
     const callback = (res, data) => {
       if (res === responseTypes.SUCCESS) {
@@ -132,6 +158,11 @@ const ShopContainer = (props) => {
       errorMessage={errorMessage}
       onFinish={handleFormFinish}
       onOffsetChange={handleOffsetChange}
+      isNewProductFormOpen={isNewProductFormOpen}
+      setIsNewProductFormOpen={setIsNewProductFormOpen}
+      newProductHasErrored={newProductHasErrored}
+      newProductErrorMessage={newProductErrorMessage}
+      onNewProductFinish={handleNewProductFormFinish}
       isNewCouponFormOpen={isNewCouponFormOpen}
       setIsNewCouponFormOpen={setIsNewCouponFormOpen}
       newCouponHasErrored={newCouponHasErrored}
@@ -152,6 +183,7 @@ const mapDispatchToProps = {
   getProducts: getProductsAction,
   buyProduct: buyProductAction,
   applyCoupon: applyCouponAction,
+  newProduct: newProductAction,
   newCoupon: newCouponAction,
 };
 
@@ -160,6 +192,7 @@ ShopContainer.propTypes = {
   getProducts: PropTypes.func,
   buyProduct: PropTypes.func,
   applyCoupon: PropTypes.func,
+  newProduct: PropTypes.func,
   newCoupon: PropTypes.func,
   nextOffset: PropTypes.number,
   prevOffset: PropTypes.number,
diff --git a/services/web/src/sagas/shopSaga.ts b/services/web/src/sagas/shopSaga.ts

Original file line number	Diff line number	Diff line change
`@@ -108,7 +108,11 @@ const AfterLogin: React.FC<AfterLoginProps> = ({`
`108`	`108`	`return <Navigate to="/login" />;`
`109`	`109`	`}`
`110`	`110`
`111`		`- if (!componentRole \|\| (componentRole && componentRole === userRole)) {`
	`111`	`+ if (`
	`112`	`+ !componentRole \|\|`
	`113`	`+ (componentRole && componentRole === userRole) \|\|`
	`114`	`+ userRole === roleTypes.ROLE_ADMIN`
	`115`	`+ ) {`
`112`	`116`	`return <Component />;`
`113`	`117`	`}`
`114`	`118`