Skip to content

refactor: unify authentication flow by replacing RegisterForm with Lo… #122

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
malavya1411 merged 1 commit into from
Jul 14, 2026
Merged

refactor: unify authentication flow by replacing RegisterForm with Lo… #122

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 18 additions & 6 deletions frontend/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -359,7 +359,6 @@ const DashboardContent: React.FC = () => {
);
if (res.ok) {
const data = await res.json();
setTheme(data.theme || 'dark');
setSignature(data.signature || '');
setAutoReply(!!data.autoReply);
setTimezone(data.timezone || 'UTC');
Expand All @@ -373,7 +372,6 @@ const DashboardContent: React.FC = () => {
'Failed to load user settings, using dev mock settings:',
err
);
setTheme('light');
setSignature('Sent from InboxOS Dev');
setAutoReply(true);
setTimezone('UTC');
Expand Down Expand Up @@ -1090,8 +1088,16 @@ const DashboardContent: React.FC = () => {
💬 Link Your Chat ID
</p>
<p className="text-[10px] leading-relaxed text-amber-850 font-medium">
To sync alerts with your Telegram, message your
bot and send the start command with your unique
To sync alerts with your Telegram, message{' '}
<a
href="https://t.me/InboxOs_mail_bot"
target="_blank"
rel="noopener noreferrer"
className="underline text-amber-900 font-bold hover:text-amber-700 transition-colors"
>
your bot
</a>{' '}
and send the start command with your unique
Workspace User ID:
</p>
<div className="flex items-center gap-2">
Expand Down Expand Up @@ -1977,8 +1983,14 @@ export default function App() {
}

const handleGlobalMouseMove = (e: MouseEvent) => {
document.documentElement.style.setProperty('--global-mouse-x', `${e.clientX}px`);
document.documentElement.style.setProperty('--global-mouse-y', `${e.clientY}px`);
document.documentElement.style.setProperty(
'--global-mouse-x',
`${e.clientX}px`
);
document.documentElement.style.setProperty(
'--global-mouse-y',
`${e.clientY}px`
);
};
window.addEventListener('mousemove', handleGlobalMouseMove);
return () => {
Expand Down
39 changes: 15 additions & 24 deletions frontend/src/components/AuthLayout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -126,12 +126,6 @@ export const AuthLayout: React.FC<AuthLayoutProps> = ({ children }) => {
{/* Internal Subtle grid pattern */}
<div className="absolute inset-0 engineering-grid opacity-[0.06] pointer-events-none" />

{/* Floating abstract glass shapes */}
<motion.div
animate={{ y: [0, -12, 0], rotate: [0, 4, 0] }}
transition={{ duration: 8, repeat: Infinity, ease: 'easeInOut' }}
className="absolute top-[18%] right-[8%] w-16 h-16 rounded-[16px] bg-white/40 dark:bg-white/5 border border-white/50 dark:border-white/10 backdrop-blur-sm shadow-[0_4px_24px_rgba(0,0,0,0.01)] pointer-events-none"
/>
<motion.div
animate={{ y: [0, 16, 0], rotate: [0, -6, 0] }}
transition={{
Expand All @@ -143,27 +137,24 @@ export const AuthLayout: React.FC<AuthLayoutProps> = ({ children }) => {
className="absolute bottom-[20%] left-[6%] w-24 h-24 rounded-[22px] bg-white/30 dark:bg-white/5 border border-white/40 dark:border-white/10 backdrop-blur-md shadow-[0_4px_24px_rgba(0,0,0,0.01)] pointer-events-none"
/>

<div className="flex items-center justify-between z-10 relative">
<div className="flex items-center gap-3">
<Logo iconOnly size={34} className="shrink-0" />
<div>
<h2
className="text-[17px] font-bold tracking-tight text-[#1D1D1D] dark:text-zinc-100 leading-none"
style={{ fontFamily: "'Oswald', sans-serif", letterSpacing: '-0.3px' }}
>
InboxOS
</h2>
</div>
</div>
<span className="text-[10px] font-bold px-3 py-1 bg-white dark:bg-zinc-800 border border-[#EAE5DA] dark:border-zinc-700 text-[#6B7280] dark:text-zinc-400 rounded-full shadow-sm">
Open Source
</span>
</div>

{/* Main Content Area */}
<div className="my-auto space-y-8 max-w-xl text-left z-10 relative">
{/* Logo Row */}
<div className="flex items-center gap-3.5 select-none">
<Logo iconOnly size={46} className="shrink-0" />
<h2
className="text-[24px] font-extrabold tracking-tight text-[#1D1D1D] dark:text-zinc-100 leading-none"
style={{
fontFamily: "'Oswald', sans-serif",
letterSpacing: '-0.3px',
}}
>
InboxOS
</h2>
</div>

{/* Header */}
<h1 className="text-4xl md:text-[44px] font-extrabold tracking-tight text-[#1D1D1D] dark:text-zinc-100 leading-[1.1]">
<h1 className="text-4xl md:text-[44px] font-extrabold tracking-tight text-[#1D1D1D] dark:text-zinc-100 leading-[1.1] !mt-4">
Your inbox should{' '}
<span
className="text-[#5F6B38]"
Expand Down
100 changes: 45 additions & 55 deletions frontend/src/components/LandingPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import {
ShieldAlert,
Smartphone,
Calendar,
ChevronRight,
TrendingUp,
Lock,
Check,
Expand Down Expand Up @@ -420,29 +419,34 @@ export const LandingPage: React.FC = () => {
className="flex items-center gap-3 cursor-pointer select-none"
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
>
<Logo iconOnly size={34} className="shrink-0 transition-transform duration-200 hover:scale-105 active:scale-95" />
<div className="flex flex-col justify-center">
<h1
className="text-[17px] font-bold tracking-tight text-[#1D1D1D] leading-none"
style={{ fontFamily: "'Oswald', sans-serif", letterSpacing: '-0.3px' }}
>
InboxOS
</h1>
</div>
<Logo
iconOnly
size={42}
className="shrink-0 transition-transform duration-200 hover:scale-105 active:scale-95"
/>
<h1
className="text-[22px] font-extrabold tracking-tight text-[#1D1D1D] leading-none"
style={{
fontFamily: "'Oswald', sans-serif",
letterSpacing: '-0.3px',
}}
>
InboxOS
</h1>
</div>

{/* Desktop Nav Links */}
<nav className="hidden md:flex items-center gap-9 text-[15px] font-medium text-[#6B7280]">
<a
href="#features"
href="#pipeline"
className={`group relative py-1.5 transition-colors duration-200 hover:text-[#5F6B38] ${
activeSection === 'features'
activeSection === 'pipeline'
? 'text-[#5F6B38] font-semibold'
: ''
}`}
>
Features
{activeSection === 'features' ? (
How it Works
{activeSection === 'pipeline' ? (
<motion.span
layoutId="activeUnderline"
className="absolute left-0 right-0 bottom-0 h-0.5 bg-[#5F6B38]"
Expand All @@ -453,15 +457,15 @@ export const LandingPage: React.FC = () => {
)}
</a>
<a
href="#pipeline"
href="#features"
className={`group relative py-1.5 transition-colors duration-200 hover:text-[#5F6B38] ${
activeSection === 'pipeline'
activeSection === 'features'
? 'text-[#5F6B38] font-semibold'
: ''
}`}
>
How it Works
{activeSection === 'pipeline' ? (
Features
{activeSection === 'features' ? (
<motion.span
layoutId="activeUnderline"
className="absolute left-0 right-0 bottom-0 h-0.5 bg-[#5F6B38]"
Expand Down Expand Up @@ -508,7 +512,7 @@ export const LandingPage: React.FC = () => {
)}
</a>
<a
href="https://github.com"
href="https://github.com/CodeLabsAI29/Inbox_OS"
target="_blank"
rel="noopener noreferrer"
className="group relative py-1.5 transition-colors duration-200 hover:text-[#5F6B38]"
Expand Down Expand Up @@ -580,26 +584,26 @@ export const LandingPage: React.FC = () => {
>
<nav className="flex flex-col gap-4 text-left">
<a
href="#features"
href="#pipeline"
onClick={() => setIsMobileMenuOpen(false)}
className={`text-sm font-medium py-1 transition-colors duration-200 ${
activeSection === 'features'
activeSection === 'pipeline'
? 'text-[#5F6B38] font-semibold'
: 'text-[#6B7280]'
}`}
>
Features
How it Works
</a>
<a
href="#pipeline"
href="#features"
onClick={() => setIsMobileMenuOpen(false)}
className={`text-sm font-medium py-1 transition-colors duration-200 ${
activeSection === 'pipeline'
activeSection === 'features'
? 'text-[#5F6B38] font-semibold'
: 'text-[#6B7280]'
}`}
>
How it Works
Features
</a>
<a
href="#demo"
Expand All @@ -624,7 +628,7 @@ export const LandingPage: React.FC = () => {
InboxOS vs Standard
</a>
<a
href="https://github.com"
href="https://github.com/CodeLabsAI29/Inbox_OS"
target="_blank"
rel="noopener noreferrer"
onClick={() => setIsMobileMenuOpen(false)}
Expand Down Expand Up @@ -666,16 +670,11 @@ export const LandingPage: React.FC = () => {
whileInView="visible"
viewport={{ once: true, margin: '-100px' }}
variants={sectionVariants}
className="relative pt-36 pb-20 md:pt-44 md:pb-28 px-6 max-w-[1280px] mx-auto z-10"
className="relative pt-28 pb-20 md:pt-36 md:pb-28 px-6 max-w-[1280px] mx-auto z-10"
>
<div className="grid grid-cols-1 lg:grid-cols-12 gap-12 lg:gap-8 items-center">
{/* Left Text */}
<div className="lg:col-span-6 space-y-7 text-left">
<div className="inline-flex items-center gap-2 px-3 py-1.5 bg-[#5F6B38]/5 border border-[#5F6B38]/10 rounded-full text-[#5F6B38] font-bold text-[10px] tracking-wider uppercase">
<Sparkles size={11} strokeWidth={1.5} />
<span>Introducing the Decision & Execution Layer</span>
</div>

<h1 className="text-4xl md:text-5xl lg:text-[64px] font-bold tracking-tight text-[#1D1D1D] leading-[1.1] lg:max-w-2xl">
Email that{' '}
<span
Expand Down Expand Up @@ -713,22 +712,7 @@ export const LandingPage: React.FC = () => {
className="transition-transform duration-200 group-hover:translate-x-[5px]"
/>
</button>
<a
href="#demo"
className="group h-[48px] px-6 text-[15px] font-semibold text-[#5F6B38] bg-white border border-[#5F6B38] hover:bg-[#FAF7F2] rounded-[16px] transition-all duration-200 hover:-translate-y-0.5 active:scale-95 text-center flex items-center justify-center gap-2"
>
<span>Watch Live Demo</span>
<ChevronRight
size={16}
strokeWidth={2}
className="transition-transform duration-200 group-hover:translate-x-[5px]"
/>
</a>
</div>

<p className="text-[10px] font-semibold text-[#6B7280]/60">
Open source & self-hostable. Supports local AI models via Ollama.
</p>
</div>

{/* Right Hero Visual: Living AI Pipeline Loop with animations & parallax */}
Expand Down Expand Up @@ -1834,7 +1818,7 @@ export const LandingPage: React.FC = () => {

<div className="flex gap-3 pt-2">
<a
href="https://github.com"
href="https://github.com/CodeLabsAI29/Inbox_OS"
target="_blank"
rel="noopener noreferrer"
className="h-[48px] px-6 text-[15px] font-semibold text-white bg-slate-900 hover:bg-slate-800 rounded-[16px] transition-all hover:-translate-y-0.5 active:translate-y-0 shadow-sm flex items-center justify-center gap-2"
Expand Down Expand Up @@ -2257,7 +2241,7 @@ export const LandingPage: React.FC = () => {
Get Started Free
</button>
<a
href="https://github.com"
href="https://github.com/CodeLabsAI29/Inbox_OS"
target="_blank"
rel="noopener noreferrer"
className="w-full sm:w-auto h-[48px] px-6 text-[15px] font-semibold text-white bg-transparent border border-white/30 hover:bg-white/10 rounded-[16px] transition-all duration-200 hover:-translate-y-0.5 active:scale-95 flex items-center justify-center gap-1.5"
Expand All @@ -2281,10 +2265,13 @@ export const LandingPage: React.FC = () => {
className="flex items-center gap-3 cursor-pointer select-none"
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
>
<Logo iconOnly size={32} className="shrink-0" />
<h4
className="text-[17px] font-bold text-[#1D1D1D]"
style={{ fontFamily: "'Oswald', sans-serif", letterSpacing: '-0.3px' }}
<Logo iconOnly size={38} className="shrink-0" />
<h4
className="text-[20px] font-extrabold text-[#1D1D1D] leading-none"
style={{
fontFamily: "'Oswald', sans-serif",
letterSpacing: '-0.3px',
}}
>
InboxOS
</h4>
Expand All @@ -2299,7 +2286,10 @@ export const LandingPage: React.FC = () => {

{/* Social Icons */}
<div className="flex items-center gap-3 pt-2">
<SocialIcon href="https://github.com" ariaLabel="GitHub">
<SocialIcon
href="https://github.com/CodeLabsAI29/Inbox_OS"
ariaLabel="GitHub"
>
<GithubIcon size={16} />
</SocialIcon>
<SocialIcon href="https://discord.com" ariaLabel="Discord">
Expand Down Expand Up @@ -2362,7 +2352,7 @@ export const LandingPage: React.FC = () => {
<ul className="space-y-3 text-[14px]">
<li>
<a
href="https://github.com"
href="https://github.com/CodeLabsAI29/Inbox_OS"
target="_blank"
rel="noopener noreferrer"
className="text-[#6B7280] hover:text-[#5F6B38] hover:translate-x-[4px] duration-200 transition-all flex items-center"
Expand Down
Loading
Loading