57 lines
1.5 KiB
TypeScript
57 lines
1.5 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
import React from "react";
|
||
|
|
import Hero from "./Hero";
|
||
|
|
import AboutSection from "./AboutSection";
|
||
|
|
import { gsap } from "gsap";
|
||
|
|
import MyWorkSection from "./MyWorkSection";
|
||
|
|
import MySkillsSection from "./MySkillsSection";
|
||
|
|
import homepageTimeline from "../(utils)/homepage-timeline";
|
||
|
|
import { SiteContext } from "../../layouts/general_layout/GeneralLayout";
|
||
|
|
import ContactMeSection from "./ContactMeSection";
|
||
|
|
|
||
|
|
export type Project = {
|
||
|
|
id: number;
|
||
|
|
title: string;
|
||
|
|
description: string;
|
||
|
|
image?: string | null;
|
||
|
|
url?: string | null;
|
||
|
|
full_description?: string;
|
||
|
|
};
|
||
|
|
|
||
|
|
type ChildProps = {
|
||
|
|
projects: Project[];
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function HomepageComponent({ projects }: ChildProps) {
|
||
|
|
const layoutContext: any = React.useContext(SiteContext);
|
||
|
|
|
||
|
|
if (layoutContext) layoutContext.projects = projects;
|
||
|
|
|
||
|
|
const comp = React.useRef<HTMLDivElement>(null);
|
||
|
|
|
||
|
|
React.useLayoutEffect(() => {
|
||
|
|
let ctx = gsap.context(() => {
|
||
|
|
homepageTimeline({ componentRef: comp });
|
||
|
|
}, comp);
|
||
|
|
|
||
|
|
return () => ctx.revert();
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<React.Fragment>
|
||
|
|
<div
|
||
|
|
id="homepage-content-wrapper"
|
||
|
|
ref={comp}
|
||
|
|
className="z-0 xl:z-50 mb-32"
|
||
|
|
>
|
||
|
|
<Hero />
|
||
|
|
<AboutSection />
|
||
|
|
<MySkillsSection />
|
||
|
|
<MyWorkSection />
|
||
|
|
<ContactMeSection />
|
||
|
|
</div>
|
||
|
|
</React.Fragment>
|
||
|
|
);
|
||
|
|
}
|