forked from Transparency/kgroad-frontend2
41 lines
790 B
TypeScript
41 lines
790 B
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import "./Switch.scss";
|
|
import Link from "next/link";
|
|
|
|
interface ISwitchProps {
|
|
defaultState: boolean;
|
|
color?: string;
|
|
href: string;
|
|
}
|
|
|
|
const Switch: React.FC<ISwitchProps> = ({
|
|
defaultState,
|
|
color,
|
|
href,
|
|
}: ISwitchProps) => {
|
|
const [toggleSwitch, setToggleSwitch] = useState<boolean>(
|
|
defaultState || false
|
|
);
|
|
return (
|
|
<Link
|
|
scroll={false}
|
|
href={href}
|
|
onClick={() => setToggleSwitch((prev) => !prev)}
|
|
style={{
|
|
backgroundColor: !toggleSwitch
|
|
? "rgb(71, 85, 105)"
|
|
: color
|
|
? color
|
|
: "rgb(230, 68, 82)",
|
|
}}
|
|
className={toggleSwitch ? "switch-active" : "switch-passive"}
|
|
>
|
|
<span />
|
|
</Link>
|
|
);
|
|
};
|
|
|
|
export default Switch;
|