mirror of
https://github.com/rgrgogu/new_starr.git
synced 2026-09-27 00:12:54 +08:00
70 lines
3.2 KiB
React
70 lines
3.2 KiB
React
/***********************************************************************************************************************************************************************
|
|
* File Name: Register.jsx
|
|
* Type of Program: Frontend Page
|
|
* Description: Registration page. Accepts optional ?group_code= query param to
|
|
* auto-enroll new users into a user group on verification.
|
|
* Route: /register or /register?group_code=XXXX
|
|
* Module: User Credentials
|
|
* Author: lash0000
|
|
* Date Created: May 23, 2026
|
|
***********************************************************************************************************************************************************************
|
|
* Change History:
|
|
* DATE AUTHOR LOG NUMBER DESCRIPTION
|
|
* May 23, 2026 lash0000 001 Initial creation - STAR Phase 1 Project
|
|
***********************************************************************************************************************************************************************/
|
|
import { Link } from 'react-router-dom'
|
|
import { RegisterForm } from '../components/RegisterForm'
|
|
import { AuthThemeToggle } from '../components/AuthThemeToggle'
|
|
import { MetadataProvider } from '@/contexts/MetadataContext'
|
|
|
|
// TODO: flip to true once the hero banner asset is ready; grid auto-centers the
|
|
// left panel while this is false so no other classes need to change either way.
|
|
const SHOW_BANNER = false
|
|
|
|
export default function Register() {
|
|
return (
|
|
<MetadataProvider
|
|
value={{
|
|
title: 'Register - Philproperties',
|
|
description: 'Create an account to access our online course platform.',
|
|
keywords: 'register, signup, philproperties, training, onboarding, real-estate',
|
|
ogTitle: 'Register - Philproperties',
|
|
ogDescription: 'Create an account to access our online course platform.',
|
|
}}
|
|
>
|
|
<div className={`relative grid min-h-svh ${SHOW_BANNER ? 'lg:grid-cols-2' : ''}`}>
|
|
<AuthThemeToggle className="absolute top-4 right-4 z-10" />
|
|
{/* ── Left panel ── */}
|
|
<div className="flex flex-col gap-4 p-6 md:p-10">
|
|
<div className="flex justify-center">
|
|
<Link to="/" className="flex items-center gap-2 font-medium">
|
|
<div className="xs:w-40 sm:w-48 md:w-56 2xl:w-64 block dark:hidden">
|
|
<img src="/philpro-white.png" alt="Philproperties" />
|
|
</div>
|
|
<div className="xs:w-40 sm:w-48 md:w-56 2xl:w-64 hidden dark:block">
|
|
<img src="/philpro-dark.png" alt="Philproperties" />
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
|
|
<div className="flex flex-1 items-center justify-center">
|
|
<div className="w-full max-w-xl">
|
|
<RegisterForm />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* ── Right panel — hero image ── */}
|
|
{SHOW_BANNER && (
|
|
<div className="relative hidden lg:block">
|
|
<img
|
|
src="https://cq5as7pc73.ufs.sh/f/pHNnzIw3VjcgzIbC8SR4stTZRKXP3cfbD6e2p9jmdAUQBuox"
|
|
alt="Philproperties"
|
|
className="absolute inset-0 h-full w-full object-cover rounded-3xl p-2"
|
|
/>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</MetadataProvider>
|
|
)
|
|
} |