Skip to content

Commit 228de58

Browse files
InfvyrInfvyr
committed
upgrade nextjs and sanity
1 parent d1bf932 commit 228de58

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+18467
-23062
lines changed

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,4 +39,5 @@ next-env.d.ts
3939
# other
4040
.idea
4141
.vscode
42-
.fleet
42+
.fleet
43+
WARP.md

‎app/error.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22

33
export default function Error({ error, reset }) {
44
return (
5-
<div className="h-full w-full flex-center flex-col gap-5">
5+
<main className="h-dvh w-full flex-center flex-col gap-5">
66
<p className="text-3xl text-red-500">Something went wrong! </p>
77
<p className="text-red-500">{error.toString()}</p>
88
<button className="btn" onClick={() => reset()}>
99
Retry
1010
</button>
11-
</div>
11+
</main>
1212
);
1313
}

‎app/layout.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1+
import { AppFooter, AppHeader, AppMetadata } from "components";
2+
import { ThemeContext as ThemeContextProvider } from "context";
13
import { Suspense } from "react";
2-
import { AppHeader, AppFooter, AppMetadata } from "components";
3-
import Loading from "./loading";
44
import "styles/globals.css";
5-
import { ThemeContext } from "context";
5+
import Loading from "./loading";
66

77
export const metadata = { ...AppMetadata };
88

99
export default function RootLayout({ children }) {
1010
return (
11-
<html lang="en">
11+
<html lang="en" suppressHydrationWarning>
1212
<body>
13-
<ThemeContext>
13+
<ThemeContextProvider>
1414
<AppHeader />
1515
<Suspense fallback={<Loading />}>{children}</Suspense>
1616
<AppFooter />
17-
</ThemeContext>
17+
</ThemeContextProvider>
1818
</body>
1919
</html>
2020
);

‎app/page.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
"use client";
22

3-
import { WelcomeSection, AboutSection, TechnologiesSection, ProjectsSection } from "app/sections";
3+
import { AboutSection, ProjectsSection, TechnologiesSection, WelcomeSection } from "app/sections";
44

55
export default function Page() {
66
return (
7-
<div className="container-md">
7+
<main className="container-md">
88
<WelcomeSection />
99
<AboutSection />
1010
<ProjectsSection />
1111
<TechnologiesSection />
12-
</div>
12+
</main>
1313
);
1414
}

‎app/projects/layout.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
"use client";
22

3+
import { HeadingDivider, Loader } from "components";
34
import { Suspense, useState } from "react";
4-
import useSWR from "swr";
55
import { ErrorBoundary } from "react-error-boundary";
6-
import { HeadingDivider, Loader } from "components";
7-
import { Filter } from "./components/Filter";
6+
import useSWR from "swr";
87
import { fetcher } from "utils/fetcher";
98
import Error from "../error";
9+
import { Filter } from "./components/Filter";
1010
import { Projects } from "./components/Projects";
1111

1212
const url = `${process.env.NEXT_PUBLIC_SANITY_URL}${process.env.NEXT_PUBLIC_SANITY_ALL_PROJECTS}`;

‎app/sections/about/TimeLine.jsx‎

Lines changed: 57 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
"use client";
22

3-
import { useEffect, useRef, useState } from "react";
43
import { LazyMotion, domAnimation, useInView } from "framer-motion";
4+
import { useEffect, useRef, useState } from "react";
55

66
const TimeLineData = [
7+
{ year: 2025, text: "Continue as Flutter & Web Front-end developer" },
78
{ year: 2023, text: "Start my journey as a Flutter developer" },
89
{ year: 2022, text: "Start my journey as a React developer" },
910
{ year: 2021, text: "Dive completely into React.js" },
@@ -12,11 +13,9 @@ const TimeLineData = [
1213
];
1314

1415
export function TimeLine() {
15-
/// TODO: Add color mode support
1616
const colorMode = "dark";
1717
const [, setActiveItem] = useState(0);
1818
const carouselRef = useRef(null);
19-
// const animRef = useRef(null);
2019
const isInView = useInView(carouselRef, { once: true });
2120

2221
const scroll = (node, left) => {
@@ -65,65 +64,63 @@ export function TimeLine() {
6564
onScroll={handleScroll}
6665
className="flex flex-row flex-nowrap gap-5 justify-between overflow-x-auto snap-x cursor-pointer hide-scroll-bar"
6766
>
68-
<>
69-
{TimeLineData.map((item, index) => {
70-
return (
71-
<li
72-
id={`carousel__item-${index}`}
73-
key={index}
74-
className="flex flex-col gap-3 snap-start w-[calc((100%/2)-30px)] sm:w-1/3 md:w-1/6"
75-
onClick={(e) => handleClick(e, index)}
76-
style={{
77-
transform: isInView
78-
? "none"
79-
: `${index === 0 ? "translateY(250px)" : `translateY(${200 / index}px)`}`,
80-
opacity: isInView ? 1 : 0,
81-
transition: `all 0.9s cubic-bezier(0.17, 0.55, 0.55, 1) ${
82-
index === 0 ? 0.5 : 1.05 * index
83-
}s`
84-
}}
67+
{TimeLineData.map((item, index) => {
68+
return (
69+
<li
70+
id={`carousel__item-${index}`}
71+
key={index}
72+
className={`flex flex-col gap-3 snap-start md:snap-end flex-shrink-0 w-[calc((100%/2)-30px)] sm:w-1/3 md:w-1/6 ${index === TimeLineData.length - 1 ? "pr-5" : ""}`}
73+
onClick={(e) => handleClick(e, index)}
74+
style={{
75+
transform: isInView
76+
? "none"
77+
: `${index === 0 ? "translateY(250px)" : `translateY(${200 / index}px)`}`,
78+
opacity: isInView ? 1 : 0,
79+
transition: `all 0.9s cubic-bezier(0.17, 0.55, 0.55, 1) ${
80+
index === 0 ? 0.5 : 1.05 * index
81+
}s`
82+
}}
83+
>
84+
<h3
85+
tabIndex="0"
86+
aria-label={"What do I do in " + item.year}
87+
className="flex items-center gap-4 text-2xl font-bold"
8588
>
86-
<h3
87-
tabIndex="0"
88-
aria-label={"What do I do in " + item.year}
89-
className="flex items-center gap-4 text-2xl font-bold"
89+
{`${item.year}`}
90+
<svg
91+
width="208"
92+
height="6"
93+
viewBox="0 0 208 6"
94+
xmlns="http://www.w3.org/2000/svg"
95+
fill={colorMode === "dark" ? "#fff" : "#232323"}
9096
>
91-
{`${item.year}`}
92-
<svg
93-
width="208"
94-
height="6"
95-
viewBox="0 0 208 6"
96-
xmlns="http://www.w3.org/2000/svg"
97-
fill={colorMode === "dark" ? "#fff" : "#232323"}
98-
>
99-
<path
100-
fillRule="evenodd"
101-
clipRule="evenodd"
102-
d="M2.5 5.5C3.88071 5.5 5 4.38071 5 3V3.5L208 3.50002V2.50002L5 2.5V3C5 1.61929 3.88071 0.5 2.5 0.5C1.11929 0.5 0 1.61929 0 3C0 4.38071 1.11929 5.5 2.5 5.5Z"
103-
fillOpacity="0.5"
104-
/>
105-
<defs>
106-
<linearGradient
107-
id="paint0_linear"
108-
x1="-4.30412e-10"
109-
y1="0.5"
110-
x2="208"
111-
y2="0.500295"
112-
gradientUnits="userSpaceOnUse"
113-
>
114-
<stop stopColor="#fff" />
115-
<stop offset="0.79478" stopColor="#fff" stopOpacity="0" />
116-
</linearGradient>
117-
</defs>
118-
</svg>
119-
</h3>
120-
<p className="tracking-wide " tabIndex="0">
121-
{item.text}
122-
</p>
123-
</li>
124-
);
125-
})}
126-
</>
97+
<path
98+
fillRule="evenodd"
99+
clipRule="evenodd"
100+
d="M2.5 5.5C3.88071 5.5 5 4.38071 5 3V3.5L208 3.50002V2.50002L5 2.5V3C5 1.61929 3.88071 0.5 2.5 0.5C1.11929 0.5 0 1.61929 0 3C0 4.38071 1.11929 5.5 2.5 5.5Z"
101+
fillOpacity="0.5"
102+
/>
103+
<defs>
104+
<linearGradient
105+
id="paint0_linear"
106+
x1="-4.30412e-10"
107+
y1="0.5"
108+
x2="208"
109+
y2="0.500295"
110+
gradientUnits="userSpaceOnUse"
111+
>
112+
<stop stopColor="#fff" />
113+
<stop offset="0.79478" stopColor="#fff" stopOpacity="0" />
114+
</linearGradient>
115+
</defs>
116+
</svg>
117+
</h3>
118+
<p className="tracking-wide " tabIndex="0">
119+
{item.text}
120+
</p>
121+
</li>
122+
);
123+
})}
127124
</ul>
128125
</LazyMotion>
129126
);

‎app/sections/about/index.jsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
"use client";
2-
3-
import { useRef } from "react";
4-
import { LazyMotion, domAnimation, useInView } from "framer-motion";
51
import { HeadingDivider } from "components";
2+
import { LazyMotion, domAnimation, useInView } from "framer-motion";
3+
import { useRef } from "react";
64
import { TimeLine } from "./TimeLine";
75

86
export function AboutSection() {

‎app/sections/index.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
export * from "./introduction";
2-
export * from "./about";
3-
export * from "./technologies";
4-
export * from "./project";
5-
export * from "./project/ProjectItem";
1+
export { WelcomeSection } from "./introduction";
2+
export { AboutSection } from "./about";
3+
export { TechnologiesSection } from "./technologies";
4+
export { ProjectsSection } from "./project";
5+
export { ProjectItem } from "./project/ProjectItem";

‎app/sections/introduction/index.jsx‎

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
1-
"use client";
2-
3-
import { useEffect, useState, useRef } from "react";
4-
import Link from "next/link";
51
import { LazyMotion, domAnimation, useInView } from "framer-motion";
6-
import { WelcomeAnimation } from "./IntroAnimation";
72
import { useScrollTo } from "hooks";
3+
import Link from "next/link";
4+
import { useEffect, useRef, useState } from "react";
85
import { useMediaQuery } from "utils";
6+
import { WelcomeAnimation } from "./IntroAnimation";
97

108
export function WelcomeSection() {
119
const ref = useRef(null);
@@ -74,12 +72,12 @@ export function WelcomeSection() {
7472
count === 0
7573
? "0"
7674
: count === 1
77-
? "-100%"
78-
: count === 2
79-
? "-200%"
80-
: count === 3
81-
? "-300%"
82-
: "0",
75+
? "-100%"
76+
: count === 2
77+
? "-200%"
78+
: count === 3
79+
? "-300%"
80+
: "0",
8381
left: "13px"
8482
}}
8583
>

‎app/sections/project/index.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import { Suspense, useRef } from "react";
1+
import { HeadingDivider, Loader } from "components";
22
import { domAnimation, LazyMotion, useInView } from "framer-motion";
33
import Link from "next/link";
4+
import { Suspense, useRef } from "react";
5+
import { ErrorBoundary } from "react-error-boundary";
46
import useSWR from "swr";
5-
import { HeadingDivider, Loader } from "components";
67
import { fetcher } from "utils/fetcher";
8+
import { SITE_ROUTES } from "../../../constants";
79
import Error from "../../error";
8-
import { ErrorBoundary } from "react-error-boundary";
910
import { Projects } from "../../projects/components/Projects";
10-
import { SITE_ROUTES } from "../../../constants";
1111

1212
const url = `${process.env.NEXT_PUBLIC_SANITY_URL}${process.env.NEXT_PUBLIC_SANITY_LATEST_PROJECTS}`;
1313

0 commit comments

Comments
 (0)