From 9241d93f1bc44f54d740dc9e0a810ad074244769 Mon Sep 17 00:00:00 2001 From: anikaahmed114 Date: Sat, 2 Mar 2024 15:18:26 -0500 Subject: [PATCH 1/2] fixing button component --- compass/app/auth/forgot_password/page.tsx | 2 +- compass/app/auth/newPassword/page.tsx | 2 +- compass/app/page.tsx | 4 +--- compass/components/Button1.tsx | 24 ----------------------- compass/tsconfig.json | 2 +- 5 files changed, 4 insertions(+), 30 deletions(-) delete mode 100644 compass/components/Button1.tsx diff --git a/compass/app/auth/forgot_password/page.tsx b/compass/app/auth/forgot_password/page.tsx index e12f6b2..eee4b70 100644 --- a/compass/app/auth/forgot_password/page.tsx +++ b/compass/app/auth/forgot_password/page.tsx @@ -1,5 +1,5 @@ "use client" -import Button from '@/components/Button49'; +import Button from '@/components/Button'; import Input from '@/components/Input' import InlineLink from '@/components/InlineLink'; import Paper from '@/components/auth/Paper'; diff --git a/compass/app/auth/newPassword/page.tsx b/compass/app/auth/newPassword/page.tsx index 6b4aaef..81e2056 100644 --- a/compass/app/auth/newPassword/page.tsx +++ b/compass/app/auth/newPassword/page.tsx @@ -1,7 +1,7 @@ // pages/index.tsx "use client"; import { useState, useEffect } from 'react'; -import Button from '@/components/Button1'; +import Button from '@/components/Button'; import Input from '@/components/Input1'; import Paper from '@/components/auth/Paper'; diff --git a/compass/app/page.tsx b/compass/app/page.tsx index 56bb65b..1d7b132 100644 --- a/compass/app/page.tsx +++ b/compass/app/page.tsx @@ -1,8 +1,6 @@ // pages/index.tsx "use client"; - -import Button from '@/components/Button49'; -import Button from '@/components/Button1'; +import Button from '@/components/Button'; import Input from '@/components/Input' import InlineLink from '@/components/InlineLink'; import Paper from '@/components/auth/Paper'; diff --git a/compass/components/Button1.tsx b/compass/components/Button1.tsx deleted file mode 100644 index bf6dd55..0000000 --- a/compass/components/Button1.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { FunctionComponent, ReactNode } from 'react'; - -type ButtonProps = { - children: ReactNode; - onClick?: () => void; // make the onClick handler optional - type?: "button" | "submit" | "reset"; // specify possible values for type - disabled?: boolean; -}; - -const Button: FunctionComponent = ({ children, type, disabled, onClick }) => { - const buttonClassName = `inline-block rounded border ${disabled ? 'bg-gray-400 text-gray-600 cursor-not-allowed' : 'border-purple-600 bg-purple-600 text-white hover:bg-transparent hover:text-purple-600 focus:outline-none focus:ring active:text-purple-500'} px-12 py-3 text-sm font-semibold`; - return ( - - ); -}; - -export default Button; diff --git a/compass/tsconfig.json b/compass/tsconfig.json index c714696..1acc222 100644 --- a/compass/tsconfig.json +++ b/compass/tsconfig.json @@ -8,7 +8,7 @@ "noEmit": true, "esModuleInterop": true, "module": "esnext", - "moduleResolution": "bundler", + "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", From a9bcb6761bcdf5874c8c471ac333fb95619f78b1 Mon Sep 17 00:00:00 2001 From: Advik Arora Date: Sat, 2 Mar 2024 15:26:33 -0500 Subject: [PATCH 2/2] created email input --- compass/app/auth/forgot_password/page.tsx | 4 ++-- compass/components/auth/EmailInput.tsx | 17 +++++++++++++++++ compass/utils/classes/InputProps.ts | 9 +++++++++ 3 files changed, 28 insertions(+), 2 deletions(-) create mode 100644 compass/components/auth/EmailInput.tsx create mode 100644 compass/utils/classes/InputProps.ts diff --git a/compass/app/auth/forgot_password/page.tsx b/compass/app/auth/forgot_password/page.tsx index e12f6b2..b2e7c9c 100644 --- a/compass/app/auth/forgot_password/page.tsx +++ b/compass/app/auth/forgot_password/page.tsx @@ -1,5 +1,5 @@ "use client" -import Button from '@/components/Button49'; +import Button from '@/components/Button'; import Input from '@/components/Input' import InlineLink from '@/components/InlineLink'; import Paper from '@/components/auth/Paper'; @@ -44,7 +44,7 @@ export default function Page() { iconKey={'EmailInputIcon'} onChange={(e) => { setconfirmEmail(e.target.value); - setEmailError(''); // Reset the error when the user types + }}/> {emailError && (

diff --git a/compass/components/auth/EmailInput.tsx b/compass/components/auth/EmailInput.tsx new file mode 100644 index 0000000..cb3a829 --- /dev/null +++ b/compass/components/auth/EmailInput.tsx @@ -0,0 +1,17 @@ +import React, { useState } from 'react'; +import Input from '@/components/Input' +import { InputProps } from '@/utils/classes/InputProps'; + +const EmailInput: React.FunctionComponent = ({ type, title, placeholder, ...rest }) => { + + return ( + + ); +}; + +export default EmailInput; diff --git a/compass/utils/classes/InputProps.ts b/compass/utils/classes/InputProps.ts new file mode 100644 index 0000000..2354d62 --- /dev/null +++ b/compass/utils/classes/InputProps.ts @@ -0,0 +1,9 @@ +import { InputHTMLAttributes } from "react"; +import { Icons } from "../constants"; + +export type InputProps = InputHTMLAttributes & { + iconKey?: keyof typeof Icons; // Use keyof typeof to ensure the key exists in Icons + title?: string; // Assuming title is always a string + type?: string; + placeholder?: string; + }; \ No newline at end of file