Mechanic ux (#281)

* E2E-UI
* Mechanic UX fixes
* Fix profile pages

.github/workflows/pr-build.yml

@@ -23,6 +23,8 @@ jobs:
       PLATFORMS: "linux/amd64,linux/arm64"
     permissions:
       pull-requests: write # Required to post comments
+      contents: read
+      checks: write
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -177,6 +179,8 @@ jobs:
     runs-on: ubuntu-latest
     permissions:
       pull-requests: write
+      contents: read
+      checks: write
     steps:
       - name: Checkout code
         uses: actions/checkout@v4

deploy/docker/docker-compose.yml

@@ -155,7 +155,9 @@ services:
     image: crapi/crapi-web:${VERSION:-latest}
     ports:
       - "${LISTEN_IP:-127.0.0.1}:8888:80"
+      - "${LISTEN_IP:-127.0.0.1}:30080:80"
       - "${LISTEN_IP:-127.0.0.1}:8443:443"
+      - "${LISTEN_IP:-127.0.0.1}:30443:443"
     environment:
       - COMMUNITY_SERVICE=crapi-community:${COMMUNITY_SERVER_PORT:-8087}
       - IDENTITY_SERVICE=crapi-identity:${IDENTITY_SERVER_PORT:-8080}

postman_collections/crAPI.postman_environment.json

@@ -3,12 +3,12 @@
     "name": "Crapi",
     "values": [{
             "key": "url",
-            "value": "http://127.0.0.1:8888",
+            "value": "http://127.0.0.1:30080",
             "enabled": true
         },
         {
             "key": "url_mail",
-            "value": "http://127.0.0.1:8025",
+            "value": "http://127.0.0.1:30080/mailhog",
             "enabled": true
         }
     ],

services/identity/src/main/java/com/crapi/constant/UserMessage.java

@@ -91,7 +91,7 @@ public class UserMessage {
   public static final String CONVERT_VIDEO_INTERNAL_ERROR = "Error occured while executing.";
   public static final String CONVERT_VIDEO_CLOSE_TO_WIN_THE_GAME = "You are very close.";
   public static final String CONVERT_VIDEO_BASH_COMMAND_TRIGGERED =
-      "Video conversion bash command triggered.";
+      "Video conversion command executed.";
   public static final String SORRY_DIDNT_GET_PROFILE =
       "Sorry, Didn't get any profile video name for the user.";
   public static final String THIS_IS_ADMIN_FUNCTION =

services/identity/src/main/java/com/crapi/service/Impl/ProfileServiceImpl.java

@@ -202,7 +202,7 @@ public CRAPIResponse deleteAdminProfileVideo(Long videoId, HttpServletRequest re
   @Transactional
   @Override
   public CRAPIResponse convertVideo(Long videoId, HttpServletRequest request) {
-    BashCommand bashCommand = new BashCommand();
+    BashCommand conversionShell = new BashCommand();
     ProfileVideo profileVideo;
     String host = request.getHeader(HttpHeaders.HOST);
     String xForwardedHost = request.getHeader("x-forwarded-host");
@@ -237,8 +237,11 @@ public CRAPIResponse convertVideo(Long videoId, HttpServletRequest request) {
               && enable_shell_injection
               && optionalProfileVideo.get().getConversion_params() != null) {
             profileVideo = optionalProfileVideo.get();
-            return new CRAPIResponse(
-                bashCommand.executeBashCommand(profileVideo.getConversion_params()), 200);
+            String conversionCommand =
+                String.format(
+                    "convertVideo -i %s %s",
+                    profileVideo.getVideo_name(), profileVideo.getConversion_params());
+            return new CRAPIResponse(conversionShell.executeBashCommand(conversionCommand), 200);
           }
           return new CRAPIResponse(UserMessage.CONVERT_VIDEO_INTERNAL_ERROR, 500);
         }

services/mailhog/Dockerfile

@@ -1,7 +1,6 @@
 #
 # MailHog Dockerfile
 #
-
 FROM golang:alpine AS builder
 
 # Install MailHog:

services/web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "crapi-web",
   "version": "0.1.0",
-  "proxy": "http://localhost:8888",
+  "proxy": "http://localhost:30080",
   "private": true,
   "dependencies": {
     "@ant-design/cssinjs": "^1.21.1",

services/web/src/actions/mechanicActions.ts

@@ -0,0 +1,33 @@
+import actionTypes from "../constants/actionTypes";
+
+interface ActionPayload {
+  accessToken: string;
+  callback: (res: any, data?: any) => void;
+  [key: string]: any;
+}
+
+export const createCommentAction = ({
+  accessToken,
+  serviceId,
+  comment,
+  callback,
+  ...data
+}: ActionPayload) => {
+  return {
+    type: actionTypes.CREATE_SERVICE_COMMENT,
+    payload: { accessToken, serviceId, comment, ...data, callback },
+  };
+};
+
+export const updateServiceRequestStatusAction = ({
+  accessToken,
+  serviceId,
+  status,
+  callback,
+  ...data
+}: ActionPayload) => {
+  return {
+    type: actionTypes.UPDATE_SERVICE_REQUEST_STATUS,
+    payload: { accessToken, serviceId, status, ...data, callback },
+  };
+};

services/web/src/actions/profileActions.ts

@@ -17,7 +17,7 @@ import actionTypes from "../constants/actionTypes";
 
 interface ActionPayload {
   accessToken: string;
-  callback: () => void;
+  callback: (status: string, data: any) => void;
   [key: string]: any;
 }
 
@@ -69,7 +69,7 @@ export const changeVideoNameAction = ({
 interface ConvertVideoPayload {
   accessToken: string;
   videoId: string;
-  callback: () => void;
+  callback: (res: string, data: any) => void;
 }
 
 export const convertVideoAction = ({
@@ -86,3 +86,18 @@ export const convertVideoAction = ({
     },
   };
 };
+
+export const getVideoAction = ({
+  accessToken,
+  videoId,
+  callback,
+}: ActionPayload) => {
+  return {
+    type: actionTypes.GET_VIDEO,
+    payload: {
+      accessToken,
+      videoId,
+      callback,
+    },
+  };
+};

services/web/src/actions/userActions.ts

@@ -187,6 +187,18 @@ export const getMechanicServicesAction = ({
   };
 };
 
+export const getMechanicServiceAction = ({
+  accessToken,
+  serviceId,
+  callback,
+  ...data
+}: ActionPayload & AccessTokenPayload) => {
+  return {
+    type: actionTypes.GET_MECHANIC_SERVICE,
+    payload: { accessToken, serviceId, callback, ...data },
+  };
+};
+
 export const getVehicleServicesAction = ({
   accessToken,
   VIN,

services/web/src/actions/vehicleActions.ts

@@ -17,7 +17,7 @@ import actionTypes from "../constants/actionTypes";
 
 interface ActionPayload {
   accessToken: string;
-  callback: () => void;
+  callback: (res: string, data: any) => void;
   [key: string]: any;
 }
 
@@ -41,8 +41,8 @@ export const verifyVehicleAction = ({
 };
 
 export const getMechanicsAction = ({
-  callback,
   accessToken,
+  callback,
   ...data
 }: ActionPayload) => {
   return {

services/web/src/components/layout/layout.tsx

@@ -41,6 +41,7 @@ import NewPostContainer from "../../containers/newPost/newPost";
 import PostContainer from "../../containers/post/post";
 import VehicleServiceDashboardContainer from "../../containers/vehicleServiceDashboard/vehicleServiceDashboard";
 import ServiceReportContiner from "../../containers/serviceReport/serviceReport";
+import MechanicServiceRequestContainer from "../../containers/mechanicServiceRequest/mechanicServiceRequest";
 import {
   logOutUserAction,
   validateAccessTokenAction,
@@ -241,6 +242,19 @@ const StyledComp: React.FC<PropsFromRedux> = (props) => {
                 />
               }
             />
+            <Route
+              path="/mechanic-service"
+              element={
+                <AfterLogin
+                  component={MechanicServiceRequestContainer}
+                  isLoggedIn={props.isLoggedIn}
+                  componentRole={roleTypes.ROLE_MECHANIC}
+                  userRole={props.role}
+                  accessToken={props.accessToken}
+                  logOutUser={props.logOutUser}
+                />
+              }
+            />
             <Route
               path="/reset-password"
               element={

services/web/src/components/mechanicDashboard/mechanicDashboard.tsx

@@ -26,13 +26,17 @@ interface Owner {
 
 interface Vehicle {
   owner: Owner;
+  id: string;
+  vin: string;
 }
 
 interface Service {
   id: string;
   problem_details: string;
   created_on: string;
+  updated_on: string;
   vehicle: Vehicle;
+  status: string;
 }
 
 interface MechanicDashboardProps {
@@ -47,10 +51,15 @@ const MechanicDashboard: React.FC<MechanicDashboardProps> = ({ services }) => {
         {services.map((service) => (
           <Col span={8} key={service.id}>
             <Card hoverable className="dashboard-card">
-              <Meta
-                title={service.problem_details}
-                description={service.created_on}
-              />
+              <Meta title={service.id} description={service.created_on} />
+              <p>
+                Problem Details:
+                {service.problem_details}
+              </p>
+              <p>
+                Vehicle VIN:
+                {service.vehicle.vin}
+              </p>
               <p>
                 Owner email-id:
                 {service.vehicle.owner.email}
@@ -59,6 +68,17 @@ const MechanicDashboard: React.FC<MechanicDashboardProps> = ({ services }) => {
                 Owner Phone No.:
                 {service.vehicle.owner.number}
               </p>
+              <p>
+                Status:
+                {service.status}
+              </p>
+              <p>
+                Updated On:
+                {service.updated_on}
+              </p>
+              <p>
+                <a href={`/mechanic-service?id=${service.id}`}>View Service</a>
+              </p>
             </Card>
           </Col>
         ))}