1
0
mirror of https://github.com/immich-app/immich.git synced 2025-06-27 05:11:11 +02:00

feat(web,server): disable password login (#1223)

* feat(web,server): disable password login

* chore: unit tests

* chore: fix import

* chore: linting

* feat(cli): server command for enable/disable password login

* chore: update docs

* feat(web): confirm dialogue

* chore: linting

* chore: linting

* chore: linting

* chore: linting

* chore: linting

* chore: fix web test

* chore: server unit tests
This commit is contained in:
Jason Rasmussen
2023-01-09 16:32:58 -05:00
committed by GitHub
parent 5999af6c78
commit bd838a71d1
66 changed files with 861 additions and 167 deletions

View File

@ -1,4 +1,5 @@
<script lang="ts">
import { goto } from '$app/navigation';
import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
import { loginPageMessage } from '$lib/constants';
import { api, oauth, OAuthConfigResponseDto } from '@api';
@ -8,7 +9,7 @@
let email = '';
let password = '';
let oauthError: string;
let oauthConfig: OAuthConfigResponseDto = { enabled: false };
let oauthConfig: OAuthConfigResponseDto = { enabled: false, passwordLoginEnabled: false };
let loading = true;
const dispatch = createEventDispatcher();
@ -30,6 +31,14 @@
try {
const { data } = await oauth.getConfig(window.location);
oauthConfig = data;
const { enabled, url, autoLaunch } = oauthConfig;
if (enabled && url && autoLaunch && !oauth.isAutoLaunchDisabled(window.location)) {
await goto('/auth/login?autoLaunch=0', { replaceState: true });
await goto(url);
return;
}
} catch (e) {
console.error('Error [login-form] [oauth.generateConfig]', e);
}
@ -83,60 +92,68 @@
<LoadingSpinner />
</div>
{:else}
<form on:submit|preventDefault={login} autocomplete="off">
<div class="m-4 flex flex-col gap-2">
<label class="immich-form-label" for="email">Email</label>
<input
class="immich-form-input"
id="email"
name="email"
type="email"
bind:value={email}
required
/>
</div>
<div class="m-4 flex flex-col gap-2">
<label class="immich-form-label" for="password">Password</label>
<input
class="immich-form-input"
id="password"
name="password"
type="password"
bind:value={password}
required
/>
</div>
{#if error}
<p class="text-red-400 pl-4">{error}</p>
{/if}
<div class="flex w-full">
<button
type="submit"
disabled={loading}
class="m-4 p-2 bg-immich-primary dark:bg-immich-dark-primary dark:text-immich-dark-gray dark:hover:bg-immich-dark-primary/80 hover:bg-immich-primary/75 px-6 py-4 text-white rounded-md shadow-md w-full font-semibold"
>Login</button
>
</div>
{#if oauthConfig.enabled}
<div class="flex flex-col gap-4 px-4">
<hr />
{#if oauthError}
<p class="text-red-400">{oauthError}</p>
{/if}
<a href={oauthConfig.url} class="flex w-full">
<button
type="button"
disabled={loading}
class="bg-immich-primary dark:bg-immich-dark-primary dark:text-immich-dark-gray dark:hover:bg-immich-dark-primary/80 hover:bg-immich-primary/75 px-6 py-4 text-white rounded-md shadow-md w-full font-semibold"
>{oauthConfig.buttonText || 'Login with OAuth'}</button
>
</a>
{#if oauthConfig.passwordLoginEnabled}
<form on:submit|preventDefault={login} autocomplete="off">
<div class="m-4 flex flex-col gap-2">
<label class="immich-form-label" for="email">Email</label>
<input
class="immich-form-input"
id="email"
name="email"
type="email"
bind:value={email}
required
/>
</div>
{/if}
</form>
<div class="m-4 flex flex-col gap-2">
<label class="immich-form-label" for="password">Password</label>
<input
class="immich-form-input"
id="password"
name="password"
type="password"
bind:value={password}
required
/>
</div>
{#if error}
<p class="text-red-400 pl-4">{error}</p>
{/if}
<div class="flex w-full">
<button
type="submit"
disabled={loading}
class="m-4 p-2 bg-immich-primary dark:bg-immich-dark-primary dark:text-immich-dark-gray dark:hover:bg-immich-dark-primary/80 hover:bg-immich-primary/75 px-6 py-4 text-white rounded-md shadow-md w-full font-semibold"
>Login</button
>
</div>
</form>
{/if}
{#if oauthConfig.enabled}
<div class="flex flex-col gap-4 px-4">
{#if oauthConfig.passwordLoginEnabled}
<hr />
{/if}
{#if oauthError}
<p class="text-red-400">{oauthError}</p>
{/if}
<a href={oauthConfig.url} class="flex w-full">
<button
type="button"
disabled={loading}
class="bg-immich-primary dark:bg-immich-dark-primary dark:text-immich-dark-gray dark:hover:bg-immich-dark-primary/80 hover:bg-immich-primary/75 px-6 py-4 text-white rounded-md shadow-md w-full font-semibold"
>{oauthConfig.buttonText || 'Login with OAuth'}</button
>
</a>
</div>
{/if}
{#if !oauthConfig.enabled && !oauthConfig.passwordLoginEnabled}
<p class="text-center dark:text-immich-dark-fg p-4">Login has been disabled.</p>
{/if}
{/if}
</div>