Skip to content

job api integrated #442

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Aleesha-azhar wants to merge 16 commits into
base: master
Choose a base branch
from
Open

job api integrated #442

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
d7f58f5
job api integrated
Aleesha-azhar Aug 17, 2023
5037773
pre-commit issue fixed
Aleesha-azhar Aug 17, 2023
030924a
changes done
Aleesha-azhar Aug 21, 2023
1fc4392
changes done
Aleesha-azhar Aug 21, 2023
bea4350
Update [jobDetail].tsx
Aleesha-azhar Aug 24, 2023
04e93a2
Update [jobDetail].tsx
Aleesha-azhar Aug 24, 2023
94b01fd
code updated
Aleesha-azhar Aug 25, 2023
2546ff4
Merge branch 'job_page' of https://github.com/Aleesha-azhar/prixite.g…
Aleesha-azhar Aug 25, 2023
cb80f3c
updated
Aleesha-azhar Aug 25, 2023
ce19d74
filter is added
Aleesha-azhar Aug 29, 2023
8ca181c
feedback done
Aleesha-azhar Aug 31, 2023
a60cadc
UI updated
Aleesha-azhar Aug 31, 2023
52a3f8b
checks are applied
Aleesha-azhar Sep 1, 2023
281b8e0
vacancy is hide
Aleesha-azhar Sep 4, 2023
c87347c
fix ui issue
Aleesha-azhar Sep 6, 2023
f41a9ae
check is added for vacancy
Aleesha-azhar Sep 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions components/Smart/ApplyNowBtn/ApplyNowBtn.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
.apply-btn {
font-family: 'lato';
color: white !important;
font-size: 14px;
height: 48px;
}

@media only screen and (max-width: 550px) {
.apply-btn {
height: 40px;
}
}
28 changes: 28 additions & 0 deletions components/Smart/ApplyNowBtn/ApplyNowBtn.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import React from 'react'
import { Box, Button } from '@mui/material'
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
import Link from 'next/link'

interface ApplyNowBtnInterface {
text?: string
url?: string
}

const ApplyNowBtn: React.FC<ApplyNowBtnInterface> = ({ text, url }) => {
return (
<Box>
<Button
fullWidth
variant="contained"
endIcon={<SendOutlinedIcon />}
className="apply-btn"
>
<Link className="btn-text-color" href={url} target="_blank">
{text}
</Link>
</Button>
</Box>
)
}

export default ApplyNowBtn
21 changes: 21 additions & 0 deletions data/data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,10 @@ export const pages = [
path: '/team',
text: 'Meet the team',
},
{
path: '/jobs',
text: 'Jobs',
},
]
if (FEATURES.blogs) {
pages.push({
Expand Down Expand Up @@ -267,6 +271,10 @@ export const footerData = {
text: 'Services',
path: '/services',
},
{
path: '/jobs',
text: 'Jobs',
},
{
text: 'News & Blogs',
path: '/blogs',
Expand Down Expand Up @@ -309,3 +317,16 @@ export const productsList = {
heading:
'Our aim is to build secure and reliable products and fulfill our clients requirements.',
}

/********** Home Page Jobs Data ********* */
export const jobsData = {
jobsPageTitle: 'Jobs',
jobsPageHeader: 'Careers at Prixite 🚀',
jobPageHeader: 'Full time - Remote',
jobsHeading: 'Our Jobs',
aboutRole: 'About the Role',
description: 'Description',
jobDataNotFound: 'No Jobs available currently',
positionClose: 'This position is closed.',
pageNotFound: '404 | This Page could not be found',
}
267 changes: 267 additions & 0 deletions pages/jobs/[jobDetail].tsx
View file
Open in desktop
Copy link
Contributor

@umairjameelprixite umairjameelprixite Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Constants should be coming from any constants utils file.

Original file line number Diff line number Diff line change
@@ -0,0 +1,267 @@
import React from 'react'
import { Container, Box, Typography, Button } from '@mui/material'
import Head from 'next/head'
import { jobsData } from '../../data/data'
import { JobProps, ResultProps, ResProps, Jobs } from '../../types/interfaces'
import Image from 'next/image'
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
import Link from 'next/link'

export const getStaticPaths = async () => {
const url = `${process.env.NEXT_PUBLIC_ERP_BASEPATH}/api/resource/Job%20Opening?fields=[%22*%22]`
const res = await fetch(url)
const result: ResProps = await res.json()

const paths = result.data.map((job: Jobs) => {
return {
params: {
jobDetail: job.name,
},
}
})
return {
paths,
fallback: true,
}
}

export const getStaticProps = async (context: JobProps) => {
const name = context.params?.jobDetail
const url = `${process.env.NEXT_PUBLIC_ERP_BASEPATH}/api/resource/Job%20Opening?fields=["*"]&filters=[["Job%20Opening","name","=","${name}"]]`
const res = await fetch(url)
const result = await res.json()

return {
props: {
result,
},
}
}

const JobDetail = ({ result }: ResultProps) => {
const job_url = `${process.env.NEXT_PUBLIC_ERP_BASEPATH}/job_application/new?job_title=${result?.data[0]?.name}`
const { description, jobPageHeader, aboutRole, positionClose, pageNotFound } =
jobsData
return (
<>
<Head>
<title>{result?.data[0]?.job_title}</title>
<meta name="prixite" content="Prixte" />
<link rel="icon" href="/favicon.ico" />
</Head>
{result?.data[0] ? (
<Container maxWidth="xl" className="page-header">
<Box className="header">
<Box className="heading">
<Typography className="heading-text">
{result?.data[0]?.job_title} 🚀
</Typography>
</Box>
<Box>
{result?.data[0]?.publish === 0 ? (
<></>
) : (
<>
{result?.data[0]?.status === 'Open' ? (
<Button
fullWidth
variant="contained"
endIcon={<SendOutlinedIcon />}
className="apply-btn"
>
<Link
className="btn-text-color"
href={job_url}
target="_blank"
>
{'Apply Now'}
</Link>
</Button>
) : (
<></>
)}
</>
)}
</Box>
</Box>

{result?.data[0]?.publish === 1 ? (
<Box className="page-content">
<Container disableGutters maxWidth="xl">
<div className="post-body">
<Container className="circle-container" maxWidth="xl">
<Box className="circle-image">
<Image
width={80}
height={80}
src={'/images/jobs/circle.png'}
alt="circle-image"
/>
</Box>
<Box className="circle-card">
<Typography className=" job-title">
{aboutRole.slice(0, 0)}
<span style={{ color: 'var(--primary-green)' }}>
{aboutRole.slice(0, 9)}
</span>
{aboutRole.slice(9, 15)}
</Typography>
</Box>
</Container>

<Box className="job-container">
<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/company.png'}
alt="company-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">
Company
</Typography>
<Typography className="job-text">
{result?.data[0]?.company}
</Typography>
</Box>
</Box>

<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/status.png'}
alt="status-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">Status</Typography>
{result?.data[0]?.status === 'Open' ? (
<Typography className="job-text">
{result?.data[0]?.status}
</Typography>
) : (
<Typography className="job-text text">
{result?.data[0]?.status}
</Typography>
)}
</Box>
</Box>

<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/currency.png'}
alt="currency-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">
Currency
</Typography>
<Typography className="job-text">
{result?.data[0]?.currency}
</Typography>
</Box>
</Box>
</Box>

<Box className="job-container1">
<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/designation.png'}
alt="designation-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">
Designation
</Typography>
<Typography className="job-text">
{result?.data[0]?.designation}
</Typography>
</Box>
</Box>

{result?.data[0]?.vacancies === 0 ? (
<></>
) : (
<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/vacancy.png'}
alt="vacancy-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">
Vacancy
</Typography>
<Typography className="job-text">
{result?.data[0]?.vacancies}
</Typography>
</Box>
</Box>
)}
{result?.data[0]?.publish_salary_range === 1 ? (
<Box className="job-role-container">
<Box className="job-image-container">
<Image
width={48}
height={48}
src={'/images/jobs/salary range.png'}
alt="salary-image"
/>
</Box>
<Box className="job-info">
<Typography className="content-text">
Salary Range
</Typography>
<Typography className="job-text">
Range {result?.data[0]?.lower_range}-
{result?.data[0]?.upper_range}
</Typography>
</Box>
</Box>
) : (
<></>
)}
</Box>

<Box className="job-role-info">
<Typography className="job-title">
{jobPageHeader.slice(0, 0)}
{description}
</Typography>
<div
dangerouslySetInnerHTML={{
__html: result?.data[0]?.description,
}}
/>
</Box>
</div>
</Container>
</Box>
) : (
<h1 className="job-data-not-found"> {positionClose} </h1>
)}
</Container>
) : (
<h1 className="not-found-page"> {pageNotFound} </h1>
)}
</>
)
}

export default JobDetail
Loading