Add environment variable to control local login availability
Add VITE_ENABLE_LOCAL_LOGIN env variable to conditionally show/hide local username/password login on the login screen. When set to 'false' (production), only Microsoft login is shown. When 'true' (development), both options are available. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
68a39d3554
commit
30d5cf7702
3 changed files with 77 additions and 62 deletions
|
|
@ -10,4 +10,7 @@ VITE_WEBSOCKET_PATH=/socket.io/
|
|||
|
||||
# MSAL Authentication (local development)
|
||||
VITE_MSAL_REDIRECT_URI=http://localhost:5173/
|
||||
VITE_MSAL_POST_LOGOUT_REDIRECT_URI=http://localhost:5173/
|
||||
VITE_MSAL_POST_LOGOUT_REDIRECT_URI=http://localhost:5173/
|
||||
|
||||
# Local login (username/password) - enable for development
|
||||
VITE_ENABLE_LOCAL_LOGIN=true
|
||||
|
|
@ -10,4 +10,7 @@ VITE_WEBSOCKET_PATH=/semblance_back/socket.io/
|
|||
|
||||
# MSAL Authentication (production server)
|
||||
VITE_MSAL_REDIRECT_URI=https://ai-sandbox.oliver.solutions/semblance
|
||||
VITE_MSAL_POST_LOGOUT_REDIRECT_URI=https://ai-sandbox.oliver.solutions/semblance
|
||||
VITE_MSAL_POST_LOGOUT_REDIRECT_URI=https://ai-sandbox.oliver.solutions/semblance
|
||||
|
||||
# Local login (username/password) - disable for production
|
||||
VITE_ENABLE_LOCAL_LOGIN=false
|
||||
|
|
@ -24,6 +24,9 @@ export default function Login() {
|
|||
const location = useLocation();
|
||||
const { login, loginWithMicrosoft, isAuthenticated, isMsalLoading } = useAuth();
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
|
||||
// Check if local login is enabled (defaults to true for backwards compatibility)
|
||||
const enableLocalLogin = import.meta.env.VITE_ENABLE_LOCAL_LOGIN !== 'false';
|
||||
|
||||
// Get the intended destination from state, or default to home page
|
||||
const from = location.state?.from || '/';
|
||||
|
|
@ -120,70 +123,76 @@ export default function Login() {
|
|||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Divider */}
|
||||
<div className="relative mb-6">
|
||||
<div className="absolute inset-0 flex items-center">
|
||||
<div className="w-full border-t border-gray-200"></div>
|
||||
</div>
|
||||
<div className="relative flex justify-center text-sm">
|
||||
<span className="bg-white px-2 text-gray-500 dark:bg-gray-800 dark:text-gray-400">
|
||||
Or continue with username
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{enableLocalLogin && (
|
||||
<>
|
||||
{/* Divider */}
|
||||
<div className="relative mb-6">
|
||||
<div className="absolute inset-0 flex items-center">
|
||||
<div className="w-full border-t border-gray-200"></div>
|
||||
</div>
|
||||
<div className="relative flex justify-center text-sm">
|
||||
<span className="bg-white px-2 text-gray-500 dark:bg-gray-800 dark:text-gray-400">
|
||||
Or continue with username
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="username"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Username</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="Enter your username"
|
||||
{...field}
|
||||
disabled={isLoading}
|
||||
autoComplete="username"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="password"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Password</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="Enter your password"
|
||||
type="password"
|
||||
{...field}
|
||||
disabled={isLoading}
|
||||
autoComplete="current-password"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<Button type="submit" className="w-full" disabled={isLoading || isMsalLoading}>
|
||||
{isLoading ? "Signing in..." : "Sign In"}
|
||||
</Button>
|
||||
</form>
|
||||
</Form>
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="username"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Username</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="Enter your username"
|
||||
{...field}
|
||||
disabled={isLoading}
|
||||
autoComplete="username"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="password"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Password</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="Enter your password"
|
||||
type="password"
|
||||
{...field}
|
||||
disabled={isLoading}
|
||||
autoComplete="current-password"
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<Button type="submit" className="w-full" disabled={isLoading || isMsalLoading}>
|
||||
{isLoading ? "Signing in..." : "Sign In"}
|
||||
</Button>
|
||||
</form>
|
||||
</Form>
|
||||
</>
|
||||
)}
|
||||
</CardContent>
|
||||
|
||||
<CardFooter className="flex flex-col space-y-2">
|
||||
<div className="text-sm text-center text-gray-500 mb-2">
|
||||
Default account: user / pass
|
||||
</div>
|
||||
{enableLocalLogin && (
|
||||
<div className="text-sm text-center text-gray-500 mb-2">
|
||||
Default account: user / pass
|
||||
</div>
|
||||
)}
|
||||
{!isLoading && !isMsalLoading && (
|
||||
<div className="flex flex-col items-center justify-center gap-2">
|
||||
<Button
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue