Fix linting issues

This commit is contained in:
Gabriel Tofvesson 2024-12-31 00:15:15 +01:00
parent a0745160ae
commit 2c66460976
5 changed files with 9 additions and 11 deletions

View File

@ -26,7 +26,6 @@ export default function Home() {
const [cycle, setCycle] = React.useState({ index: 0, show: true });
const [showButton, setShowButton] = React.useState(false);
const [hideButton, setHideButton] = React.useState(false);
return (
<div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-orbitron)] select-none">
@ -45,7 +44,6 @@ export default function Home() {
<div className={`${showButton ? "tofvesson-emph " : ""}inline`}><BlinkText interval={1000}>_</BlinkText></div>
</div>
<Button
onClick={ () => setHideButton(true) }
border={false}
invertColors={true}
className={`${ showButton ? "opacity-100" : "opacity-0 hover:cursor-default"} transition-opacity ease-in-out duration-500 delay-150`}>

View File

@ -1,17 +1,17 @@
"use client";
import React from "react";
import { ReactNode, useEffect, useState } from "react"
export type BlinkTextProps = { children: any, interval: number, props?: React.HTMLAttributes<HTMLDivElement> };
export type BlinkTextProps = { children?: ReactNode, interval: number, props?: React.HTMLAttributes<HTMLDivElement> };
export default function BlinkText({ children, interval, props }: BlinkTextProps) {
const elementProps = props ? props : {};
const [show, setShow] = React.useState(false);
React.useEffect(() => {
const [show, setShow] = useState(false);
useEffect(() => {
const intervalRef = setInterval(() => {
setShow(!show);
}, interval);
return () => clearInterval(intervalRef);
}, [show]);
}, [show, interval]);
return <div {...elementProps} style={{ visibility: show ? "visible" : "hidden", display: "inline" }}>{children}</div>
}

View File

@ -1,6 +1,6 @@
import { ReactNode } from "react"
export type ButtonProps = { children?: any, border?: boolean, invertColors?: boolean, href?: string, onClick?: React.MouseEventHandler<HTMLAnchorElement>, className?: string }
export type ButtonProps = { children?: ReactNode, border?: boolean, invertColors?: boolean, href?: string, onClick?: React.MouseEventHandler<HTMLAnchorElement>, className?: string }
export default function Button({ children, border, invertColors, href, onClick, className }: ButtonProps) {
return <a

View File

@ -1,7 +1,7 @@
"use client";
import React from "react";
export type DelayProps = { children: any, delay?: number, useOpacity?: boolean, onComplete?: () => void, shouldWait?: boolean };
export type DelayProps = { children?: React.ReactNode, delay?: number, useOpacity?: boolean, onComplete?: () => void, shouldWait?: boolean };
export default function Delay({ children, delay, useOpacity, onComplete, shouldWait }: DelayProps) {
const [show, setShow] = React.useState(false);
React.useEffect(() => {
@ -20,7 +20,7 @@ export default function Delay({ children, delay, useOpacity, onComplete, shouldW
}, delay);
return () => clearInterval(intervalRef);
}, [shouldWait, delay]);
}, [shouldWait, delay, onComplete]);
if (useOpacity) {
return <div className={`${ show ? "opacity-100" : "opacity-0"} transition-opacity ease-in-out duration-300`}>{children}</div>

View File

@ -25,7 +25,7 @@ export default function TypeText({ children, interval, onComplete, reverse }: Ty
}, interval);
return () => clearInterval(intervalRef);
}, [length, children, reverse, interval]);
}, [length, children, reverse, interval, onComplete]);
return <>{children.substring(0, length)}</>
}