add ComingSoonPage component and integrate it into EmployeeProfile for placeholder content

This commit is contained in:
Vaibhav Surve 2025-04-09 12:03:16 +05:30
parent 0e7088b4d4
commit 1019e9a32f
2 changed files with 37 additions and 30 deletions

View File

@ -0,0 +1,24 @@
import React from 'react'
import { Link } from 'react-router-dom'
export const ComingSoonPage = () => {
return (
<>
<div className="misc-wrapper">
<h2 className="mb-2 mx-2">Coming Soon!</h2>
<p className="mb-4 mx-2">We're currently working on this feature and will have it ready shortly.
Thank you for your patience!</p>
<div className="mt-4">
<img
src="../assets/img/illustrations/girl-doing-yoga-light.png"
alt="girl-doing-yoga-light"
aria-label="Girl doing yoga light"
width="500"
className="img-fluid"
data-app-dark-img="illustrations/girl-doing-yoga-dark.png"
data-app-light-img="illustrations/girl-doing-yoga-light.png" />
</div>
</div>
</>
)
}

View File

@ -8,7 +8,7 @@ import { getCachedData } from "../../slices/apiDataManager";
import { useEmployeeProfile, useEmployees, useEmployeesByProject } from "../../hooks/useEmployees";
import { useSelector } from "react-redux";
import EmployeeRepository from "../../repositories/EmployeeRepository";
import { ComingSoonPage } from "../Misc/ComingSoonPage";
const EmployeeProfile = () => {
@ -56,49 +56,32 @@ const EmployeeProfile = () => {
switch (activePill) {
case "account": {
return (
<div className="row">
{/* <div className="col-xl-4 col-lg-5 col-md-5"> */}
<p>Account</p>
{/* </div> */}
</div>
<>
<ComingSoonPage/>
</>
);
}
case "attendance": {
return (
<div className="row">
<div className="col-lg-12 col-xl-12">
{/* Teams */}
<p>attendance component</p>
{/* Teams */}
</div>
</div>
<>
<ComingSoonPage/>
</>
);
break;
}
case "activities": {
return (
<p>activites components</p>
<>
<ComingSoonPage/>
</>
);
break;
}
default:
return <div className="misc-wrapper">
<h2 className="mb-2 mx-2">Coming Soon!</h2>
<p className="mb-4 mx-2">We're currently working on this feature and will have it ready shortly.
Thank you for your patience!</p>
<div className="mt-4">
<img
src="../assets/img/illustrations/girl-doing-yoga-light.png"
alt="girl-doing-yoga-light"
aria-label="Girl doing yoga light"
width="500"
className="img-fluid"
data-app-dark-img="illustrations/girl-doing-yoga-dark.png"
data-app-light-img="illustrations/girl-doing-yoga-light.png" />
</div>
</div>;
return <>
<ComingSoonPage/>
</>;
}
};