Merge branch 'main' of https://github.com/MeetDOD/StyleShare into iss…

…ue-576
VaibhavArora314 · Aug 8, 2024 · bf4a817 · bf4a817
2 parents eb045d4 + fbbde94
commit bf4a817
Show file tree

Hide file tree

Showing 16 changed files with 353 additions and 128 deletions.
diff --git a/admin/Dockerfile b/admin/Dockerfile
@@ -0,0 +1,7 @@
+FROM node:alpine
+WORKDIR /app
+COPY package.json package-lock.json ./
+RUN npm install
+COPY . .
+EXPOSE 5173
+CMD ["npm", "run" , "dev"] 
diff --git a/admin/src/pages/ContactMessages.tsx b/admin/src/pages/ContactMessages.tsx
@@ -9,6 +9,7 @@ import '../styles/Model.css'
 import { ColorRing } from 'react-loader-spinner';
 import { MdMessage } from "react-icons/md";
 import { TbReportAnalytics } from "react-icons/tb";
+import toast from "react-hot-toast";
 
 const ContactMessages = () => {
   const [contactMessages, setContactMessages] = useState<IContactMessage[]>([]);
@@ -59,6 +60,21 @@ const ContactMessages = () => {
     }
   };
 
+  const handleDeleteMessage = async (id: string) => {
+      try {
+        await axios.delete(`/api/v1/admin/deletecontactmessage/${id}`, {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        });
+        setContactMessages(contactMessages.filter((msg) => msg.id !== id));
+        toast.success("Contact Message deleted successfully !")
+      } catch (error) {
+        console.error("Error deleting message:", error);
+        toast.error("Error in deleting message")
+      }
+  };
+
   const handleOpenModal = (message: IContactMessage) => {
     setSelectedMessage(message);
     setOpen(true);
@@ -114,7 +130,7 @@ const ContactMessages = () => {
                   <td className="px-8 py-4 font-semibold">{new Date(contactMessage.createdAt).toLocaleDateString()}</td>
                   <td className="px-8 py-4 font-semibold">{contactMessage.subject.slice(0, 10)}</td>
                   <td className="px-12 py-4 font-semibold">{contactMessage.message.slice(0, 10)}</td>
-                  <td className="px-2 py-4 grid grid-cols-1 gap-3 justify-center md:grid-cols-2">
+                  <td className="px-2 py-4 grid grid-cols-1 gap-3 justify-center md:grid-cols-3">
                   <button
                     onClick={() => handleOpenModal(contactMessage)}
                     className="font-semibold rounded-md p-2 bg-sky-500 text-white border-2 hover:bg-sky-600"
@@ -129,6 +145,12 @@ const ContactMessages = () => {
                   >
                     Reply
                   </a>
+                  <button
+                    onClick={() => handleDeleteMessage(contactMessage.id)}
+                    className="font-semibold rounded-md p-2 bg-red-500 text-white border-2 hover:bg-red-600"
+                  >
+                    Delete
+                  </button>
                 </td>
                 </tr>
               ))}

diff --git a/backend/Dockerfile b/backend/Dockerfile
@@ -0,0 +1,10 @@
+FROM node:alpine
+WORKDIR /app
+COPY package.json package-lock.json ./
+RUN npm install
+COPY . .
+RUN npm run backend-build
+
+
+EXPOSE 8000
+CMD ["npm", "run" , "dev"] 
diff --git a/backend/src/routes/admin/controller.ts b/backend/src/routes/admin/controller.ts
@@ -1090,6 +1090,25 @@ export const downloadFavoritesReportController = async (req: Request, res: Respo
   }
 };
 
+export const deleteContactMessage = async (req: Request, res: Response) => {
+  const { id } = req.params;
+
+  try {
+    const deletedMessage = await prisma.contactMessage.delete({
+      where: { id },
+    });
+
+    res.status(200).json({
+      message: "Contact message deleted successfully!",
+      deletedMessage,
+    });
+  } catch (error) {
+    res.status(500).json({
+      error: "An error occurred while deleting the contact message!",
+    });
+  }
+};
+
 export const deleteFeedback = async (req: Request, res: Response) => {
   const { id } = req.params;
 

diff --git a/backend/src/routes/admin/route.ts b/backend/src/routes/admin/route.ts
@@ -1,5 +1,5 @@
 import {Router} from 'express';
-import { getPostReactionsController,getFavoritesController,adminLoginController, adminProfileController, allUserForAdmin, blockUserController, unblockUserController, getAdminPostsController, getAdminTrendingPostsController, getAdminStatsController, getGraphsStatsController, updatePostController, deletePostController, getPostByIdController, getAllContactMessages, deleteCommentController, downloadReportController, getFeedbacks, toggleFeedbackVisibility, downloadCommentsReportController, downloadFavoritesReportController, downloadReactionsReportController, downloadUsersReportController, downloadContactMessagesReportController, downloadPostsReportController, deleteFeedback } from './controller';
+import { getPostReactionsController,getFavoritesController,adminLoginController, adminProfileController, allUserForAdmin, blockUserController, unblockUserController, getAdminPostsController, getAdminTrendingPostsController, getAdminStatsController, getGraphsStatsController, updatePostController, deletePostController, getPostByIdController, getAllContactMessages, deleteCommentController, downloadReportController, getFeedbacks, toggleFeedbackVisibility, downloadCommentsReportController, downloadFavoritesReportController, downloadReactionsReportController, downloadUsersReportController, downloadContactMessagesReportController, downloadPostsReportController, deleteContactMessage, deleteFeedback } from './controller';
 import { isAdmin } from '../../middleware/adminAuth';
 
 const adminRouter = Router();
@@ -54,6 +54,8 @@ adminRouter.get("/downloadusersfavoritesreport", downloadFavoritesReportControll
 
 adminRouter.get("/downloadusersreactionreport", downloadReactionsReportController);
 
+adminRouter.delete("/deletecontactmessage/:id", isAdmin, deleteContactMessage);
+
 adminRouter.delete('/deletefeedback/:id', isAdmin, deleteFeedback);
 
 export default adminRouter;
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -0,0 +1,40 @@
+
+services:
+
+  admin:
+    build: 
+      context: ./admin
+    container_name: styleshare-admin
+    ports:
+      - '5173:5173'
+
+  frontend:
+    build: 
+      context: ./frontend
+    container_name: styleshare-frontend
+    ports:
+      - '3000:3000'
+
+  backend:
+    build: 
+      context: ./backend
+    container_name: styleshare-backend
+    depends_on:
+      - db
+    environment:
+      - DATABASE_URL=${DATABASE_URL}
+
+    ports:
+      - '8000:8000'
+
+  db:
+    image: mongo:latest
+    container_name: styleshare-db
+    restart: always
+    ports:
+      - '27017:27017'
+    volumes:
+      - mongodb_data:/data/db
+
+volumes:
+  mongodb_data:
diff --git a/frontend/Dockerfile b/frontend/Dockerfile
@@ -0,0 +1,7 @@
+FROM node:alpine
+WORKDIR /app
+COPY package.json package-lock.json ./
+RUN npm install
+COPY . .
+EXPOSE 3000
+CMD ["npm", "run" , "dev"] 
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -33,6 +33,7 @@
     "react-fast-marquee": "^1.6.4",
     "react-hot-toast": "^2.4.1",
     "react-icons": "^5.2.1",
+    "react-loading-skeleton": "^3.4.0",
     "react-parallax-tilt": "^1.7.231",
     "react-responsive-modal": "^6.4.2",
     "react-router-dom": "^6.24.0",

diff --git a/frontend/src/components/LeaderboardSkeleton.tsx b/frontend/src/components/LeaderboardSkeleton.tsx
@@ -0,0 +1,59 @@
+import Skeleton from 'react-loading-skeleton';
+import 'react-loading-skeleton/dist/skeleton.css';
+
+const LeaderboardSkeleton = () => {
+  const skeletonArray = Array(5).fill(0); // Adjust the number of skeleton rows as needed
+
+  return (
+    <div className="overflow-x-auto">
+      <table className="min-w-full divide-y divide-gray-200">
+        <thead className="text-center text-sm font-medium text-[#000435]  bg-white dark:text-white dark:bg-[#5f67de] border-b-2 border-sky-600">
+          <tr>
+            <th scope="col" className="px-2 py-3 sm:px-6 text-[#5f67de] bg-white dark:text-white dark:bg-[#000435] uppercase tracking-wider">
+              <Skeleton width={60} height={20} className=" rounded dark:bg-white" />
+            </th>
+            <th scope="col" className="px-2 py-3 sm:px-6 text-[#5f67de] bg-white  dark:text-white dark:bg-[#000435] uppercase tracking-wider">
+              <Skeleton width={80} height={20} className=" rounded dark:bg-white" />
+            </th>
+            <th scope="col" className="px-2 py-3 sm:px-6 mx-12 text-[#5f67de] bg-white dark:text-white dark:bg-[#000435] uppercase tracking-wider">
+              <Skeleton width={120} height={20} className=" rounded dark:bg-white" />
+            </th>
+            <th scope="col" className="px-2 py-3 sm:px-6 text-[#5f67de] bg-white dark:text-white dark:bg-[#000435] uppercase tracking-wider">
+              <Skeleton width={60} height={20} className=" rounded dark:bg-white" />
+            </th>
+            <th scope="col" className="px-2 py-3 sm:px-6 text-[#5f67de] bg-white dark:text-white dark:bg-[#000435] uppercase tracking-wider">
+              <Skeleton width={60} height={20} className=" rounded dark:bg-white" />
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          {skeletonArray.map((_, index) => (
+            <tr key={index} className="text-center text-[#000435] dark:text-gray-50 border-b-2 border-sky-900">
+              <td className="px-2 py-4 sm:px-6">
+                <div className="flex flex-col items-center">
+                  <Skeleton width={40} height={40} circle={true} className=" rounded-full dark:bg-white" />
+                </div>
+              </td>
+              <td className="px-2 py-4 sm:px-6">
+                <div className="flex flex-col items-center">
+                  <Skeleton width={40} height={40} circle={true} className=" rounded-full dark:bg-white" />
+                </div>
+              </td>
+              <td className="px-2 py-4 sm:px-6">
+                <Skeleton width={120} height={20} className=" rounded dark:bg-white" />
+              </td>
+              <td className="px-2 py-4 sm:px-6">
+                <Skeleton width={60} height={20} className=" rounded dark:bg-white" />
+              </td>
+              <td className="px-2 py-4 sm:px-6">
+                <Skeleton width={60} height={20} className=" rounded dark:bg-white" />
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+};
+
+export default LeaderboardSkeleton;