GSG-G9 · Alaalser · Feb 16, 2021 · Feb 16, 2021 · Feb 16, 2021 · Feb 16, 2021
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/public/favicon.png b/client/public/favicon.png
diff --git a/client/public/index.html b/client/public/index.html
@@ -2,7 +2,7 @@
 <html dir="rtl" lang="ar">
 <head>
   <meta charset="utf-8" />
-  <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
+  <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="description" content="Rawdaty is the first platform to help you choose your children's kindergarten" />
   <link href='https://fonts.googleapis.com/css?family=Tajawal' rel='stylesheet'>  

diff --git a/client/src/App/index.js b/client/src/App/index.js
@@ -11,11 +11,8 @@ import { notification } from 'antd';
 
 import NavBar from '../Components/Layout/Navbar';
 import Footer from '../Components/Layout/Footer';
-import KindergartenProfilePage from '../Pages/KindergartenProfilePage';
-
 import SideBar from '../Components/Layout/SideBar';
 import Home from '../Pages/HomePage';
-import Signup from '../Pages/Signup';
 import LoginPage from '../Pages/LoginPage';
 import AuthContext from '../Context/AuthContext';
 import LogoutContext from '../Context/LogoutContext';
@@ -87,19 +84,13 @@ const App = () => {
               <About />
             </Route>
 
-            <Route
-              exact
-              path="/kindergarten/:kindergartenId"
-              render={(props) => <KindergartenProfilePage {...props} />}
-            />
+            <Route exact path="/kindergarten/:id" />
 
             <Route exact path="/login">
               {!role ? <LoginPage /> : <Redirect to="/" />}
             </Route>
 
-            <Route exact path="/signup">
-              <Signup />
-            </Route>
+            <Route exact path="/signup" />
 
             <Route exact path={['/', '/about', '/kindergarten/:id', '/search']}>
               <Footer />

diff --git a/client/src/Components/CommentContainer/index.js b/client/src/Components/CommentContainer/index.js
@@ -1,40 +1,47 @@
-import React, { useState } from 'react';
-// import { List } from 'antd';
+import React, { useState, useEffect } from 'react';
+import { List } from 'antd';
 import PropTypes from 'prop-types';
 import Comment from '../Common/Comment';
 import MainButton from '../Common/MainButton';
 
-import './style.css';
-
 const CommentContainer = ({ data, isAdmin }) => {
+  const [commentsToShow, setCommentsToShow] = useState([]);
+  const [next, setNext] = useState(3);
   const commentsPerPage = 3;
-  const [limit, setLimit] = useState(commentsPerPage);
+
+  const loopWithSlice = (start, end) => {
+    const slicedComments = data.slice(start, end);
+    setCommentsToShow([...commentsToShow, ...slicedComments]);
+  };
 
   const handleShowMoreComments = () => {
-    setLimit(commentsPerPage + limit);
+    loopWithSlice(next, next + commentsPerPage);
+    setNext(next + commentsPerPage);
   };
 
+  useEffect(() => {
+    loopWithSlice(0, commentsPerPage);
+  }, []);
+
   return (
     <div>
-      <ul className="list">
-        {data.length !== 0 ? (
-          data.slice(0, limit).map((item) => (
-            <li key={item.id}>
-              <Comment
-                isAdmin={isAdmin}
-                userName={item.user_name}
-                commentText={item.comment}
-                date={item.create_at}
-                rateValue={item.rating}
-              />
-            </li>
-          ))
-        ) : (
-          <Comment description="لا يوجد رياض أطفال" />
+      <List
+        split={false}
+        itemLayout="horizontal"
+        dataSource={commentsToShow}
+        renderItem={(item) => (
+          <List.Item>
-          <List.Item>
+          <List.Item key="should be unique string">
-          <List.Item>
+          <List.Item key="should be unique string">
+            <Comment
+              isAdmin={isAdmin}
+              userName={item.user_name}
+              commentText={item.comment}
+              date={item.create_at}
+              rateValue={item.rating}
+            />
+          </List.Item>
         )}
-      </ul>
-
-      {data.length > limit && (
+      />
+      {commentsToShow.length < data.length && (
         <MainButton onClick={handleShowMoreComments}>
           عرض المزيد من التعليقات
         </MainButton>

diff --git a/client/src/Components/CommentContainer/style.css b/client/src/Components/CommentContainer/style.css
diff --git a/client/src/Components/Common/Comment/index.js b/client/src/Components/Common/Comment/index.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import { Row, Col, Typography } from 'antd';
 import PropTypes from 'prop-types';
-import moment from 'moment';
 
 import Rating from '../Rating';
 import MainButton from '../MainButton';
@@ -31,7 +30,7 @@ const Comment = ({
         <Row className="top-container">
           <Rating rateValue={rateValue} />
           <Title level={3} id="comment-date">
-            {moment(date).format('YYYY-MM-DD')}
+            {date}
           </Title>
           {isAdmin && (
             <MainButton

diff --git a/client/src/Components/Common/DropList/style.css b/client/src/Components/Common/DropList/style.css
@@ -9,4 +9,4 @@
 
 .search-case {
   height: 25px;
-}
+}
diff --git a/client/src/Components/Common/NavTap/style.css b/client/src/Components/Common/NavTap/style.css
@@ -87,11 +87,11 @@
   height: 100px !important;
 }
 
-.ant-modal-content {
+.modal .ant-modal-content {
   height: 150px !important;
 }
 
-.ant-modal-body {
+.modal .ant-modal-body {
   display: flex;
   align-items: center;
   justify-content: center;
-Original file line number
+Diff line change
@@ Expand Up / @@ -9,4 +9,4 @@ @@
     .search-case {
       height: 25px;
-    }
+    }