diff --git a/apps/redi-talent-pool/src/components/organisms/JobListingCard.tsx b/apps/redi-talent-pool/src/components/organisms/JobListingCard.tsx index 58a7248eb..46f983af0 100644 --- a/apps/redi-talent-pool/src/components/organisms/JobListingCard.tsx +++ b/apps/redi-talent-pool/src/components/organisms/JobListingCard.tsx @@ -11,14 +11,16 @@ import './JobListingCard.scss' interface JobListingCardProps { jobListing: Partial - onClick?: () => void + onCardClick?: () => void + onCompanyNameClick?: () => void isFavorite?: boolean toggleFavorite?: (id: string) => void } export function JobListingCard({ jobListing, - onClick, + onCardClick, + onCompanyNameClick, toggleFavorite, isFavorite, }: JobListingCardProps) { @@ -36,6 +38,11 @@ export function JobListingCard({ toggleFavorite && toggleFavorite(jobListing.id) } + const handleCompanyNameClick = (e: React.MouseEvent) => { + e.stopPropagation() + onCompanyNameClick() + } + const imgSrc = companyAvatarImage ? AWS_PROFILE_AVATARS_BUCKET_BASE_URL + companyAvatarImage : null @@ -43,9 +50,9 @@ export function JobListingCard({ return ( {companyName} diff --git a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx index 03772a31e..3d02747f8 100644 --- a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx +++ b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx @@ -120,7 +120,7 @@ export function EditableJobPostings({ startEditing(jobListing.id)} + onCardClick={() => startEditing(jobListing.id)} /> ))} diff --git a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableNamePhotoLocation.tsx b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableNamePhotoLocation.tsx index 0e5bc6575..ac4091a53 100644 --- a/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableNamePhotoLocation.tsx +++ b/apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableNamePhotoLocation.tsx @@ -28,6 +28,28 @@ export function EditableNamePhotoLocation({ profile, disableEditing }: Props) { const isLocationEmpty = EditableNamePhotoLocation.isSectionEmpty(profile) + function getCorrectAvatar(profile, disableEditing): JSX.Element { + if (profile && disableEditing) { + return ( + + ) + } else if (profile && !disableEditing) { + return ( + + ) + } else { + return null + } + } + return ( - {profile ? ( - - ) : null} + { getCorrectAvatar(profile, disableEditing) } {profile?.companyName} diff --git a/apps/redi-talent-pool/src/pages/app/browse/BrowseJobseeker.tsx b/apps/redi-talent-pool/src/pages/app/browse/BrowseJobseeker.tsx index 67f359750..09b5e4b89 100644 --- a/apps/redi-talent-pool/src/pages/app/browse/BrowseJobseeker.tsx +++ b/apps/redi-talent-pool/src/pages/app/browse/BrowseJobseeker.tsx @@ -269,9 +269,12 @@ export function BrowseJobseeker() { + onCardClick={() => history.push(`/app/job-listing/${jobListing.id}`) } + onCompanyNameClick={() => + history.push(`/app/company-profile/${jobListing.tpCompanyProfileId}`) + } toggleFavorite={handleFavoriteJobListing} isFavorite={isFavorite} /> diff --git a/apps/redi-talent-pool/src/pages/app/company-profile/CompanyProfile.tsx b/apps/redi-talent-pool/src/pages/app/company-profile/CompanyProfile.tsx new file mode 100644 index 000000000..d7d1fedfc --- /dev/null +++ b/apps/redi-talent-pool/src/pages/app/company-profile/CompanyProfile.tsx @@ -0,0 +1,55 @@ +import { useHistory, useParams } from "react-router-dom"; +import { Columns } from 'react-bulma-components' +import { useTpCompanyProfileByIdQuery } from "apps/redi-talent-pool/src/react-query/use-tpcompanyprofile-query"; +import { LoggedIn } from "apps/redi-talent-pool/src/components/templates"; +import { EditableNamePhotoLocation } from "apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableNamePhotoLocation"; +import { EditableAbout } from "apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableAbout"; +import { EditableDetails } from "apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableDetails"; +import { EditableContact } from "apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableContact"; +import { EditableJobPostings } from '../../../components/organisms/company-profile-editables/EditableJobPostings' +import { stubFalse } from "lodash"; +import { useTpJobListingAllOfOneUserQuery } from "apps/redi-talent-pool/src/react-query/use-tpjoblisting-all-query"; +import JobListing from "../job-listing/JobListing"; +import { JobListingCard } from '../../../components/organisms/JobListingCard'; + +// const history = useHistory() + +interface CompanyProfileParams { + tpCompanyProfileId: string +} + +export function CompanyProfile() { + const { tpCompanyProfileId } = useParams() + const { data: companyProfile } = useTpCompanyProfileByIdQuery(tpCompanyProfileId) + // const { data: jobListings } = useTpJobListingAllOfOneUserQuery(tpCompanyProfileId) + + return ( + + + + + + + + + + + + + {/* {jobListings?.map((jobListing) => ( + + + history.push(`/app/job-listing/${jobListing.id}`) + } + /> + + ))} */} + + + ) +} + +export default CompanyProfile \ No newline at end of file diff --git a/apps/redi-talent-pool/src/pages/app/job-listing/JobListing.tsx b/apps/redi-talent-pool/src/pages/app/job-listing/JobListing.tsx index a5ad9cdd6..46e5c6300 100644 --- a/apps/redi-talent-pool/src/pages/app/job-listing/JobListing.tsx +++ b/apps/redi-talent-pool/src/pages/app/job-listing/JobListing.tsx @@ -16,12 +16,18 @@ import { EditableContact } from '../../../components/organisms/company-profile-e import { EditableDetails } from '../../../components/organisms/company-profile-editables/EditableDetails' import { LoggedIn } from '../../../components/templates' import { useTpJobListingOneQuery } from '../../../react-query/use-tpjoblisting-one-query' +import { useHistory } from 'react-router-dom' export function JobListing() { const { tpJobListingId }: { tpJobListingId: string } = useParams() const { data: jobListing } = useTpJobListingOneQuery(tpJobListingId) - console.log(jobListing) + const history = useHistory() + + const handleCompanyClick = (e: React.MouseEvent) => { + e.stopPropagation() + history.push(`/app/company-profile/${jobListing.tpCompanyProfileId}`) + } return ( @@ -41,10 +47,11 @@ export function JobListing() { > {jobListing?.title} at {jobListing?.tpCompanyProfile?.companyName} diff --git a/apps/redi-talent-pool/src/react-query/use-tpcompanyprofile-query.ts b/apps/redi-talent-pool/src/react-query/use-tpcompanyprofile-query.ts index 6442d4b04..bd9c7fd72 100644 --- a/apps/redi-talent-pool/src/react-query/use-tpcompanyprofile-query.ts +++ b/apps/redi-talent-pool/src/react-query/use-tpcompanyprofile-query.ts @@ -1,5 +1,5 @@ import { useQuery } from 'react-query' -import { fetchCurrentUserTpCompanyProfile } from '../services/api/api' +import { fetchCurrentUserTpCompanyProfile, fetchTpCompanyProfileById } from '../services/api/api' interface Props { retry: boolean @@ -18,3 +18,9 @@ export function useTpCompanyProfileQuery(props?: Props) { } ) } + +export function useTpCompanyProfileByIdQuery(id: string) { + return useQuery(['oneTpCompanyProfile', id], () => + fetchTpCompanyProfileById(id) + ) +} \ No newline at end of file diff --git a/apps/redi-talent-pool/src/react-query/use-tpjoblisting-all-query.ts b/apps/redi-talent-pool/src/react-query/use-tpjoblisting-all-query.ts index 752b19965..595bea34c 100644 --- a/apps/redi-talent-pool/src/react-query/use-tpjoblisting-all-query.ts +++ b/apps/redi-talent-pool/src/react-query/use-tpjoblisting-all-query.ts @@ -1,6 +1,7 @@ import { useQuery } from 'react-query' import { fetchAllTpJobListings, + fetchAllTpJobListingsOfOneUser, fetchAllTpJobListingsUsingFilters, TpJobListingFilters, } from '../services/api/api' @@ -12,6 +13,14 @@ export function useTpJobListingAllQuery() { }) } +export function useTpJobListingAllOfOneUserQuery(id: string) { + return useQuery(['allTpJobListingsOfOneUser', id], () => + fetchAllTpJobListingsOfOneUser(id), + { + refetchOnWindowFocus: false, + }) +} + export function useBrowseTpJobListingsQuery(filters: TpJobListingFilters) { return useQuery(['browseTpJobListings', filters], () => fetchAllTpJobListingsUsingFilters(filters) diff --git a/apps/redi-talent-pool/src/routes/routes__logged-in.tsx b/apps/redi-talent-pool/src/routes/routes__logged-in.tsx index 9fc2e7656..ee8b47df5 100644 --- a/apps/redi-talent-pool/src/routes/routes__logged-in.tsx +++ b/apps/redi-talent-pool/src/routes/routes__logged-in.tsx @@ -35,7 +35,13 @@ const JobListing = lazy( const JobseekerProfile = lazy( () => import( - /* webpackChunkName: "Browse", webpackPreload: true */ '../pages/app/jobseeker-profile/JobseekerProfile' + /* webpackChunkName: "JobseekerProfile", webpackPreload: true */ '../pages/app/jobseeker-profile/JobseekerProfile' + ) +) +const CompanyProfile = lazy( + () => + import( + /* webpackChunkName: "CompanyProfile", webpackPreload: true */ '../pages/app/company-profile/CompanyProfile' ) ) @@ -69,6 +75,11 @@ const routes: RouteDefinition[] = [ component: JobseekerProfile, exact: true, }, + { + path: '/app/company-profile/:tpCompanyProfileId', + component: CompanyProfile, + exact: true, + }, ] const routesRequiringLoggedIn = routes.map((route) => diff --git a/apps/redi-talent-pool/src/services/api/api.tsx b/apps/redi-talent-pool/src/services/api/api.tsx index d5f32cc5c..d35c1cb17 100644 --- a/apps/redi-talent-pool/src/services/api/api.tsx +++ b/apps/redi-talent-pool/src/services/api/api.tsx @@ -349,6 +349,11 @@ export async function fetchAllTpJobListings(): Promise> { return resp.data.filter((listing) => !listing.dummy) } +export async function fetchAllTpJobListingsOfOneUser( id: string): Promise> { + const resp = await http(`${API_URL}/redUsers/${id}/tpJobListings`) + return resp.data +} + export async function fetchOneTpJobListingOfCurrentUser( id: string ): Promise { @@ -430,3 +435,10 @@ export async function fetchTpJobseekerProfileById( const resp = await http(`${API_URL}/tpJobseekerProfiles/${id}`) return resp.data } + +export async function fetchTpCompanyProfileById( + id: string +): Promise> { + const resp = await http(`${API_URL}/tpCompanyProfiles/${id}`) + return resp.data +}