Merge pull request #16 from tomvin/create-new-job

Add "Create new job" button in JobPostingsPage
tomvin · Sep 25, 2019 · 58444a0 · 58444a0
2 parents 8856a87 + bd36150
commit 58444a0
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 11 deletions.
diff --git a/src/modules/company/containers/CreateNewJob.tsx b/src/modules/company/containers/CreateNewJob.tsx
@@ -0,0 +1,11 @@
+import React from 'react';
+import pageWrapper from '../../shared/components/PageWrapper/PageWrapper'
+import { EUserType } from '../../../models/UserType'
+
+const CreateNewJob = () => {
+    return <div>
+        <p>Create new job page</p>
+    </div>;
+};
+
+export default pageWrapper(CreateNewJob, { authorisedUserTypes: [EUserType.Company] })
diff --git a/src/modules/company/containers/JobPostingsPage/JobPostingsPage.scss b/src/modules/company/containers/JobPostingsPage/JobPostingsPage.scss
@@ -0,0 +1,21 @@
+.job-postings {
+    text-align: center;
+
+    &__new {
+        padding: 12px 48px;
+        display: inline-block;
+        margin-bottom: var(--spacing-3);
+        border-radius: 16px;
+        color: var(--gray-800);
+        border: 1px solid var(--gray-800);
+
+        &:visited {
+            color: var(--gray-800);
+            text-decoration: none;
+        }
+
+        &:hover {
+            background: var(--purple-300);
+        }
+    }
+}
diff --git a/...es/company/containers/JobPostingsPage.tsx → ...iners/JobPostingsPage/JobPostingsPage.tsx b/...es/company/containers/JobPostingsPage.tsx → ...iners/JobPostingsPage/JobPostingsPage.tsx
@@ -1,16 +1,18 @@
 import React from 'react'
-import pageWrapper from '../../shared/components/PageWrapper/PageWrapper'
-import { EUserType } from '../../../models/UserType'
-import List from '../../shared/components/List/List'
-import { IJob } from '../../../models/Job'
-import { ListItemVM } from '../../shared/components/ListItem/ListItemModels'
+import { Link } from 'react-router-dom'
+import pageWrapper from '../../../shared/components/PageWrapper/PageWrapper'
+import { EUserType } from '../../../../models/UserType'
+import List from '../../../shared/components/List/List'
+import { IJob } from '../../../../models/Job'
+import { ListItemVM } from '../../../shared/components/ListItem/ListItemModels'
 import { useQuery } from '@apollo/react-hooks'
 import gql from 'graphql-tag'
-import Loading from '../../shared/components/Loading/Loading'
-import Error from '../../shared/components/Error/Error'
+import Loading from '../../../shared/components/Loading/Loading'
+import Error from '../../../shared/components/Error/Error'
 import { useSelector } from 'react-redux'
-import { userSelector } from '../../../redux/slices/authenticationSlice'
-import { IUser } from '../../../models/User'
+import { userSelector } from '../../../../redux/slices/authenticationSlice'
+import { IUser } from '../../../../models/User'
+import './JobPostingsPage.scss'
 
 const JobPostingsPage = () => {
   const user: IUser = useSelector(userSelector);
@@ -67,7 +69,8 @@ const JobPostingsPage = () => {
   if (error) return <Error />;
 
   return (
-    <div>
+    <div className="job-postings">
+      <Link className="job-postings__new" to="/company/new">Create new job</Link>
       <List items={buildJobPostings(data.jobs)}></List>
     </div>
   )

diff --git a/src/modules/core/containers/App/App.tsx b/src/modules/core/containers/App/App.tsx
@@ -16,10 +16,11 @@ import Navigation from '../Navigation/Navigation';
 import PotentialJobsPage from '../../../seeker/containers/PotentialJobsPage/PotentialJobsPage';
 import PotentialJobDetailsPage from '../../../seeker/containers/PotentialJobDetailsPage/PotentialJobDetailsPage';
 import Header from '../../components/Header/Header';
-import JobPostingsPage from '../../../company/containers/JobPostingsPage';
+import JobPostingsPage from '../../../company/containers/JobPostingsPage/JobPostingsPage';
 import MatchedJobDetailsPage from '../../../seeker/containers/MatchedJobDetailsPage/MatchedJobDetailsPage';
 import NotFoundPage from '../NotFoundPage/NotFoundPage';
 import JobPostingDetailsPage from '../../../company/containers/JobPostingDetailsPage';
+import CreateNewJob from '../../../company/containers/CreateNewJob';
 
 library.add(far, fas);
 
@@ -69,6 +70,7 @@ const App: React.FC = () => {
               <Route path="/login" component={LoginPage}></Route>
               <Route path="/company/jobs/:jobId" component={JobPostingDetailsPage}></Route>
               <Route path="/company/jobs" component={JobPostingsPage}></Route>
+              <Route path="/company/new" component={CreateNewJob}></Route>
               <Route exact path="/" render={() => {
                 if (user && user.isCompany) {
                   return (<Redirect to="/company/jobs" />)