⚡ Upgrade design & moved backend here & login and settings work with api

components/Input/Input.tsx

@@ -0,0 +1,64 @@
+'use client';
+
+// ---------------------------------------------------------------------------------------------------------------------
+//!                                                      Imports
+// ---------------------------------------------------------------------------------------------------------------------
+
+// ------------------------------------------------------ React --------------------------------------------------------
+import { forwardRef, MouseEvent, useState } from 'react';
+// ---------------------------------------------------------------------------------------------------------------------
+
+// ------------------------------------------------- Assets & Styles ---------------------------------------------------
+import EyeSlashIcon from '@/assets/EyeSlashIcon';
+import EyeIcon from '@/assets/EyeIcon';
+import './styles.scss';
+// ---------------------------------------------------------------------------------------------------------------------
+
+const Input = ({
+	name = '',
+	type = '',
+	placeholder = '',
+	defaultValue = '',
+	required = false,
+	autoComplete = 'off',
+}) => {
+	const [isPasswordVisible, setIsPasswordVisible] = useState(false);
+
+	const togglePasswordVisibility = (ev: MouseEvent) => {
+		ev.stopPropagation();
+
+		setIsPasswordVisible((prev) => !prev);
+	};
+
+	return (
+		<div className='inputContainer'>
+			<input
+				type={
+					type == 'password'
+						? isPasswordVisible
+							? 'text'
+							: 'password'
+						: type
+				}
+				name={name}
+				id={name}
+				placeholder={placeholder}
+				defaultValue={defaultValue}
+				autoComplete={autoComplete}
+				required={required}
+				className='input'
+			/>
+			{type == 'password' && (
+				<button
+					type='button'
+					className='passwordToggleButton'
+					onClick={togglePasswordVisibility}
+				>
+					{isPasswordVisible ? <EyeSlashIcon /> : <EyeIcon />}
+				</button>
+			)}
+		</div>
+	);
+};
+
+export default Input;