diff --git a/env.ts b/env.ts
index 79869c3..9d6baff 100644
--- a/env.ts
+++ b/env.ts
@@ -1,12 +1,9 @@
 import { defineConfig, Schema } from '@julr/vite-plugin-validate-env';
 
-// TODO: Integrate .env for CI and remove optional() call on required fields
 export default defineConfig({
     APP_TITLE: Schema.string.optional(),
     APP_MAPBOX_ACCESS_TOKEN: Schema.string(),
     APP_GRAPHQL_ENDPOINT: Schema.string.optional(),
     APP_GOOGLE_ANALYTICS_ID: Schema.string.optional(),
-})
-
-// Hcaptcha
-export const hCaptchaKey = process.env.REACT_APP_HCATPCHA_SITEKEY || '10000000-ffff-ffff-ffff-000000000001';
+    APP_HCAPTCHA_SITEKEY: Schema.string.optional(),
+});
\ No newline at end of file
diff --git a/src/components/Captcha/index.tsx b/src/components/Captcha/index.tsx
index e0982b0..f895d05 100644
--- a/src/components/Captcha/index.tsx
+++ b/src/components/Captcha/index.tsx
@@ -5,9 +5,10 @@ import {
     InputContainerProps,
 } from '@ifrc-go/ui';
 
+import { hCaptchaKey } from '#config';
+
 export type HCaptchaProps<T> = Omit<InputContainerProps, 'input'> & {
     name: T,
-    siteKey: string | undefined;
     onChange: (value: string | undefined, name: T) => void;
     elementRef?: React.RefObject<HCaptcha>;
 };
@@ -27,9 +28,7 @@ function HCaptchaInput<T extends string>(props: HCaptchaProps<T>) {
         inputSectionClassName,
         label,
         readOnly,
-
         name,
-        siteKey,
         onChange,
         elementRef,
     } = props;
@@ -70,11 +69,10 @@ function HCaptchaInput<T extends string>(props: HCaptchaProps<T>) {
             inputSectionClassName={inputSectionClassName}
             label={label}
             readOnly={readOnly}
-            input={siteKey && (
+            input={hCaptchaKey && (
                 <HCaptcha
                     ref={elementRef}
-                    // disabled={disabled || readOnly}
-                    sitekey={siteKey}
+                    sitekey={hCaptchaKey}
                     onVerify={handleVerify}
                     onError={handleError}
                     onExpire={handleExpire}
diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index 14529c4..f84881d 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -65,13 +65,6 @@ function Navbar(props: Props) {
                     >
                         {strings.appLogin}
                     </Link>
-                    {/* <Button
-                        name={undefined}
-                        variant="primary"
-                        onClick={undefined}
-                    >
-                        {strings.appLogin}
-                    </Button> */}
                 </NavigationTabList>
             </PageContainer>
             <PageContainer
diff --git a/src/config.ts b/src/config.ts
index 4003e60..95e348b 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -5,11 +5,13 @@ const {
     APP_TITLE,
     APP_COMMIT_HASH,
     APP_VERSION,
+    APP_HCAPTCHA_SITEKEY,
 } = import.meta.env;
 
 export const environment = APP_ENVIRONMENT;
 export const appTitle = APP_TITLE;
 export const api = APP_GRAPHQL_API_ENDPOINT;
 export const mapboxToken = APP_MAPBOX_ACCESS_TOKEN;
+export const hCaptchaKey = APP_HCAPTCHA_SITEKEY;
 export const appCommitHash = APP_COMMIT_HASH;
 export const appVersion = APP_VERSION;
diff --git a/src/utils/domain/user.ts b/src/utils/domain/user.ts
deleted file mode 100644
index 852ce43..0000000
--- a/src/utils/domain/user.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import {
-    isNotDefined,
-    isTruthyString,
-} from '@togglecorp/fujs';
-
-interface User {
-    first_name: string | undefined | null;
-    last_name: string | undefined | null;
-    username: string;
-}
-
-// eslint-disable-next-line import/prefer-default-export
-export function getUserName(user: User | undefined) {
-    if (isNotDefined(user)) {
-        return 'Unknown user';
-    }
-
-    const name = [user.first_name, user.last_name].filter(isTruthyString).join(' ');
-    if (isTruthyString(name)) {
-        return name;
-    }
-
-    // NOTE: Username can also be email
-    // so stripping out the domain part
-    const index = user.username.indexOf('@');
-    if (index === -1) {
-        return user.username;
-    }
-
-    return user.username.substring(0, index);
-}
diff --git a/src/views/Login/i18n.json b/src/views/Login/i18n.json
index 0db7612..74132ad 100644
--- a/src/views/Login/i18n.json
+++ b/src/views/Login/i18n.json
@@ -4,13 +4,13 @@
         "loginTitle":"IFRC GO - Login",
         "loginHeader":"Login",
         "loginSubHeader":"If you are staff, member or volunteer of the Red Cross Red Crescent Movement (National Societies, the IFRC and the ICRC) login with you email and password.",
-        "loginEmailUsername":"Email/Username",
+        "loginEmailUsername":"Email",
         "loginPassword":"Password",
         "loginRecoverTitle":"Recover password",
         "loginShowUsernameTitle":"Show me my username",
         "loginResendValidation":"Re-send validation email",
         "loginResendValidationTitle":"I didn't get my validation email",
-        "loginForgotUserPass":"Forgot your password/username?",
+        "loginForgotUserPass":"Forgot your password?",
         "loginInvalid":"Invalid username or password",
         "loginErrorMessage":"Error: {message}",
         "loginButton":"Login",
diff --git a/src/views/Login/index.tsx b/src/views/Login/index.tsx
index d51c8ad..fd6f672 100644
--- a/src/views/Login/index.tsx
+++ b/src/views/Login/index.tsx
@@ -1,9 +1,4 @@
-import {
-    useContext,
-    useMemo,
-    useState,
-} from 'react';
-import HCaptcha from '@hcaptcha/react-hcaptcha';
+import { useMemo } from 'react';
 import {
     Button,
     PasswordInput,
@@ -18,47 +13,27 @@ import {
     useForm,
 } from '@togglecorp/toggle-form';
 
+import HCaptcha from '#components/Captcha';
 import Link from '#components/Link';
 import Page from '#components/Page';
-import UserContext from '#contexts/user';
-import { getUserName } from '#utils/domain/user';
 
 import i18n from './i18n.json';
 import styles from './styles.module.css';
 
 interface FormFields {
-    username?: string;
-    password?: string;
+    email: string;
+    password: string;
+    captcha: string;
 }
-type FormSchema = ObjectSchema<FormFields>;
+type PartialFormFields = Partial<FormFields>;
+type FormSchema = ObjectSchema<PartialFormFields>;
 type FormSchemaFields = ReturnType<FormSchema['fields']>;
 
-const defaultFormValue: FormFields = {};
-
-const usersData = [
-    {
-        id: 1,
-        username: 'johndoe',
-        password: 'password123',
-        first: 'John',
-        last: 'Doe',
-        token: 'dummyToken123',
-        expires: '2024-12-31T23:59:59Z',
-    },
-    {
-        id: 2,
-        username: 'janedoe',
-        password: 'password456',
-        first: 'Jane',
-        last: 'Doe',
-        token: 'dummyToken456',
-        expires: '2025-01-31T23:59:59Z',
-    },
-];
+const defaultFormValue: PartialFormFields = {};
 
 const formSchema: FormSchema = {
     fields: (): FormSchemaFields => ({
-        username: {
+        email: {
             required: true,
             requiredValidation: requiredStringCondition,
         },
@@ -66,13 +41,16 @@ const formSchema: FormSchema = {
             required: true,
             requiredValidation: requiredStringCondition,
         },
+        captcha: {
+            required: true,
+            requiredValidation: requiredStringCondition,
+        },
     }),
 };
 
 // eslint-disable-next-line import/prefer-default-export
 export function Component() {
     const strings = useTranslation(i18n);
-    const { setUserAuth: setUser } = useContext(UserContext);
     const {
         value: formValue,
         setFieldValue,
@@ -80,43 +58,24 @@ export function Component() {
         validate,
     } = useForm(formSchema, { value: defaultFormValue });
 
-    const fieldError: FormFields = {};
-    const [, setCaptchaToken] = useState<string | null>(null);
+    const fieldError: PartialFormFields = {};
 
     const handleFormSubmit = useMemo(
         () => createSubmitHandler(
             validate,
             setError,
-            () => {
-                const selectedUser = usersData[0];
-                setUser({
-                    id: selectedUser.id,
-                    username: selectedUser.username,
-                    firstName: selectedUser.first ?? undefined,
-                    lastName: selectedUser.last ?? undefined,
-                    displayName: getUserName({
-                        first_name: selectedUser.first,
-                        last_name: selectedUser.last,
-                        username: selectedUser.username,
-                    }),
-                    token: selectedUser.token,
-                    expires: selectedUser.expires,
-                });
-            },
+            // FIXME: Add form submission logic here
+            () => {},
         ),
-        [validate, setError, setUser],
+        [validate, setError],
     );
 
-    const handleCaptchaVerify = (token: string) => {
-        setCaptchaToken(token);
-    };
-
     const signupInfo = resolveToComponent(
         strings.loginDontHaveAccount,
         {
             signUpLink: (
                 <Link
-                    to="login" // Fixme :add signup
+                    to="login" // FIXME :add Register
                     withUnderline
                 >
                     {strings.loginSignUp}
@@ -139,10 +98,10 @@ export function Component() {
             >
                 <div className={styles.fields}>
                     <TextInput
-                        name="username"
+                        name="email"
                         label={strings.loginEmailUsername}
-                        value={formValue.username}
-                        error={fieldError?.username}
+                        value={formValue.email}
+                        error={fieldError?.email}
                         onChange={setFieldValue}
                         withAsterisk
                         autoFocus
@@ -158,14 +117,14 @@ export function Component() {
                 </div>
                 <div className={styles.utilityLinks}>
                     <Link
-                        to="login" // Note:Fixme:Forgotpassword
+                        to="login" // FIXME: ForgotPassword
                         title={strings.loginRecoverTitle}
                         withUnderline
                     >
                         {strings.loginForgotUserPass}
                     </Link>
                     <Link
-                        to="login" // Note:Fixme:Loginresendvalidation
+                        to="login" // FIXME :LoginResendValidation
                         title={strings.loginResendValidationTitle}
                         withUnderline
                     >
@@ -174,12 +133,13 @@ export function Component() {
                 </div>
                 <div className={styles.actions}>
                     <HCaptcha
-                        sitekey="10000000-ffff-ffff-ffff-000000000001"
-                        onVerify={handleCaptchaVerify}
+                        name="captcha"
+                        onChange={setFieldValue}
                     />
                     <Button
                         name={undefined}
                         type="submit"
+                        onClick={handleFormSubmit}
                     >
                         {strings.loginButton}
                     </Button>
diff --git a/vite.config.ts b/vite.config.ts
index 97d5b48..45403fd 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -9,6 +9,7 @@ import { ValidateEnv as validateEnv } from '@julr/vite-plugin-validate-env';
 import { VitePluginRadar } from 'vite-plugin-radar';
 
 import alertHubPackage from './package.json';
+import envConfig from './env';
 
 /* Get commit hash */
 const commitHash = execSync('git rev-parse --short HEAD').toString();
@@ -35,7 +36,7 @@ export default defineConfig(({ mode }) => {
             reactSwc(),
             tsconfigPaths(),
             webfontDownload(),
-            validateEnv(),
+            validateEnv(envConfig),
             isProd ? compression() : undefined,
             VitePluginRadar({
                 analytics: {