Skip to content

Commit eda104f

Browse files
tzyiantzyian
committed
UI icons and navbar dropdown
1 parent db8d994 commit eda104f

File tree

11 files changed

+75
-46
lines changed

11 files changed

+75
-46
lines changed

‎peerprep/.env.example‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,6 @@ NEXT_PUBLIC_QUESTION_SERVICE=http://backend:9090
33
NEXT_PUBLIC_USER_SERVICE=http://user-service:3001
44
# note NGINX will currently point to itself.
55
NEXT_PUBLIC_NGINX=http://localhost:3000
6-
DEV_ENV=not
6+
ENV=
77
NEXT_PUBLIC_MATCHING_SERVICE=http://matching-service-api:9200
88
NEXT_PUBLIC_STORAGE_BLOB=http://storage-blob-api:9300

‎peerprep/app/layout.tsx‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,26 @@ import type { Metadata } from "next";
22
import "./globals.css";
33
import Navbar from "@/components/navbar/Navbar";
44

5+
import ThemeProvider from "./theme-provider";
6+
57
export const metadata: Metadata = {
68
title: "PeerPrep - One Stop Technical Interview Preparation",
79
description: "Your choice for Technical Interview Preparation",
810
};
911

1012
export default function RootLayout({
11-
children,
12-
}: Readonly<{
13+
children,
14+
}: Readonly<{
1315
children: React.ReactNode;
1416
}>) {
1517
return (
1618
<html lang="en">
17-
<body>
18-
<Navbar />
19-
{children}
20-
</body>
19+
<body>
20+
<ThemeProvider>
21+
<Navbar />
22+
</ThemeProvider>
23+
<ThemeProvider>{children}</ThemeProvider>{" "}
24+
</body>
2125
</html>
2226
);
2327
}

‎peerprep/app/page.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,16 +22,18 @@ export default function Home() {
2222
<p className={"text-center"}>Boring code platforms 😢</p>
2323
</div>
2424
<div className={"m-3 flex w-1/2 justify-center rounded-md text-lg"}>
25-
<div className={"rounded-md border-2 border-black p-5"}>
25+
<div className={"rounded-md bg-gray-1 p-5"}>
2626
<p>Tired of solving interview questions by yourself?</p>
2727
<p> Code with a friend 👥 instead! 😊</p>
2828
<p>PeerPrep is a platform for technical interview preparation</p>
2929

30-
<div className={"m-5 rounded-md border-2 border-black p-5"}>
31-
<p>Features:</p>
30+
<div className={"m-5 rounded-md border-black p-5"}>
31+
<p>
32+
<strong>Features:</strong>
33+
</p>
3234
<ol>
33-
<li>Online coding</li>
34-
<li> A code editor</li>
35+
<li>- Online coding</li>
36+
<li>- A code editor</li>
3537
</ol>
3638
</div>
3739
</div>

‎peerprep/app/theme-provider.tsx‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
"use client";
2+
3+
import { createContext } from "react";
4+
5+
export const ThemeContext = createContext({});
6+
7+
export default function ThemeProvider({
8+
children,
9+
}: {
10+
children: React.ReactNode;
11+
}) {
12+
return <ThemeContext.Provider value="dark">{children}</ThemeContext.Provider>;
13+
}

‎peerprep/components/home/Carousel.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
import React, { useState, useEffect, useRef } from "react";
22
import { AnimatePresence, motion, MotionConfig } from "framer-motion";
3-
import {ChevronLeftIcon, ChevronRightIcon} from "@heroicons/react/24/outline";
4-
5-
3+
import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/24/outline";
64

75
// code adapted from https://buildui.com/courses/framer-motion-recipes/carousel-part-1
86

@@ -47,6 +45,7 @@ const Carousel = ({ images }: { images: ImageProps[] }) => {
4745
});
4846

4947
// TODO: make it infinite scroll to not show white background
48+
// TODO: use bigger pictures
5049

5150
return (
5251
<div className="m-auto flex flex-auto items-center">
@@ -56,15 +55,16 @@ const Carousel = ({ images }: { images: ImageProps[] }) => {
5655
<motion.div
5756
animate={{ x: `-${index * 33}%` }}
5857
className="flex"
59-
style={{ width: `${200 * images.length}%` }}
58+
initial={"center"}
59+
// style={{ width: `${200 * images.length}%` }}
6060
>
6161
{images.map((image, i) => (
6262
<motion.img
6363
key={i}
6464
src={image.url}
6565
alt={image.alt}
66-
width={600}
67-
height={600}
66+
width={800}
67+
height={800}
6868
className="h-auto w-full rounded-md border-2 border-white object-cover"
6969
/>
7070
))}

‎peerprep/components/navbar/ProfileDropdown.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,28 +24,28 @@ export const ProfileDropdown = () => {
2424
</div>
2525
<MenuItems
2626
transition
27-
className="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 transition focus:outline-none data-[closed]:scale-95 data-[closed]:transform data-[closed]:opacity-0 data-[enter]:duration-100 data-[leave]:duration-75 data-[enter]:ease-out data-[leave]:ease-in"
27+
className="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-gray-1 py-1 shadow-lg ring-1 ring-black ring-opacity-5 transition focus:outline-none data-[closed]:scale-95 data-[closed]:transform data-[closed]:opacity-0 data-[enter]:duration-100 data-[leave]:duration-75 data-[enter]:ease-out data-[leave]:ease-in"
2828
>
2929
<MenuItem>
3030
<a
3131
href="#"
32-
className="block px-4 py-2 text-sm text-gray-700 data-[focus]:bg-gray-100"
32+
className="block px-4 py-2 text-sm data-[focus]:bg-gray-2"
3333
>
3434
Your Profile
3535
</a>
3636
</MenuItem>
3737
<MenuItem>
3838
<a
3939
href="#"
40-
className="block px-4 py-2 text-sm text-gray-700 data-[focus]:bg-gray-100"
40+
className="block px-4 py-2 text-sm data-[focus]:bg-gray-2"
4141
>
4242
Settings
4343
</a>
4444
</MenuItem>
4545
<MenuItem>
4646
<a
4747
href="#"
48-
className="block px-4 py-2 text-sm text-gray-700 data-[focus]:bg-gray-100"
48+
className="block px-4 py-2 text-sm data-[focus]:bg-gray-2"
4949
>
5050
Sign out
5151
</a>

‎peerprep/components/shared/PeerprepButton.tsx‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,27 @@ import React from "react";
33
import styles from "@/style/elements.module.css";
44

55
type PeerprepButtonProps = {
6-
onClick: () => void;
6+
onClick?: () => void;
77
children: React.ReactNode;
88
className?: string;
9+
disabled?: boolean;
10+
type?: "button" | "submit" | "reset";
911
};
1012

1113
const PeerprepButton: React.FC<PeerprepButtonProps> = ({
1214
onClick,
1315
children,
1416
className,
17+
disabled,
18+
type,
1519
}) => {
1620
return (
17-
<button onClick={onClick} className={`${styles.button} ${className}`}>
21+
<button
22+
onClick={onClick}
23+
disabled={disabled}
24+
type={type}
25+
className={`${styles.button} ${className}`}
26+
>
1827
{children}
1928
</button>
2029
);

‎peerprep/components/shared/PeerprepDropdown.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@ const PeerprepDropdown = <T extends string | number>({
1717
className,
1818
}: PeerprepDropdownProps<T>): JSX.Element => {
1919
return (
20-
<div className="flex flex-col space-y-1 space-x-2">
21-
<label className="text-base font-medium">{label}</label>
20+
<div className="flex flex-col space-x-2 space-y-1">
21+
<label className="pl-2 text-base font-medium">{label}</label>
2222
<select
2323
value={value}
2424
onChange={onChange}

‎peerprep/components/shared/PeerprepSearchBar.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
// PeerprepSearchBar.tsx
22
import React from "react";
33
import styles from "@/style/elements.module.css";
4+
import { MagnifyingGlassIcon } from "@heroicons/react/16/solid";
45

56
interface PeerprepSearchBarProps {
67
value: string;
@@ -14,7 +15,8 @@ const PeerprepSearchBar: React.FC<PeerprepSearchBarProps> = ({
1415
onChange,
1516
}) => {
1617
return (
17-
<div className="flex flex-col">
18+
<div className="relative">
19+
<MagnifyingGlassIcon className="pointer-events-none absolute left-3 top-1/2 h-5 w-5 -translate-y-1/2 transform text-gray-400" />
1820
<input
1921
type="text"
2022
placeholder={label}

‎peerprep/middleware.ts‎

Lines changed: 15 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -2,29 +2,28 @@ import { cookies } from "next/headers";
22
import { NextResponse } from "next/server";
33
import { NextRequest } from "next/server";
44

5-
function isNoSession(request: NextRequest): boolean {
6-
return (
7-
request.nextUrl.pathname.startsWith("/auth") && cookies().has("session")
8-
);
9-
}
5+
const protectedRoutes = ["/questions/*", "/user/*"];
6+
const publicRoutes = ["/", "/auth/login/", "/auth/register"];
107

11-
function isSession(request: NextRequest): boolean {
12-
return (
13-
!request.nextUrl.pathname.startsWith("/auth") && !cookies().has("session")
14-
);
15-
}
8+
const isValidSession = () => {
9+
return cookies().has("session");
10+
};
1611

1712
export function middleware(request: NextRequest) {
18-
// UNCOMMENT AND ADD TO ENV IF JUST TESTING FRONTEND STUFF
19-
if (process.env.NEXT_BYPASS_LOGIN === "yesplease") {
13+
const path = request.nextUrl.pathname;
14+
const isProtectedRoute = protectedRoutes.includes(path);
15+
const isPublicRoute = publicRoutes.includes(path);
16+
17+
if (isPublicRoute) {
2018
return NextResponse.next();
2119
}
2220

23-
if (isNoSession(request)) {
24-
return NextResponse.redirect(new URL("/questions", request.url));
21+
// UNCOMMENT AND ADD TO ENV IF JUST TESTING FRONTEND STUFF
22+
if (process.env.NEXT_BYPASS_LOGIN === "yesplease") {
23+
return NextResponse.next();
2524
}
2625

27-
if (isSession(request)) {
26+
if (!isValidSession() && isProtectedRoute) {
2827
return NextResponse.redirect(new URL("/auth/login", request.url));
2928
}
3029
}
@@ -39,6 +38,6 @@ export const config = {
3938
* - _next/image (image optimization files)
4039
* - favicon.ico, sitemap.xml, robots.txt (metadata files)
4140
*/
42-
"/((?!api|_next/static|_next/image|favicon.ico|sitemap.xml|robots.txt).*)",
41+
"/((?!api|_next/static|_next/image|favicon.ico|sitemap.xml|robots.txt|.*\\.png$).*)",
4342
],
4443
};

0 commit comments

Comments
 (0)