Added Gitea oauth login

This commit is contained in:
2025-09-15 22:26:26 +03:30
parent 790b3d45b3
commit 64874a41ed
4 changed files with 106 additions and 1 deletions

BIN
bun.lockb

Binary file not shown.

View File

@@ -4,6 +4,7 @@ import { TooltipProvider } from "@/components/ui/tooltip";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { BrowserRouter, Routes, Route } from "react-router-dom"; import { BrowserRouter, Routes, Route } from "react-router-dom";
import Index from "./pages/Index"; import Index from "./pages/Index";
import GiteaOAuthCallback from "./pages/GiteaOAuthCallback";
import NotFound from "./pages/NotFound"; import NotFound from "./pages/NotFound";
const queryClient = new QueryClient(); const queryClient = new QueryClient();
@@ -16,6 +17,7 @@ const App = () => (
<BrowserRouter basename="/admin"> <BrowserRouter basename="/admin">
<Routes> <Routes>
<Route path="/" element={<Index />} /> <Route path="/" element={<Index />} />
<Route path="/oauth/gitea/callback" element={<GiteaOAuthCallback />} />
{/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */} {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
<Route path="*" element={<NotFound />} /> <Route path="*" element={<NotFound />} />
</Routes> </Routes>

View File

@@ -4,7 +4,7 @@ import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input'; import { Input } from '@/components/ui/input';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { toast } from '@/hooks/use-toast'; import { toast } from '@/hooks/use-toast';
import { Lock } from 'lucide-react'; import { Lock, Github } from 'lucide-react';
interface LoginPageProps { interface LoginPageProps {
onLogin: (token: string) => void; onLogin: (token: string) => void;
@@ -62,6 +62,11 @@ const LoginPage = ({ onLogin }: LoginPageProps) => {
} }
}; };
const handleGiteaLogin = () => {
// Redirect to the Gitea OAuth endpoint
window.location.href = '/admin/api/login/oauth/gitea';
};
return ( return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100"> <div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100">
<Card className="w-full max-w-md shadow-lg"> <Card className="w-full max-w-md shadow-lg">
@@ -91,6 +96,25 @@ const LoginPage = ({ onLogin }: LoginPageProps) => {
{isLoading ? "Signing in..." : "Sign In"} {isLoading ? "Signing in..." : "Sign In"}
</Button> </Button>
</form> </form>
<div className="relative my-6">
<div className="absolute inset-0 flex items-center">
<div className="w-full border-t border-gray-300"></div>
</div>
<div className="relative flex justify-center text-sm">
<span className="px-2 bg-white text-gray-500">Or continue with</span>
</div>
</div>
<Button
type="button"
onClick={handleGiteaLogin}
className="w-full h-12 text-base"
variant="outline"
>
<Github className="w-5 h-5 mr-2" />
Login with Gitea
</Button>
</CardContent> </CardContent>
</Card> </Card>
</div> </div>

View File

@@ -0,0 +1,79 @@
import React, { useEffect } from 'react';
import { useNavigate, useSearchParams } from 'react-router-dom';
import { toast } from '@/hooks/use-toast';
const GiteaOAuthCallback = () => {
const navigate = useNavigate();
const [searchParams] = useSearchParams();
useEffect(() => {
const handleOAuthCallback = async () => {
// Get the code from the URL parameters
const code = searchParams.get('code');
if (!code) {
toast({
title: "Error",
description: "No authorization code received from Gitea",
variant: "destructive",
});
navigate('/');
return;
}
try {
// Send the code to our backend to exchange for a JWT token
const response = await fetch('/admin/api/login/oauth/gitea/final', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ code }),
});
const data = await response.json();
if (response.ok && data.token) {
// Store the token in localStorage
localStorage.setItem('adminToken', data.token);
toast({
title: "Success",
description: data.message || "Login successful",
});
// Redirect to the admin dashboard
window.location.href = '/admin';
} else {
toast({
title: "Error",
description: data.error || "Login failed",
variant: "destructive",
});
navigate('/');
}
} catch (error) {
toast({
title: "Error",
description: "Network error. Please try again.",
variant: "destructive",
});
navigate('/');
}
};
handleOAuthCallback();
}, [navigate, searchParams]);
return (
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-50 to-slate-100">
<div className="text-center">
<div className="inline-block animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-slate-600 mb-4"></div>
<h2 className="text-2xl font-semibold text-slate-800">Processing Gitea Login</h2>
<p className="text-slate-600 mt-2">Please wait while we complete your authentication...</p>
</div>
</div>
);
};
export default GiteaOAuthCallback;