Merge pull request #230 from w3bdesign/dev

Typescript
w3bdesign · Feb 7, 2022 · 745f6f2 · 745f6f2 · vercel · Feb 7, 2022
2 parents 952a425 + 0403833
commit 745f6f2
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 53 deletions.
diff --git a/src/components/Layout/Hamburger.component.tsx b/src/components/Layout/Hamburger.component.tsx
@@ -54,8 +54,8 @@ const Hamburger = (): JSX.Element => {
     };
   }, [isExpanded]);
 
-  const handleClickOutside = (e: { target: any }) => {
-    if (node.current?.contains(e.target)) {
+  const handleClickOutside = (e: MouseEvent): void => {
+    if (node.current?.contains(e.target as Node)) {
       /**
        * Clicked inside of the menu
        */
@@ -85,8 +85,7 @@ const Hamburger = (): JSX.Element => {
         data-testid="hamburger"
         onClick={handleMobileMenuClick}
         aria-expanded={isExpanded}
-        type="button"
-      >
+        type="button">
         <span className="sr-only text-white text-2xl">Hamburger</span>
         <span
           className={`${hamburgerLine} ${
@@ -109,23 +108,20 @@ const Hamburger = (): JSX.Element => {
         id="mobile-menu"
         data-testid="mobile-menu"
         aria-hidden={!isExpanded}
-        className="absolute right-0 w-full text-center bg-gray-800 mt-4 w-30 invisible"
-      >
+        className="absolute right-0 w-full text-center bg-gray-800 mt-4 w-30 invisible">
         <ul aria-label="Navigasjon">
           {LINKS.map((link) => (
             <li
               key={link.id}
-              className="menu-item w-full border-t border-gray-600 border-solid shadow"
-            >
+              className="menu-item w-full border-t border-gray-600 border-solid shadow">
               {link.external ? (
                 <a
                   className="inline-block m-4 text-xl text-white hover:underline"
                   aria-label={link.text}
                   href={link.url}
                   target="_blank"
                   rel="noreferrer"
-                  data-testid={`mobil-${link.text}`}
-                >
+                  data-testid={`mobil-${link.text}`}>
                   {link.text}
                 </a>
               ) : (

diff --git a/src/components/Prosjekter/ProsjektIndividualProjects.component.tsx b/src/components/Prosjekter/ProsjektIndividualProjects.component.tsx
@@ -1,19 +1,10 @@
-import { gsap } from "gsap";
-import { ScrollTrigger } from "gsap/dist/ScrollTrigger";
-
 import Image from "../UI/Image.component";
 import Button from "../UI/Button.component";
 
 import { urlFor } from "../../lib/sanity";
 
 import type { IProject } from "./ProsjekterListings.component";
 
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect";
-
-interface IOnEnter {
-  progress: number;
-}
-
 interface ILinkButton {
   url: string;
   text: string;
@@ -27,43 +18,20 @@ interface ILinkButton {
  */
 
 const ProsjektIndividualProjects = ({ projects }: IProject): JSX.Element => {
-  // https://edidiongasikpo.com/using-gsap-scrolltrigger-plugin-in-react
-  // https://greensock.com/forums/topic/24427-scrolltrigger-fade-in-elements-on-scroll-by-toggleclass-only-once/
-
   const ShowLinkButton = ({ url, text, name }: ILinkButton): JSX.Element => (
     <a rel="noopener noreferrer" target="_blank" aria-label={name} href={url}>
       <Button text={text} />
     </a>
   );
 
-  useIsomorphicLayoutEffect(() => {
-    gsap.registerPlugin(ScrollTrigger);
-    const boxes = gsap.utils.toArray("#projectdiv");
-    boxes.forEach((box: any, _i: number) => {
-      const anim = gsap.from(box, { duration: 0.5, autoAlpha: 0, y: 50, paused: true });
-      ScrollTrigger.create({
-        trigger: box,
-        end: "bottom bottom",
-        once: true,
-        onEnter: (self: IOnEnter) => {
-          if (self.progress === 1) {
-            anim.progress(1);
-          } else {
-            anim.play();
-          }
-        }
-      });
-    });
-  }, []);
   return (
     <>
       {projects.map(
         ({ id, name, description, subdescription, urlwww, urlgithub, projectimage }) => (
           <div
             id="projectdiv"
             key={id}
-            className="p-6 text-lg text-black  bg-white rounded shadow invisible"
-          >
+            className="p-6 text-lg text-black  bg-white rounded shadow invisible">
             <h2 className="text-xl font-black text-center">{name}</h2>
             <div className="mt-6 text-lg text-left lg:text-left md:text-left">
               <p>{description}</p>

diff --git a/src/pages/api/siteMapGenerator.ts b/src/pages/api/siteMapGenerator.ts
@@ -1,26 +1,19 @@
 const { SitemapStream, streamToPromise } = require("sitemap");
 const { Readable } = require("stream");
 
+import type { NextApiRequest, NextApiResponse } from "next";
+
 interface IData {
   toString: () => string;
 }
 
-interface IReq {
-  headers: { host: any };
-}
-
-interface IRes {
-  writeHead: (arg0: number, arg1: { "Content-Type": string }) => void;
-  end: (arg0: any) => void;
-}
-
 interface ILinks {
   url: string;
   changefreq: string;
   priority: number;
 }
 
-const siteMapGenerator = async (req: IReq, res: IRes) => {
+const siteMapGenerator = async (req: NextApiRequest, res: NextApiResponse) => {
   // An array with your links
 
   const links: ILinks[] = [