msb-public
/
tech-interview-handbook
mirror of https://github.com/yangshun/tech-interview-handbook
2
1
Code Issues Projects Releases Wiki Activity

[offers][feat] add header for pages (#526)

Browse Source 
* [offers][feat] add header for pages

* [offers][fix] fix pronoun for toast

* [offers][feat] fix index page description
pull/527/head
Zhang Ziqing 2 years ago committed by GitHub
parent a79e132161
commit d1956ca12a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 509 additions and 442 deletions
Show Stats Download Patch File Download Diff File

2
apps/portal/src/components/offers/OffersNavigation.tsx
Unescape View File

@ -8,7 +8,7 @@ const navigation: ProductNavigationItems = [
const navigationAuthenticated: ProductNavigationItems = [ const navigationAuthenticated: ProductNavigationItems = [
{ href: '/offers/submit', name: 'Analyze your offers' }, { href: '/offers/submit', name: 'Analyze your offers' },
{ href: '/offers/dashboard', name: 'Your dashboard' }, { href: '/offers/dashboard', name: 'My dashboard' },
{ href: '/offers/features', name: 'Features' }, { href: '/offers/features', name: 'Features' },
{ href: '/offers/about', name: 'About' }, { href: '/offers/about', name: 'About' },
]; ];

2
apps/portal/src/pages/index.tsx
Unescape View File

@ -12,7 +12,7 @@ const features = [
}, },
{ {
description: description:
'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores impedit perferendis suscipit eaque, iste dolor cupiditate blanditiis ratione.', 'Reveal stories behind offers. Help job seekers benchmark and analyse their anonymous offers with more context. Encourage discussions around offer profiles.',
href: '/offers', href: '/offers',
img: '/logos/offers-logo.svg', img: '/logos/offers-logo.svg',
name: 'Tech Offers', name: 'Tech Offers',

11
apps/portal/src/pages/offers/about.tsx
Unescape View File

@ -1,3 +1,5 @@
import Head from 'next/head';
import Container from '~/components/shared/Container'; import Container from '~/components/shared/Container';
const people = [ const people = [
@ -29,6 +31,10 @@ const people = [
export default function AboutPage() { export default function AboutPage() {
return ( return (
<>
<Head>
<title>About us - Tech Offers Repo</title>
</Head>
<div className="lg:py-18 bg-white py-12"> <div className="lg:py-18 bg-white py-12">
<Container variant="xs"> <Container variant="xs">
<div className="space-y-12"> <div className="space-y-12">
@ -40,8 +46,8 @@ export default function AboutPage() {
Tech Offers Repo, a project under the series of Tech Interview Tech Offers Repo, a project under the series of Tech Interview
Handbook (TIH), reveals the stories behind offers by focusing on Handbook (TIH), reveals the stories behind offers by focusing on
the profiles of the offer receivers. It helps job seekers the profiles of the offer receivers. It helps job seekers
benchmark and analyse their anonymous offers with more context and benchmark and analyse their anonymous offers with more context
encourages discussions around offer profiles. and encourages discussions around offer profiles.
</p> </p>
</div> </div>
{/* Feedback */} {/* Feedback */}
@ -99,5 +105,6 @@ export default function AboutPage() {
</div> </div>
</Container> </Container>
</div> </div>
</>
); );
} }

17
apps/portal/src/pages/offers/dashboard.tsx
Unescape View File

@ -1,3 +1,4 @@
import Head from 'next/head';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { signIn, useSession } from 'next-auth/react'; import { signIn, useSession } from 'next-auth/react';
import { useState } from 'react'; import { useState } from 'react';
@ -45,6 +46,10 @@ export default function ProfilesDashboard() {
if (userProfiles.length === 0) { if (userProfiles.length === 0) {
return ( return (
<>
<Head>
<title>My Dashboard - Tech Offers Repo</title>
</Head>
<div className="flex w-full"> <div className="flex w-full">
<div className="w-full justify-center space-y-8 py-16 text-xl"> <div className="w-full justify-center space-y-8 py-16 text-xl">
<div className="flex w-full flex-row justify-center"> <div className="flex w-full flex-row justify-center">
@ -60,10 +65,15 @@ export default function ProfilesDashboard() {
</div> </div>
</div> </div>
</div> </div>
</>
); );
} }
return ( return (
<>
<Head>
<title>My Dashboard - Tech Offers Repo</title>
</Head>
<Container variant="xs"> <Container variant="xs">
{userProfilesQuery.isLoading && ( {userProfilesQuery.isLoading && (
<div className="flex h-screen"> <div className="flex h-screen">
@ -75,11 +85,11 @@ export default function ProfilesDashboard() {
{!userProfilesQuery.isLoading && ( {!userProfilesQuery.isLoading && (
<div className="overflow-y-auto py-8"> <div className="overflow-y-auto py-8">
<h1 className="mx-auto mb-4 text-start text-4xl font-bold text-slate-900"> <h1 className="mx-auto mb-4 text-start text-4xl font-bold text-slate-900">
Your dashboard My dashboard
</h1> </h1>
<p className="mt-4 text-xl leading-8 text-slate-500"> <p className="mt-4 text-xl leading-8 text-slate-500">
Save your offer profiles to your dashboard to easily access and edit Save your offer profiles to your dashboard to easily access and
them later. edit them later.
</p> </p>
<div className="mt-8 flex justify-center"> <div className="mt-8 flex justify-center">
<ul className="w-full space-y-4" role="list"> <ul className="w-full space-y-4" role="list">
@ -93,5 +103,6 @@ export default function ProfilesDashboard() {
</div> </div>
)} )}
</Container> </Container>
</>
); );
} }

13
apps/portal/src/pages/offers/features.tsx
Unescape View File

@ -1,3 +1,4 @@
import Head from 'next/head';
import type { SVGProps } from 'react'; import type { SVGProps } from 'react';
import { import {
BookmarkSquareIcon, BookmarkSquareIcon,
@ -82,6 +83,10 @@ const footerNavigation = {
export default function LandingPage() { export default function LandingPage() {
return ( return (
<>
<Head>
<title>Features - Tech Offers Repo</title>
</Head>
<div className="mx-auto w-full overflow-y-auto bg-white"> <div className="mx-auto w-full overflow-y-auto bg-white">
<main> <main>
{/* Hero section */} {/* Hero section */}
@ -99,7 +104,8 @@ export default function LandingPage() {
</span> </span>
</h1> </h1>
<p className="mx-auto mt-6 max-w-lg text-center text-xl sm:max-w-3xl"> <p className="mx-auto mt-6 max-w-lg text-center text-xl sm:max-w-3xl">
Analyze your offers using profiles from fellow software engineers. Analyze your offers using profiles from fellow software
engineers.
</p> </p>
<div className="mx-auto mt-10 max-w-sm sm:flex sm:max-w-none sm:justify-center"> <div className="mx-auto mt-10 max-w-sm sm:flex sm:max-w-none sm:justify-center">
<div className="space-y-4 sm:mx-auto sm:inline-grid sm:grid-cols-1 sm:gap-5 sm:space-y-0"> <div className="space-y-4 sm:mx-auto sm:inline-grid sm:grid-cols-1 sm:gap-5 sm:space-y-0">
@ -181,8 +187,8 @@ export default function LandingPage() {
Your privacy is our priority. Your privacy is our priority.
</h2> </h2>
<p className="text-primary-100 mt-4 flex flex-row justify-center text-lg"> <p className="text-primary-100 mt-4 flex flex-row justify-center text-lg">
All offer profiles are anonymized and we do not store information All offer profiles are anonymized and we do not store
about your personal identity. information about your personal identity.
</p> </p>
<div className="mt-12 grid grid-cols-1 gap-x-6 gap-y-12 sm:grid-cols-2 lg:mt-16 lg:grid-cols-3 lg:gap-x-8 lg:gap-y-16"> <div className="mt-12 grid grid-cols-1 gap-x-6 gap-y-12 sm:grid-cols-2 lg:mt-16 lg:grid-cols-3 lg:gap-x-8 lg:gap-y-16">
{features.map((feature) => ( {features.map((feature) => (
@ -253,5 +259,6 @@ export default function LandingPage() {
</div> </div>
</footer> </footer>
</div> </div>
</>
); );
} }

6
apps/portal/src/pages/offers/index.tsx
Unescape View File

@ -1,3 +1,4 @@
import Head from 'next/head';
import Link from 'next/link'; import Link from 'next/link';
import { useState } from 'react'; import { useState } from 'react';
import { MapPinIcon } from '@heroicons/react/24/outline'; import { MapPinIcon } from '@heroicons/react/24/outline';
@ -27,6 +28,10 @@ export default function OffersHomePage() {
useSearchParamSingle<JobTitleType | null>('jobTitleId'); useSearchParamSingle<JobTitleType | null>('jobTitleId');
return ( return (
<>
<Head>
<title>Home - Tech Offers Repo</title>
</Head>
<main className="flex-1 overflow-y-auto"> <main className="flex-1 overflow-y-auto">
<Banner size="sm"> <Banner size="sm">
⭐ Check if your offer is competitive by submitting it{' '} ⭐ Check if your offer is competitive by submitting it{' '}
@ -140,5 +145,6 @@ export default function OffersHomePage() {
/> />
</Container> </Container>
</main> </main>
</>
); );
} }

8
apps/portal/src/pages/offers/profile/[offerProfileId].tsx
Unescape View File

@ -1,4 +1,5 @@
import Error from 'next/error'; import Error from 'next/error';
import Head from 'next/head';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useSession } from 'next-auth/react'; import { useSession } from 'next-auth/react';
import { useState } from 'react'; import { useState } from 'react';
@ -201,6 +202,12 @@ export default function OfferProfile() {
</div> </div>
</div> </div>
) : ( ) : (
<>
<Head>
<title>
{background?.profileName ? background.profileName : 'View profile'}
</title>
</Head>
<div className="w-full divide-x lg:flex"> <div className="w-full divide-x lg:flex">
<div className="divide-y lg:w-2/3"> <div className="divide-y lg:w-2/3">
<div className="h-fit"> <div className="h-fit">
@ -238,5 +245,6 @@ export default function OfferProfile() {
/> />
</div> </div>
</div> </div>
</>
); );
} }

4
apps/portal/src/pages/offers/profile/edit/[offerProfileId].tsx
Unescape View File

@ -1,4 +1,5 @@
import Error from 'next/error'; import Error from 'next/error';
import Head from 'next/head';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useState } from 'react'; import { useState } from 'react';
import { JobType } from '@prisma/client'; import { JobType } from '@prisma/client';
@ -88,6 +89,9 @@ export default function OffersEditPage() {
return ( return (
<> <>
<Head>
<title>Edit profile</title>
</Head>
{getProfileResult.isError && ( {getProfileResult.isError && (
<div className="flex w-full justify-center"> <div className="flex w-full justify-center">
<Error statusCode={404} title="Requested profile does not exist" /> <Error statusCode={404} title="Requested profile does not exist" />

11
apps/portal/src/pages/offers/submit.tsx
Unescape View File

@ -1,5 +1,14 @@
import Head from 'next/head';
import OffersSubmissionForm from '~/components/offers/offersSubmission/OffersSubmissionForm'; import OffersSubmissionForm from '~/components/offers/offersSubmission/OffersSubmissionForm';
export default function OffersSubmissionPage() { export default function OffersSubmissionPage() {
return <OffersSubmissionForm />; return (
<>
<Head>
<title>Analyze your offers</title>
</Head>
<OffersSubmissionForm />
</>
);
} }

11
apps/portal/src/pages/offers/submit/index.tsx
Unescape View File

@ -1,5 +1,14 @@
import Head from 'next/head';
import OffersSubmissionForm from '~/components/offers/offersSubmission/OffersSubmissionForm'; import OffersSubmissionForm from '~/components/offers/offersSubmission/OffersSubmissionForm';
export default function OffersSubmissionPage() { export default function OffersSubmissionPage() {
return <OffersSubmissionForm />; return (
<>
<Head>
<title>Analyze your offers</title>
</Head>
<OffersSubmissionForm />
</>
);
} }

6
apps/portal/src/pages/offers/submit/result/[offerProfileId].tsx
Unescape View File

@ -1,4 +1,5 @@
import Error from 'next/error'; import Error from 'next/error';
import Head from 'next/head';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useSession } from 'next-auth/react'; import { useSession } from 'next-auth/react';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useRef, useState } from 'react';
@ -92,6 +93,10 @@ export default function OffersSubmissionResult() {
title="You do not have permissions to access this page" title="You do not have permissions to access this page"
/> />
) : ( ) : (
<>
<Head>
<title>View the result</title>
</Head>
<div ref={pageRef} className="w-full"> <div ref={pageRef} className="w-full">
<div className="flex justify-center"> <div className="flex justify-center">
<div className="block w-full max-w-screen-md overflow-hidden rounded-lg sm:shadow-lg md:my-10"> <div className="block w-full max-w-screen-md overflow-hidden rounded-lg sm:shadow-lg md:my-10">
@ -139,5 +144,6 @@ export default function OffersSubmissionResult() {
</div> </div>
</div> </div>
</div> </div>
</>
); );
} }
Write Preview
Loading…
Cancel
Save