setup reducer and config

coderj001 · coderj001 · commit e7a3b6dd9c4c · 2021-04-06T13:19:23.000+05:30
diff --git a/backend/Backend/settings.py b/backend/Backend/settings.py
@@ -67,8 +67,7 @@
 AUTH_PASSWORD_VALIDATORS = [
     {
         'NAME':
-        'django.contrib.auth.password_validation.' +
-        'UserAttributeSimilarityValidator',
+        'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
     },
     {
         'NAME':
diff --git a/backend/Backend/urls.py b/backend/Backend/urls.py
@@ -8,4 +8,4 @@
     path('api/', include('core.urls'))
 ]
 
-urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT),
+urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
diff --git a/backend/Pipfile b/backend/Pipfile
@@ -13,6 +13,9 @@ pillow = "*"
 django-linter = "*"
 pylint = "*"
 isort = "*"
+ipython = "*"
+ipdb = "*"
+autopep8 = "*"
 
 [requires]
 python_version = "3.8"
diff --git a/backend/Pipfile.lock b/backend/Pipfile.lock
diff --git a/backend/core/models.py b/backend/core/models.py
@@ -82,6 +82,10 @@ class OrderItem(models.Model):
     image = models.CharField(max_length=200, null=True, blank=True)
     _id = models.AutoField(primary_key=True, editable=False)
 
+    class Meta:
+        verbose_name = "OrderItem"
+        verbose_name_plural = "OrderItems"
+
     def __str__(self):
         return str(self.name)
 
@@ -98,5 +102,9 @@ class ShippingAddress(models.Model):
         max_digits=7, decimal_places=2, null=True, blank=True)
     _id = models.AutoField(primary_key=True, editable=False)
 
+    class Meta:
+        verbose_name = "ShippingAddress"
+        verbose_name_plural = "ShippingAddresses"
+
     def __str__(self):
         return str(self.address)
diff --git a/backend/core/serializer.py b/backend/core/serializer.py
@@ -0,0 +1,10 @@
+from django.contrib.auth.models import User
+from rest_framework.serializers import ModelSerializer
+
+from core.models import Order, OrderItem, Product, Review, ShippingAddress
+
+
+class ProductSerializer(ModelSerializer):
+    class Meta:
+        model = Product
+        fields = '__all__'
diff --git a/backend/core/views.py b/backend/core/views.py
@@ -1,16 +1,19 @@
 from rest_framework.decorators import api_view
 from rest_framework.response import Response
 
-from .product import PRODUCT
+from core.models import Order, OrderItem, Product, Review, ShippingAddress
+from core.serializer import ProductSerializer
 
 
 @api_view(['GET'])
 def getProducts(request):
-    products = PRODUCT
-    return Response(products)
+    products = Product.objects.all()
+    serializer = ProductSerializer(products, many=True)
+    return Response(serializer.data)
 
 
 @api_view(['GET'])
 def getProduct(request, id):
-    product = PRODUCT[id-1]
-    return Response(product)
+    product = Product.objects.get(pk=id)
+    serializer = ProductSerializer(product)
+    return Response(serializer.data)
diff --git a/backend/static/images/airpods.jpg b/backend/static/images/airpods.jpg
diff --git a/frontend/package.json b/frontend/package.json
@@ -1,5 +1,6 @@
 {
   "name": "frontend",
+  "proxy": "http://127.0.0.1:8000",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
@@ -15,10 +16,14 @@
     "react": "^17.0.2",
     "react-bootstrap": "^1.5.2",
     "react-dom": "^17.0.2",
+    "react-redux": "^7.2.3",
     "react-router": "^5.2.0",
     "react-router-bootstrap": "^0.25.0",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.3",
+    "redux": "^4.0.5",
+    "redux-devtools-extension": "^2.13.9",
+    "redux-thunk": "^2.3.0",
     "web-vitals": "^1.0.1"
   },
   "scripts": {
diff --git a/frontend/src/Pages/HomePage.jsx b/frontend/src/Pages/HomePage.jsx
@@ -1,27 +1,31 @@
-import React, { useState, useEffect } from "react";
+import React, { useEffect } from "react";
+import { useDispatch, useSelector } from "react-redux";
 import { Row, Col } from "react-bootstrap";
 import Product from "../components/Product";
-import axios from "axios";
+import { listProducts } from "../actions/productActions";
 
 function HomePage() {
-  const [products, setProducts] = useState([]);
+  const dispatch = useDispatch();
+  const { loading, error, products } = useSelector(
+    (state) => state.productList
+  );
   useEffect(() => {
-    async function fetchProducts() {
-      const { data } = await axios.get("http://localhost:8000/api/products/");
-      setProducts(data);
-    }
-    fetchProducts();
-  }, []);
+    dispatch(listProducts());
+  }, [dispatch]);
   return (
     <div>
       <h1>Latest Product</h1>
-      <Row>
-        {products.map((product) => (
-          <Col sm={12} md={6} lg={4} xl={3} key={product._id}>
-            <Product product={product} />
-          </Col>
-        ))}
-      </Row>
+      {loading ? (
+        <h1>Loading...</h1>
+      ) : (
+        <Row>
+          {products.map((product) => (
+            <Col sm={12} md={6} lg={4} xl={3} key={product._id}>
+              <Product product={product} />
+            </Col>
+          ))}
+        </Row>
+      )}
     </div>
   );
 }
diff --git a/frontend/src/Pages/ProductPage.jsx b/frontend/src/Pages/ProductPage.jsx
@@ -18,7 +18,7 @@ function ProductPage(props) {
   useEffect(() => {
     async function fetchProduct() {
       const { data } = await axios.get(
-        `http://localhost:8000/api/product/${props.match.params.id}`
+        `/api/product/${props.match.params.id}`
       );
       setProduct(data);
     }
diff --git a/frontend/src/actions/productActions.jsx b/frontend/src/actions/productActions.jsx
@@ -0,0 +1,23 @@
+import {
+  PRODUCT_LIST_FAIL,
+  PRODUCT_LIST_REQUEST,
+  PRODUCT_LIST_SUCCESS,
+} from "../constants/productConstants";
+
+import axios from "axios";
+
+export const listProducts = () => async (dispatch) => {
+  try {
+    dispatch({ type: PRODUCT_LIST_REQUEST });
+    const { data } = await axios.get("/api/products/");
+    dispatch({ type: PRODUCT_LIST_SUCCESS, payload: data });
+  } catch (err) {
+    dispatch({
+      type: PRODUCT_LIST_FAIL,
+      payload:
+        err.response && err.response.data.message
+          ? err.response.data.message
+          : err.message,
+    });
+  }
+};
diff --git a/frontend/src/constants/productConstants.jsx b/frontend/src/constants/productConstants.jsx
@@ -0,0 +1,3 @@
+export const PRODUCT_LIST_REQUEST = "PRODUCT_LIST_REQUEST";
+export const PRODUCT_LIST_SUCCESS = "PRODUCT_LIST_SUCCESS";
+export const PRODUCT_LIST_FAIL = "PRODUCT_LIST_FAIL";
diff --git a/frontend/src/index.js b/frontend/src/index.js
@@ -1,6 +1,13 @@
 import React from "react";
 import ReactDOM from "react-dom";
+import { Provider } from "react-redux";
+import store from "./store.jsx";
 import "./index.css";
 import App from "./App.jsx";
 
-ReactDOM.render(<App />, document.getElementById("root"));
+ReactDOM.render(
+  <Provider store={store}>
+    <App />
+  </Provider>,
+  document.getElementById("root")
+);
diff --git a/frontend/src/reducers/productReducer.jsx b/frontend/src/reducers/productReducer.jsx
@@ -0,0 +1,18 @@
+import {
+  PRODUCT_LIST_FAIL,
+  PRODUCT_LIST_REQUEST,
+  PRODUCT_LIST_SUCCESS,
+} from "../constants/productConstants";
+
+export const productListReducer = (state = { products: [] }, action) => {
+  switch (action.type) {
+    case PRODUCT_LIST_REQUEST:
+      return { loading: true, products: [] };
+    case PRODUCT_LIST_SUCCESS:
+      return { loading: false, products: action.payload };
+    case PRODUCT_LIST_FAIL:
+      return { loading: false, error: action.payload };
+    default:
+      return state;
+  }
+};
diff --git a/frontend/src/store.jsx b/frontend/src/store.jsx
diff --git a/frontend/yarn.lock b/frontend/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -67,8 +67,7 @@`
`67`	`67`	`AUTH_PASSWORD_VALIDATORS = [`
`68`	`68`	`{`
`69`	`69`	`'NAME':`
`70`		`- 'django.contrib.auth.password_validation.' +`
`71`		`- 'UserAttributeSimilarityValidator',`
	`70`	`+ 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',`
`72`	`71`	`},`
`73`	`72`	`{`
`74`	`73`	`'NAME':`
Original file line number	Diff line number	Diff line change
`@@ -8,4 +8,4 @@`
`8`	`8`	`path('api/', include('core.urls'))`
`9`	`9`	`]`
`10`	`10`
`11`		`-urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT),`
	`11`	`+urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)`